/* ===== SAFAREJA — CSS VARIABLES ===== */
:root {
  --bg:            #f5f3ef;
  --bg-card:       #ffffff;
  --bg-nav:        rgba(255,255,255,0.92);
  --bg-glass:      rgba(255,255,255,0.7);
  --text:          #1a1f2e;
  --text-muted:    #6b7280;
  --text-light:    #9ca3af;
  --accent:        #3d6b4f;
  --accent-light:  #5a9470;
  --accent-warm:   #c07f3a;
  --accent-warm-l: #e8a855;
  --border:        rgba(0,0,0,0.08);
  --shadow-sm:     0 2px 8px rgba(0,0,0,0.06);
  --shadow-md:     0 8px 24px rgba(0,0,0,0.1);
  --shadow-lg:     0 20px 60px rgba(0,0,0,0.15);
  --shadow-card:   0 4px 20px rgba(61,107,79,0.12);
  --radius-sm:     10px;
  --radius-md:     16px;
  --radius-lg:     24px;
  --radius-xl:     32px;
  --nav-height:    68px;
  --top-height:    60px;
  --font:          'Vazirmatn', sans-serif;
  --transition:    0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
  --ease:          0.25s ease;
}

[data-theme="dark"] {
  --bg:            #0f1419;
  --bg-card:       #1a2230;
  --bg-nav:        rgba(20,30,45,0.95);
  --bg-glass:      rgba(20,30,45,0.7);
  --text:          #e8e6e0;
  --text-muted:    #8a9ab0;
  --text-light:    #5a6b80;
  --accent:        #5a9470;
  --accent-light:  #7ab890;
  --accent-warm:   #e8a855;
  --accent-warm-l: #f0c07a;
  --border:        rgba(255,255,255,0.08);
  --shadow-sm:     0 2px 8px rgba(0,0,0,0.3);
  --shadow-md:     0 8px 24px rgba(0,0,0,0.4);
  --shadow-lg:     0 20px 60px rgba(0,0,0,0.5);
  --shadow-card:   0 4px 20px rgba(0,0,0,0.3);
}