/* Ujjina Player Studio - Temas Profesionales */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap');

[data-theme="dark"] {
    --bg: #111114;
    --bg-secondary: #161619;
    --surface: #1c1c21;
    --surface-hover: #242429;
    --surface-raised: #222228;
    --border: #2e2e36;
    --border-accent: #3d3d4a;
    --text: #f0f0f4;
    --text-muted: #9d9db0;
    --text-secondary: #c0c0d0;
    --accent: #8b6fff;
    --accent-hover: #a48aff;
    --accent-soft: rgba(139, 111, 255, 0.1);
    --accent-glow: rgba(139, 111, 255, 0.18);
    --accent-gradient: linear-gradient(135deg, #8b6fff 0%, #5ca0ff 100%);
    --input-bg: #141417;
    --input-border: #35353f;
    --input-focus: #8b6fff;
    --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.5);
    --shadow: 0 4px 12px rgba(0, 0, 0, 0.35);
    --shadow-lg: 0 8px 32px rgba(0, 0, 0, 0.5);
    --shadow-glow: 0 0 20px rgba(139, 111, 255, 0.07);
    --header-bg: linear-gradient(180deg, rgba(17, 17, 20, 0.97) 0%, rgba(17, 17, 20, 0.92) 100%);
    --header-border: rgba(139, 111, 255, 0.12);
    --preview-bg: #0d0d10;
    --card-border-top: linear-gradient(90deg, #8b6fff, #5ca0ff);
    --primary: #8b6fff;
    --success: #34d399;
    --danger: #ff6b81;
    --warning: #ffc145;
    color-scheme: dark;
}

[data-theme="light"] {
    --bg: #edf0f8;
    --bg-secondary: #f4f6fc;
    --surface: #ffffff;
    --surface-hover: #f0f2fa;
    --surface-raised: #ffffff;
    --border: #d4d8e8;
    --border-accent: #c0c6e0;
    --text: #0f1729;
    --text-muted: #6b7194;
    --text-secondary: #484e72;
    --accent: #5a3fd6;
    --accent-hover: #4930b8;
    --accent-soft: rgba(90, 63, 214, 0.07);
    --accent-glow: rgba(90, 63, 214, 0.12);
    --accent-gradient: linear-gradient(135deg, #5a3fd6 0%, #3d7ce8 100%);
    --input-bg: #f2f4fb;
    --input-border: #c8cde0;
    --input-focus: #5a3fd6;
    --shadow-sm: 0 1px 3px rgba(0, 0, 30, 0.06);
    --shadow: 0 4px 12px rgba(0, 0, 30, 0.08);
    --shadow-lg: 0 8px 32px rgba(0, 0, 30, 0.1);
    --shadow-glow: 0 0 20px rgba(90, 63, 214, 0.05);
    --header-bg: linear-gradient(180deg, rgba(255, 255, 255, 0.97) 0%, rgba(255, 255, 255, 0.92) 100%);
    --header-border: rgba(90, 63, 214, 0.15);
    --preview-bg: #e0e3f0;
    --card-border-top: linear-gradient(90deg, #5a3fd6, #3d7ce8);
    --primary: #5a3fd6;
    --success: #10b981;
    --danger: #ef4444;
    --warning: #f59e0b;
    color-scheme: light;
}

body {
    background: var(--bg);
    color: var(--text);
}

/* Logo switching */
[data-theme="dark"] .logo-dark { display: inline-block !important; }
[data-theme="dark"] .logo-light { display: none !important; }
[data-theme="light"] .logo-dark { display: none !important; }
[data-theme="light"] .logo-light { display: inline-block !important; }

/* Theme toggle icon */
.theme-icon-dark { display: none; }
.theme-icon-light { display: none; }
[data-theme="dark"] .theme-icon-dark { display: inline; }
[data-theme="light"] .theme-icon-light { display: inline; }