/* Family Member Care: one palette for the three surfaces served from www/.
 *
 * Before this (2026-09-27) index.html, admin.html and portal.html each carried their own
 * :root. They disagreed: the carer app's --brand was #1a799e while admin and portal used
 * #4f92c6, and --ink was #344054 in one and #1e2b3a in the others. Same token name, three
 * meanings, so "change the brand colour" had no single answer.
 *
 * The palette below is named unambiguously. Each surface then aliases its own --brand and
 * --ink to a palette entry, so NOTHING changes visually here: the disagreement is now
 * visible in one file instead of hidden across three.
 *
 * THE FILL / INK RULE. A record colour is a FILL: a dot, a chip, a left border. Most of them
 * are too light to be read as text. Every one that is written with has a -ink twin, dark
 * enough to clear WCAG AA (4.5:1) on the darkest light background we use, #f6f8fa, which
 * means it clears on every lighter one too. Asserted both ways in test/colour-contrast.test.mjs.
 * The blue, teal and green inks are the values the marketing site already uses and has used
 * correctly for months; amber and orange were computed, because marketing's are too light too.
 */
:root {
  /* Brand. ONE colour across every surface (Ben, 2026-09-28): #1a799e, which the carer app
     was already using. The blue it replaces, #4f92c6, failed WCAG AA in BOTH directions:
     3.15:1 as text and 3.35:1 with white on it, and it was the brand on the admin console,
     the provider portal and the marketing site. The teal clears both (4.62:1 and 4.92:1).

     It is also the right colour on its own terms. The logo is #184854, and the three below
     sit in a 192-197 degree hue band: they are one family, light to dark. The old blue was
     206 and its deep partner #00478f was 210, a different hue wearing the same name. */
  --brand: #1a799e;           /* the FMC colour. Text, buttons, accents */
  --brand-deep: #13607c;      /* hover, headings on it, 6.59:1 */
  --brand-logo: #184854;      /* the logo mark itself, 9.42:1 */

  /* Neutrals */
  --ink-900: #1e2b3a;         /* admin and portal body text */
  --ink-700: #344054;         /* carer app body text */
  --ink-muted: #667085;       /* 4.76:1 on the page, the quietest text allowed */
  --ink-muted-admin: #6b7a8d;
  --surface: #ffffff;
  --page: #f9fafb;
  --page-admin: #f6f8fa;
  --line: #d0d5dd;
  --line-soft: #eaecf0;
  --line-admin: #e2e8ef;

  /* Record colours. FILLS. Only --red and --navy are dark enough to write with as they are. */
  --blue: #477be2;
  --teal: #01a2b8;
  --green: #009855;
  --red: #b42419;             /* 6.27:1, readable as text as well as a fill */
  --amber: #fcac11;
  --orange: #ff7c45;
  --navy: #334054;            /* 10.04:1 */

  /* ...and the twins we write with */
  --blue-ink: #3651c9;        /* 6.21:1 */
  --teal-ink: #0e7481;        /* 5.15:1 */
  --green-ink: #158043;       /* 4.70:1 */
  --amber-ink: #97670a;       /* 4.63:1 (the bare amber is 1.82:1) */
  --orange-ink: #b15630;      /* 4.65:1 */

  --font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}
