/* Harmony Control - Theme System */

/* Default Theme (Current - Purple/Pink Gradient) */
:root[data-theme="default"] {
    --primary-color: #6f42c1;
    --primary-dark: #5a32a3;
    --primary-light: #8b5fcf;
    --secondary-color: #e83e8c;
    --secondary-dark: #d91a72;
    --gradient-primary: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    --gradient-secondary: linear-gradient(135deg, #f093fb 0%, #f5576c 100%);
    --bg-gradient: linear-gradient(135deg, #667eea 0%, #764ba2 25%, #f093fb 50%, #4facfe 75%, #00f2fe 100%);
}

/* Dark Theme */
:root[data-theme="dark"] {
    --primary-color: #8b5cf6;
    --primary-dark: #7c3aed;
    --primary-light: #a78bfa;
    --secondary-color: #ec4899;
    --secondary-dark: #db2777;
    --gradient-primary: linear-gradient(135deg, #6366f1 0%, #8b5cf6 100%);
    --gradient-secondary: linear-gradient(135deg, #ec4899 0%, #f472b6 100%);
    --bg-gradient: linear-gradient(135deg, #1e1b4b 0%, #312e81 25%, #4c1d95 50%, #581c87 75%, #6b21a8 100%);
}

/* Ocean Theme */
:root[data-theme="ocean"] {
    --primary-color: #0ea5e9;
    --primary-dark: #0284c7;
    --primary-light: #38bdf8;
    --secondary-color: #06b6d4;
    --secondary-dark: #0891b2;
    --gradient-primary: linear-gradient(135deg, #0ea5e9 0%, #3b82f6 100%);
    --gradient-secondary: linear-gradient(135deg, #06b6d4 0%, #22d3ee 100%);
    --bg-gradient: linear-gradient(135deg, #0c4a6e 0%, #075985 25%, #0369a1 50%, #0284c7 75%, #0ea5e9 100%);
}

/* Forest Theme */
:root[data-theme="forest"] {
    --primary-color: #10b981;
    --primary-dark: #059669;
    --primary-light: #34d399;
    --secondary-color: #14b8a6;
    --secondary-dark: #0d9488;
    --gradient-primary: linear-gradient(135deg, #10b981 0%, #059669 100%);
    --gradient-secondary: linear-gradient(135deg, #14b8a6 0%, #2dd4bf 100%);
    --bg-gradient: linear-gradient(135deg, #064e3b 0%, #065f46 25%, #047857 50%, #059669 75%, #10b981 100%);
}

/* Sunset Theme */
:root[data-theme="sunset"] {
    --primary-color: #f59e0b;
    --primary-dark: #d97706;
    --primary-light: #fbbf24;
    --secondary-color: #ef4444;
    --secondary-dark: #dc2626;
    --gradient-primary: linear-gradient(135deg, #f59e0b 0%, #ef4444 100%);
    --gradient-secondary: linear-gradient(135deg, #f97316 0%, #fb923c 100%);
    --bg-gradient: linear-gradient(135deg, #7c2d12 0%, #9a3412 25%, #c2410c 50%, #ea580c 75%, #f97316 100%);
}

/* Royal Theme */
:root[data-theme="royal"] {
    --primary-color: #8b5cf6;
    --primary-dark: #7c3aed;
    --primary-light: #a78bfa;
    --secondary-color: #ec4899;
    --secondary-dark: #db2777;
    --gradient-primary: linear-gradient(135deg, #8b5cf6 0%, #6366f1 100%);
    --gradient-secondary: linear-gradient(135deg, #ec4899 0%, #a855f7 100%);
    --bg-gradient: linear-gradient(135deg, #4c1d95 0%, #5b21b6 25%, #6d28d9 50%, #7c3aed 75%, #8b5cf6 100%);
}

/* Minimal Light Theme */
:root[data-theme="minimal"] {
    --primary-color: #6366f1;
    --primary-dark: #4f46e5;
    --primary-light: #818cf8;
    --secondary-color: #8b5cf6;
    --secondary-dark: #7c3aed;
    --gradient-primary: linear-gradient(135deg, #6366f1 0%, #8b5cf6 100%);
    --gradient-secondary: linear-gradient(135deg, #8b5cf6 0%, #a78bfa 100%);
    --bg-gradient: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 25%, #e2e8f0 50%, #cbd5e1 75%, #94a3b8 100%);
}

/* Apply theme to body background */
body {
    background: var(--bg-gradient);
    background-size: 400% 400%;
    animation: gradientShift 15s ease infinite;
}