/* =========================================================================
   DISHA PLANNER STUDIO — DESIGN TOKENS
   Aesthetic: "Study Desk" — a fountain-pen-on-paper planner, stitched
   binding, brass-tab dividers. Ink navy + brass gold + sage accent on warm
   paper. Every theme below overrides these same variables, so the whole
   app (including user custom themes) is just a re-skin of these tokens.
   ========================================================================= */

:root {
  /* ---- Palette (default theme: "Study Desk") ------------------------- */
  --color-bg: #EFE8D8;              /* warm paper */
  --color-bg-elevated: #FAF6EC;     /* index-card paper */
  --color-surface: #FFFFFF;
  --color-ink: #1B2A4A;             /* deep navy ink */
  --color-ink-soft: #4B5A78;
  --color-muted: #8A8371;
  --color-accent: #2F6F5E;          /* sage / ledger-green */
  --color-accent-2: #C9A227;        /* brass gold */
  --color-danger: #B0432C;
  --color-warning: #C9A227;
  --color-success: #2F6F5E;
  --color-border: #D8CFB8;
  --color-border-strong: #1B2A4A;

  /* ---- Priority colors -------------------------------------------------*/
  --priority-high: #B0432C;
  --priority-medium: #C9A227;
  --priority-low: #2F6F5E;

  /* ---- Typography --------------------------------------------------- */
  --font-display: 'Fraunces', 'Iowan Old Style', Georgia, serif;
  --font-body: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-mono: 'IBM Plex Mono', 'SFMono-Regular', Menlo, monospace;

  --fs-xs: 0.75rem;
  --fs-sm: 0.875rem;
  --fs-base: 1rem;
  --fs-md: 1.0625rem;
  --fs-lg: 1.2rem;
  --fs-xl: 1.45rem;
  --fs-xxl: 1.85rem;

  /* ---- Spacing scale -------------------------------------------------*/
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 64px;

  /* ---- Shape ---------------------------------------------------------*/
  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 18px;
  --radius-pill: 999px;
  --stitch-dash: 3px;

  /* ---- Elevation -------------------------------------------------------*/
  --shadow-sm: 0 1px 2px rgba(27, 42, 74, 0.08);
  --shadow-md: 0 4px 16px rgba(27, 42, 74, 0.12);
  --shadow-lg: 0 12px 32px rgba(27, 42, 74, 0.18);

  /* ---- Motion ----------------------------------------------------------*/
  --dur-fast: 120ms;
  --dur-base: 220ms;
  --dur-slow: 420ms;
  --ease-out: cubic-bezier(.16,.84,.44,1);

  /* ---- Layout ------------------------------------------------------- */
  --sidebar-w: 280px;
  --preview-w: 420px;
  --header-h: 64px;
}

/* Reduced motion respected globally */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
    scroll-behavior: auto !important;
  }
}

/* High contrast mode toggle (applied via body.high-contrast) */
body.high-contrast {
  --color-bg: #FFFFFF;
  --color-bg-elevated: #FFFFFF;
  --color-ink: #000000;
  --color-ink-soft: #000000;
  --color-muted: #333333;
  --color-border: #000000;
  --color-border-strong: #000000;
}

body.large-text { font-size: 118%; }