/* ---------------------------------------------------------------------------
 * Tasreef design tokens — the single source of truth for the palette.
 *
 * Before this file the palette was copy-pasted into 36 templates and had drifted
 * into 26 distinct :root token sets, which is why one wrong value (--gold at
 * 2.17:1 on light backgrounds) had to be fixed in 18 files by hand.
 *
 * Served as a static file so browsers cache it once instead of re-downloading
 * ~26KB of inline CSS on every page.
 *
 * Contrast: every --gold / --muted pair here meets WCAG AA (4.5:1) against the
 * --bg-0 of its own theme. Verify with scripts/check_contrast.py before editing.
 * --------------------------------------------------------------------------- */

:root {
  --bg-0:          #07070e;
  --bg-1:          #0d0d18;
  --bg-2:          #13131f;
  --bg-card:       rgba(255,255,255,0.030);
  --bg-card-h:     rgba(255,255,255,0.048);
  --bg-input:      rgba(255,255,255,0.022);
  --gold:          #c9a84c;
  --gold-lt:       #e8c97a;
  --gold-dim:      rgba(201,168,76,0.10);
  --gold-border:   rgba(201,168,76,0.20);
  --gold-glow:     rgba(201,168,76,0.08);
  --ivory:         #f0ede8;
  --ivory-60:      rgba(240,237,232,0.60);
  --silver:        #9a96a5;
  --muted:         #7f766c;
  --border:        rgba(255,255,255,0.055);
  --border-h:      rgba(255,255,255,0.10);
  --r-sm:  8px;
  --r-md:  14px;
  --r-lg:  22px;
  --r-xl:  32px;
  --f-ar:  'Cairo',    sans-serif;
  --f-en:  'Space Grotesk', 'Cairo', sans-serif;
  --shadow-card:  0 4px 32px rgba(0,0,0,0.50), 0 1px 0 rgba(255,255,255,0.04) inset;
  --shadow-gold:  0 0 60px rgba(201,168,76,0.10), 0 0 120px rgba(201,168,76,0.05);
  --shadow-btn:   0 2px 20px rgba(201,168,76,0.30);
  --shadow-btn-h: 0 6px 32px rgba(201,168,76,0.45);
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
}

:root[data-theme="light"] {
  --bg-0:        #faf9f7;
  --bg-1:        #f4f2ee;
  --bg-2:        #edeae4;
  --bg-card:     rgba(0,0,0,0.028);
  --bg-card-h:   rgba(0,0,0,0.045);
  --bg-input:    rgba(0,0,0,0.040);
  --ivory:       #1a1814;
  --ivory-60:    rgba(26,24,20,0.60);
  --silver:      #6b6560;
  --muted:       #746c63;
  --border:      rgba(0,0,0,0.090);
  --border-h:    rgba(0,0,0,0.150);
  --shadow-card: 0 2px 20px rgba(0,0,0,0.08), 0 1px 0 rgba(255,255,255,0.9) inset;
  --shadow-gold: 0 0 60px rgba(201,168,76,0.15), 0 0 120px rgba(201,168,76,0.08);
  --shadow-btn:  0 2px 16px rgba(201,168,76,0.35);
  --shadow-btn-h:0 6px 28px rgba(201,168,76,0.50);
  --gold: #7d6626;
  --gold-lt: #6b5720;
}