/* ============================================
   EG4NET v2 — Theme System
   Tre temi: blue (default), dark, light
   Ogni tema definisce le sue variabili CSS
   ============================================ */

/* --- TEMA BLU (default) --- */
:root,
[data-theme="blue"] {
  /* Superfici */
  --bg-app: #0c1929;
  --bg-sidebar: #0a1628;
  --bg-topbar: rgba(10, 22, 40, 0.85);
  --bg-card: rgba(15, 30, 56, 0.7);
  --bg-card-hover: rgba(20, 40, 72, 0.8);
  --bg-glass: rgba(15, 30, 56, 0.45);
  --bg-input: rgba(12, 25, 48, 0.6);
  --bg-overlay: rgba(4, 10, 20, 0.7);
  --bg-tooltip: rgba(10, 22, 40, 0.95);

  /* Bordi */
  --border-subtle: rgba(56, 120, 200, 0.15);
  --border-medium: rgba(56, 120, 200, 0.25);
  --border-strong: rgba(56, 120, 200, 0.4);
  --border-input: rgba(56, 120, 200, 0.2);
  --border-input-focus: rgba(96, 160, 255, 0.5);

  /* Testo */
  --text-primary: #e8edf5;
  --text-secondary: #94a3bb;
  --text-muted: #5a6a80;
  --text-accent: #60a0ff;
  --text-on-accent: #ffffff;

  /* Accent / Brand */
  --accent-primary: #3b82f6;
  --accent-primary-hover: #2563eb;
  --accent-primary-glow: rgba(59, 130, 246, 0.3);
  --accent-secondary: #8b5cf6;
  --accent-secondary-hover: #7c3aed;

  /* Stato */
  --color-success: #22c55e;
  --color-success-bg: rgba(34, 197, 94, 0.12);
  --color-warning: #f59e0b;
  --color-warning-bg: rgba(245, 158, 11, 0.12);
  --color-error: #ef4444;
  --color-error-bg: rgba(239, 68, 68, 0.12);
  --color-info: #3b82f6;
  --color-info-bg: rgba(59, 130, 246, 0.12);

  /* Glassmorphism */
  --glass-blur: 16px;
  --glass-border: rgba(56, 120, 200, 0.12);
  --glass-shadow: 0 8px 32px rgba(0, 0, 0, 0.3);

  /* Glow effects */
  --glow-accent: 0 0 20px rgba(59, 130, 246, 0.15);
  --glow-strong: 0 0 30px rgba(59, 130, 246, 0.25);

  /* Sidebar */
  --sidebar-width: 280px;
  --sidebar-active-bg: rgba(59, 130, 246, 0.12);
  --sidebar-active-border: var(--accent-primary);
  --sidebar-hover-bg: rgba(59, 130, 246, 0.08);

  /* Solid color for <option> elements (rgba not supported) */
  --bg-select-option: #0f1e38;

  /* Spacing & Radius */
  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 16px;
  --radius-xl: 20px;

  /* Transizioni */
  --transition-fast: 150ms ease;
  --transition-normal: 250ms ease;
  --transition-slow: 400ms ease;

  /* Topbar */
  --topbar-height: 68px;

  /* Z-index */
  --z-sidebar: 100;
  --z-overlay: 90;
  --z-topbar: 80;
  --z-toast: 200;
  --z-modal: 150;
}

/* --- TEMA DARK (nero profondo) --- */
[data-theme="dark"] {
  --bg-app: #09090b;
  --bg-sidebar: #0c0c0f;
  --bg-topbar: rgba(12, 12, 15, 0.85);
  --bg-card: rgba(20, 20, 25, 0.7);
  --bg-card-hover: rgba(30, 30, 38, 0.8);
  --bg-glass: rgba(20, 20, 25, 0.45);
  --bg-input: rgba(15, 15, 20, 0.6);
  --bg-overlay: rgba(0, 0, 0, 0.75);

  --border-subtle: rgba(255, 255, 255, 0.06);
  --border-medium: rgba(255, 255, 255, 0.1);
  --border-strong: rgba(255, 255, 255, 0.18);
  --border-input: rgba(255, 255, 255, 0.08);
  --border-input-focus: rgba(139, 92, 246, 0.5);

  --text-primary: #f0f0f2;
  --text-secondary: #8b8b95;
  --text-muted: #55555f;
  --text-accent: #a78bfa;

  --accent-primary: #8b5cf6;
  --accent-primary-hover: #7c3aed;
  --accent-primary-glow: rgba(139, 92, 246, 0.3);
  --accent-secondary: #6366f1;

  --glass-border: rgba(255, 255, 255, 0.06);
  --glass-shadow: 0 8px 32px rgba(0, 0, 0, 0.5);

  --glow-accent: 0 0 20px rgba(139, 92, 246, 0.15);

  --sidebar-active-bg: rgba(139, 92, 246, 0.1);
  --sidebar-active-border: var(--accent-primary);
  --sidebar-hover-bg: rgba(139, 92, 246, 0.06);

  /* Solid color for <option> elements (rgba not supported) */
  --bg-select-option: #1a1a1f;
}

/* --- TEMA LIGHT (chiaro) --- */
[data-theme="light"] {
  --bg-app: #f0f2f5;
  --bg-sidebar: #ffffff;
  --bg-topbar: rgba(255, 255, 255, 0.92);
  --bg-card: #ffffff;
  --bg-card-hover: #f8f9fb;
  --bg-glass: rgba(255, 255, 255, 0.75);
  --bg-input: #ffffff;
  --bg-overlay: rgba(0, 0, 0, 0.35);
  --bg-tooltip: rgba(30, 40, 60, 0.95);

  --border-subtle: rgba(0, 40, 100, 0.08);
  --border-medium: rgba(0, 40, 100, 0.12);
  --border-strong: rgba(0, 40, 100, 0.2);
  --border-input: rgba(0, 40, 100, 0.15);
  --border-input-focus: rgba(59, 130, 246, 0.5);

  --text-primary: #1a2332;
  --text-secondary: #4a5568;
  --text-muted: #94a3b8;
  --text-accent: #2563eb;
  --text-on-accent: #ffffff;

  --accent-primary: #2563eb;
  --accent-primary-hover: #1d4ed8;
  --accent-primary-glow: rgba(37, 99, 235, 0.15);
  --accent-secondary: #7c3aed;

  --glass-border: rgba(0, 40, 100, 0.08);
  --glass-shadow: 0 4px 16px rgba(0, 0, 0, 0.06);

  --glow-accent: 0 0 15px rgba(37, 99, 235, 0.08);

  --sidebar-active-bg: rgba(37, 99, 235, 0.08);
  --sidebar-active-border: var(--accent-primary);
  --sidebar-hover-bg: rgba(37, 99, 235, 0.04);

  --color-success-bg: rgba(34, 197, 94, 0.08);
  --color-warning-bg: rgba(245, 158, 11, 0.08);
  --color-error-bg: rgba(239, 68, 68, 0.08);
  --color-info-bg: rgba(59, 130, 246, 0.08);

  /* Solid color for <option> elements */
  --bg-select-option: #ffffff;
}