/* =====================================================================
   Aventra — design tokens
   Colours for every theme live in js/theme.js (presets) and are written
   onto :root at runtime by A.theme.apply(). The values below are the
   Ocean Blue defaults so the page never renders un-themed, plus every
   non-colour token (type, radii, motion, layout, risk scale).
   ===================================================================== */
:root {
  /* --- Ocean Blue defaults (overwritten by A.theme.apply) --- */
  --bg-1: #dff2fb;
  --bg-2: #9fd6ef;
  --bg-3: #2f8fcf;
  --bg-4: #0b4f8a;
  --text: #0d2a45;
  --text-2: #3f5f7a;
  --text-3: #7a94ab;
  --heading: #0a2540;
  --accent: #0e8fd1;
  --accent-2: #19c2c9;
  --accent-ink: #ffffff;
  --accent-soft: rgba(14, 143, 209, 0.12);
  --glass-rgb: 255, 255, 255;
  --glass-alpha: 0.62;
  --glass-rim: rgba(255, 255, 255, 0.75);
  --glass-rim-2: rgba(20, 70, 110, 0.10);
  --glass-blur: 22px;
  --glass-sat: 140%;
  --surface: #ffffff;
  --surface-2: rgba(255, 255, 255, 0.55);
  --surface-3: rgba(12, 70, 120, 0.06);
  --line: rgba(13, 42, 69, 0.10);
  --nav-active-bg: rgba(255, 255, 255, 0.85);
  --nav-active-ink: #0a2540;
  --shadow-card: 0 18px 50px rgba(9, 50, 90, 0.16), 0 1px 0 rgba(255, 255, 255, 0.6) inset;
  --shadow-pop: 0 30px 80px rgba(6, 40, 80, 0.35);
  --shadow-soft: 0 8px 24px rgba(9, 50, 90, 0.12);
  --globe-glow: 60, 190, 255;         /* rgb triplet for the atmosphere */
  --route: #7fe7ff;                   /* flight route glow */
  --route-2: #ffd27a;                 /* aircraft accent */
  --cloud-tint: 255, 255, 255;        /* rgb triplet for the clouds around the globe */
  --stars: rgba(255, 255, 255, 0.85);
  --scrollbar: rgba(13, 42, 69, 0.22);
  --selection: rgba(25, 194, 201, 0.30);
  --backdrop: rgba(4, 30, 55, 0.45);

  /* --- Derived --- */
  --glass-bg: rgba(var(--glass-rgb), var(--glass-alpha));
  --glass-bg-strong: rgba(var(--glass-rgb), calc(var(--glass-alpha) + 0.22));
  --glass-bg-weak: rgba(var(--glass-rgb), calc(var(--glass-alpha) * 0.55));

  /* --- Risk scale (fixed across themes; only the tints soften on dark) --- */
  --risk-green: #34c27a;
  --risk-yellow: #f2c231;
  --risk-orange: #f28a2e;
  --risk-red: #e5484d;
  --risk-green-soft: rgba(52, 194, 122, 0.18);
  --risk-yellow-soft: rgba(242, 194, 49, 0.20);
  --risk-orange-soft: rgba(242, 138, 46, 0.20);
  --risk-red-soft: rgba(229, 72, 77, 0.18);
  --risk-green-ink: #157347;
  --risk-yellow-ink: #8a6a00;
  --risk-orange-ink: #9a4a00;
  --risk-red-ink: #a1202a;

  /* --- Type --- */
  --font-display: 'Bodoni Moda', 'Bodoni FLF', 'Bodoni 72', Didot, 'Bodoni MT', Georgia, serif;
  --font-ui: 'Inter', -apple-system, BlinkMacSystemFont, 'SF Pro Text', 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
  --font-mono: 'SF Mono', ui-monospace, Menlo, Consolas, monospace;
  --fs-xs: 11.5px;
  --fs-sm: 13px;
  --fs-md: 14.5px;
  --fs-lg: 17px;
  --fs-xl: 22px;
  --fs-2xl: 30px;
  --fs-3xl: 40px;
  --fs-hero: 56px;

  /* --- Shape --- */
  --radius-xl: 28px;
  --radius-lg: 22px;
  --radius-md: 16px;
  --radius-sm: 11px;
  --radius-pill: 999px;

  /* --- Motion --- */
  --dur-fast: 160ms;
  --dur: 320ms;
  --dur-slow: 640ms;
  --dur-page: 420ms;
  --ease: cubic-bezier(0.22, 0.61, 0.36, 1);
  --ease-spring: cubic-bezier(0.34, 1.4, 0.64, 1);

  /* --- Layout --- */
  --sidebar-w: 236px;
  --sidebar-collapsed-w: 80px;
  --topbar-h: 76px;
  --gutter: 22px;
  --gutter-sm: 14px;
  --content-max: 1680px;
  --bottom-nav-h: 64px;
}

/* Reduce Motion: every duration collapses to zero (transitions/animations still "run", instantly). */
html.reduce-motion {
  --dur-fast: 0ms;
  --dur: 0ms;
  --dur-slow: 0ms;
  --dur-page: 0ms;
}

/* Dark themes soften the risk tints and rims. */
html.dark {
  --risk-green-soft: rgba(52, 194, 122, 0.22);
  --risk-yellow-soft: rgba(242, 194, 49, 0.22);
  --risk-orange-soft: rgba(242, 138, 46, 0.22);
  --risk-red-soft: rgba(229, 72, 77, 0.24);
  --risk-green-ink: #7fe0ae;
  --risk-yellow-ink: #ffd95c;
  --risk-orange-ink: #ffb26b;
  --risk-red-ink: #ff8a8f;
}