/*
 * Amethyst Behavioral Healthcare (ABH) -- dashboard design tokens.
 *
 * For: compliance-dashboard, census-dashboard, treatment-coordination,
 * ritten-dashboard (IOP / ABH entity). NOT for powerbi-dashboard, which is
 * Peer Support / ARS -- use brand/ars/tokens.css there.
 *
 * Source: https://amethystbehavioralhealthcare.com (abhmn.com redirects there),
 * extracted 2026-09-24 from the site's own Avada theme palette
 * (--awb-color1..8) and typography variables, cross-checked against the
 * logo artwork (ABH_Primary_CLR.png / ABH_Icon_CLR.png use exactly
 * #285780 / #9b7ea4 / #4f6d85). See brand/abh/brand.json for provenance.
 *
 * Install: copy this whole folder (tokens.css + fonts/ + logos/) into an
 * app's static/brand/, link static/brand/tokens.css BEFORE style.css. Font
 * URLs below are relative to this file, so the folder must move as a unit.
 * No CDN: fonts are self-hosted woff2 (SIL OFL, licenses in fonts/).
 *
 * Contrast (WCAG 2.x, measured 2026-09-24): every --text*, --link, --accent
 * and --status-* value is >= 4.5:1 on EVERY --surface-* token (page, card,
 * tint) and each --status-* on its own --status-*-bg; --text-on-accent on
 * --accent/--accent-hover >= 7:1; --border-strong >= 3:1 (non-text UI).
 * Fill-only primitives are marked; never put text on them without a checked
 * pairing. Re-check with better-colors if you add a surface.
 *
 * Light mode only for now. Dark mode is not defined by the brand and is
 * a deliberate follow-up, not an omission to paper over.
 */

@font-face {
  font-family: "League Spartan";
  src: url("fonts/LeagueSpartan-400-800.woff2") format("woff2");
  font-weight: 400 800;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Bricolage Grotesque";
  src: url("fonts/BricolageGrotesque-300-700.woff2") format("woff2");
  font-weight: 300 700;
  font-style: normal;
  font-display: swap;
}

:root {
  /* ---- Brand primitives (from the site theme; don't use directly in components) */
  --abh-purple: #734681;    /* primary CTA color on the site. 7.19:1 on white */
  --abh-blue: #285780;      /* logo wordmark. 7.59:1 on white */
  --abh-slate: #4f6d85;     /* logo accent. 5.44:1 on white */
  --abh-lilac: #9b7ea4;     /* logo accent. 3.55:1 -- large text / UI only */
  --abh-lavender: #ebe5ed;  /* fill only */
  --abh-mist: #f9f9fb;      /* fill only */
  --abh-ink: #141617;       /* 18.15:1 on white */
  --abh-white: #ffffff;

  /* ---- Typography */
  --font-heading: "League Spartan", Arial, Helvetica, sans-serif;
  --font-body: "Bricolage Grotesque", Arial, Helvetica, sans-serif;
  --font-weight-body: 400;
  --font-weight-body-strong: 500;
  --font-weight-heading: 700;
  --font-weight-subheading: 600;
  --line-height-body: 1.5;
  --line-height-heading: 1.15;

  /* Dense-dashboard type scale (rem, 16px root). Data UI runs smaller than
     the marketing site; body is 0.9375rem (15px), tables 0.875rem. */
  --text-xs: 0.75rem;
  --text-sm: 0.875rem;
  --text-base: 0.9375rem;
  --text-lg: 1.125rem;
  --text-xl: 1.375rem;
  --text-2xl: 1.75rem;
  --text-kpi: 2.25rem;

  /* ---- Surfaces & text */
  --surface-page: var(--abh-mist);
  --surface-card: var(--abh-white);
  --surface-tint: var(--abh-lavender);   /* selected rows, section bands */
  --surface-header: var(--abh-white);    /* the site's header is white with the color logo */
  --text: var(--abh-ink);
  --text-muted: #4c6980;                 /* slate darkened so it also passes on --surface-tint */
  --text-on-accent: var(--abh-white);
  --text-header: var(--abh-blue);
  --text-heading: var(--abh-blue);       /* page headings (h1), as on the site. 7.59 card/header, 7.22 page, 6.13 tint; print on white 7.59 */

  /* ---- Interactive */
  --accent: var(--abh-purple);           /* primary buttons, active nav */
  --accent-hover: #5e3769;               /* purple darkened ~18% */
  --link: var(--abh-blue);
  --focus-ring: var(--abh-blue);
  --border: #d9cedc;                     /* decorative dividers/cards (lilac 38%) */
  --border-strong: #95799d;                 /* lilac darkened: inputs/controls >= 3:1 on every surface */

  /* ---- Status (shared across ABH and ARS; not brand-owned). Always pair
     with a text label or icon -- never color alone. */
  --status-good: #1e7542;
  --status-good-bg: #e3f3e8;
  --status-warn: #8a5300;
  --status-warn-bg: #fdf0d5;
  --status-critical: #b42318;
  --status-critical-bg: #fde7e4;
  --status-neutral: var(--text-muted);
  --status-neutral-bg: var(--abh-lavender);

  /* ---- Charts. Categorical slots derived 2026-09-24 with the dataviz
     skill (snap-to-passing): slot 1 holds ABH blue's hue, slot 2 ABH
     purple's; slots 3-4 were searched in OKLCH with the status hues
     (good/warn/critical) excluded so a series never reads as a status.
     The raw primitives can't be used directly: blue/slate/lilac are under
     the 0.10 chroma floor and blue vs purple is only dE 11.4 apart.
     validate_palette.py --mode light --surface #ffffff, adjacent AND
     --pairs all (donuts are rings): L band PASS, chroma PASS, worst CVD
     dE 12.7 (deutan, 1<->2), worst normal-vision dE 15.6 (3<->4), all >= 3:1
     on --surface-card (3.19-8.61) and --surface-page (3.04-8.18). White
     text on --chart-1 is 4.82:1 (calendar chips). Assign in order, never
     cycle; always ship a legend + table. Light mode only. */
  --chart-1: #1176be;   /* blue    OKLCH 0.55 0.14 247 */
  --chart-2: #6a377a;   /* purple  OKLCH 0.43 0.12 318 */
  --chart-3: #a28b23;   /* ochre   OKLCH 0.64 0.12  96 */
  --chart-4: #2ea095;   /* teal    OKLCH 0.64 0.10 186 */
  /* Residual bucket ("Other" / "Unknown") after slots 1-4 -- never a 5th
     series. Warm gray, OKLCH 0.51 0.02 105: low chroma on purpose so it
     reads as "not a category" (it fails the dataviz chroma floor by
     design). Derived 2026-09-24 from #606060, which was only dE 13.3 from
     --chart-2. validate_palette.py --pairs all with --chart-1..4: normal
     dE >= 15.8 (15.8 vs slot 2, 16.1 vs 1, 16.4 vs 3 and 4), CVD dE >= 10.0
     (tritan vs slot 2). 5.73:1 on --surface-card, 5.45 on --surface-page,
     4.63 on --surface-tint. Fill only: pair with a label, like every slot. */
  --chart-other: #67675a;
  --chart-surface: var(--surface-card);
  --chart-gridline: var(--border);          /* hairline, recessive by design */
  --chart-baseline: var(--border-strong);   /* >= 3:1 on every surface */
  --chart-track: var(--status-neutral-bg);  /* empty donut ring */
  /* SVG chart text. Smaller than --text-xs on purpose: the apps' chart
     geometry (fixed label gutters in reports/charts.py) was sized for 10-12px
     system-ui, and Bricolage sets wider. Raise these only together with the
     gutters. */
  --chart-text-axis: 0.625rem;    /* 10px */
  --chart-text-label: 0.6875rem;  /* 11px */

  /* ---- DEMO_DATA banner (not brand-owned; identical in every app so a
     demo screenshot is always recognisable). Text 11.70:1 on the fill;
     rule 4.03:1 on the fill, 5.02:1 on white. */
  --demo-banner-bg: #fde68a;
  --demo-banner-text: #422006;
  --demo-banner-rule: #b45309;

  /* ---- Space, radius, elevation */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.25rem;
  --space-6: 1.5rem;
  --space-8: 2rem;
  --radius-sm: 4px;
  --radius-control: 6px;
  --radius-card: 10px;
  --shadow-card: 0 1px 2px rgb(20 22 23 / 0.06), 0 1px 3px rgb(20 22 23 / 0.08);
}