/* The one look: "Build board" in Hurlburt colors (design-system.md 1.2, D-006). Contrast measured 2026-11-02 by the Product Designer.
 * Three themes of the same look, chosen by <html data-theme="...">:
 *   dark    = Steel       (TV always; phones in dark mode; this is also the default with no data-theme)
 *   light   = Galvanized  (phones in light mode)
 *   desk    = Desk        (admin, owner, sign-in; light only in v1; no page uses it yet)
 * Brand colors that fail as text are used only as fills/lines; text uses the tints named in the comments. */

/* ---- shared by all three themes: fonts, team colors, hazard stripe, supply/return rules ---- */
:root {
  --font-display: "Big Shoulders Stencil Display", "Impact", "Arial Narrow", sans-serif;   /* headings, TV ranks */
  --font-name:    "Barlow Condensed", "Arial Narrow", "Helvetica Neue Condensed", sans-serif; /* team names, labels */
  --font-num:     "Barlow Condensed", "Arial Narrow", "Helvetica Neue Condensed", sans-serif; /* all numbers (stencil digits break up when big) */
  --font-body:    "Poppins", "Helvetica Neue", Arial, system-ui, sans-serif;                   /* body, footers, small print */
  --fw-display: 900; --fw-name: 700; --fw-num: 700; --fw-body: 400; --fw-body-strong: 600;
  --ls-display: .02em; --tt-display: uppercase;
  --num-features: "tnum" 1, "lnum" 1;

  /* the fixed list of 12 team colors. Gold replaced Orange (orange stays the leader / new-points color). Fills only, never text. */
  --team-red: #F05252;     --team-gold: #F2C14E;   --team-lime: #A3D94E;  --team-green: #2FC37A;
  --team-teal: #22C3B5;    --team-sky: #4CB8F5;    --team-blue: #5B8CFF;  --team-violet: #9D7BFF;
  --team-magenta: #E05AD0; --team-pink: #FF85B0;   --team-sand: #D8B98A;  --team-silver: #B7C1CC;
  --on-team: #0A0F13;

  /* hazard stripe (navy + true Hurlburt orange): decoration only */
  --c-stripe-a: #04194E; --c-stripe-b: #E86930; --stripe-h: 12px;
  --c-rule-1: #EC2027;   /* Hurlburt red, lines only ("supply") */
  --c-rule-2: #38B8EB;   /* Hurlburt sky, lines only ("return") */
  --panel-border: var(--hairline) solid var(--c-line);
}

/* Steel: TV always, phones in dark mode (default) */
:root,
:root[data-theme="dark"] {
  color-scheme: dark;
  --c-bg: #0B1424; --c-surface: #111D30; --c-surface-2: #18263D; --c-line: #2A3A55;
  --c-ink: #EEF2F6; --c-muted: #B0BDCC;
  --c-accent: #FF8A4C;          /* orange tint: leader fill + new points. dark text on it 8.2:1 */
  --c-on-accent: #0A0F13;
  --c-accent-text: #FF8A4C;     /* 7.9:1 on bg, 7.2:1 on panel */
  --c-brand-true: #E86930;      /* true Hurlburt orange: decoration only (5.7:1 on bg, under the 7:1 TV bar) */
  --c-good: #5CBF85; --c-bad-text: #FF8A80; --c-bad-soft: #2A1A22; --c-info: #38B8EB; --c-focus: #38B8EB;
  --c-brand: #04194E; --c-on-brand: #EEF2F6; --c-brand-muted: #B9C6DD;
  --c-bar: #38B8EB; --c-bar-track: #18263D;
  --c-swatch-outline: transparent;
  --c-skeleton: #18263D;
  --bg-texture:
    radial-gradient(1200px 500px at 30% 0%, rgba(255,255,255,.025), transparent 70%),
    repeating-linear-gradient(0deg, rgba(255,255,255,.012) 0 1px, transparent 1px 3px);
}

/* Galvanized: phones in light mode (navy ink) */
:root[data-theme="light"] {
  color-scheme: light;
  --c-bg: #E7EAEE; --c-surface: #F5F7F9; --c-surface-2: #DCE1E7; --c-line: #C3CAD3;
  --c-ink: #04194E; --c-muted: #4A5870;
  --c-accent: #E86930;          /* true orange as a FILL with navy text (5.2:1) */
  --c-on-accent: #04194E;
  --c-accent-text: #A8410C;     /* deep tint for orange text: 5.7:1 panel */
  --c-brand-true: #E86930;
  --c-good: #18794A; --c-bad-text: #B3151B; --c-bad-soft: #FBE3E3; --c-info: #0A6A99; --c-focus: #0A6A99;
  --c-brand: #04194E; --c-on-brand: #EEF2F6; --c-brand-muted: #B9C6DD;
  --c-bar: #0A6A99; --c-bar-track: #DCE1E7;   /* sky deep tint: true sky fails 3:1 on light */
  --c-swatch-outline: rgba(4, 25, 78, .35);
  --c-skeleton: #DCE1E7;
  --bg-texture: none;
}

/* Desk: admin, owner, sign-in (light only in v1). Defines every name the other themes define, plus the desk-only extras
 * (input border, link, soft status backgrounds, warn, bad fill, nav band) listed in tests/structure.test.mjs. */
:root[data-theme="desk"] {
  color-scheme: light;
  --c-bg: #EDF0F4; --c-surface: #FFFFFF; --c-surface-2: #F5F7F9; --c-line: #C5CCD6;
  --c-ink: #04194E; --c-muted: #4A5870;
  --c-accent: #E86930;          /* fills only (first-place cell, nav badge) with navy text 5.2:1; never text on white (3.2) */
  --c-on-accent: #04194E;
  --c-accent-text: #A8410C;     /* 6.1 on white */
  --c-brand-true: #E86930;
  --c-good: #18794A; --c-bad-text: #B3151B; --c-bad-soft: #FBE3E3; --c-info: #0A6A99; --c-focus: #0A6A99;
  --c-brand: #04194E; --c-on-brand: #EEF2F6; --c-brand-muted: #B9C6DD;
  --c-bar: #0A6A99; --c-bar-track: #DCE1E7;
  --c-swatch-outline: rgba(4, 25, 78, .35);
  --c-skeleton: #DCE1E7;
  --bg-texture: none;
  /* desk-only extras */
  --c-input-border: #66768C;    /* 4.6 on white, 4.1 on bg (needs 3:1) */
  --c-link: #0A6A99;            /* 5.9 on white; links are underlined */
  --c-accent-soft: #FFF1E8;     /* highlighted row; accent text 5.5 on it */
  --c-good-soft: #E4F4EA;       /* good 4.8 on it */
  --c-warn: #7A5300; --c-warn-soft: #FBF0D0;   /* ochre, kept apart from Hurlburt orange; 6.0 on soft */
  --c-bad: #B3151B;             /* destructive fill: white text 6.9 */
  --c-nav: #04194E;             /* left nav band: #EEF2F6 14.9, #B9C6DD 9.7, sky 7.4 */
}