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

   THIS FILE IS THE SINGLE SOURCE OF TRUTH for the identity provider's
   pages. 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 (repo modurel-web) keeps its own copy of this file and
   brand-modurel.css in src/styles/tokens/, taken when it moved out of
   this repo on 2026-10-04: a change here does not reach it.

   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;
}