/* Opening Passport — design tokens (UX-2). THE only file where color literals may live;
 * everything else (templates, web.css, styles.css) references var(--…) only, and
 * tests/test_design_tokens.py enforces both that rule and the WCAG 2.1 AA contrast of
 * every pair the stylesheets rely on.
 *
 * Palette derived from tenderscan.ca's published token set (approved at the UX-2 gate):
 * primary blue #1E40AF family, teal accent, gray neutrals, Inter (web only).
 *
 * SEMANTIC STATE COLORS ARE CUSTODY SEMANTICS, NOT DECORATION (frozen meaning):
 *   amber = queued on device (not on the server)      green = saved / server-confirmed
 *   red   = alarm / integrity / destructive           grey  = superseded / inactive
 *   sand  = restricted keying marker
 * They may be re-tinted HERE to harmonize, but each remains instantly distinguishable
 * and is ALWAYS paired with a word or icon in markup — never color alone.
 *
 * :root = light (web app, owner portal, exports, tag print).
 * [data-theme="dark"] = the PWA field theme (dark by default: mechanical rooms,
 * stairwells — contrast over subtlety). */

:root {
  /* brand */
  --primary: #1E40AF;
  --primary-hover: #1D4ED8;
  --on-primary: #FFFFFF;
  --accent: #0F766E;            /* interactive accents ONLY — never on status pills */
  --on-accent: #FFFFFF;

  /* neutrals */
  --surface: #F3F4F6;           /* page background */
  --surface-raised: #FFFFFF;    /* cards, panels, header */
  --border: #E5E7EB;
  --border-strong: #9CA3AF;
  --text: #1F2937;
  --text-muted: #6B7280;        /* raised surfaces only — tested against --surface-raised */
  --focus: #1D4ED8;

  /* semantic custody states (see header comment) */
  --queued: #B45309;            --on-queued: #FFFFFF;
  --saved: #15803D;             --on-saved: #FFFFFF;
  --alarm: #B91C1C;             --on-alarm: #FFFFFF;
  --alarm-strong: #7F1D1D;      --on-alarm-strong: #FECACA;   /* full-width custody banner */
  --alarm-soft-bg: #FDECEA;     --alarm-soft-border: #F5C2BD; --alarm-soft-text: #7F1D1D;
  --saved-soft-bg: #F0FDF4;     --saved-soft-border: #86EFAC; --saved-soft-text: #14532D;
  --inactive: #6B7280;          --on-inactive: #FFFFFF;
  --restricted-bg: #FDF6EC;     --restricted-border: #EEDDC0; --restricted-text: #92400E;
  --pressure-bg: #78350F;       --on-pressure: #FDE68A;       /* storage-pressure banner */
  --neutral-pill-bg: #E5E7EB;   --neutral-pill-text: #374151; /* informational chips */

  --shadow: 0 1px 3px rgba(17, 24, 39, .08);
  --radius: 8px;
}

[data-theme="dark"] {
  --primary: #2563EB;
  --primary-hover: #1D4ED8;
  --on-primary: #FFFFFF;
  --accent: #2DD4BF;
  --on-accent: #062E2A;

  --surface: #111827;
  --surface-raised: #1F2937;
  --border: #374151;
  --border-strong: #6B7280;
  --text: #E5E7EB;
  --text-muted: #9CA3AF;
  --focus: #60A5FA;

  /* dark pills are OUTLINE-style: these are text/border tiers on --surface */
  --queued: #F59E0B;            --on-queued: #111827;
  --saved: #4ADE80;             --on-saved: #052E16;
  --alarm: #F87171;             --on-alarm: #2B1214;
  --alarm-strong: #2B1214;      --on-alarm-strong: #FECACA;
  --alarm-soft-bg: #2B1214;     --alarm-soft-border: #F87171; --alarm-soft-text: #FECACA;
  --saved-soft-bg: #102517;     --saved-soft-border: #4ADE80; --saved-soft-text: #BBF7D0;
  --inactive: #9CA3AF;          --on-inactive: #111827;
  --restricted-bg: #2B2410;     --restricted-border: #A16207; --restricted-text: #FDE68A;
  --pressure-bg: #2B2410;       --on-pressure: #FDE68A;
  --neutral-pill-bg: #1F2937;   --neutral-pill-text: #D1D5DB;

  --shadow: 0 1px 3px rgba(0, 0, 0, .5);
}