/* ============================================================================
   tokens.css — Terminal 5 design tokens (single source of truth)
   Loaded before style.css / index.html / admin.html inline styles.
   Light values live in :root; dark values override via
   @media (prefers-color-scheme: dark), matching the app's existing convention.

   Stage S2a: style.css consumes these --t5-* tokens directly. The
   Stage-S1 legacy alias block (old style.css :root names pinned to their
   pre-redesign values) has been removed now that style.css no longer
   references any of those names.
   ========================================================================= */

/* ---- Hanken Grotesk (self-hosted, variable, latin subset) ---- */
@font-face {
  font-family: 'Hanken Grotesk';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url(/fonts/hanken-grotesk-latin-normal.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Hanken Grotesk';
  font-style: italic;
  font-weight: 100 900;
  font-display: swap;
  src: url(/fonts/hanken-grotesk-latin-italic.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* ============================================================================
   Terminal 5 tokens — light mode (default)
   ========================================================================= */
:root {
  --t5-font: 'Hanken Grotesk', system-ui, -apple-system, 'Segoe UI', sans-serif;

  /* surfaces */
  --t5-bg: #E9E8E4;        /* warm concourse — page background */
  --t5-card: #FCFBF9;      /* sign panel — card surface */
  --t5-cell: #F1F0EB;      /* cutout — inset cells/banners */
  --t5-sign: #2A2D31;      /* charcoal anchor block (monogram chips, avatar, [+] tile) */

  /* borders */
  --t5-line: rgba(27, 30, 33, .09);   /* 1px card edge */
  --t5-hair: rgba(27, 30, 33, .08);   /* hairline divider */

  /* text */
  --t5-ink: #1B1E21;       /* primary data */
  --t5-sub: #52585F;       /* labels / secondary text */
  --t5-mut: #61676E;       /* muted / tertiary text (≥4.5:1 on bg for small text) */

  /* wayfinding yellow — adjacency law applies in both modes */
  --t5-yellow: #FFD200;
  --t5-yellow-ink: #151617; /* ink/glyphs on yellow */

  /* status derivations (light ground) */
  --t5-delay: #A54D08;     /* delayed indicator + revised time (≥4.5:1 on tinted wells) */
  --t5-green: #1F7A3E;     /* on-time indicator */
  --t5-red: #B3352C;       /* cancelled / diverted alert */
  --t5-track: #ABA8A0;     /* progress track remaining portion */

  /* tinted severity strips (derived from --t5-delay / --t5-red for light ground) */
  --t5-delay-tint: rgba(184, 84, 7, .14);
  --t5-red-tint: rgba(179, 53, 44, .14);

  /* Map tab — ocean is the page ground, land a quiet lift above it */
  --t5-map-ocean: #E4E2DD;
  --t5-map-land: #D6D3CB;
  --t5-map-track: rgba(27, 30, 33, .38);
  --t5-map-upcoming: rgba(27, 30, 33, .34);
  --t5-map-node: #52585F;
  --t5-map-label: #52585F;
  --t5-map-callout: #FCFBF9;
  --t5-map-callout-ink: #1B1E21;
  --t5-map-callout-sub: #52585F;
}

/* ============================================================================
   Terminal 5 tokens — dark mode (native)
   ========================================================================= */
@media (prefers-color-scheme: dark) {
  :root {
    --t5-bg: #26282B;        /* concourse charcoal */
    --t5-card: #2F3337;      /* sign panel */
    --t5-cell: #25282B;      /* cutout */
    --t5-sign: #3B4046;      /* charcoal anchor block, lifted off the panel */

    --t5-line: rgba(255, 255, 255, .09);
    --t5-hair: rgba(255, 255, 255, .07);

    --t5-ink: #F7F8F9;       /* signage white */
    --t5-sub: #A9B0B7;       /* label grey */
    --t5-mut: #99A0A7;      /* ≥4.5:1 on dark card for small text */

    --t5-yellow: #FFD200;
    --t5-yellow-ink: #151617;

    --t5-delay: #FF8A1F;
    --t5-green: #4FC77C;
    --t5-red: #FF6B5E;
    --t5-track: rgba(255, 255, 255, .14);

    --t5-delay-tint: rgba(255, 138, 31, .13);
    --t5-red-tint: rgba(255, 107, 94, .13);

    --t5-map-ocean: #25282B;
    --t5-map-land: #33373C;
    --t5-map-track: rgba(255, 255, 255, .34);
    --t5-map-upcoming: rgba(255, 255, 255, .30);
    --t5-map-node: #A9B0B7;
    --t5-map-label: #A9B0B7;
    --t5-map-callout: #2F3337;
    --t5-map-callout-ink: #F7F8F9;
    --t5-map-callout-sub: #A9B0B7;
  }
}
