/* ═══════════════════════════════════════════════════════════════════════════
   THEME: Midnight Cyberpunk 🌃
   Neon cyberpunk aesthetic with glowing accents and grid patterns
   ═══════════════════════════════════════════════════════════════════════════ */

[data-theme="cyberpunk"] {
  /* ─── Core Palette ─────────────────────────── */
  --bg-base:        #0a0a12;
  --bg-panel:       #12121f;
  --bg-card:        #181828;
  --bg-card-hover:  #1f1f35;
  --bg-border:      #2a2a4a;
  --bg-border-dim:  #1a1a2e;

  /* Team Colors - Neon Enhanced */
  --t-color:        #ff2d75;
  --t-dim:          rgba(255,45,117,0.12);
  --t-border:       rgba(255,45,117,0.35);
  --ct-color:       #00f0ff;
  --ct-dim:         rgba(0,240,255,0.12);
  --ct-border:      rgba(0,240,255,0.35);

  /* Text */
  --text-primary:   #ffffff;
  --text-secondary: #9090b0;
  --text-muted:     #404060;

  /* Status */
  --hp-high:        #00ff88;
  --hp-mid:         #ffcc00;
  --hp-low:         #ff3366;
  --money:          #00ff88;

  /* ─── Body & Background ────────────────────── */
  --body-gradient: linear-gradient(135deg, #0a0a12 0%, #0d0d1a 50%, #0a0a12 100%);
}

[data-theme="cyberpunk"] body {
  background: var(--body-gradient);
}

[data-theme="cyberpunk"] body::after {
  background:
    /* Grid pattern */
    linear-gradient(90deg, rgba(0,240,255,0.03) 1px, transparent 1px),
    linear-gradient(rgba(0,240,255,0.03) 1px, transparent 1px),
    /* Gradient overlay */
    linear-gradient(180deg, #0a0a12 0%, #0d0d1a 50%, #0a0a12 100%);
  background-size: 40px 40px, 40px 40px, 100% 100%;
  opacity: 0.6;
  z-index: -1;
}

/* ─── Glow Effects ──────────────────────────── */
[data-theme="cyberpunk"] .player-card {
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.05),
    0 0 0 1px var(--bg-border-dim);
  transition: all 0.2s ease;
}

[data-theme="cyberpunk"] .player-card:hover {
  box-shadow:
    0 0 20px rgba(0,240,255,0.15),
    0 0 40px rgba(255,45,117,0.08),
    inset 0 1px 0 rgba(255,255,255,0.1);
}

/* ─── Scoreboard Glow ───────────────────────── */
[data-theme="cyberpunk"] .scoreboard {
  box-shadow:
    0 0 30px rgba(0,240,255,0.1),
    0 0 60px rgba(255,45,117,0.05),
    inset 0 0 30px rgba(0,0,0,0.3);
}

/* ─── Bomb Timer Enhanced ───────────────────── */
[data-theme="cyberpunk"] [style*="rgba(40,8,8,0.9)"] {
  background: rgba(20,0,20,0.9) !important;
  box-shadow:
    0 0 20px rgba(255,51,102,0.3),
    inset 0 0 20px rgba(255,51,102,0.1);
}

/* ─── Team Header Glow ──────────────────────── */
[data-theme="cyberpunk"] .team-label-t,
[data-theme="cyberpunk"] [style*="var(--t-color)"] {
  text-shadow: 0 0 10px var(--t-color), 0 0 20px var(--t-color);
}

[data-theme="cyberpunk"] .team-label-ct,
[data-theme="cyberpunk"] [style*="var(--ct-color)"] {
  text-shadow: 0 0 10px var(--ct-color), 0 0 20px var(--ct-color);
}

/* ─── Dot Glow on Map ───────────────────────── */
[data-theme="cyberpunk"] .player-dot {
  filter: drop-shadow(0 0 3px var(--ct-color)) drop-shadow(0 0 6px var(--ct-color));
}

[data-theme="cyberpunk"] .player-dot.t-side {
  filter: drop-shadow(0 0 3px var(--t-color)) drop-shadow(0 0 6px var(--t-color));
}

/* ─── Scrollbar Neon ────────────────────────── */
[data-theme="cyberpunk"] ::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, var(--ct-color), var(--t-color));
  box-shadow: 0 0 10px var(--ct-color);
}

/* ─── Button Effects ─────────────────────────── */
[data-theme="cyberpunk"] button:hover {
  box-shadow: 0 0 15px rgba(0,240,255,0.3);
}

/* ─── Connecting Ring ═══════════════════════ */
[data-theme="cyberpunk"] .connecting-ring {
  border-color: var(--bg-border);
  border-top-color: linear-gradient(var(--ct-color), var(--t-color));
  box-shadow:
    0 0 20px var(--ct-color),
    0 0 40px rgba(0,240,255,0.3);
}

/* ─── C4 Pulse Enhanced ─────────────────────── */
[data-theme="cyberpunk"] [style*="c4pulse"] {
  animation: c4pulseCyber 1.1s ease-in-out infinite;
}

@keyframes c4pulseCyber {
  0%   { box-shadow: 0 0 0 0 rgba(255,51,102,0.9), 0 0 15px rgba(255,51,102,0.6); opacity: 1; }
  50%  { box-shadow: 0 0 0 8px rgba(255,51,102,0), 0 0 25px rgba(255,51,102,0.3); opacity: 0.85; }
  100% { box-shadow: 0 0 0 0 rgba(255,51,102,0), 0 0 15px rgba(255,51,102,0.6); opacity: 1; }
}

/* ─── Phase Pulse Enhanced ───────────────────── */
@keyframes phasePulseCyber {
  0%   { opacity: 0.5; text-shadow: 0 0 5px currentColor; }
  100% { opacity: 1; text-shadow: 0 0 15px currentColor, 0 0 30px currentColor; }
}

[data-theme="cyberpunk"] [style*="phasePulse"] {
  animation: phasePulseCyber 0.65s ease-in-out infinite alternate;
}

/* ─── Radar Container Glow ──────────────────── */
[data-theme="cyberpunk"] #radar {
  box-shadow:
    0 0 40px rgba(0,240,255,0.1),
    0 0 80px rgba(255,45,117,0.05),
    inset 0 0 60px rgba(0,0,0,0.5);
}

/* ─── Settings Panel ────────────────────────── */
[data-theme="cyberpunk"] .settings-panel {
  box-shadow:
    0 16px 48px rgba(0,0,0,0.7),
    0 0 30px rgba(0,240,255,0.1);
}