/* ══════════════════════════════════════════
   THEME DEFINITIONS — Midnight Pulse system
   ══════════════════════════════════════════ */

/* Nightclub — Midnight Pulse (default, active redesign target) */
[data-theme="nightclub"] {
  /* Primary — purple neon tube */
  --primary: #d0bcff;
  --primary-light: #e9ddff;
  --primary-lighter: #e9ddff;
  --primary-dark: #a078ff;
  --primary-deep: #6d3bd7;

  /* Secondary — neon pink, social/celebratory */
  --accent: #ffb0cd;
  --accent-light: #ffd9e4;

  /* Tertiary — electric green, Live indicators only */
  --highlight: #4ae176;
  --green: #4ae176;

  /* Surfaces — No-Line hierarchy (shift tiers, no 1px borders) */
  --bg: #13131a;
  --bg-card: #1b1b22;
  --bg-card-mid: #1f1f26;
  --bg-card-high: #2a2931;
  --bg-card-highest: #34343c;

  /* Borders — ghost only */
  --border: rgba(255,255,255,0.06);
  --border-hover: rgba(208,188,255,0.3);

  /* Glass — for layered chrome only (nav, modals, chips over imagery) */
  --glass: rgba(19,19,26,0.85);
  --glass-border: rgba(255,255,255,0.06);

  /* Text */
  --text-1: #e4e1eb;
  --text-2: #cbc3d7;
  --text-3: #958ea0;

  /* Glow RGB values (used as rgba(var(--glow-rgb), opacity)) */
  --glow-rgb: 208,188,255;
  --glow-secondary-rgb: 255,176,205;
  --glow-tertiary-rgb: 74,225,118;

  /* Named glows */
  --glow-card: 0 8px 32px rgba(208,188,255,0.08);
  --glow-primary: 0 0 32px rgba(160,120,255,0.32);
  --glow-primary-large: 0 0 48px rgba(160,120,255,0.4), 0 0 96px rgba(160,120,255,0.18);
  --glow-nav: 0 -10px 40px rgba(160,120,255,0.15);
}

/* Sunset */
[data-theme="sunset"] {
  --primary: #FB923C; --primary-light: #FDBA74; --primary-lighter: #FED7AA;
  --primary-dark: #F97316; --primary-deep: #EA580C;
  --accent: #EAB308; --accent-light: #FACC15; --highlight: #F59E0B;
  --bg: #0b0806; --bg-card: #1a1208; --bg-card-mid: #1f1810; --bg-card-high: #2a2218; --bg-card-highest: #352c1f;
  --border: rgba(255,200,100,0.06); --border-hover: rgba(249,115,22,0.3);
  --glass: rgba(11,8,6,0.85); --glass-border: rgba(255,200,100,0.07);
  --text-1: #fef3e2; --text-2: rgba(255,240,220,0.7); --text-3: rgba(255,240,220,0.38);
  --glow-rgb: 249,115,22;
  --glow-secondary-rgb: 234,179,8;
  --glow-tertiary-rgb: 245,158,11;
  --glow-card: 0 8px 32px rgba(249,115,22,0.06);
  --glow-primary: 0 0 32px rgba(249,115,22,0.28);
  --glow-primary-large: 0 0 48px rgba(249,115,22,0.35), 0 0 96px rgba(249,115,22,0.14);
  --glow-nav: 0 -10px 40px rgba(249,115,22,0.12);
}

/* Ocean */
[data-theme="ocean"] {
  --primary: #22D3EE; --primary-light: #67E8F9; --primary-lighter: #A5F3FC;
  --primary-dark: #06B6D4; --primary-deep: #0891B2;
  --accent: #60A5FA; --accent-light: #93C5FD; --highlight: #4ade80;
  --bg: #060b0b; --bg-card: #0d1a1a; --bg-card-mid: #111f1f; --bg-card-high: #182929; --bg-card-highest: #1f3232;
  --border: rgba(100,200,255,0.06); --border-hover: rgba(6,182,212,0.3);
  --glass: rgba(6,11,11,0.85); --glass-border: rgba(100,200,255,0.07);
  --text-1: #e2f8f5; --text-2: rgba(220,250,245,0.65); --text-3: rgba(220,250,245,0.35);
  --glow-rgb: 6,182,212;
  --glow-secondary-rgb: 96,165,250;
  --glow-tertiary-rgb: 74,222,128;
  --glow-card: 0 8px 32px rgba(6,182,212,0.06);
  --glow-primary: 0 0 32px rgba(6,182,212,0.28);
  --glow-primary-large: 0 0 48px rgba(6,182,212,0.35), 0 0 96px rgba(6,182,212,0.14);
  --glow-nav: 0 -10px 40px rgba(6,182,212,0.12);
}

/* Minimal (light) */
[data-theme="minimal"] {
  --primary: #6d3bd7; --primary-light: #8B5CF6; --primary-lighter: #A78BFA;
  --primary-dark: #5B21B6; --primary-deep: #4C1D95;
  --accent: #db2777; --accent-light: #ec4899; --highlight: #059669;
  --bg: #f5f5f7; --bg-card: #ffffff; --bg-card-mid: #f0f0f3; --bg-card-high: #e8e8eb; --bg-card-highest: #dddde0;
  --border: rgba(0,0,0,0.08); --border-hover: rgba(109,59,215,0.2);
  --glass: rgba(245,245,247,0.9); --glass-border: rgba(0,0,0,0.06);
  --text-1: #18181b; --text-2: rgba(0,0,0,0.6); --text-3: rgba(0,0,0,0.35);
  --glow-rgb: 109,59,215;
  --glow-secondary-rgb: 219,39,119;
  --glow-tertiary-rgb: 5,150,105;
  --glow-card: 0 8px 32px rgba(109,59,215,0.06);
  --glow-primary: 0 0 32px rgba(109,59,215,0.2);
  --glow-primary-large: 0 0 48px rgba(109,59,215,0.28), 0 0 96px rgba(109,59,215,0.12);
  --glow-nav: 0 -10px 40px rgba(109,59,215,0.1);
}

/* ══════════════════════════════════════════
   GLOW OVERRIDES (use --glow-rgb for theme-awareness)
   ══════════════════════════════════════════ */

.particle { background: rgba(var(--glow-rgb),0.3); }

.how-steps::before {
  background: linear-gradient(90deg, var(--primary), var(--accent), var(--highlight));
}
.how-step:hover .how-step-num {
  border-color: var(--border-hover);
  box-shadow: 0 0 32px rgba(var(--glow-rgb),0.12);
}
.bento-card::before {
  background: conic-gradient(from var(--border-angle, 0deg), transparent 60%, var(--bento-accent, rgba(var(--glow-rgb),0.3)) 100%);
}
.bento-card::after {
  background: linear-gradient(90deg, transparent, var(--bento-accent, rgba(var(--glow-rgb),0.4)), transparent);
}
.bento-small .bento-icon {
  background: rgba(var(--glow-rgb),0.06);
  border-color: rgba(var(--glow-rgb),0.12);
}
.bento-small:hover .bento-icon {
  background: rgba(var(--glow-rgb),0.12);
  box-shadow: 0 0 24px rgba(var(--glow-rgb),0.1);
}
.testimonial-card:hover {
  border-color: rgba(var(--glow-rgb),0.15);
}
.vb::after {
  background: radial-gradient(ellipse at bottom, rgba(var(--glow-rgb),0.05), transparent 70%);
}
.venue-form input:focus, .venue-form textarea:focus {
  border-color: rgba(var(--glow-rgb),0.3);
  box-shadow: 0 0 0 3px rgba(var(--glow-rgb),0.05);
}
.cta-glow {
  background: radial-gradient(ellipse, rgba(var(--glow-rgb),0.12) 0%, rgba(var(--glow-secondary-rgb),0.06) 40%, transparent 70%);
}
.cta-qr {
  box-shadow: 0 8px 32px rgba(var(--glow-rgb),0.2);
}
.cta-qr:hover {
  box-shadow: 0 12px 40px rgba(var(--glow-rgb),0.3);
}
.divider {
  background: linear-gradient(90deg, transparent, rgba(var(--glow-rgb),0.15), transparent);
}
.phone-frame {
  box-shadow:
    0 40px 100px -20px rgba(0,0,0,0.6),
    0 0 0 0.5px rgba(255,255,255,0.04),
    0 0 80px rgba(var(--glow-rgb),0.06),
    inset 0 1px 0 rgba(255,255,255,0.06);
}
.phone-frame:hover {
  box-shadow:
    0 40px 100px -20px rgba(0,0,0,0.6),
    0 0 0 0.5px rgba(255,255,255,0.06),
    0 0 120px rgba(var(--glow-rgb),0.12),
    inset 0 1px 0 rgba(255,255,255,0.08);
}
.hero-mesh {
  background:
    radial-gradient(ellipse 80% 60% at 10% 20%, rgba(var(--glow-rgb),0.15) 0%, transparent 50%),
    radial-gradient(ellipse 60% 80% at 80% 80%, rgba(var(--glow-secondary-rgb),0.08) 0%, transparent 50%),
    radial-gradient(ellipse 50% 50% at 60% 10%, rgba(var(--glow-rgb),0.06) 0%, transparent 50%);
  background-size: 200% 200%;
}

/* Nav scrolled backgrounds */
[data-theme="nightclub"] .nav.scrolled { background: rgba(19,19,26,0.80); }
[data-theme="sunset"]    .nav.scrolled { background: rgba(11,8,6,0.80); }
[data-theme="ocean"]     .nav.scrolled { background: rgba(6,11,11,0.80); }
[data-theme="minimal"]   .nav.scrolled { background: rgba(245,245,247,0.92); }

/* ══════════════════════════════════════════
   MINIMAL (LIGHT) THEME OVERRIDES
   ══════════════════════════════════════════ */
[data-theme="minimal"] body::after { opacity: 0.08; }
[data-theme="minimal"] .gradient-text {
  background: linear-gradient(135deg, var(--primary), var(--primary-light), var(--accent));
  -webkit-background-clip: text; -webkit-text-fill-color: transparent;
  background-size: 200% 200%;
}
[data-theme="minimal"] .scroll-progress {
  background: linear-gradient(90deg, var(--primary), var(--accent), var(--highlight));
}
[data-theme="minimal"] .nav-cta {
  background: linear-gradient(135deg, var(--primary), var(--primary-light)) !important;
  box-shadow: 0 2px 12px rgba(var(--glow-rgb),0.2);
}
[data-theme="minimal"] .btn-primary {
  background: linear-gradient(135deg, var(--primary), var(--primary-light));
  color: #fff;
}
[data-theme="minimal"] .nav-logo {
  color: var(--primary);
  -webkit-text-fill-color: var(--primary);
  background: none;
}
[data-theme="minimal"] .hero-badge {
  background: rgba(var(--glow-tertiary-rgb),0.06);
  border-color: rgba(var(--glow-tertiary-rgb),0.15);
}
[data-theme="minimal"] .stat-number {
  background: linear-gradient(135deg, var(--primary), var(--primary-light));
  -webkit-background-clip: text; -webkit-text-fill-color: transparent;
}
[data-theme="minimal"] .bento-card {
  background: #ffffff;
  border-color: rgba(0,0,0,0.06);
}
[data-theme="minimal"] .testimonial-card {
  background: #ffffff;
  border-color: rgba(0,0,0,0.06);
}
[data-theme="minimal"] .how-step-num {
  background: #ffffff;
  border-color: rgba(0,0,0,0.08);
}
[data-theme="minimal"] .trust-badge {
  background: #ffffff;
  border-color: rgba(0,0,0,0.08);
}

/* ══════════════════════════════════════════
   THEME TRANSITIONS
   ══════════════════════════════════════════ */
body, .nav, .bento-card, .trust-badge, .how-step-num, .footer,
.btn-primary, .btn-secondary, .section-label, .stat, .venue-form,
.venue-form input, .venue-form textarea, .testimonial-card {
  transition: background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease;
}