/* ============================================================
   SAMVIDHAN SARAL — Design Tokens
   CSS Custom Properties. Everything visual derives from here.
   Admin theme overrides land here at runtime via JS.
   ============================================================ */

:root {
  /* ── Color — Brand ───────────────────────────────────────── */
  --ink:          #1A2744;   /* deep navy — authority, trust */
  --ink-light:    #2D4080;
  --ink-dark:     #0E1830;
  --gold:         #B8861A;   /* saffron amber — India, warmth */
  --gold-light:   #D4A030;
  --gold-pale:    #FEF3C7;

  /* ── Color — Surfaces ────────────────────────────────────── */
  --bg:           #F4EEE3;   /* warm parchment — archival feel */
  --bg-warm:      #EDE6D8;
  --surface:      #FDFAF5;   /* near-white with warmth */
  --surface-alt:  #F7F2E9;
  --parchment:    #E8DCC8;
  --parchment-dark: #D0BF9E;

  /* ── Color — Text ────────────────────────────────────────── */
  --text:         #1C1711;   /* rich warm black */
  --text-muted:   #6B6259;
  --text-subtle:  #9E948A;
  --text-on-ink:  rgba(255,255,255,0.92);
  --text-on-ink-dim: rgba(255,255,255,0.55);

  /* ── Color — Borders ─────────────────────────────────────── */
  --border:       #DDD4C5;
  --border-strong:#BFB09A;
  --border-ink:   rgba(26,39,68,0.12);

  /* ── Color — Status ─────────────────────────────────────── */
  --success:      #166534;
  --success-bg:   #DCFCE7;
  --warning:      #92400E;
  --warning-bg:   #FEF3C7;
  --error:        #991B1B;
  --error-bg:     #FEE2E2;
  --info:         #1E40AF;
  --info-bg:      #DBEAFE;

  /* ── Typography ─────────────────────────────────────────── */
  --font-display: 'Playfair Display', Georgia, 'Times New Roman', serif;
  --font-body:    'Lora', Georgia, 'Times New Roman', serif;
  --font-ui:      'DM Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-devanagari: 'Noto Serif Devanagari', 'Noto Sans Devanagari', serif;

  /* ── Font Scale ──────────────────────────────────────────── */
  --text-2xs:   0.6875rem;  /* 11px */
  --text-xs:    0.75rem;    /* 12px */
  --text-sm:    0.875rem;   /* 14px */
  --text-base:  1rem;       /* 16px */
  --text-md:    1.0625rem;  /* 17px — ideal reading size */
  --text-lg:    1.125rem;   /* 18px */
  --text-xl:    1.25rem;    /* 20px */
  --text-2xl:   1.5rem;     /* 24px */
  --text-3xl:   1.875rem;   /* 30px */
  --text-4xl:   2.25rem;    /* 36px */
  --text-5xl:   3rem;       /* 48px */

  /* ── Spacing ─────────────────────────────────────────────── */
  --sp-1: 0.25rem;
  --sp-2: 0.5rem;
  --sp-3: 0.75rem;
  --sp-4: 1rem;
  --sp-5: 1.25rem;
  --sp-6: 1.5rem;
  --sp-8: 2rem;
  --sp-10: 2.5rem;
  --sp-12: 3rem;
  --sp-16: 4rem;
  --sp-20: 5rem;
  --sp-24: 6rem;

  /* ── Radius ──────────────────────────────────────────────── */
  --r-sm:  4px;
  --r-md:  8px;
  --r-lg:  12px;
  --r-xl:  18px;
  --r-2xl: 24px;
  --r-full: 9999px;

  /* ── Shadow ──────────────────────────────────────────────── */
  --shadow-xs: 0 1px 2px rgba(0,0,0,0.06);
  --shadow-sm: 0 1px 4px rgba(0,0,0,0.07), 0 1px 2px rgba(0,0,0,0.05);
  --shadow-md: 0 4px 16px rgba(0,0,0,0.08), 0 2px 6px rgba(0,0,0,0.05);
  --shadow-lg: 0 12px 32px rgba(0,0,0,0.10), 0 4px 12px rgba(0,0,0,0.06);
  --shadow-ink: 0 4px 20px rgba(26,39,68,0.18);

  /* ── Transitions ─────────────────────────────────────────── */
  --ease-fast: 120ms ease;
  --ease:      220ms ease;
  --ease-slow: 380ms ease;

  /* ── Layout ──────────────────────────────────────────────── */
  --max-w:         1200px;
  --max-w-reading: 720px;
  --max-w-narrow:  580px;
  --nav-h:         64px;

  /* ── Z-index ─────────────────────────────────────────────── */
  --z-base: 1;
  --z-nav:  50;
  --z-modal: 100;
  --z-toast: 200;
}

/* Dark mode stub (future) */
@media (prefers-color-scheme: dark) {
  :root[data-theme="auto"] {
    --bg: #10141E;
    --surface: #171C2A;
    --text: #EDE6D8;
    --text-muted: #9A9080;
    --border: #2A3350;
  }
}