/* letz gooo, light: the flag's white ground with its red and light blue, and night-blue ink. Linked after
   gooo.css only when the light theme applies (always for Light, with the system's light mode for Automatic,
   see document.tsx), so it only swaps tokens. The ramps run the other way from the dark theme's: screens use
   the 800s and 900s for tinted grounds and the 200s to 400s for text, so each step keeps its role. */
:root {
  color-scheme: light;

  /* The flag's blue is too pale for text on white; links and accents take a deeper shade of it. */
  --lux-blue: #00a3e0;

  --color-bg: #f3f6fa;
  --color-surface: #ffffff;
  --color-text: #0e1a2b;
  --color-divider: color-mix(in srgb, #0e1a2b 12%, transparent);

  --color-neutral-100: #131b27;
  --color-neutral-200: #253041;
  --color-neutral-300: #394557;
  --color-neutral-400: #525e70;
  --color-neutral-500: #6a7586;
  --color-neutral-600: #8993a2;
  --color-neutral-700: #adb6c2;
  --color-neutral-800: #d5dce5;
  --color-neutral-900: #e8edf3;

  /* Accent: Luxembourg light blue. */
  --color-accent: #0a7db4;
  --color-accent-100: #08283b;
  --color-accent-200: #0c3b57;
  --color-accent-300: #0f5a83;
  --color-accent-400: #0d6e9f;
  --color-accent-500: #0a86c0;
  --color-accent-600: #3aaee0;
  --color-accent-700: #8dd0ee;
  --color-accent-800: #c4e7f7;
  --color-accent-900: #e3f4fc;

  /* Second accent: Luxembourg red. */
  --color-accent-2: #d01f36;
  --color-accent-2-100: #3f0a12;
  --color-accent-2-200: #66101c;
  --color-accent-2-300: #8f1626;
  --color-accent-2-400: #b81d31;
  --color-accent-2-500: #d01f36;
  --color-accent-2-600: #ea6878;
  --color-accent-2-700: #f29ea9;
  --color-accent-2-800: #f9cfd4;
  --color-accent-2-900: #fdecee;

  /* Darker modes and statuses, readable on white and under white text. */
  --color-bus: oklch(0.58 0.15 148);
  --color-train: oklch(0.56 0.2 22);
  --color-tram: oklch(0.54 0.16 300);
  --color-ok: oklch(0.56 0.15 148);
  --color-warn: oklch(0.6 0.14 65);
  --color-danger: oklch(0.54 0.2 25);

  --color-section: #d9eefa;
  --color-section-glow: #c2e4f6;
  --color-section-ghost: #a6d6ef;

  --shadow-sm: 0 0 0 1px #dde3eb;
  --shadow-md: 0 0 0 1px #d0d8e2, 0 6px 18px rgba(16, 32, 56, .08);
  --shadow-lg: 0 0 0 1px #b8c2ce, 0 16px 40px rgba(16, 32, 56, .14);
}

/* The map shows OpenStreetMap's own light tiles (app.css, loaded later, darkens them for the dark theme). */
html .map-canvas .leaflet-tile-pane { filter: none; }
