/* ═══════════════════════════════════════════════════════════════════
   DEAD FREQUENCY THEME - Dark Grunge Electronic
   ═══════════════════════════════════════════════════════════════════
   Color palette extracted from dead-frequency.com
   Neon pink/orange, industrial grunge aesthetic
   
   Load: base.css + deadfrequency.css
═══════════════════════════════════════════════════════════════════ */

:root {
  /* ─────────────────────────────────────────────────
     COLOR PALETTE - DEAD FREQUENCY OVERRIDES
  ───────────────────────────────────────────────── */

  /* Background layers - dark grunge */
  --zar-bg: #0a0a0f;
  --zar-bg-secondary: #12111a;
  --zar-bg-tertiary: #1a1828;

  /* Text colors - high contrast white */
  --zar-text: #ffffff;
  --zar-text-muted: #a0a0a0;
  --zar-text-faint: #666666;

  /* Neon pink primary from dead-frequency.com */
  --zar-accent: #ff1a8c;
  --zar-accent-dark: #cc147a;
  --zar-accent-light: #ff4da6;
  --zar-accent-glow: rgba(255, 26, 140, 0.2);

  /* Secondary neon orange */
  --zar-secondary: #ff6b35;
  --zar-secondary-dark: #cc5629;
  --zar-secondary-light: #ff8866;

  /* Reunion accent (tan/brown) */
  --zar-reunion: #d4a574;

  /* ─────────────────────────────────────────────────
     PLAYER COMPONENT COLORS
  ───────────────────────────────────────────────── */

  --zar-player-bg: #12111a;
  --zar-player-border: rgba(255, 26, 140, 0.15);
  --zar-player-shadow: rgba(0, 0, 0, 0.7);

  /* ─────────────────────────────────────────────────
     BUTTON STATES
  ───────────────────────────────────────────────── */

  --zar-button-bg: transparent;
  --zar-button-border: rgba(255, 26, 140, 0.3);
  --zar-button-text: #ffffff;
  --zar-button-hover: rgba(255, 26, 140, 0.1);
  --zar-button-active: rgba(255, 26, 140, 0.2);

  /* ─────────────────────────────────────────────────
     VISUALIZER
  ───────────────────────────────────────────────── */

  --zar-visualizer-color: #ff1a8c;
  --zar-visualizer-bg: rgba(18, 17, 26, 0.9);
  --zar-visualizer-line-width: 2;

  /* ─────────────────────────────────────────────────
     PROGRESS BAR
  ───────────────────────────────────────────────── */

  --zar-progress-bg: rgba(255, 26, 140, 0.15);
  --zar-progress-fill: #ff1a8c;
  --zar-progress-handle: #ff1a8c;

  /* ─────────────────────────────────────────────────
     LYRICS
  ───────────────────────────────────────────────── */

  --zar-lyrics-color: #ffffff;
  --zar-lyrics-marker-color: #ff1a8c;

  /* ─────────────────────────────────────────────────
     SCROLLBAR
  ───────────────────────────────────────────────── */

  --zar-scrollbar-thumb: rgba(255, 26, 140, 0.3);
  --zar-scrollbar-thumb-hover: rgba(255, 26, 140, 0.6);

  /* ─────────────────────────────────────────────────
     LAYOUT CONTAINMENT
  ───────────────────────────────────────────────── */

  /* Override full-bleed to stay within container */
  --zar-hero-overflow-width: 100%;
  --zar-hero-overflow-margin: 0;
  --zar-controls-overflow-width: 100%;
  --zar-controls-overflow-margin: 0;
}