/* ============================================================
   Design tokens — neutral / structural layer. BRAND-INDEPENDENT.

   THIS FILE IS THE SINGLE SOURCE OF TRUTH for the whole product suite.
   It is served from here because Razor has no build step and can only
   serve files that physically live under wwwroot/. The Astro marketing
   site (src/Modurel.Web) imports this same file by relative path — see
   its astro.config.mjs `vite.server.fs.allow`, without which `astro dev`
   403s on it while `astro build` succeeds.

   Nothing whose value depends on the brand hue belongs here. Tokens that
   *reference* a brand token (`var(--brand-500)`) DO belong here: custom
   properties resolve at use time, so they re-resolve inside a
   `[data-brand="…"]` scope automatically. Only tokens holding a literal
   colour derived from the brand (rgba ramps, gradients) have to be
   duplicated per brand — see brand-*.css.
   ============================================================ */

:root {
  /* Sky accent — shared across brands */
  --sky-300:#7AD2F4; --sky-400:#4CBFEF; --sky-500:#2BA6E0;
  /* Semantic hues */
  --green-400:#3FC38A; --green-500:#2FAE78; --green-600:#259466;
  --red-400:#EC6A62; --red-500:#E0514A; --red-600:#C53F3A;
  --amber-400:#E8B055; --amber-500:#DD9B33; --amber-600:#C0821F;
  --violet-500:#8B7CF0;
  /* Cool neutral slate */
  --slate-0:#0A0E14; --slate-50:#0E131B; --slate-100:#11161F; --slate-150:#141A24;
  --slate-200:#161C27; --slate-250:#1B2230; --slate-300:#232C3A; --slate-400:#2E3A4C;
  --slate-500:#3C4A5E; --slate-600:#5E6B7E; --slate-700:#8794A6; --slate-800:#9AA6B8;
  --slate-900:#C2CBD8; --slate-950:#E6EAF2; --white:#FFFFFF;

  /* Surfaces */
  --bg-app:var(--slate-0); --surface:var(--slate-100); --surface-raised:var(--slate-200);
  --surface-sunken:var(--slate-50); --surface-hover:var(--slate-250); --surface-inset:#0C1016;
  /* Borders */
  --border:var(--slate-300); --border-subtle:#1A212C; --border-strong:var(--slate-400);
  --border-focus:var(--brand-400);
  /* Text */
  --text-primary:var(--slate-950); --text-secondary:var(--slate-800); --text-muted:var(--slate-600);
  --text-faint:var(--slate-500); --text-on-brand:#FFFFFF; --text-link:var(--brand-300);
  /* Brand / interactive — every one of these resolves through to the active brand */
  --accent:var(--brand-500); --accent-hover:var(--brand-400); --accent-press:var(--brand-600);
  --accent-fg:#FFFFFF; --accent-soft-fg:var(--brand-300);
  /* Status */
  --success:var(--green-500); --success-soft:rgba(47,174,120,0.15); --success-fg:var(--green-400);
  --danger:var(--red-500); --danger-soft:rgba(224,81,74,0.15); --danger-fg:var(--red-400);
  --warning:var(--amber-500); --warning-soft:rgba(221,155,51,0.15); --warning-fg:var(--amber-400);
  --info:var(--brand-400); --info-fg:var(--brand-300);

  /* Typography */
  --font-sans:'IBM Plex Sans',ui-sans-serif,system-ui,-apple-system,'Segoe UI',sans-serif;
  --font-mono:'IBM Plex Mono',ui-monospace,'SF Mono','Cascadia Code',Menlo,monospace;
  --font-brand:'Montserrat Alternates',var(--font-sans);
  --text-2xs:11px; --text-xs:12px; --text-sm:13px; --text-base:14px; --text-md:15px;
  --text-lg:16px; --text-xl:18px; --text-2xl:22px; --text-3xl:28px; --text-4xl:36px; --text-5xl:48px;

  /* Spacing */
  --space-1:2px; --space-2:4px; --space-3:6px; --space-4:8px; --space-5:12px; --space-6:16px;
  --space-7:20px; --space-8:24px; --space-9:32px; --space-10:40px; --space-11:48px; --space-12:64px;

  /* Radii / borders */
  --radius-xs:4px; --radius-sm:6px; --radius-md:8px; --radius-lg:10px; --radius-xl:14px;
  --radius-2xl:20px; --radius-full:9999px;

  /* Elevation */
  --shadow-sm:0 1px 3px rgba(0,0,0,0.40),0 1px 1px rgba(0,0,0,0.30);
  --shadow-md:0 4px 12px rgba(0,0,0,0.45);
  --shadow-lg:0 12px 32px rgba(0,0,0,0.50);
  --shadow-focus:0 0 0 3px var(--ring);
  --edge-highlight:inset 0 1px 0 rgba(255,255,255,0.04);

  /* Motion */
  --dur-fast:120ms; --dur-base:180ms;

  color-scheme:dark;
}
