:root {
  --primary: #1b4332;
  --primary-mid: #2d6a4f;
  --primary-light: #3a8260;
  --accent: #c9a84c;
  --accent-light: #e2c87a;
  --bg: #f9f5ee;
  --bg-dark: #ede8dc;
  --ink: #0e1e17;
  --text: #2c3e35;
  --muted: #7a8c82;
  --white: #ffffff;
  --hero-bg1: #0e1e17;
  --hero-bg2: #091510;
  --hero-glow: rgba(45,106,79,0.35);
  --card-bg: #ffffff;
  --section-alt: #0e1e17;
}

body.theme-muharram {
  --primary: #2a2a2a; --primary-mid: #3d3d3d; --primary-light: #555555;
  --accent: #8a8070; --accent-light: #b0a898; --bg: #111111; --bg-dark: #0a0a0a;
  --ink: #e8e0d0; --text: #c8c0b0; --muted: #888880; --white: #f0ece4;
  --hero-bg1: #080808; --hero-bg2: #020202; --hero-glow: rgba(60,50,40,0.4);
  --card-bg: #181818; --section-alt: #0d0d0d;
}

body.theme-ashura {
  --primary: #1a0000; --primary-mid: #2d0000; --primary-light: #5c0000;
  --accent: #cc0000; --accent-light: #ff2222; --bg: #080000; --bg-dark: #040000;
  --ink: #f5e8e8; --text: #d4b8b8; --muted: #885555; --white: #fff0f0;
  --hero-bg1: #050000; --hero-bg2: #020000; --hero-glow: rgba(180,0,0,0.3);
  --card-bg: #100000; --section-alt: #060000;
}

body.theme-arbaeen {
  --primary: #0f0a00; --primary-mid: #1f1000; --primary-light: #4a2000;
  --accent: #8b1010; --accent-light: #b83030; --bg: #060400; --bg-dark: #030200;
  --ink: #ede0d0; --text: #c8b8a8; --muted: #806050; --white: #f5ede0;
  --hero-bg1: #040200; --hero-bg2: #020100; --hero-glow: rgba(100,20,0,0.3);
  --card-bg: #0d0700; --section-alt: #050300;
}

body.theme-imaali {
  --primary: #1a0a2e; --primary-mid: #2d1a4a; --primary-light: #4a2a7a;
  --accent: #9b59b6; --accent-light: #c39bd3; --bg: #0a0514; --bg-dark: #060310;
  --ink: #f0e8ff; --text: #c8b8e8; --muted: #7a6888; --white: #f5f0ff;
  --hero-bg1: #070310; --hero-bg2: #030108; --hero-glow: rgba(120,40,180,0.3);
  --card-bg: #100818; --section-alt: #080310;
}

body.theme-ramadan {
  --primary: #0a1628; --primary-mid: #132040; --primary-light: #1e3a6e;
  --accent: #d4a017; --accent-light: #f0c040; --bg: #06101e; --bg-dark: #030a14;
  --ink: #f0e8d0; --text: #c8b888; --muted: #607888; --white: #f5f0e8;
  --hero-bg1: #040c1a; --hero-bg2: #020608; --hero-glow: rgba(30,60,140,0.4);
  --card-bg: #0d1a30; --section-alt: #060e1c;
}

body.theme-eid {
  --primary: #0d5c2e; --primary-mid: #177a40; --primary-light: #22a055;
  --accent: #ffd700; --accent-light: #ffe94d; --bg: #f0fff5; --bg-dark: #e0f5ea;
  --ink: #052010; --text: #0a3a1a; --muted: #4a7a5a; --white: #ffffff;
  --hero-bg1: #052010; --hero-bg2: #020c06; --hero-glow: rgba(30,140,70,0.5);
  --card-bg: #ffffff; --section-alt: #052010;
}

body { transition: background 1.2s ease, color 1.2s ease; }
.event-banner {
  position: fixed; top: 0; left: 0; right: 0; z-index: 200; display: none;
  padding: 0.6rem 1rem; background: var(--accent); color: var(--primary);
  text-align: center; font-size: 0.78rem; font-weight: 700;
  letter-spacing: 0.12em; text-transform: uppercase;
}
body.theme-ashura .event-banner { background: #8b0000; color: #ffeaea; }
body.theme-arbaeen .event-banner { background: #5c0a0a; color: #f0d8d8; }
body.theme-ramadan .event-banner { background: #d4a017; color: #020a18; }
body.theme-imaali .event-banner { background: #2d1a4a; color: #c39bd3; }