/* ============================================
   أسامة محبوب — Design Tokens
   ============================================ */

:root {
  /* Typography */
  --font-display: 'Aref Ruqaa', serif;
  --font-body: 'Tajawal', sans-serif;
  --font-quote: 'Amiri', serif;

  /* Qatari maroon + gold identity */
  --maroon: #8a1538;
  --maroon-deep: #5e0e26;
  --gold: #c9a227;
  --gold-soft: #e3c766;

  /* Motion */
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
  --dur-fast: 0.25s;
  --dur-med: 0.6s;
  --dur-slow: 1s;

  /* Layout */
  --radius-lg: 28px;
  --radius-md: 18px;
  --radius-sm: 12px;
  --container: 1080px;
  --header-h: 72px;
}

/* ---------- Light mode ---------- */
:root[data-theme='light'] {
  --bg: #faf6f0;
  --bg-alt: #f3ece1;
  --surface: #ffffff;
  --surface-2: #fbf7f0;
  --text: #241419;
  --text-soft: #6c5a60;
  --accent: var(--maroon);
  --accent-2: #a8244d;
  --gold-accent: #a8821a;
  --border: rgba(138, 21, 56, 0.14);
  --shadow: 0 20px 60px -20px rgba(94, 14, 38, 0.25);
  --shadow-soft: 0 8px 30px -12px rgba(94, 14, 38, 0.18);
  --bg-text-fill: rgba(138, 21, 56, 0.05);
  --bg-text-stroke: rgba(138, 21, 56, 0.12);
  --glow: rgba(201, 162, 39, 0.35);
  --particle: rgba(138, 21, 56, 0.35);
  --header-bg: rgba(250, 246, 240, 0.75);
  --toast-bg: #241419;
  --toast-text: #faf6f0;
}

/* ---------- Dark mode ---------- */
:root[data-theme='dark'] {
  --bg: #120a0e;
  --bg-alt: #1a0f15;
  --surface: #1f1219;
  --surface-2: #251720;
  --text: #f5ede7;
  --text-soft: #b39aa4;
  --accent: #e0aa3e;
  --accent-2: #c9a227;
  --gold-accent: #e0aa3e;
  --border: rgba(224, 170, 62, 0.16);
  --shadow: 0 20px 60px -18px rgba(0, 0, 0, 0.7);
  --shadow-soft: 0 8px 30px -12px rgba(0, 0, 0, 0.55);
  --bg-text-fill: rgba(224, 170, 62, 0.045);
  --bg-text-stroke: rgba(224, 170, 62, 0.14);
  --glow: rgba(224, 170, 62, 0.28);
  --particle: rgba(224, 170, 62, 0.4);
  --header-bg: rgba(18, 10, 14, 0.72);
  --toast-bg: #f5ede7;
  --toast-text: #120a0e;
}