/* Maalam design tokens (Phase 0, draft). Brand direction B (ADR 0002): calm, clear wayfinding.
   Our own identity: signal blue, marker yellow, graphite on paper. Not modelled on any other app.
   UI type and map labels: Noto Kufi Arabic (OFL; Safwan, 2026-10-13), map labels fall back to IBM Plex
   Sans Arabic for Latin. Wordmark: Alexandria (OFL). */
:root {
  /* brand */
  --mlm-signal: #2443A8;
  --mlm-signal-strong: #18307E;
  --mlm-marker: #F7C948;
  --mlm-graphite: #1E2522;
  --mlm-paper: #F3F4F1;
  --mlm-mist: #D6DCE8;

  /* semantic, light */
  --bg: var(--mlm-paper);
  --surface: #FFFFFF;
  --surface-sunk: #ECEEEA;
  --text: var(--mlm-graphite);
  --text-muted: #59625E;
  --line: #E1E4DF;
  --accent: var(--mlm-signal);
  --accent-ink: #FFFFFF;
  --accent-soft: #E6EBF8;
  --highlight: var(--mlm-marker);
  --positive: #2A8C7E;
  --warning: #B7791F;
  --danger: #A3322A;
  --scrim: rgba(30, 37, 34, 0.32);

  /* type */
  --font-ui: "Noto Kufi Arabic", "Geeza Pro", system-ui, sans-serif;  /* Safwan's choice, 2026-10-13 (design/fonts/); OFL 1.1, licence file read; the map labels use it too (pipeline/glyphs.py) */
  --font-brand: "Alexandria", "Noto Kufi Arabic", sans-serif;
  --font-num: "IBM Plex Mono", "Noto Kufi Arabic", ui-monospace, monospace;  /* Plex Mono has no Arabic letters: words next to a number (دقيقة، كم) take the UI's Arabic face, never a system font */
  --text-xs: 12px;  --text-sm: 13px;  --text-md: 15px;  --text-lg: 17px;
  --text-xl: 20px;  --text-2xl: 24px; --text-3xl: 32px;

  /* space (4-point scale), radius, elevation, motion */
  --s1: 4px; --s2: 8px; --s3: 12px; --s4: 16px; --s5: 20px; --s6: 24px; --s8: 32px;
  --r-sm: 8px; --r-md: 14px; --r-lg: 20px; --r-pill: 999px;
  --e1: 0 1px 3px rgba(30, 37, 34, 0.16);
  --e2: 0 6px 20px rgba(30, 37, 34, 0.16);
  --e3: 0 -8px 28px rgba(30, 37, 34, 0.18);
  --t-fast: 120ms; --t-base: 220ms; --ease: cubic-bezier(0.2, 0.8, 0.2, 1);
  --touch: 44px;  /* minimum touch target */
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg: #0F1312; --surface: #181D1C; --surface-sunk: #222826; --text: #ECEFEE;
    --text-muted: #9BA6A2; --line: #2A312F; --accent: #4D6BDB; --accent-ink: #FFFFFF; --icon: #9DB0F5;
    --accent-soft: #1E2847; --positive: #5CC3AD; --warning: #E0B25A; --danger: #EC8A80;
    --scrim: rgba(0, 0, 0, 0.5); --e1: 0 1px 2px rgba(0,0,0,.5); --e2: 0 8px 24px rgba(0,0,0,.45);
    --e3: 0 -8px 28px rgba(0,0,0,.5); color-scheme: dark;
  }
}
:root[data-theme="dark"] {
  --bg: #0F1312; --surface: #181D1C; --surface-sunk: #222826; --text: #ECEFEE;
  --text-muted: #9BA6A2; --line: #2A312F; --accent: #4D6BDB; --accent-ink: #FFFFFF; --icon: #9DB0F5;
  --accent-soft: #1E2847; --positive: #5CC3AD; --warning: #E0B25A; --danger: #EC8A80;
  --scrim: rgba(0, 0, 0, 0.5); --e1: 0 1px 2px rgba(0,0,0,.5); --e2: 0 8px 24px rgba(0,0,0,.45);
  --e3: 0 -8px 28px rgba(0,0,0,.5); color-scheme: dark;
}
@media (prefers-reduced-motion: reduce) { :root { --t-fast: 0ms; --t-base: 0ms; } }