/* GBC THEME — the fleet in gbctrafficcontrol.com's own look (owner, 2026-10-03, paraphrased: the GBC copy themed from
   the website, and the desktop admin view updated). Loaded LAST (app/index.html and the fixture), so it decides.

   The website's tokens, read from its index.html :root that day:
     ground #2a2521 · card #37322e · band #322d28 · ink #e9e6e3 · soft ink #b3b2b0 · faint #8b8885
     orange #b34b0c (fills, white text 5.5:1) · deep #7c3306 · accent-lite #de8b52 (text and lines on dark, 5.7:1)
     hairline rgba(179,178,176,.10) · line rgba(179,178,176,.18) · radii 14/10 · Outfit headings, Inter body.
   One colour the website does not need and a fleet does: the ATTENTION colour (due now, overdue, warnings). It is the
   traffic-warning-sign yellow #f2c94c, so "due" never reads as the brand orange. No red but heavy traffic, as ever.
   Fonts are bundled (fleet/brand/fonts, SIL OFL): the app fetches nothing from another site. */

@font-face { font-family: Inter; font-style: normal; font-weight: 400; font-display: swap; src: url("fleet/brand/fonts/inter-latin-400-normal.woff2") format("woff2"); }
@font-face { font-family: Inter; font-style: normal; font-weight: 500; font-display: swap; src: url("fleet/brand/fonts/inter-latin-500-normal.woff2") format("woff2"); }
@font-face { font-family: Inter; font-style: normal; font-weight: 600; font-display: swap; src: url("fleet/brand/fonts/inter-latin-600-normal.woff2") format("woff2"); }
@font-face { font-family: Outfit; font-style: normal; font-weight: 600; font-display: swap; src: url("fleet/brand/fonts/outfit-latin-600-normal.woff2") format("woff2"); }
@font-face { font-family: Outfit; font-style: normal; font-weight: 700; font-display: swap; src: url("fleet/brand/fonts/outfit-latin-700-normal.woff2") format("woff2"); }
@font-face { font-family: Outfit; font-style: normal; font-weight: 800; font-display: swap; src: url("fleet/brand/fonts/outfit-latin-800-normal.woff2") format("woff2"); }

html, body { background: #2a2521; }

/* THE TOKENS. `:not(#gbc-theme)` lifts these over every light/dark set the app carries ([data-theme] included). */
#fleetView:not(#gbc-theme), #fleetView.flt-polished:not(#gbc-theme) {
  --fl-ink: #2a2521;          /* the ground, and the text ON an accent (espresso on #de8b52: 5.7:1) */
  --fl-ink-2: #37322e;
  --fl-ink-3: #433c36;
  --fl-mint: #de8b52;         /* the brand accent: GBC's accent-lite */
  --fl-mint-ink: #de8b52;
  --fl-amber: #f2c94c;        /* attention: warning-sign yellow */
  --fl-amber-ink: #f2c94c;
  --fl-paper: #e9e6e3;
  --fl-white: #37322e;
  --fl-bg: #2a2521;
  --fl-card: #37322e;
  --fl-card-2: #433c36;
  --fl-line: rgba(179, 178, 176, 0.18);
  --fl-text: #e9e6e3;
  --fl-text-2: #b3b2b0;
  --fl-mint-text: #de8b52;
  --fl-amber-text: #f2c94c;
  --gbc-orange: #b34b0c;
  --gbc-orange-deep: #7c3306;
  --gbc-band: #322d28;
  --gbc-hair: rgba(179, 178, 176, 0.10);
  --gbc-shadow-1: 0 1px 2px rgba(20, 14, 10, .35), 0 8px 20px -8px rgba(20, 14, 10, .5);
  --gbc-shadow-2: 0 2px 4px rgba(20, 14, 10, .4), 0 14px 34px -10px rgba(20, 14, 10, .6);
  background: #2a2521;
  color: #e9e6e3;
  font-family: Inter, system-ui, -apple-system, sans-serif;
  -webkit-font-smoothing: antialiased;
}
#fleetView :is(h1, h2, h3), #fleetView .flt-today-tile b, #fleetView .flt-stat b { font-family: Outfit, Inter, system-ui, sans-serif; letter-spacing: -0.01em; }
#fleetView :focus-visible { outline: 2px solid #de8b52; outline-offset: 2px; }

/* THE TOP BAR: the website's header: the light GBC mark, a kicker tag, an orange hairline under it */
#fleetView .flt-topbar { border-bottom: 1px solid rgba(179, 75, 12, .6); padding-bottom: 14px; }
#fleetView .flt-tagline { font-size: 10.5px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: #de8b52; }

/* SECTION KICKERS: the website's editorial kicker */
#fleetView .flt-today-h, #fleetView .flt-kicker { font-family: Inter, system-ui, sans-serif; font-size: 11.5px; font-weight: 600; letter-spacing: .11em; text-transform: uppercase; color: #de8b52; }

/* CARDS: surface gradient, a 1px inner top highlight, the website's shadow; hover lifts on a mouse only */
#fleetView .flt-card, #fleetView .flt-today-tile {
  background: linear-gradient(180deg, #3a3531, #34302c);
  border: 1px solid var(--gbc-hair);
  border-radius: 14px;
  box-shadow: inset 0 1px 0 rgba(233, 230, 227, .05), var(--gbc-shadow-1);
  color: #e9e6e3;
}
#fleetView .flt-today-tile b { color: #e9e6e3; }
#fleetView .flt-today-tile span { color: #e9e6e3; }
#fleetView .flt-today-tile small { color: #b3b2b0; }
#fleetView .flt-today-tile.is-due { border-color: rgba(242, 201, 76, .55); }
#fleetView .flt-today-tile.is-due b { color: #f2c94c; }
#fleetView .flt-today-tile.is-warn b { color: #f2c94c; }
@media (hover: hover) {
  #fleetView .flt-today-tile:hover, #fleetView .flt-card--tap:hover { transform: translateY(-3px); box-shadow: inset 0 1px 0 rgba(233, 230, 227, .06), var(--gbc-shadow-2); border-color: rgba(222, 139, 82, .55); }
}
#fleetView .flt-today-tile, #fleetView .flt-card--tap { transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; }
@media (prefers-reduced-motion: reduce) { #fleetView .flt-today-tile, #fleetView .flt-card--tap { transition: none; } }

/* BUTTONS: the website's primary (orange fill, white text, a darker bottom edge that presses), quiet ghosts */
#fleetView .flt-btn--primary {
  background: linear-gradient(180deg, #c0540f, #b34b0c); color: #fff; border: 1px solid #7c3306; border-bottom-width: 3px;
}
#fleetView .flt-btn--primary:active { border-bottom-width: 1px; transform: translateY(1px); }
#fleetView .flt-btn--ghost { background: transparent; color: #e9e6e3; border: 1px solid rgba(179, 178, 176, .28); }
#fleetView .flt-btn--ghost:hover { border-color: #de8b52; }

/* THE DESKTOP ADMIN RAIL: a band like the website's, orange for where you are */
#fleetView .flt-railed > .flt-tabs.flt-rail {
  background: #322d28; border: 1px solid var(--gbc-hair); border-radius: 14px; padding: 8px; box-shadow: var(--gbc-shadow-1);
}
#fleetView .flt-railed > .flt-rail .flt-tab { color: #b3b2b0; font-family: Outfit, Inter, system-ui, sans-serif; font-weight: 600; border-radius: 10px; }
#fleetView .flt-railed > .flt-rail .flt-tab:hover { background: #3a3531; color: #e9e6e3; }
#fleetView .flt-railed > .flt-rail .flt-tab[aria-selected="true"] { background: #b34b0c; color: #fff; box-shadow: inset 3px 0 0 #de8b52; }
#fleetView .flt-railed > .flt-rail .flt-tab[aria-selected="true"] .flt-rail-ico { color: #fff; }
#fleetView .flt-railed > .flt-rail .flt-tab:focus-visible { outline: 2px solid #de8b52; outline-offset: 2px; }
#fleetView .flt-rail .flt-tab-n { background: #f2c94c; color: #2a2521; }

/* WHAT THE AUDIT FOUND STILL IN THE NEXUS PALETTE (scratch audit-theme.cjs over every tab and form, 2026-10-03):
   literal colours the tokens above cannot reach. Each is the same surface in GBC's colours. */
#fleetView .flt-stat.is-due { background: linear-gradient(180deg, #3a3531, #34302c); border-color: rgba(242, 201, 76, .55); }
#fleetView .flt-stat.is-due b, #fleetView .flt-stat.is-due span { color: #f2c94c; }
#fleetView .flt-admin-panel { background: linear-gradient(180deg, #3a3531, #34302c); border: 1px solid var(--gbc-hair); box-shadow: var(--gbc-shadow-1); color: #e9e6e3; }
#fleetView .flt-admin-panel.flt-admin-on { border-color: rgba(222, 139, 82, .45); box-shadow: inset 5px 0 0 #de8b52, var(--gbc-shadow-1); }
#fleetView .flt-admin-panel.flt-admin-readonly { background: transparent; box-shadow: none; }
#fleetView .flt-seg-btn[aria-pressed="true"] b { background: rgba(42, 37, 33, .22); }
#fleetView.flt-desktop .flt-split-empty { border-color: rgba(179, 178, 176, .22); }
#fleetView .flt-keys kbd { border-color: rgba(179, 178, 176, .35); background: #322d28; color: #e9e6e3; }

/* FORMS: the website's fields (a warm off-surface, 16px so a phone never zooms, the accent ring on focus) */
#fleetView :is(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]), select, textarea) {
  background-color: #322d28; color: #e9e6e3; border-color: rgba(179, 178, 176, .28); font-size: max(16px, 1em); color-scheme: dark;
}
#fleetView :is(input, select, textarea)::placeholder { color: #8b8885; opacity: 1; }
#fleetView :is(input, select, textarea):focus { border-color: #de8b52; outline: none; box-shadow: 0 0 0 3px rgba(222, 139, 82, .25); }
#fleetView :is(input[type="checkbox"], input[type="radio"], input[type="range"]) { accent-color: #de8b52; }

/* SELECTED STATES the remap cannot judge (a light text on a var() fill): GBC's orange for "this one" */
#fleetView .nfv-hotspot[aria-pressed="true"] { background: #b34b0c; border-color: #7c3306; color: #fff; }
#fleetView .nfv-hotspot[aria-pressed="true"] small { color: #fff; }
.nft-job-pick button[aria-pressed=true], .nft .nft-music-row > button[aria-pressed=true] { background: #de8b52; color: #2a2521; }
.nft-footer nav button[aria-pressed=true], .nft-section-tabs button[aria-pressed=true], .nft-wheel-controls button[aria-pressed=true] { background: #de8b52; color: #2a2521; border-color: #de8b52; }
.nft-map-caption { background: #322d28; color: #e9e6e3; }
.nft-map-caption > small { color: #b3b2b0; }
.nft-mini-map, .nft-map-canvas { background: #231f1c; }   /* under the night map's own ground (gbc-map-theme.js) */

/* THE LOGO, light on dark (the website's own silver mark: the same paths as gbc-logo.svg, every fill #e9e6e3).
   brand.css cropped a wider NEXUS-era image inside a dark tile; GBC's mark is shown whole instead. */
.fleet-original-brand { background: transparent; overflow: visible; }
.fleet-original-brand img, .nft-brand .fleet-original-brand img, .sh-top-mark .fleet-original-brand img { position: static; width: 100%; height: 100%; object-fit: contain; object-position: left center; left: auto; top: auto; }

/* PRINT: the daily report prints black on white (daily-report.css); the theme's dark ground and card gradients step aside */
@media print {
  html, body { background: #fff !important; }
  #fleetView .flt-dr-page, #fleetView .flt-dr-truck { background: #fff !important; box-shadow: none !important; }
}

/* THE DRIVER'S PRE-TRIP (2026-10-17): the original's new card, in GBC's colours. A chosen OK is the GBC orange fill
   with white text (5.35:1; the remap's accent-lite fill under white fails at 2.6:1); a chosen Defect stays the
   attention colour; the count is a warm light badge, not the original's pale mint. */
.nft .nft-pretrip-list button[aria-pressed="true"][data-result="pass"] { background: #b34b0c; border-color: #7c3306; color: #fff; }
.nft .nft-pretrip-heading>[data-pt-count] { background: #e9e6e3; color: #28231f; }