/* ============================================
   THEME DEFINITIONS
   Modern, elegant color palettes with enhanced
   contrast and visual hierarchy
   ============================================ */

/* Default theme (light) */
:root {
    /* Primary color with RGB for gradients */
    --primary-color: #2563EB;
    --primary-hover: #1D4ED8;
    --primary-rgb: 37, 99, 235;

    /* Surface RGB for glassmorphism */
    --surface-rgb: 255, 255, 255;

    /* Sidebar - deep navy with subtle warmth */
    --sidebar-bg: #0F172A;
    --sidebar-hover: #1E293B;
    --sidebar-text: rgba(255, 255, 255, 0.7);
    --sidebar-text-hover: #FFFFFF;

    /* Backgrounds - clean with slight warmth */
    --background-color: #F1F5F9;
    --surface-color: #FFFFFF;
    --topbar-bg: rgba(255, 255, 255, 0.85);
    --topbar-border: #E2E8F0;
    --border-color: #B0BEC5;

    /* Text - balanced contrast */
    --text-dark: #1E293B;
    --text-light: #64748B;
    --text-primary: #0F172A;

    /* Semantic colors - vibrant but professional */
    --success-color: #10B981;
    --error-color: #EF4444;
    --warning-color: #F59E0B;
    --info-color: #3B82F6;

    /* Alert colors - subtle backgrounds */
    --alert-success-bg: #ECFDF5;
    --alert-success-text: #047857;
    --alert-success-border: #6EE7B7;

    --alert-error-bg: #FEF2F2;
    --alert-error-text: #B91C1C;
    --alert-error-border: #FECACA;

    --alert-info-bg: #EFF6FF;
    --alert-info-text: #1D4ED8;
    --alert-info-border: #BFDBFE;

    /* UI states */
    --disabled-bg: #F1F5F9;
    --hover-bg: #F8FAFC;

    /* Links */
    --link-color: #2563EB;
    --link-hover: #1D4ED8;

    /* Form controls */
    --focus-ring-color: rgba(37, 99, 235, 0.2);
    --input-bg: #FFFFFF;
    --input-border: #CBD5E1;

    /* Table specific */
    --table-header-bg: #F8FAFC;
    --table-row-hover: #F1F5F9;

    /* Additional UI elements */
    --badge-bg: #E2E8F0;
    --code-bg: #F1F5F9;
    --divider-color: #E2E8F0;

    /* Modal */
    --modal-backdrop: rgba(15, 23, 42, 0.6);
}


/* Dark Theme - Modern dark with deep blues */
[data-theme="Dark"] {
    --primary-color: #3B82F6;
    --primary-hover: #2563EB;
    --primary-rgb: 59, 130, 246;
    --surface-rgb: 15, 23, 42;

    --sidebar-bg: #0F172A;
    --sidebar-hover: #1E293B;
    --sidebar-text: rgba(255, 255, 255, 0.6);
    --sidebar-text-hover: #FFFFFF;

    --background-color: #020617;
    --surface-color: #0F172A;
    --topbar-bg: rgba(15, 23, 42, 0.85);
    --topbar-border: #1E293B;
    --border-color: #1E293B;

    --text-dark: #E2E8F0;
    --text-light: #94A3B8;
    --text-primary: #F8FAFC;

    /* Theme-specific shadows */
    --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.4);
    --shadow-md: 0 4px 6px rgba(0, 0, 0, 0.4);
    --shadow-lg: 0 10px 15px rgba(0, 0, 0, 0.5);

    --success-color: #34D399;
    --error-color: #F87171;
    --warning-color: #FBBF24;
    --info-color: #60A5FA;

    --alert-success-bg: #064E3B;
    --alert-success-text: #6EE7B7;
    --alert-success-border: #059669;

    --alert-error-bg: #7F1D1D;
    --alert-error-text: #FCA5A5;
    --alert-error-border: #DC2626;

    --alert-info-bg: #1E3A8A;
    --alert-info-text: #93C5FD;
    --alert-info-border: #3B82F6;

    --disabled-bg: rgba(255, 255, 255, 0.05);
    --hover-bg: rgba(255, 255, 255, 0.04);

    --link-color: #60A5FA;
    --link-hover: #3B82F6;

    --focus-ring-color: rgba(59, 130, 246, 0.3);
    --input-bg: #1E293B;
    --input-border: #334155;

    --table-header-bg: rgba(255, 255, 255, 0.04);
    --table-row-hover: rgba(255, 255, 255, 0.04);

    --badge-bg: #334155;
    --code-bg: #020617;
    --divider-color: #1E293B;

    --modal-backdrop: rgba(0, 0, 0, 0.8);
}


/* Midnight Blue Theme - Refined navy dark theme inspired by Linear/Vercel */
[data-theme="Midnight-Blue"] {
    --primary-color: #6366F1;
    --primary-hover: #4F46E5;
    --primary-rgb: 99, 102, 241;
    --surface-rgb: 15, 23, 42;

    /* Sidebar - rich navy */
    --sidebar-bg: #0C1222;
    --sidebar-hover: #162032;
    --sidebar-text: rgba(148, 163, 184, 0.9);
    --sidebar-text-hover: #FFFFFF;

    /* Backgrounds - layered navy tones */
    --background-color: #0F172A;
    --surface-color: #1E293B;
    --topbar-bg: rgba(30, 41, 59, 0.8);
    --topbar-border: rgba(99, 102, 241, 0.1);
    --border-color: rgba(148, 163, 184, 0.1);

    /* Text - crisp whites and soft grays */
    --text-dark: #E2E8F0;
    --text-light: #94A3B8;
    --text-primary: #F8FAFC;

    /* Refined shadows for depth */
    --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.3), 0 1px 2px rgba(0, 0, 0, 0.2);
    --shadow-md: 0 4px 6px rgba(0, 0, 0, 0.3), 0 2px 4px rgba(0, 0, 0, 0.2);
    --shadow-lg: 0 10px 15px rgba(0, 0, 0, 0.4), 0 4px 6px rgba(0, 0, 0, 0.2);

    /* Semantic colors - vibrant on dark */
    --success-color: #10B981;
    --error-color: #F43F5E;
    --warning-color: #F59E0B;
    --info-color: #38BDF8;

    /* Alert backgrounds with subtle transparency */
    --alert-success-bg: rgba(16, 185, 129, 0.15);
    --alert-success-text: #34D399;
    --alert-success-border: rgba(16, 185, 129, 0.3);

    --alert-error-bg: rgba(244, 63, 94, 0.15);
    --alert-error-text: #FB7185;
    --alert-error-border: rgba(244, 63, 94, 0.3);

    --alert-info-bg: rgba(56, 189, 248, 0.15);
    --alert-info-text: #7DD3FC;
    --alert-info-border: rgba(56, 189, 248, 0.3);

    /* UI states */
    --disabled-bg: rgba(148, 163, 184, 0.08);
    --hover-bg: rgba(99, 102, 241, 0.08);

    /* Links - indigo accent */
    --link-color: #818CF8;
    --link-hover: #6366F1;

    /* Form controls */
    --focus-ring-color: rgba(99, 102, 241, 0.4);
    --input-bg: #0F172A;
    --input-border: rgba(148, 163, 184, 0.2);

    /* Tables */
    --table-header-bg: rgba(15, 23, 42, 0.6);
    --table-row-hover: rgba(99, 102, 241, 0.08);

    /* Additional elements */
    --badge-bg: rgba(99, 102, 241, 0.2);
    --code-bg: #0C1222;
    --divider-color: rgba(148, 163, 184, 0.1);

    /* Modal with blur */
    --modal-backdrop: rgba(12, 18, 34, 0.85);
}


/* Blue Theme - Professional corporate blue */
[data-theme="Blue"] {
    --primary-color: #0369A1;
    --primary-hover: #075985;
    --primary-rgb: 3, 105, 161;

    --sidebar-bg: #082F49;
    --sidebar-hover: #0C4A6E;
    --sidebar-text: rgba(255, 255, 255, 0.7);
    --sidebar-text-hover: #FFFFFF;

    --background-color: #F0F9FF;
    --surface-color: #FFFFFF;
    --topbar-bg: rgba(255, 255, 255, 0.9);
    --topbar-border: #E0F2FE;
    --border-color: #E0F2FE;

    --text-dark: #0C4A6E;
    --text-light: #64748B;
    --text-primary: #082F49;

    --success-color: #059669;
    --error-color: #DC2626;
    --warning-color: #D97706;
    --info-color: #0284C7;

    --alert-success-bg: #ECFDF5;
    --alert-success-text: #047857;
    --alert-success-border: #34D399;

    --alert-error-bg: #FEF2F2;
    --alert-error-text: #991B1B;
    --alert-error-border: #F87171;

    --alert-info-bg: #E0F2FE;
    --alert-info-text: #075985;
    --alert-info-border: #38BDF8;

    --disabled-bg: #E0F2FE;
    --hover-bg: #F0F9FF;

    --link-color: #0284C7;
    --link-hover: #0369A1;

    --focus-ring-color: rgba(3, 105, 161, 0.25);
    --input-bg: #FFFFFF;
    --input-border: #7DD3FC;

    --table-header-bg: #E0F2FE;
    --table-row-hover: #F0F9FF;

    --badge-bg: #BAE6FD;
    --code-bg: #E0F2FE;
    --divider-color: #BAE6FD;

    --modal-backdrop: rgba(8, 47, 73, 0.5);
}


/* Restaurant Theme - Warm hospitality palette */
[data-theme="Restaurant"] {
    --primary-color: #C2410C;
    --primary-hover: #9A3412;
    --primary-rgb: 194, 65, 12;

    --sidebar-bg: #431407;
    --sidebar-hover: #7C2D12;
    --sidebar-text: rgba(255, 255, 255, 0.75);
    --sidebar-text-hover: #FFFFFF;

    --background-color: #FFFBEB;
    --surface-color: #FFFFFF;
    --topbar-bg: rgba(255, 255, 255, 0.92);
    --topbar-border: #FDE68A;
    --border-color: #FDE68A;

    --text-dark: #451A03;
    --text-light: #92400E;
    --text-primary: #292524;

    --success-color: #65A30D;
    --error-color: #DC2626;
    --warning-color: #D97706;
    --info-color: #0284C7;

    --alert-success-bg: #F7FEE7;
    --alert-success-text: #365314;
    --alert-success-border: #84CC16;

    --alert-error-bg: #FEF2F2;
    --alert-error-text: #7F1D1D;
    --alert-error-border: #F87171;

    --alert-info-bg: #FEF3C7;
    --alert-info-text: #78350F;
    --alert-info-border: #FBBF24;

    --disabled-bg: #FEF3C7;
    --hover-bg: #FFFBEB;

    --link-color: #C2410C;
    --link-hover: #9A3412;

    --focus-ring-color: rgba(194, 65, 12, 0.25);
    --input-bg: #FFFFFF;
    --input-border: #FCD34D;

    --table-header-bg: #FEF3C7;
    --table-row-hover: #FFFBEB;

    --badge-bg: #FDE68A;
    --code-bg: #FEF3C7;
    --divider-color: #FDE68A;

    --modal-backdrop: rgba(67, 20, 7, 0.5);
}


/* High Contrast Theme - Maximum accessibility */
[data-theme="High-Contrast"] {
    --primary-color: #0000EE;
    --primary-hover: #0000CC;
    --primary-rgb: 0, 0, 238;

    --sidebar-bg: #000000;
    --sidebar-hover: #1A1A1A;
    --sidebar-text: #FFFFFF;
    --sidebar-text-hover: #FFFFFF;

    --background-color: #FFFFFF;
    --surface-color: #FFFFFF;
    --topbar-bg: #FFFFFF;
    --topbar-border: #000000;
    --border-color: #000000;

    --text-dark: #000000;
    --text-light: #1A1A1A;
    --text-primary: #000000;

    --success-color: #006400;
    --error-color: #CC0000;
    --warning-color: #CC6600;
    --info-color: #0000CC;

    --alert-success-bg: #CCFFCC;
    --alert-success-text: #003300;
    --alert-success-border: #006400;

    --alert-error-bg: #FFCCCC;
    --alert-error-text: #660000;
    --alert-error-border: #CC0000;

    --alert-info-bg: #CCCCFF;
    --alert-info-text: #000066;
    --alert-info-border: #0000CC;

    --disabled-bg: #E6E6E6;
    --hover-bg: #F0F0F0;

    --link-color: #0000EE;
    --link-hover: #0000CC;

    --focus-ring-color: rgba(0, 0, 238, 0.4);
    --input-bg: #FFFFFF;
    --input-border: #000000;

    --table-header-bg: #E6E6E6;
    --table-row-hover: #F0F0F0;

    --badge-bg: #CCCCCC;
    --code-bg: #E6E6E6;
    --divider-color: #000000;

    --modal-backdrop: rgba(0, 0, 0, 0.9);
}


/* VS Code Dark Theme */
[data-theme="VS-Code-Dark"] {
    --primary-color: #007ACC;
    --primary-hover: #005A9E;
    --primary-rgb: 0, 122, 204;

    --sidebar-bg: #1E1E1E;
    --sidebar-hover: #2D2D2D;
    --sidebar-text: rgba(255, 255, 255, 0.6);
    --sidebar-text-hover: #FFFFFF;

    --background-color: #1E1E1E;
    --surface-color: #252526;
    --topbar-bg: rgba(37, 37, 38, 0.9);
    --topbar-border: #3E3E42;
    --border-color: #3E3E42;

    --text-dark: #CCCCCC;
    --text-light: #858585;
    --text-primary: #FFFFFF;

    --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.5);
    --shadow-md: 0 4px 6px rgba(0, 0, 0, 0.5);
    --shadow-lg: 0 10px 15px rgba(0, 0, 0, 0.6);

    --success-color: #4EC9B0;
    --error-color: #F14C4C;
    --warning-color: #CCA700;
    --info-color: #3794FF;

    --alert-success-bg: #0E3A2E;
    --alert-success-text: #4EC9B0;
    --alert-success-border: #4EC9B0;

    --alert-error-bg: #4B1F1F;
    --alert-error-text: #F14C4C;
    --alert-error-border: #F14C4C;

    --alert-info-bg: #1E3A5F;
    --alert-info-text: #3794FF;
    --alert-info-border: #3794FF;

    --disabled-bg: rgba(255, 255, 255, 0.04);
    --hover-bg: rgba(255, 255, 255, 0.05);

    --link-color: #3794FF;
    --link-hover: #007ACC;

    --focus-ring-color: rgba(0, 122, 204, 0.4);
    --input-bg: #3C3C3C;
    --input-border: #3E3E42;

    --table-header-bg: #1E1E1E;
    --table-row-hover: rgba(255, 255, 255, 0.04);

    --badge-bg: #3C3C3C;
    --code-bg: #1E1E1E;
    --divider-color: #3E3E42;

    --modal-backdrop: rgba(0, 0, 0, 0.75);
}


/* GitHub Dark Theme */
[data-theme="GitHub-Dark"] {
    --primary-color: #58A6FF;
    --primary-hover: #388BFD;
    --primary-rgb: 88, 166, 255;

    --sidebar-bg: #161B22;
    --sidebar-hover: #21262D;
    --sidebar-text: rgba(255, 255, 255, 0.6);
    --sidebar-text-hover: #FFFFFF;

    --background-color: #0D1117;
    --surface-color: #161B22;
    --topbar-bg: rgba(22, 27, 34, 0.9);
    --topbar-border: #30363D;
    --border-color: #30363D;

    --text-dark: #C9D1D9;
    --text-light: #8B949E;
    --text-primary: #F0F6FC;

    --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.4);
    --shadow-md: 0 4px 6px rgba(0, 0, 0, 0.4);
    --shadow-lg: 0 10px 15px rgba(0, 0, 0, 0.5);

    --success-color: #3FB950;
    --error-color: #F85149;
    --warning-color: #D29922;
    --info-color: #58A6FF;

    --alert-success-bg: #0D2D1F;
    --alert-success-text: #3FB950;
    --alert-success-border: #238636;

    --alert-error-bg: #3D1F1F;
    --alert-error-text: #F85149;
    --alert-error-border: #DA3633;

    --alert-info-bg: #0D2E4E;
    --alert-info-text: #58A6FF;
    --alert-info-border: #1F6FEB;

    --disabled-bg: rgba(110, 118, 129, 0.1);
    --hover-bg: rgba(177, 186, 196, 0.06);

    --link-color: #58A6FF;
    --link-hover: #388BFD;

    --focus-ring-color: rgba(88, 166, 255, 0.35);
    --input-bg: #0D1117;
    --input-border: #30363D;

    --table-header-bg: #010409;
    --table-row-hover: rgba(177, 186, 196, 0.06);

    --badge-bg: #21262D;
    --code-bg: #0D1117;
    --divider-color: #21262D;

    --modal-backdrop: rgba(1, 4, 9, 0.8);
}


/* Spotify Theme - Premium dark with signature green */
[data-theme="Spotify-Dark"] {
    --primary-color: #1DB954;
    --primary-hover: #1ED760;
    --primary-rgb: 29, 185, 84;

    --sidebar-bg: #000000;
    --sidebar-hover: #1A1A1A;
    --sidebar-text: rgba(255, 255, 255, 0.6);
    --sidebar-text-hover: #FFFFFF;

    --background-color: #121212;
    --surface-color: #181818;
    --topbar-bg: rgba(24, 24, 24, 0.92);
    --topbar-border: #282828;
    --border-color: #282828;

    --text-dark: #FFFFFF;
    --text-light: #B3B3B3;
    --text-primary: #FFFFFF;

    --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.7);
    --shadow-md: 0 4px 6px rgba(0, 0, 0, 0.7);
    --shadow-lg: 0 10px 15px rgba(0, 0, 0, 0.8);

    --success-color: #1DB954;
    --error-color: #E91429;
    --warning-color: #FFA42B;
    --info-color: #1E90FF;

    --alert-success-bg: #0D4A2A;
    --alert-success-text: #1ED760;
    --alert-success-border: #1DB954;

    --alert-error-bg: #3D1F1F;
    --alert-error-text: #E91429;
    --alert-error-border: #E91429;

    --alert-info-bg: #1A3A4A;
    --alert-info-text: #1E90FF;
    --alert-info-border: #1E90FF;

    --disabled-bg: rgba(255, 255, 255, 0.06);
    --hover-bg: rgba(255, 255, 255, 0.08);

    --link-color: #1ED760;
    --link-hover: #1DB954;

    --focus-ring-color: rgba(29, 185, 84, 0.4);
    --input-bg: #242424;
    --input-border: #333333;

    --table-header-bg: #1A1A1A;
    --table-row-hover: rgba(29, 185, 84, 0.08);

    --badge-bg: #1DB954;
    --code-bg: #0A0A0A;
    --divider-color: #282828;

    --modal-backdrop: rgba(0, 0, 0, 0.85);
}


/* Oracle Theme - Corporate red accent */
[data-theme="Oracle"] {
    --primary-color: #C74634;
    --primary-hover: #A73A2B;
    --primary-rgb: 199, 70, 52;

    --sidebar-bg: #312D2A;
    --sidebar-hover: #403B37;
    --sidebar-text: rgba(255, 255, 255, 0.75);
    --sidebar-text-hover: #FFFFFF;

    --background-color: #F5F5F5;
    --surface-color: #FFFFFF;
    --topbar-bg: rgba(255, 255, 255, 0.92);
    --topbar-border: #E0E0E0;
    --border-color: #E0E0E0;

    --text-dark: #312D2A;
    --text-light: #666666;
    --text-primary: #161513;

    --success-color: #00A652;
    --error-color: #C74634;
    --warning-color: #FF9E18;
    --info-color: #0572CE;

    --alert-success-bg: #E8F5E9;
    --alert-success-text: #00A652;
    --alert-success-border: #00A652;

    --alert-error-bg: #FFEBEE;
    --alert-error-text: #A73A2B;
    --alert-error-border: #C74634;

    --alert-info-bg: #E3F2FD;
    --alert-info-text: #0572CE;
    --alert-info-border: #0572CE;

    --disabled-bg: #F5F5F5;
    --hover-bg: #FAFAFA;

    --link-color: #0572CE;
    --link-hover: #035DAF;

    --focus-ring-color: rgba(199, 70, 52, 0.25);
    --input-bg: #FFFFFF;
    --input-border: #CCCCCC;

    --table-header-bg: #F5F3F0;
    --table-row-hover: #FAF9F8;

    --badge-bg: #C74634;
    --code-bg: #F5F3F0;
    --divider-color: #E0E0E0;

    --modal-backdrop: rgba(49, 45, 42, 0.6);
}


/* Discord Theme - Distinctive blurple */
[data-theme="Discord-Dark"] {
    --primary-color: #5865F2;
    --primary-hover: #4752C4;
    --primary-rgb: 88, 101, 242;

    --sidebar-bg: #1E1F22;
    --sidebar-hover: #2B2D31;
    --sidebar-text: rgba(255, 255, 255, 0.6);
    --sidebar-text-hover: #FFFFFF;

    --background-color: #313338;
    --surface-color: #2B2D31;
    --topbar-bg: rgba(43, 45, 49, 0.92);
    --topbar-border: #1E1F22;
    --border-color: #3F4147;

    --text-dark: #F2F3F5;
    --text-light: #B5BAC1;
    --text-primary: #FFFFFF;

    --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.4);
    --shadow-md: 0 4px 6px rgba(0, 0, 0, 0.4);
    --shadow-lg: 0 10px 15px rgba(0, 0, 0, 0.5);

    --success-color: #23A559;
    --error-color: #F23F43;
    --warning-color: #F0B232;
    --info-color: #5865F2;

    --alert-success-bg: #1E4037;
    --alert-success-text: #23A559;
    --alert-success-border: #23A559;

    --alert-error-bg: #4B1F1F;
    --alert-error-text: #F23F43;
    --alert-error-border: #F23F43;

    --alert-info-bg: #2D3159;
    --alert-info-text: #5865F2;
    --alert-info-border: #5865F2;

    --disabled-bg: rgba(79, 84, 92, 0.3);
    --hover-bg: rgba(79, 84, 92, 0.16);

    --link-color: #00A8FC;
    --link-hover: #5865F2;

    --focus-ring-color: rgba(88, 101, 242, 0.4);
    --input-bg: #1E1F22;
    --input-border: #3F4147;

    --table-header-bg: #1E1F22;
    --table-row-hover: rgba(79, 84, 92, 0.16);

    --badge-bg: #5865F2;
    --code-bg: #1E1F22;
    --divider-color: #3F4147;

    --modal-backdrop: rgba(0, 0, 0, 0.85);
}




