/* tokens.css — shared design tokens for the GPS Server web UI.
 *
 * Served publicly at /static/tokens.css (see webserver.go). Every page links
 * this before its own <style> block, so page rules always win on specificity
 * ties — pages override tokens by re-declaring the custom property, not by
 * out-specifying the selector.
 *
 * Governing constraint: incoming telemetry values are the most readable text
 * on the screen. Colour is spent on exceptions only; a healthy value renders
 * as --text (16.4:1) rather than as a saturated "good" green (4.1–5.1:1).
 */

:root {
  /* Brand — darkened from the original #217346 so white text on it clears
     4.5:1 at the 10–11px sizes used in the ribbon and status bar. */
  --brand:        #17643c;
  --brand-hover:  #1f7d4b;
  --brand-ink:    #ffffff;

  /* Surfaces */
  --surface:      #ffffff;
  --surface-sunk: #f4f6f4;
  --row-zebra:    #f7f9f8;  /* neutral; was green #f2fbf5 and fought status colour */
  --row-hover:    #eef3f0;
  --line:         #d6dbd7;
  --line-soft:    #e8ebe9;

  /* Text */
  --text:         #1b211d;  /* 16.4:1 on --surface — all live data lands here */
  --text-2:       #5a655e;
  --text-3:       #74807a;  /* 4.71:1 — placeholder/empty copy only, never data */

  /* Signal. Not brand colours, and never used to mean "healthy". */
  --ok:           #1a6b3f;
  --warn:         #8a5200;  /* was #f57f17 at 2.65:1 */
  --warn-bg:      #fdf3e0;
  --crit:         #b3261e;
  --crit-bg:      #fdeceb;
  --info:         #12507d;

  /* Type — five steps replacing twelve ad-hoc px values.
     --t-sm is the floor for any value a person reads. */
  --t-xs: 11px;
  --t-sm: 12px;
  --t-md: 14px;
  --t-lg: 18px;
  --t-xl: 24px;
  --font:      system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  /* ui-monospace resolves to SF Mono on macOS, Consolas on Windows, DejaVu on
     the Linux host. The previous 'Consolas', monospace stack silently fell back
     to Courier everywhere except Windows. */
  --font-mono: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace;

  /* Space + radius */
  --x1: 4px; --x2: 8px; --x3: 12px; --x4: 16px; --x5: 24px;
  --r1: 2px; --r2: 4px; --r3: 6px;

  /* Stacking — replaces 17 ad-hoc values including a stray 10000 */
  --z-sticky:   10;
  --z-dropdown: 100;
  --z-modal:    1000;
  --z-toast:    2000;
  --z-loading:  3000;
}

/* Dark theme — OPT-IN ONLY, via <html data-theme="dark">.
 *
 * Deliberately NOT wired to @media (prefers-color-scheme: dark): index.html
 * and dashboard.html still carry ~1000 inline style attributes with baked-in
 * light values, so flipping automatically would produce a half-dark UI —
 * dark chrome with white JS-generated panels. Auto-switching becomes safe
 * once those inline styles are on tokens; until then map.html is the only
 * page that opts in, and it is dark by design rather than by preference.
 *
 * Values below match map.html's original hand-built palette so the page is
 * unchanged, except --crit, which was #d94452 at 3.97:1 on this ground.
 */
:root[data-theme="dark"] {
  --brand:        #2d9a5e;
  --brand-hover:  #3dd68c;
  --brand-ink:    #08130c;

  --surface:      #0d1f14;
  --surface-sunk: #142b1c;
  --row-zebra:    #112418;
  --row-hover:    #1a3825;
  --line:         #1e4a2e;
  --line-soft:    #17351e;

  --text:         #d4e8dc;
  --text-2:       #9db8a9;
  --text-3:       #7a9b87;

  --ok:           #3dd68c;
  --warn:         #e8a838;
  --warn-bg:      #33280f;
  --crit:         #f0827c;  /* was #d94452 — 3.97:1 on --surface */
  --crit-bg:      #3a1a18;
  --info:         #7cbcea;
}

/* Keyboard focus. The app previously had no visible focus state on any of its
   155 buttons; :focus-visible keeps it off mouse clicks. */
:focus-visible {
  outline: 2px solid var(--brand);
  outline-offset: 2px;
  border-radius: var(--r1);
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}
