:root {
  /* Base color variables - will be overridden by theme combinations */
  --bg-primary: #0f1419;
  --bg-secondary: #1e2328;
  --bg-tertiary: #2a2f36;
  --text-primary: #e6f1ff;
  --text-secondary: #b3d9ff;
  --text-muted: #7aa3cc;
  --accent-primary: #00d4ff;
  --accent-secondary: #0099cc;
  --border-color: #3d4852;
  --shadow: rgba(0, 212, 255, 0.2);
  --success: #00ff88;
  --warning: #ffaa00;
  --error: #ff4757;
  --input-bg: #1a1f26;
  --input-border: #3d4852;
  --input-focus: #00d4ff;
  --tab-active: #00d4ff;
  --tab-inactive: #3d4852;
}

/* Blue Theme - Dark Mode */
[data-theme="blue"][data-mode="dark"] {
  --bg-primary: #0f1419;
  --bg-secondary: #1e2328;
  --bg-tertiary: #2a2f36;
  --text-primary: #e6f1ff;
  --text-secondary: #b3d9ff;
  --text-muted: #7aa3cc;
  --accent-primary: #00d4ff;
  --accent-secondary: #0099cc;
  --border-color: #3d4852;
  --shadow: rgba(0, 212, 255, 0.2);
  --input-bg: #1a1f26;
  --input-border: #3d4852;
  --input-focus: #00d4ff;
}

/* Blue Theme - Light Mode */
[data-theme="blue"][data-mode="light"] {
  --bg-primary: #f0f8ff;
  --bg-secondary: #e6f3ff;
  --bg-tertiary: #d9edff;
  --text-primary: #0f1419;
  --text-secondary: #1e2328;
  --text-muted: #4a5568;
  --accent-primary: #0066cc;
  --accent-secondary: #004499;
  --border-color: #b3d9ff;
  --shadow: rgba(0, 102, 204, 0.1);
  --input-bg: #ffffff;
  --input-border: #b3d9ff;
  --input-focus: #0066cc;
}

/* Purple Theme - Dark Mode */
[data-theme="purple"][data-mode="dark"] {
  --bg-primary: #1a0d26;
  --bg-secondary: #2d1b3d;
  --bg-tertiary: #3d2952;
  --text-primary: #f0e6ff;
  --text-secondary: #d9b3ff;
  --text-muted: #b380d9;
  --accent-primary: #a855f7;
  --accent-secondary: #7c3aed;
  --border-color: #4c3366;
  --shadow: rgba(168, 85, 247, 0.2);
  --input-bg: #241233;
  --input-border: #4c3366;
  --input-focus: #a855f7;
}

/* Purple Theme - Light Mode */
[data-theme="purple"][data-mode="light"] {
  --bg-primary: #faf5ff;
  --bg-secondary: #f3e8ff;
  --bg-tertiary: #e9d5ff;
  --text-primary: #1a0d26;
  --text-secondary: #2d1b3d;
  --text-muted: #4c1d95;
  --accent-primary: #7c3aed;
  --accent-secondary: #5b21b6;
  --border-color: #c4b5fd;
  --shadow: rgba(124, 58, 237, 0.1);
  --input-bg: #ffffff;
  --input-border: #c4b5fd;
  --input-focus: #7c3aed;
}

/* Green Theme - Dark Mode */
[data-theme="green"][data-mode="dark"] {
  --bg-primary: #0d1f0d;
  --bg-secondary: #1a331a;
  --bg-tertiary: #264d26;
  --text-primary: #e6ffe6;
  --text-secondary: #b3ffb3;
  --text-muted: #80cc80;
  --accent-primary: #22c55e;
  --accent-secondary: #16a34a;
  --border-color: #336633;
  --shadow: rgba(34, 197, 94, 0.2);
  --input-bg: #1a2e1a;
  --input-border: #336633;
  --input-focus: #22c55e;
}

/* Green Theme - Light Mode */
[data-theme="green"][data-mode="light"] {
  --bg-primary: #f0fff4;
  --bg-secondary: #dcfce7;
  --bg-tertiary: #bbf7d0;
  --text-primary: #0d1f0d;
  --text-secondary: #1a331a;
  --text-muted: #166534;
  --accent-primary: #16a34a;
  --accent-secondary: #15803d;
  --border-color: #86efac;
  --shadow: rgba(22, 163, 74, 0.1);
  --input-bg: #ffffff;
  --input-border: #86efac;
  --input-focus: #16a34a;
}

/* Orange Theme - Dark Mode */
[data-theme="orange"][data-mode="dark"] {
  --bg-primary: #1f0f0a;
  --bg-secondary: #331a0f;
  --bg-tertiary: #4d2614;
  --text-primary: #ffe6d9;
  --text-secondary: #ffccb3;
  --text-muted: #cc9980;
  --accent-primary: #f97316;
  --accent-secondary: #ea580c;
  --border-color: #663319;
  --shadow: rgba(249, 115, 22, 0.2);
  --input-bg: #2e1a0f;
  --input-border: #663319;
  --input-focus: #f97316;
}

/* Orange Theme - Light Mode */
[data-theme="orange"][data-mode="light"] {
  --bg-primary: #fff7ed;
  --bg-secondary: #ffedd5;
  --bg-tertiary: #fed7aa;
  --text-primary: #1f0f0a;
  --text-secondary: #331a0f;
  --text-muted: #9a3412;
  --accent-primary: #ea580c;
  --accent-secondary: #c2410c;
  --border-color: #fdba74;
  --shadow: rgba(234, 88, 12, 0.1);
  --input-bg: #ffffff;
  --input-border: #fdba74;
  --input-focus: #ea580c;
}

/* Pink Theme - Dark Mode */
[data-theme="pink"][data-mode="dark"] {
  --bg-primary: #1f0a1a;
  --bg-secondary: #330f26;
  --bg-tertiary: #4d1433;
  --text-primary: #ffe6f0;
  --text-secondary: #ffb3d9;
  --text-muted: #cc80b3;
  --accent-primary: #ec4899;
  --accent-secondary: #db2777;
  --border-color: #661a40;
  --shadow: rgba(236, 72, 153, 0.2);
  --input-bg: #2e0f26;
  --input-border: #661a40;
  --input-focus: #ec4899;
}

/* Pink Theme - Light Mode */
[data-theme="pink"][data-mode="light"] {
  --bg-primary: #fdf2f8;
  --bg-secondary: #fce7f3;
  --bg-tertiary: #fbcfe8;
  --text-primary: #1f0a1a;
  --text-secondary: #330f26;
  --text-muted: #be185d;
  --accent-primary: #db2777;
  --accent-secondary: #be185d;
  --border-color: #f9a8d4;
  --shadow: rgba(219, 39, 119, 0.1);
  --input-bg: #ffffff;
  --input-border: #f9a8d4;
  --input-focus: #db2777;
}

/* Teal Theme - Dark Mode */
[data-theme="teal"][data-mode="dark"] {
  --bg-primary: #0a1f1a;
  --bg-secondary: #0f332b;
  --bg-tertiary: #144d3d;
  --text-primary: #e6fff5;
  --text-secondary: #b3ffe0;
  --text-muted: #80ccb3;
  --accent-primary: #14b8a6;
  --accent-secondary: #0d9488;
  --border-color: #1a6659;
  --shadow: rgba(20, 184, 166, 0.2);
  --input-bg: #0f2e26;
  --input-border: #1a6659;
  --input-focus: #14b8a6;
}

/* Teal Theme - Light Mode */
[data-theme="teal"][data-mode="light"] {
  --bg-primary: #f0fdfa;
  --bg-secondary: #ccfbf1;
  --bg-tertiary: #99f6e4;
  --text-primary: #0a1f1a;
  --text-secondary: #0f332b;
  --text-muted: #0f766e;
  --accent-primary: #0d9488;
  --accent-secondary: #0f766e;
  --border-color: #5eead4;
  --shadow: rgba(13, 148, 136, 0.1);
  --input-bg: #ffffff;
  --input-border: #5eead4;
  --input-focus: #0d9488;
}

/* Red Theme - Dark Mode */
[data-theme="red"][data-mode="dark"] {
  --bg-primary: #1f0a0a;
  --bg-secondary: #330f0f;
  --bg-tertiary: #4d1414;
  --text-primary: #ffe6e6;
  --text-secondary: #ffb3b3;
  --text-muted: #cc8080;
  --accent-primary: #ef4444;
  --accent-secondary: #dc2626;
  --border-color: #661a1a;
  --shadow: rgba(239, 68, 68, 0.2);
  --input-bg: #2e0f0f;
  --input-border: #661a1a;
  --input-focus: #ef4444;
}

/* Red Theme - Light Mode */
[data-theme="red"][data-mode="light"] {
  --bg-primary: #fef2f2;
  --bg-secondary: #fee2e2;
  --bg-tertiary: #fecaca;
  --text-primary: #1f0a0a;
  --text-secondary: #330f0f;
  --text-muted: #991b1b;
  --accent-primary: #dc2626;
  --accent-secondary: #b91c1c;
  --border-color: #fca5a5;
  --shadow: rgba(220, 38, 38, 0.1);
  --input-bg: #ffffff;
  --input-border: #fca5a5;
  --input-focus: #dc2626;
}

/* Indigo Theme - Dark Mode */
[data-theme="indigo"][data-mode="dark"] {
  --bg-primary: #0f0a1f;
  --bg-secondary: #1e0f33;
  --bg-tertiary: #2d144d;
  --text-primary: #e6e6ff;
  --text-secondary: #b3b3ff;
  --text-muted: #8080cc;
  --accent-primary: #6366f1;
  --accent-secondary: #4f46e5;
  --border-color: #331a66;
  --shadow: rgba(99, 102, 241, 0.2);
  --input-bg: #1a0f2e;
  --input-border: #331a66;
  --input-focus: #6366f1;
}

/* Indigo Theme - Light Mode */
[data-theme="indigo"][data-mode="light"] {
  --bg-primary: #f5f3ff;
  --bg-secondary: #ede9fe;
  --bg-tertiary: #ddd6fe;
  --text-primary: #0f0a1f;
  --text-secondary: #1e0f33;
  --text-muted: #3730a3;
  --accent-primary: #4f46e5;
  --accent-secondary: #3730a3;
  --border-color: #c4b5fd;
  --shadow: rgba(79, 70, 229, 0.1);
  --input-bg: #ffffff;
  --input-border: #c4b5fd;
  --input-focus: #4f46e5;
}

/* Common theme variables */
:root {
  --success: #10b981;
  --warning: #f59e0b;
  --error: #ef4444;
  --tab-active: var(--accent-primary);
  --tab-inactive: var(--border-color);
}