/* ============================================
   FILE: theme.css
   PURPOSE: Multi-theme color system with CSS variables
   THEMES: Green (default), Red, Purple, Blue
   ============================================ */

/* ══════════════════════════════════════════════
   DEFAULT THEME — GREEN (Hacker Matrix Vibe)
══════════════════════════════════════════════ */

:root {
  /* Primary Theme Colors */
  --accent-rgb: 0, 255, 170;
  --accent-rgb-secondary: 0, 229, 255;
  --theme-primary:    #00ffaa;
  --theme-secondary:  #00e5ff;
  --theme-tertiary:   #a78bfa;
  --theme-danger:     #ff4d6d;
  --theme-warning:    #ffdd57;
  
  /* Backgrounds */
  --bg-main:          #020c0a;
  --bg-card:          rgba(10, 30, 24, 0.85);
  --bg-card-solid:    #0a1e18;
  --bg-elevated:      rgba(var(--accent-rgb), 0.04);
  --bg-overlay:       rgba(2, 12, 10, 0.92);
  
  /* Borders */
  --border-color:     rgba(var(--accent-rgb), 0.12);
  --border-hover:     rgba(var(--accent-rgb), 0.35);
  --border-glow:      rgba(var(--accent-rgb), 0.6);
  
  /* Text Colors */
  --text-main:        #d2fff3;
  --text-muted:       #6fa89a;
  --text-faint:       #3a6358;
  --text-bright:      #ffffff;
  
  /* Glow Effects */
  --glow:             0 0 12px rgba(var(--accent-rgb),0.5), 0 0 28px rgba(var(--accent-rgb),0.25);
  --glow-intense:     0 0 20px rgba(var(--accent-rgb),0.7), 0 0 50px rgba(var(--accent-rgb),0.35);
  --glow-cyan:        0 0 12px rgba(var(--accent-rgb-secondary),0.5), 0 0 28px rgba(var(--accent-rgb-secondary),0.2);
  
  /* Matrix Rain Color */
  --matrix-color:     #00ffaa;
  --matrix-bg:        rgba(2,12,10,0.05);
  
  /* Scanline Color */
  --scanline-color:   rgba(var(--accent-rgb), 0.025);
  
  /* Status Indicators */
  --status-dot:       #00ffaa;
  --status-dot-glow:  rgba(var(--accent-rgb),0.2);
  
  /* Accent aliases for compatibility */
  --accent-primary:   var(--theme-primary);
  --accent-secondary: var(--theme-secondary);
  --accent-purple:    var(--theme-tertiary);
  --accent-danger:    var(--theme-danger);
  --accent-warning:   var(--theme-warning);
  --accent-dim: rgba(var(--accent-rgb), 0.4);
  
}

/* ══════════════════════════════════════════════
   RED THEME — Cyber Attack Vibe
══════════════════════════════════════════════ */
[data-theme="red"] {
  /* Primary Theme Colors */
  --accent-rgb: 255, 0, 85; 
  --theme-primary:    #ff0055;
  --theme-secondary:  #ff3366;
  --theme-tertiary:   #ff6b9d;
  --theme-danger:     #cc0044;
  --theme-warning:    #ffaa00;
  
  /* Backgrounds */
  --bg-main:          #0a0202;
  --bg-card:          rgba(30, 10, 10, 0.85);
  --bg-card-solid:    #1e0a0a;
  --bg-elevated:      rgba(var(--accent-rgb), 0.04);
  --bg-overlay:       rgba(10, 2, 2, 0.92);
  
  /* Borders */
  --border-color:     rgba(var(--accent-rgb), 0.12);
  --border-hover:     rgba(var(--accent-rgb), 0.35);
  --border-glow:      rgba(var(--accent-rgb), 0.6);
  
  /* Text Colors */
  --text-main:        #ffd2e5;
  --text-muted:       #a96f7e;
  --text-faint:       #583a42;
  --text-bright:      #ffffff;
  
  /* Glow Effects */
  --glow:             0 0 12px rgba(var(--accent-rgb),0.5), 0 0 28px rgba(var(--accent-rgb),0.25);
  --glow-intense:     0 0 20px rgba(var(--accent-rgb),0.7), 0 0 50px rgba(var(--accent-rgb),0.35);
  --glow-cyan: var(--glow);
  
  /* Matrix Rain Color */
  --matrix-color:     #ff0055;
  --matrix-bg:        rgba(10,2,2,0.05);
  
  /* Scanline Color */
  --scanline-color:   rgba(var(--accent-rgb), 0.025);
  
  /* Status Indicators */
  --status-dot:       #ff0055;
  --status-dot-glow:  rgba(var(--accent-rgb),0.2);
  
  /* Accent aliases for compatibility */
  --accent-primary:   var(--theme-primary);
  --accent-secondary: var(--theme-secondary);
  --accent-purple:    var(--theme-tertiary);
  --accent-danger:    var(--theme-danger);
  --accent-warning:   var(--theme-warning);
  --accent-dim:       rgba(var(--accent-rgb), 0.4);
}

/* ══════════════════════════════════════════════
   PURPLE THEME — Futuristic Hacker Vibe
══════════════════════════════════════════════ */
[data-theme="purple"] {
  /* Primary Theme Colors */
  --accent-rgb: 167, 139, 250; 
  --theme-primary:    #a78bfa;
  --theme-secondary:  #c4b5fd;
  --theme-tertiary:   #e9d5ff;
  --theme-danger:     #ff4d6d;
  --theme-warning:    #fbbf24;
  
  /* Backgrounds */
  --bg-main:          #05020a;
  --bg-card:          rgba(20, 10, 30, 0.85);
  --bg-card-solid:    #140a1e;
  --bg-elevated:      rgba(var(--accent-rgb), 0.04);
  --bg-overlay:       rgba(5, 2, 10, 0.92);
  
  /* Borders */
  --border-color:     rgba(var(--accent-rgb), 0.12);
  --border-hover:     rgba(var(--accent-rgb), 0.35);
  --border-glow:      rgba(var(--accent-rgb), 0.6);
  
  /* Text Colors */
  --text-main:        #e9d5ff;
  --text-muted:       #a78bcd;
  --text-faint:       #4a3a58;
  --text-bright:      #ffffff;
  
  /* Glow Effects */
  --glow:             0 0 12px rgba(167,139,250,0.5), 0 0 28px rgba(167,139,250,0.25);
  --glow-intense:     0 0 20px rgba(167,139,250,0.7), 0 0 50px rgba(167,139,250,0.35);
  --glow-cyan:        0 0 12px rgba(196,181,253,0.5), 0 0 28px rgba(196,181,253,0.2);
  
  /* Matrix Rain Color */
  --matrix-color:     #a78bfa;
  --matrix-bg:        rgba(5,2,10,0.05);
  
  /* Scanline Color */
  --scanline-color:   rgba(var(--accent-rgb), 0.025);
  
  /* Status Indicators */
  --status-dot:       #a78bfa;
  --status-dot-glow:  rgba(167,139,250,0.2);
  
  /* Accent aliases for compatibility */
  --accent-primary:   var(--theme-primary);
  --accent-secondary: var(--theme-secondary);
  --accent-purple:    var(--theme-tertiary);
  --accent-danger:    var(--theme-danger);
  --accent-warning:   var(--theme-warning);
  --accent-dim:       rgba(var(--accent-rgb), 0.4);
}

/* ══════════════════════════════════════════════
   BLUE THEME — Clean Cyber Tech Vibe
══════════════════════════════════════════════ */
[data-theme="blue"] {
  /* Primary Theme Colors */
  --accent-rgb: 0, 217, 255; 
  --theme-primary:    #00d9ff;
  --theme-secondary:  #66e0ff;
  --theme-tertiary:   #99e9ff;
  --theme-danger:     #ff4d6d;
  --theme-warning:    #ffd93d;
  
  /* Backgrounds */
  --bg-main:          #02080a;
  --bg-card:          rgba(10, 20, 30, 0.85);
  --bg-card-solid:    #0a141e;
  --bg-elevated:      rgba(var(--accent-rgb), 0.04);
  --bg-overlay:       rgba(2, 8, 10, 0.92);
  
  /* Borders */
  --border-color:     rgba(var(--accent-rgb), 0.12);
  --border-hover:     rgba(var(--accent-rgb), 0.35);
  --border-glow:      rgba(var(--accent-rgb), 0.6);
  
  /* Text Colors */
  --text-main:        #d2f3ff;
  --text-muted:       #6f9aaa;
  --text-faint:       #3a4e58;
  --text-bright:      #ffffff;
  
  /* Glow Effects */
  --glow:             0 0 12px rgba(0,217,255,0.5), 0 0 28px rgba(0,217,255,0.25);
  --glow-intense:     0 0 20px rgba(0,217,255,0.7), 0 0 50px rgba(0,217,255,0.35);
  --glow-cyan:        0 0 12px rgba(102,224,255,0.5), 0 0 28px rgba(102,224,255,0.2);
  
  /* Matrix Rain Color */
  --matrix-color:     #00d9ff;
  --matrix-bg:        rgba(2,8,10,0.05);
  
  /* Scanline Color */
  --scanline-color:   rgba(var(--accent-rgb), 0.025);
  
  /* Status Indicators */
  --status-dot:       #00d9ff;
  --status-dot-glow:  rgba(0,217,255,0.2);
  
  /* Accent aliases for compatibility */
  --accent-primary:   var(--theme-primary);
  --accent-secondary: var(--theme-secondary);
  --accent-purple:    var(--theme-tertiary);
  --accent-danger:    var(--theme-danger);
  --accent-warning:   var(--theme-warning);
  --accent-dim:       rgba(var(--accent-rgb), 0.4);
}