/* Shared color tokens - the single source of truth for the dark/light palette
   used by index.html (the live map) and the standalone flight/airport/regnr
   pages (pages.py). Pulled out of index.html's own inline <style> so three
   separate places don't each carry their own copy - see index.html's own
   :root comment for the --data-* vs everything-else split this preserves. */
:root {
  --data-cruise: #4fd1ff;
  --data-approach: #ffb454;
  --data-enroute: #7ea6ff;
  --data-ground: #7c8a97;

  --bg: #0a0d12;
  --panel: rgba(20, 26, 34, 0.85);
  --panel-solid: #141a22;
  --border: rgba(255, 255, 255, 0.09);
  --text: #eaf0f5;
  --dim: #8b98a5;
  --accent: #4fd1ff;
  --amber: #ffb454;
  --good: #3ddc84;
  --bad: #ff6b6b;
  --mono: "SF Mono", "Cascadia Code", Consolas, monospace;

  --overlay-weak: rgba(255, 255, 255, 0.04);
  --overlay-medium: rgba(255, 255, 255, 0.07);
  --overlay-strong: rgba(255, 255, 255, 0.12);
  --accent-weak: rgba(79, 209, 255, 0.08);
  --accent-medium: rgba(79, 209, 255, 0.14);
  --accent-border: rgba(79, 209, 255, 0.32);
  --good-weak: rgba(61, 220, 132, 0.14);
  --bad-weak: rgba(255, 107, 107, 0.14);
  --amber-weak: rgba(255, 180, 84, 0.14);
  --shadow: rgba(0, 0, 0, 0.32);
  --shadow-strong: rgba(0, 0, 0, 0.48);
  --scrim: rgba(4, 6, 9, 0.65);
  --popup-bg: rgba(20, 26, 34, 0.6);
  --switch-knob-off: var(--text);
  --switch-knob-on: #06131a;
  --label-fg: #fff7e0;
  --label-glow: #ffd76a;
  /* Muted sibling of --label-fg/--label-glow, same warm-gold family - for
     airport-name-label (index.html), which needed a second, de-emphasized
     token: distinct enough from --label-fg's own bright cream that a city
     name and an airport name reads as two different things even flush
     against each other (see index.html's own overlap-fix comment for why
     that can happen), but deliberately staying in the gold hue range rather
     than a wholly different color - a hue borrowed from --accent/--amber/
     --data-approach territory would risk being mistaken for one of the
     aircraft-phase colors those already own, exactly the confusion the
     original single-gold choice was meant to avoid. */
  --label2-fg: #d9c48f;
  --label2-glow: #b8863e;
  --color-scheme: dark;
}
:root[data-theme="light"] {
  --bg: #eef1f4;
  --panel: rgba(255, 255, 255, 0.86);
  --panel-solid: #ffffff;
  --border: rgba(15, 23, 32, 0.11);
  --text: #1b2530;
  --dim: #5c6c7a;
  --accent: #0077a6;
  --amber: #a15e00;
  --good: #1f8f52;
  --bad: #d43d3d;

  --overlay-weak: rgba(15, 23, 32, 0.035);
  --overlay-medium: rgba(15, 23, 32, 0.06);
  --overlay-strong: rgba(15, 23, 32, 0.1);
  --accent-weak: rgba(0, 119, 166, 0.08);
  --accent-medium: rgba(0, 119, 166, 0.12);
  --accent-border: rgba(0, 119, 166, 0.35);
  --good-weak: rgba(31, 143, 82, 0.12);
  --bad-weak: rgba(212, 61, 61, 0.12);
  --amber-weak: rgba(161, 94, 0, 0.12);
  --shadow: rgba(15, 23, 32, 0.1);
  --shadow-strong: rgba(15, 23, 32, 0.16);
  --scrim: rgba(20, 26, 32, 0.4);
  --popup-bg: rgba(255, 255, 255, 0.75);
  --switch-knob-off: #ffffff;
  --switch-knob-on: #ffffff;
  --label-fg: #3a2e00;
  --label-glow: #fff6d8;
  /* See --label2-fg's own comment in :root above. */
  --label2-fg: #6b5628;
  --label2-glow: #fff1c4;
  --color-scheme: light;
}
@media (prefers-color-scheme: light) {
  :root:not([data-theme="dark"]) {
    --bg: #eef1f4;
    --panel: rgba(255, 255, 255, 0.86);
    --panel-solid: #ffffff;
    --border: rgba(15, 23, 32, 0.11);
    --text: #1b2530;
    --dim: #5c6c7a;
    --accent: #0077a6;
    --amber: #a15e00;
    --good: #1f8f52;
    --bad: #d43d3d;
    --overlay-weak: rgba(15, 23, 32, 0.035);
    --overlay-medium: rgba(15, 23, 32, 0.06);
    --overlay-strong: rgba(15, 23, 32, 0.1);
    --accent-weak: rgba(0, 119, 166, 0.08);
    --accent-medium: rgba(0, 119, 166, 0.12);
    --accent-border: rgba(0, 119, 166, 0.35);
    --good-weak: rgba(31, 143, 82, 0.12);
    --bad-weak: rgba(212, 61, 61, 0.12);
    --amber-weak: rgba(161, 94, 0, 0.12);
    --shadow: rgba(15, 23, 32, 0.1);
    --shadow-strong: rgba(15, 23, 32, 0.16);
    --scrim: rgba(20, 26, 32, 0.4);
    --popup-bg: rgba(255, 255, 255, 0.75);
    --switch-knob-off: #ffffff;
    --switch-knob-on: #ffffff;
    --label-fg: #3a2e00;
    --label-glow: #fff6d8;
    --label2-fg: #6b5628;
    --label2-glow: #fff1c4;
    --color-scheme: light;
  }
}

/* Generic base - index.html keeps its own (larger, map-specific) body rule
   and overrides these harmlessly; the standalone pages rely on exactly this
   much. */
html { color-scheme: var(--color-scheme); }
body {
  margin: 0;
  background: var(--bg);
  color: var(--text);
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
a { color: var(--accent); }
.dim { color: var(--dim); }