/* ============================================================================
   GapSync — semantic design tokens (docs/10 §1, values per ADR-003).

   Single source for STATUS and SEVERITY colors — these mirror the state
   machines and are never repurposed (docs/10 §1 rules). Values are mapped
   onto the emerald design system palette (app.css) instead of the original
   civic-blue spec hexes; the semantic contract is unchanged.

   Usage contract: badges get a translucent background tint and use the token
   as TEXT + BORDER color (components.css .status-badge / .severity-badge).
   Color is never the only signal — badges always carry a text label
   (docs/10 §8).

   CONTRAST RATIONALE (WCAG 2.1 AA, target >= 4.5:1 for badge text)
   Light theme text tokens are checked against the light shell ground
   #eef6fb (app.css --bg-1); dark theme tokens against the dark ground
   #081210. The faint tint behind a badge only moves the effective ratio
   toward the safe side (tints are <= 14% opacity of the same hue).

   token            | light value  vs #eef6fb | dark value  vs #081210
   -----------------+-------------------------+------------------------
   --s-draft        | #5c6b7d      ~5.0:1     | #9aa8b5     ~7.9:1
   --s-review       | #2166b8      ~5.3:1     | #4aa3e0     ~6.9:1
   --s-approved     | #0f766e      ~5.0:1     | #2fbfa0     ~8.3:1
   --s-active       | #0f7d49      ~4.7:1     | #38d08a     ~9.6:1
   --s-suspended    | #8a5f0d      ~5.2:1     | #e0a83e     ~9.0:1
   --s-rejected     | #c0271f      ~5.4:1     | #ff7a72     ~7.5:1
   --s-closed       | #374151      ~9.4:1     | #c3ccd5     ~11.5:1
   --s-expired      | #6d5cd6      ~4.6:1     | #9b8cff     ~6.9:1
   --sev-low        | #4d7c0f      ~4.6:1     | #9bd06a     ~10.6:1
   --sev-medium     | #935c00      ~5.1:1     | #f2b94b     ~10.7:1
   --sev-high       | #c2410c      ~4.7:1     | #f0854a     ~7.4:1
   --sev-critical   | #b91c1c      ~5.9:1     | #f0564f     ~5.6:1

   Palette consistency: active/rejected/suspended/review/expired reuse the
   donor emerald / red-2 / amber / sky / violet accents (or a darkened AA
   variant of them); the remaining hues are chosen to sit naturally between
   those anchors while staying visually distinct from each other.
   ========================================================================== */

:root {
  /* ---------- Status (mirrors state machines) — LIGHT ---------- */
  --s-draft:     #5c6b7d;
  --s-review:    #2166b8;
  --s-approved:  #0f766e;
  --s-active:    #0f7d49;
  --s-suspended: #8a5f0d;
  --s-rejected:  #c0271f;
  --s-closed:    #374151;
  --s-expired:   #6d5cd6;

  /* ---------- Severity — LIGHT ---------- */
  --sev-low:      #4d7c0f;
  --sev-medium:   #935c00;
  --sev-high:     #c2410c;
  --sev-critical: #b91c1c;

  /* Badge tint strength (percentage of the token color mixed into the
     badge background via color-mix; browsers without color-mix fall back
     to a transparent badge ground — text/border contrast still passes). */
  --badge-tint: 12%;
}

:root[data-theme="dark"] {
  /* ---------- Status — DARK ---------- */
  --s-draft:     #9aa8b5;
  --s-review:    #4aa3e0;
  --s-approved:  #2fbfa0;
  --s-active:    #38d08a;
  --s-suspended: #e0a83e;
  --s-rejected:  #ff7a72;
  --s-closed:    #c3ccd5;
  --s-expired:   #9b8cff;

  /* ---------- Severity — DARK ---------- */
  --sev-low:      #9bd06a;
  --sev-medium:   #f2b94b;
  --sev-high:     #f0854a;
  --sev-critical: #f0564f;

  --badge-tint: 14%;
}