:root {
  /* Neon Noir Theme - Dark with Electric Gradients */
  --bg-primary: #0f0f23;
  --bg-secondary: #1a1a2e;
  --bg-tertiary: #16213e;
  --bg-glass: rgba(26, 26, 46, 0.8);

  /* Gradients */
  --gradient-primary: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
  --gradient-accent: linear-gradient(135deg, #f093fb 0%, #f5576c 100%);
  --gradient-cyber: linear-gradient(135deg, #4facfe 0%, #00f2fe 100%);
  --gradient-success: linear-gradient(135deg, #43e97b 0%, #38f9d7 100%);

  /* Colors */
  --text-primary: #e6e6e6;
  --text-secondary: #a0a0a0;
  --text-muted: #666666;
  --accent-violet: #667eea;
  --accent-cyan: #00f2fe;
  --accent-pink: #f093fb;

  /* UI Elements */
  --border-color: rgba(102, 126, 234, 0.2);
  --hover-bg: rgba(102, 126, 234, 0.1);
  --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.3);
  --shadow-md: 0 4px 16px rgba(0, 0, 0, 0.4);
  --shadow-lg: 0 8px 32px rgba(0, 0, 0, 0.5);
  --shadow-glow: 0 0 20px rgba(102, 126, 234, 0.3);

  /* Typography */
  --font-heading: 'Outfit', sans-serif;
  --font-body: 'Manrope', sans-serif;

  /* Spacing */
  --space-xs: 4px;
  --space-sm: 8px;
  --space-md: 16px;
  --space-lg: 24px;
  --space-xl: 32px;

  /* Transitions */
  --transition-fast: 0.15s ease;
  --transition-normal: 0.3s ease;
  --transition-slow: 0.5s ease;

  /* Z-index */
  --z-map: 1;
  --z-controls: 10;
  --z-topbar: 100;
  --z-chat: 200;
  --z-modal: 1000;
  --z-toast: 2000;
  --z-loading: 3000;

  /* Map tiles */
  --map-tiles: url('https://{s}.basemaps.cartocdn.com/dark_all/{z}/{x}/{y}{r}.png');
}

/* Theme: Ocean Breeze */
[data-theme="ocean"] {
  --bg-primary: #0a192f;
  --bg-secondary: #112240;
  --bg-tertiary: #1a365d;
  --bg-glass: rgba(17, 34, 64, 0.8);
  --gradient-primary: linear-gradient(135deg, #3b82f6 0%, #06b6d4 100%);
  --gradient-accent: linear-gradient(135deg, #0ea5e9 0%, #2dd4bf 100%);
  --text-primary: #e2e8f0;
  --text-secondary: #94a3b8;
  --text-muted: #64748b;
  --accent-violet: #3b82f6;
  --accent-cyan: #06b6d4;
  --border-color: rgba(59, 130, 246, 0.2);
  --hover-bg: rgba(59, 130, 246, 0.1);
  --shadow-glow: 0 0 20px rgba(59, 130, 246, 0.3);
  --map-tiles: url('https://{s}.basemaps.cartocdn.com/dark_all/{z}/{x}/{y}{r}.png');
}

/* Theme: Forest Green */
[data-theme="forest"] {
  --bg-primary: #0f1e13;
  --bg-secondary: #1a2f1f;
  --bg-tertiary: #234029;
  --bg-glass: rgba(26, 47, 31, 0.8);
  --gradient-primary: linear-gradient(135deg, #10b981 0%, #059669 100%);
  --gradient-accent: linear-gradient(135deg, #34d399 0%, #a7f3d0 100%);
  --text-primary: #d1fae5;
  --text-secondary: #86efac;
  --text-muted: #4ade80;
  --accent-violet: #10b981;
  --accent-cyan: #34d399;
  --border-color: rgba(16, 185, 129, 0.2);
  --hover-bg: rgba(16, 185, 129, 0.1);
  --shadow-glow: 0 0 20px rgba(16, 185, 129, 0.3);
  --map-tiles: url('https://{s}.basemaps.cartocdn.com/dark_all/{z}/{x}/{y}{r}.png');
}

/* Theme: Sunset Orange */
[data-theme="sunset"] {
  --bg-primary: #1a0f0a;
  --bg-secondary: #2d1810;
  --bg-tertiary: #3d2418;
  --bg-glass: rgba(45, 24, 16, 0.8);
  --gradient-primary: linear-gradient(135deg, #f97316 0%, #dc2626 100%);
  --gradient-accent: linear-gradient(135deg, #fb923c 0%, #fca5a5 100%);
  --text-primary: #fed7aa;
  --text-secondary: #fdba74;
  --text-muted: #fb923c;
  --accent-violet: #f97316;
  --accent-cyan: #fb923c;
  --border-color: rgba(249, 115, 22, 0.2);
  --hover-bg: rgba(249, 115, 22, 0.1);
  --shadow-glow: 0 0 20px rgba(249, 115, 22, 0.3);
  --map-tiles: url('https://{s}.basemaps.cartocdn.com/dark_all/{z}/{x}/{y}{r}.png');
}

/* Theme: Royal Purple */
[data-theme="royal"] {
  --bg-primary: #1a0a2e;
  --bg-secondary: #2d1650;
  --bg-tertiary: #3d2268;
  --bg-glass: rgba(45, 22, 80, 0.8);
  --gradient-primary: linear-gradient(135deg, #8b5cf6 0%, #7c3aed 100%);
  --gradient-accent: linear-gradient(135deg, #a78bfa 0%, #c4b5fd 100%);
  --text-primary: #e9d5ff;
  --text-secondary: #c4b5fd;
  --text-muted: #a78bfa;
  --accent-violet: #8b5cf6;
  --accent-cyan: #a78bfa;
  --border-color: rgba(139, 92, 246, 0.2);
  --hover-bg: rgba(139, 92, 246, 0.1);
  --shadow-glow: 0 0 20px rgba(139, 92, 246, 0.3);
  --map-tiles: url('https://{s}.basemaps.cartocdn.com/dark_all/{z}/{x}/{y}{r}.png');
}

/* Theme: Minimal Light */
[data-theme="light"] {
  --bg-primary: #ffffff;
  --bg-secondary: #f8fafc;
  --bg-tertiary: #f1f5f9;
  --bg-glass: rgba(248, 250, 252, 0.9);
  --gradient-primary: linear-gradient(135deg, #3b82f6 0%, #2563eb 100%);
  --gradient-accent: linear-gradient(135deg, #60a5fa 0%, #93c5fd 100%);
  --text-primary: #0f172a;
  --text-secondary: #475569;
  --text-muted: #94a3b8;
  --accent-violet: #3b82f6;
  --accent-cyan: #0ea5e9;
  --border-color: rgba(226, 232, 240, 1);
  --hover-bg: rgba(241, 245, 249, 1);
  --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.1);
  --shadow-md: 0 4px 16px rgba(0, 0, 0, 0.1);
  --shadow-lg: 0 8px 32px rgba(0, 0, 0, 0.15);
  --shadow-glow: 0 0 20px rgba(59, 130, 246, 0.2);
  --map-tiles: url('https://{s}.basemaps.cartocdn.com/light_all/{z}/{x}/{y}{r}.png');
}