/* Rasid design tokens — v3 "glass observatory"
   The brand accent arrives per page on <html style="--accent:#00C833"> from the brands table. */

:root {
  --font-latin: 'IBM Plex Sans', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-arabic: 'IBM Plex Sans Arabic', 'IBM Plex Sans', system-ui, sans-serif;
  --font: var(--font-latin);
  --mono: 'IBM Plex Mono', ui-monospace, SFMono-Regular, Menlo, monospace;
  --fs-xs: 12px; --fs-sm: 13px; --fs-md: 14px; --fs-lg: 16px; --fs-xl: 20px; --fs-2xl: 30px; --fs-3xl: 44px; --fs-hero: 96px;
  --lh: 1.5;

  --s1: 4px; --s2: 8px; --s3: 12px; --s4: 16px; --s5: 20px; --s6: 24px; --s8: 32px; --s10: 40px; --s12: 48px; --s16: 64px;
  --r-xs: 6px; --r-sm: 10px; --r: 16px; --r-lg: 22px; --r-xl: 28px; --r-pill: 999px;
  --ease: cubic-bezier(.2,.7,.2,1); --spring: cubic-bezier(.34,1.3,.4,1); --fast: 140ms; --med: 280ms; --slow: 600ms;

  --rail: 72px; --rail-gap: 14px; --drawer: 380px; --content-max: 1360px; --gutter: 36px;

  /* dark: deep space, glass surfaces */
  --bg: #090D13;
  --bg-2: #0E131B;
  --glass: rgba(255,255,255,.035);
  --glass-2: rgba(255,255,255,.06);
  --glass-3: rgba(255,255,255,.09);
  --line: rgba(255,255,255,.07);
  --line-strong: rgba(255,255,255,.14);
  --line-glow: rgba(255,255,255,.18);
  --ink: #EDF1F6;
  --ink-2: #9AA6B6;
  --ink-3: #5F6B7B;
  --ink-inverse: #090D13;
  --pop: rgba(16,21,29,.92);
  --shadow-pop: 0 30px 80px rgba(0,0,0,.6), 0 0 0 1px rgba(255,255,255,.08);
  --shadow-lift: 0 18px 40px rgba(0,0,0,.45);
  --blur: 18px;

  --accent: #1B447F;
  --accent-ui: color-mix(in oklab, var(--accent) 62%, white 38%);
  --accent-soft: color-mix(in oklab, var(--accent) 24%, transparent);
  --accent-glow: color-mix(in oklab, var(--accent) 55%, transparent);
  --accent-aura: color-mix(in oklab, var(--accent) 30%, transparent);
  --on-accent: #ffffff;

  --live: #41E09A; --live-soft: rgba(65,224,154,.16);
  --warn: #F5B83D; --warn-soft: rgba(245,184,61,.16);
  --bad:  #FF6E7A; --bad-soft:  rgba(255,110,122,.16);
  --info: #7FB0FF; --info-soft: rgba(127,176,255,.16);
  --planned: #5F6B7B;
  color-scheme: dark;
}

[data-theme="light"] {
  --bg: #EEF1F6;
  --bg-2: #F7F8FB;
  --glass: rgba(255,255,255,.72);
  --glass-2: rgba(255,255,255,.9);
  --glass-3: rgba(16,24,40,.05);
  --line: rgba(16,24,40,.08);
  --line-strong: rgba(16,24,40,.16);
  --line-glow: rgba(255,255,255,.9);
  --ink: #0F1621;
  --ink-2: #566274;
  --ink-3: #8A95A6;
  --ink-inverse: #FFFFFF;
  --pop: rgba(255,255,255,.96);
  --shadow-pop: 0 30px 80px rgba(16,24,40,.2), 0 0 0 1px rgba(16,24,40,.06);
  --shadow-lift: 0 18px 40px rgba(16,24,40,.12);
  --accent-ui: var(--accent);
  --accent-soft: color-mix(in oklab, var(--accent) 14%, transparent);
  --accent-glow: color-mix(in oklab, var(--accent) 35%, transparent);
  --accent-aura: color-mix(in oklab, var(--accent) 16%, transparent);
  --live: #16915A; --live-soft: rgba(22,145,90,.12);
  --warn: #A86A0E; --warn-soft: rgba(168,106,14,.12);
  --bad:  #C9303C; --bad-soft:  rgba(201,48,60,.12);
  --info: #2B62C9; --info-soft: rgba(43,98,201,.12);
  --planned: #8A95A6;
  color-scheme: light;
}

[dir="rtl"] { --font: var(--font-arabic); }