/* =============================================================================
   uv-theme.css : the Under Vulcan palette and faces, bound to the ds.css tokens
   =============================================================================
   Candidate A "Ledger" in the Under Vulcan brand: warm paper, near-black ink and
   the logo red (#EF4236) for the BRAND (logo, 3px top rule, title tick, active-nav
   underline, focus ring, footer mark) and, deepened to #D6382E, for filled pill
   buttons so white labels pass AA. Red stays out of the DATA (numbers, charts,
   status words, totals). One data accent (--chart-1) and a grey ramp. Light is the
   default; dark follows <html data-theme="dark">, set by the blocking script in
   PortalLayoutV2 from localStorage "uv_theme" (light | dark | system).
   Every neutral elsewhere is rgba(var(--ink), a), so components need no
   per-theme block. All pairs here pass scripts/design/contrast.py.
   Literal colours are allowed ONLY on custom-property lines in this file.
   ============================================================================= */

@font-face { font-family: "Source Sans 3"; font-weight: 400; font-style: normal; font-display: swap; src: url("../fonts/SourceSans3-400.woff2") format("woff2"); }
@font-face { font-family: "Source Sans 3"; font-weight: 500; font-style: normal; font-display: swap; src: url("../fonts/SourceSans3-500.woff2") format("woff2"); }
@font-face { font-family: "Source Sans 3"; font-weight: 600; font-style: normal; font-display: swap; src: url("../fonts/SourceSans3-600.woff2") format("woff2"); }
@font-face { font-family: "Source Sans 3"; font-weight: 700; font-style: normal; font-display: swap; src: url("../fonts/SourceSans3-700.woff2") format("woff2"); }
@font-face { font-family: "Oswald"; font-weight: 500; font-style: normal; font-display: swap; src: url("../fonts/Oswald-500.woff2") format("woff2"); }
@font-face { font-family: "Oswald"; font-weight: 600; font-style: normal; font-display: swap; src: url("../fonts/Oswald-600.woff2") format("woff2"); }

:root {
  color-scheme: light;

  --font-body: "Source Sans 3", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-primary: var(--font-body);
  --font-display: "Oswald", "Source Sans 3", system-ui, sans-serif;   /* page titles only (the wordmark is the logo SVG) */
  --font-mono: ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace;

  /* Surfaces */
  --bg: #F8F6F1;
  --bg-elevated: #FFFFFF;
  --bg-sunken: #F0EDE6;
  --surface: var(--bg-elevated);
  --surface-float: color-mix(in srgb, var(--bg-elevated) 94%, transparent);

  /* Ink: every neutral is rgba(var(--ink), a) */
  --ink: 26, 26, 26;
  --text: #1A1A1A;
  --text-muted: #4A4A4A;
  --text-subtle: #6B6B6B;
  --border: rgba(var(--ink), 0.10);
  --border-strong: rgba(var(--ink), 0.18);
  --rule: var(--border);
  --hairline: var(--border);
  --hairline-strong: var(--border-strong);

  /* Brand. Roles, not shades: pick by what the red is doing. */
  --brand: #EF4236;          /* the logo red: marks only (rule, tick, underline, focus ring, footer mark). 3.53:1 on paper, 3.82 on white */
  --brand-fill: #D6382E;     /* filled button: white label 4.70:1 */
  --brand-hover: #BD3228;    /* hover fill = the public site's hover red; white label 5.75:1 */
  --brand-press: #A92B22;    /* pressed fill; white label 6.87:1 */
  --brand-text: #BD3228;     /* the ONLY red allowed as text (the "New" chip): 5.33:1 on paper, 5.75 on white */
  --brand-tint: rgba(239, 66, 54, 0.10);   /* chip background / hover wash, never on a data row */
  --rule-brand-h: 3px;       /* brand rule above the bar */
  --radius-btn: var(--radius-pill);        /* the public site's pill buttons; inputs and cards keep their radii */

  /* Interaction (names every component already reads) */
  --accent: var(--brand);          /* marks: underline, focus ring, selection edge */
  --accent-fill: var(--brand-fill);  /* primary button fill */
  --on-accent: #FFFFFF;
  --link: var(--info);

  /* Roles: text or icon colour; tints are 10% of the role on the surface */
  --positive: #1E7A4C;
  --warning: #9A5B00;
  --danger: #B3261E;
  --info: #2F5D8A;
  --positive-tint: color-mix(in srgb, var(--positive) 10%, var(--bg-elevated));
  --warning-tint: color-mix(in srgb, var(--warning) 10%, var(--bg-elevated));
  --danger-tint: color-mix(in srgb, var(--danger) 10%, var(--bg-elevated));
  --info-tint: color-mix(in srgb, var(--info) 10%, var(--bg-elevated));

  /* Charts: grey first, one accent */
  --chart-1: #2F5D8A;
  --chart-g1: #5C5C5C;
  --chart-g2: #8A8A8A;
  --chart-g3: rgba(var(--ink), 0.15);   /* context only: baseline, grid fill */

  /* Elevation (menus, tooltips, dialogs, Help drawer only) and scrim */
  --elev-1: 0 1px 2px rgba(26, 26, 26, 0.08);
  --elev-2: 0 2px 8px rgba(26, 26, 26, 0.12);
  --elev-3: 0 8px 28px rgba(26, 26, 26, 0.18);
  --scrim: rgba(26, 26, 26, 0.45);
}

html[data-theme="dark"] {
  color-scheme: dark;

  --bg: #14161A;
  --bg-elevated: #1D2025;
  --bg-sunken: #0F1114;
  --ink: 236, 234, 230;
  --text: #ECEAE6;
  --text-muted: #B9B6B0;
  --text-subtle: #8F8C86;
  --border: rgba(var(--ink), 0.12);
  --border-strong: rgba(var(--ink), 0.20);

  --brand: #EF4236;          /* 4.75:1 on #14161A (marks only; 4.28 on #1D2025, so no thin red marks on elevated surfaces) */
  --brand-fill: #D6382E;     /* white label 4.70:1 in both themes */
  --brand-text: #FF6459;     /* 5.62:1 on #1D2025, 5.89 on #14161A */
  --brand-tint: rgba(239, 66, 54, 0.16);
  --positive: #4FC58A;
  --warning: #E0A23A;
  --danger: #FF7A6E;
  --info: #6AA3DC;

  --chart-1: #6AA3DC;
  --chart-g1: #B0AEA8;
  --chart-g2: #85837E;

  --elev-1: 0 1px 2px rgba(0, 0, 0, 0.30);
  --elev-2: 0 2px 8px rgba(0, 0, 0, 0.40);
  --elev-3: 0 8px 28px rgba(0, 0, 0, 0.55);
  --scrim: rgba(0, 0, 0, 0.60);
}