/* Theme System - 10 Color Schemes */

/* 1. Dark Gray (default) */
:root,
body[data-theme="dark-gray"] {
    --primary: #4a5568;
    --secondary: #2d3748;
    --bg: #1a202c;
    --card-bg: rgba(45, 55, 72, 0.75);
    --text: #e2e8f0;
    --text-light: #a0aec0;
    --border: rgba(255, 255, 255, 0.1);
    --shadow: 0 4px 6px rgba(0, 0, 0, 0.3);
}

/* 2. Ocean Blue */
body[data-theme="ocean-blue"] {
    --primary: #2563eb;
    --secondary: #1e40af;
    --bg: #0c1e3d;
    --card-bg: rgba(30, 58, 138, 0.75);
    --text: #dbeafe;
    --text-light: #93c5fd;
    --border: rgba(96, 165, 250, 0.2);
    --shadow: 0 4px 6px rgba(37, 99, 235, 0.3);
}

/* 3. Forest Green */
body[data-theme="forest-green"] {
    --primary: #059669;
    --secondary: #047857;
    --bg: #064e3b;
    --card-bg: rgba(6, 78, 59, 0.75);
    --text: #d1fae5;
    --text-light: #6ee7b7;
    --border: rgba(52, 211, 153, 0.2);
    --shadow: 0 4px 6px rgba(5, 150, 105, 0.3);
}

/* 4. Sunset Orange */
body[data-theme="sunset-orange"] {
    --primary: #ea580c;
    --secondary: #c2410c;
    --bg: #431407;
    --card-bg: rgba(124, 45, 18, 0.75);
    --text: #fed7aa;
    --text-light: #fdba74;
    --border: rgba(251, 146, 60, 0.2);
    --shadow: 0 4px 6px rgba(234, 88, 12, 0.3);
}

/* 5. Purple Night */
body[data-theme="purple-night"] {
    --primary: #7c3aed;
    --secondary: #6d28d9;
    --bg: #2e1065;
    --card-bg: rgba(88, 28, 135, 0.75);
    --text: #e9d5ff;
    --text-light: #c084fc;
    --border: rgba(168, 85, 247, 0.2);
    --shadow: 0 4px 6px rgba(124, 58, 237, 0.3);
}

/* 6. Midnight Black */
body[data-theme="midnight-black"] {
    --primary: #374151;
    --secondary: #1f2937;
    --bg: #030712;
    --card-bg: rgba(31, 41, 55, 0.85);
    --text: #f9fafb;
    --text-light: #9ca3af;
    --border: rgba(75, 85, 99, 0.3);
    --shadow: 0 4px 6px rgba(0, 0, 0, 0.5);
}

/* 7. Rose Pink */
body[data-theme="rose-pink"] {
    --primary: #e11d48;
    --secondary: #be123c;
    --bg: #4c0519;
    --card-bg: rgba(136, 19, 55, 0.75);
    --text: #fecdd3;
    --text-light: #fb7185;
    --border: rgba(251, 113, 133, 0.2);
    --shadow: 0 4px 6px rgba(225, 29, 72, 0.3);
}

/* 8. Cyber Cyan */
body[data-theme="cyber-cyan"] {
    --primary: #06b6d4;
    --secondary: #0891b2;
    --bg: #083344;
    --card-bg: rgba(14, 116, 144, 0.75);
    --text: #cffafe;
    --text-light: #67e8f9;
    --border: rgba(34, 211, 238, 0.2);
    --shadow: 0 4px 6px rgba(6, 182, 212, 0.3);
}

/* 9. Warm Brown */
body[data-theme="warm-brown"] {
    --primary: #92400e;
    --secondary: #78350f;
    --bg: #1c0a00;
    --card-bg: rgba(120, 53, 15, 0.75);
    --text: #fef3c7;
    --text-light: #fcd34d;
    --border: rgba(217, 119, 6, 0.2);
    --shadow: 0 4px 6px rgba(146, 64, 14, 0.3);
}

/* 10. Monochrome */
body[data-theme="monochrome"] {
    --primary: #525252;
    --secondary: #404040;
    --bg: #0a0a0a;
    --card-bg: rgba(64, 64, 64, 0.75);
    --text: #fafafa;
    --text-light: #a3a3a3;
    --border: rgba(115, 115, 115, 0.2);
    --shadow: 0 4px 6px rgba(0, 0, 0, 0.4);
}

/* Background gradients for each theme */
body[data-theme="dark-gray"] {
    background: linear-gradient(135deg, #1a202c 0%, #2d3748 100%);
}

body[data-theme="ocean-blue"] {
    background: linear-gradient(135deg, #0c1e3d 0%, #1e3a8a 100%);
}

body[data-theme="forest-green"] {
    background: linear-gradient(135deg, #064e3b 0%, #065f46 100%);
}

body[data-theme="sunset-orange"] {
    background: linear-gradient(135deg, #431407 0%, #7c2d12 100%);
}

body[data-theme="purple-night"] {
    background: linear-gradient(135deg, #2e1065 0%, #581c87 100%);
}

body[data-theme="midnight-black"] {
    background: linear-gradient(135deg, #030712 0%, #1f2937 100%);
}

body[data-theme="rose-pink"] {
    background: linear-gradient(135deg, #4c0519 0%, #881337 100%);
}

body[data-theme="cyber-cyan"] {
    background: linear-gradient(135deg, #083344 0%, #0e7490 100%);
}

body[data-theme="warm-brown"] {
    background: linear-gradient(135deg, #1c0a00 0%, #78350f 100%);
}

body[data-theme="monochrome"] {
    background: linear-gradient(135deg, #0a0a0a 0%, #404040 100%);
}