/* CITYONAIR · UI globale · variables de thème
   Toutes les couleurs passent par ces variables (règle d'affichage « thème clair / sombre »).
   Sombre par défaut et recommandé ; clair au choix (data-theme="light"). */
:root {
  --font: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-display: "Inter Display", "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;

  --bg: #0a101c;
  --bg-2: #0f1828;
  --surface: rgba(14, 22, 38, 0.72);
  --surface-solid: #121c2e;
  --line: rgba(255, 255, 255, 0.10);
  --text: #f2f4f8;
  --text-2: #aab4c6;
  --text-3: #7d889c;
  --accent: #e8b547;          /* or CITYONAIR */
  --accent-ink: #1a1306;
  --live: #ff4d4d;
  --ok: #3ccf8e;
  --danger: #ff6b6b;
  --ambient: #101826;         /* couleur d'ambiance de l'image (calculée par le job images) */

  --radius: 14px;
  --radius-sm: 9px;
  --shadow: 0 10px 30px rgba(0, 0, 0, 0.35);
  --blur: saturate(140%) blur(14px);
  color-scheme: dark;
}

[data-theme="light"] {
  --bg: #f4f1ea;
  --bg-2: #ebe6dc;
  --surface: rgba(255, 255, 255, 0.82);
  --surface-solid: #ffffff;
  --line: rgba(10, 16, 28, 0.12);
  --text: #121826;
  --text-2: #475163;
  --text-3: #6b7486;
  --accent: #b9851c;
  --accent-ink: #ffffff;
  --shadow: 0 10px 30px rgba(20, 24, 40, 0.12);
  color-scheme: light;
}

*, *::before, *::after { box-sizing: border-box; }
html, body { margin: 0; }
body { background: var(--bg); color: var(--text); font-family: var(--font); -webkit-font-smoothing: antialiased; }
button, input, select, textarea { font: inherit; color: inherit; }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.brandmark { font-family: var(--font-display); font-weight: 800; letter-spacing: 0.08em; }
.brandmark b { color: var(--accent); font-weight: 800; }
[hidden] { display: none !important; }