/*
 * X1 Radio — Theme Variables
 *
 * Radio-specific design tokens layered on top of shared tokens.css.
 * This file defines the DOS-retro visual identity: navy panels, neon green text,
 * monospace typography, and CRT-inspired UI elements.
 *
 * Shared tokens provide: --bg-*, --text-*, --space-*, --radius-*, --transition-*
 * This file adds: --dos-*, --neon-*, radio-specific overrides
 */

@import url('tokens.css');

:root {
  /* ===== RADIO ACCENT OVERRIDE ===== */
  --accent:          #0f0;      /* Neon green replaces X1 blue for radio */
  --accent-hover:    #3f3;
  --accent-highlight:#5f5;
  --accent-backdrop: rgba(0, 255, 0, 0.05);

  /* ===== DOS PANEL SYSTEM ===== */
  --dos-navy:        #000080;   /* DOS window background */
  --dos-navy-hover:  #0000a0;   /* Hover state on navy elements */
  --dos-navy-dark:   #004;      /* Darker navy for selected/muted */
  --dos-border:      #aaa;      /* DOS panel borders and titlebars */
  --dos-border-light:#ccc;      /* Light border for hover/active */
  --dos-titlebar-bg: #aaa;      /* DOS titlebar background */
  --dos-titlebar-fg: #000080;   /* DOS titlebar text */

  /* ===== NEON PALETTE (radio-specific accents) ===== */
  --neon-green:      #0f0;      /* Primary: data values, active states */
  --neon-cyan:       #0ff;      /* Secondary: mapped values, links */
  --neon-yellow:     #ffff00;   /* Labels: section titles */
  --neon-blue:       #0af;      /* Accent: progress bars, highlights */

  /* ===== PANEL BACKGROUNDS ===== */
  --bg-black:        #000;      /* Pure black — canvas, overlays */
  --bg-button:       #444;      /* Button default background */
  --bg-button-hover: #555;      /* Button hover */

  /* ===== PANEL BORDERS ===== */
  --border-panel:    #555;      /* Panel separators, dividers */
  --border-muted:    rgba(170, 170, 170, 0.3); /* Subtle section dividers */

  /* ===== TEXT (radio-specific shades) ===== */
  --text-muted:      #666;      /* Muted text, decorative */
  --text-dim:        #888;      /* Dim labels, metadata */

  /* ===== SEMANTIC (radio-specific) ===== */
  --color-connected: #0a0;      /* Wallet connected state */
  --color-gold:      #daa520;   /* Gold hover on track name */
  --color-danger:    #f66;      /* Disconnect button, danger actions */
  --color-dev:       #f00;      /* Dev build indicator */
  --dos-green-dark:  #003300;   /* Dropdown option hover */
  --dos-green-selected: #004400; /* Dropdown option selected */

  /* ===== FONT OVERRIDE ===== */
  --font-display: 'VT323', monospace;
  --font-dos: 'Courier New', 'Courier Prime', monospace;
}