/* ============================================================================
   TEAM HORIZON DESIGN SYSTEM — tokens v1.0 (2026-11-14)
   One file, every app. Dark-first. Values are HSL triplets so they work with
   Tailwind/shadcn (hsl(var(--x))) and plain CSS alike.
   Derived from: airbornops.com, airborn.tech, PrecisionAviator, CCC, ROC, Manifest.
   Marine (Seaborn) fork = swap the hue block at the bottom. Nothing else changes.
   ========================================================================== */

:root {
  /* ---- Brand hues ------------------------------------------------------- */
  --h-navy: 220;          /* all surfaces */
  --h-sky: 203;           /* primary accent: chrome-blue from the wing logo */
  --h-amber: 36;          /* warning / attention only, never decoration */

  /* ---- DARK (default): dark gray to deep navy, never pitch black -------- */
  --background: var(--h-navy) 22% 9%;      /* app canvas */
  --surface:    var(--h-navy) 20% 12%;     /* sidebar, panels */
  --card:       var(--h-navy) 18% 15%;     /* cards, raised panels */
  --raised:     var(--h-navy) 16% 19%;     /* hover, inputs, chips */
  --border:     var(--h-navy) 14% 24%;
  --border-strong: var(--h-navy) 14% 32%;

  --foreground: 210 30% 95%;
  --muted-foreground: 215 14% 64%;
  --faint-foreground: 215 12% 46%;

  --primary: var(--h-sky) 82% 56%;         /* buttons, active states, links */
  --primary-foreground: var(--h-navy) 25% 8%;
  --primary-soft: var(--h-sky) 82% 56% / 0.14;   /* tinted backgrounds */
  --chrome: 210 22% 76%;                   /* silver from the logo: dividers, icons at rest */
  --chrome-dark: 210 14% 42%;

  --success: 145 55% 45%;
  --warning: var(--h-amber) 92% 55%;
  --danger: 0 72% 55%;
  --info: var(--h-sky) 82% 56%;
  --local: 145 55% 42%;                    /* LOCAL badge: runs on your hardware */
  --cloud: var(--h-amber) 85% 50%;         /* CLOUD badge: leaves the building */

  --halo: hsl(var(--primary) / 0.22);
  --glass-bg: hsl(var(--card) / 0.72);
  --glass-border: hsl(var(--border) / 0.7);
  --shadow-1: 0 1px 0 hsl(0 0% 100% / 0.04) inset, 0 8px 24px -16px var(--halo);
  --shadow-2: 0 20px 50px -20px var(--halo), 0 0 0 1px hsl(var(--border) / 0.6);
  --glow: 0 0 0 1px hsl(var(--primary) / 0.35), 0 6px 18px -6px var(--halo);

  /* ---- Type --------------------------------------------------------------
     Orbitron (OFL) = brand/display only: app name, section titles, hero numbers.
     Inter (OFL) = everything you read. JetBrains Mono (OFL) = code, IDs, keys.
     All three ship inside the app; never load from Google at runtime. */
  --font-display: "Orbitron", "Inter", system-ui, sans-serif;
  --font-sans: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, "SFMono-Regular", Menlo, monospace;
  --text-xs: 11px; --text-sm: 13px; --text-md: 15px; --text-lg: 17px; --text-xl: 22px;
  --leading: 1.5;

  /* ---- Shape & space ---------------------------------------------------- */
  --radius: 10px;          /* cards, inputs, buttons */
  --radius-sm: 6px;        /* chips, menu items */
  --radius-lg: 14px;       /* dialogs, sheets */
  --space-1: 4px; --space-2: 8px; --space-3: 12px; --space-4: 16px; --space-5: 20px; --space-6: 24px;
  --sidebar-w: 288px; --sidebar-min: 220px; --sidebar-max: 480px;
  --header-h: 56px;

  /* ---- Motion (the "high-tech but calm" feel) --------------------------- */
  --ease: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
  --t-fast: 150ms; --t-base: 200ms; --t-slow: 260ms;
  --press: scale(0.985);
}

/* ---- LIGHT: soft, never glaring ----------------------------------------- */
.light, [data-appearance="light"] {
  --background: 215 24% 94%;
  --surface:    215 22% 97%;
  --card:       0 0% 100%;
  --raised:     215 20% 93%;
  --border:     215 16% 84%;
  --border-strong: 215 16% 72%;
  --foreground: var(--h-navy) 30% 12%;
  --muted-foreground: 215 14% 40%;
  --faint-foreground: 215 12% 58%;
  --primary: var(--h-sky) 80% 42%;
  --primary-foreground: 0 0% 100%;
  --primary-soft: var(--h-sky) 80% 42% / 0.12;
  --chrome: 210 12% 48%;
  --chrome-dark: 210 10% 36%;
  --local: 145 55% 34%; --cloud: var(--h-amber) 90% 40%;
  --halo: hsl(var(--primary) / 0.16);
  --glass-bg: hsl(var(--card) / 0.8);
  --shadow-1: 0 1px 0 hsl(0 0% 100% / 0.6) inset, 0 8px 24px -18px hsl(var(--h-navy) 30% 20% / 0.35);
  --shadow-2: 0 20px 50px -24px hsl(var(--h-navy) 30% 20% / 0.35), 0 0 0 1px hsl(var(--border) / 0.8);
}

/* ---- MARINE FORK (Seaborn): one block, nothing else changes ------------- */
[data-brand="seaborn"] { --h-navy: 200; --h-sky: 190; }

/* ---- Global behaviours every app applies -------------------------------- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: 1ms !important; transition-duration: 1ms !important; scroll-behavior: auto !important; }
}