/* ============================================
   THEMES.CSS - Centralized Theme Management
   All color variables and theme definitions
   ============================================ */

/* ============================================
   DEFAULT THEME (Applied when no theme set)
   Modern Indigo-Purple Dark Theme
   ============================================ */
:root,
:root[data-theme="default"] {
    /* Primary backgrounds - Deep blue-gray palette */
    --bg-body: #0c1222;
    --bg-primary: #0c1222;
    --bg-secondary: #161f33;
    --bg-tertiary: #253352;
    --bg-card: rgba(12, 18, 34, 0.97);
    --bg-card-hover: rgba(22, 31, 51, 0.97);
    --bg-input: rgba(22, 31, 51, 0.7);
    --bg-input-focus: rgba(37, 51, 82, 0.85);
    
    /* Sidebar - Matching deep tones */
    --sidebar-bg: #0c1222;
    --sidebar-border: #1e2d4d;
    --sidebar-item-bg: transparent;
    --sidebar-item-hover: rgba(129, 140, 248, 0.12);
    --sidebar-item-active: rgba(129, 140, 248, 0.22);
    
    /* Navbar - Gradient with purple accent */
    --navbar-bg: linear-gradient(135deg, #0c1222 0%, #1e1b4b 50%, #0c1222 100%);
    --navbar-border: rgba(129, 140, 248, 0.35);
    --navbar-text: #e2e8f0;
    
    /* Text colors - High contrast for readability */
    --text-primary: #f8fafc;
    --text-secondary: #a1b0c9;
    --text-muted: #6b7c99;
    --text-heading: #f8fafc;
    --text-link: #a5b4fc;
    --text-link-hover: #c7d2fe;
    
    /* Accent colors - Vibrant indigo-purple */
    --accent-primary: #818cf8;
    --accent-primary-hover: #a5b4fc;
    --accent-primary-rgb: 129, 140, 248;
    --accent-secondary: #a78bfa;
    --accent-gradient: linear-gradient(135deg, #818cf8 0%, #a78bfa 100%);
    
    /* Borders - Subtle but visible */
    --border-color: #253352;
    --border-color-light: #3a4d73;
    --border-color-focus: #818cf8;
    
    /* Status colors - Vibrant and clear */
    --success-color: #22c55e;
    --success-color-rgb: 34, 197, 94;
    --success-bg: rgba(34, 197, 94, 0.15);
    --success-text: #86efac;
    --error-color: #f43f5e;
    --error-color-rgb: 244, 63, 94;
    --error-bg: rgba(244, 63, 94, 0.15);
    --error-text: #fda4af;
    --warning-color: #fbbf24;
    --warning-color-rgb: 251, 191, 36;
    --warning-bg: rgba(251, 191, 36, 0.15);
    --warning-text: #fde68a;
    --info-color: #38bdf8;
    --info-color-rgb: 56, 189, 248;
    --info-bg: rgba(56, 189, 248, 0.15);
    --info-text: #7dd3fc;
    --danger-color: #fb7185;
    --danger-color-light: #fda4af;
    
    /* Buttons - Rich and inviting */
    --btn-primary-bg: #4f46e5;
    --btn-primary-border: #6366f1;
    --btn-primary-text: #ffffff;
    --btn-primary-hover-bg: #6366f1;
    --btn-primary-hover-border: #818cf8;
    --btn-secondary-bg: rgba(59, 77, 115, 0.6);
    --btn-secondary-border: #3a4d73;
    --btn-secondary-text: #d1d5db;
    
    /* Shadows - Soft and modern */
    --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.35);
    --shadow-md: 0 4px 8px rgba(0, 0, 0, 0.35);
    --shadow-lg: 0 12px 24px rgba(0, 0, 0, 0.45);
    --shadow-accent: 0 4px 20px rgba(129, 140, 248, 0.35);
    
    /* Table */
    --table-header-bg: #161f33;
    --table-row-hover: rgba(129, 140, 248, 0.1);
    --table-border: #253352;
    
    /* Timetable specific */
    --timetable-cell-bg: #161f33;
    --timetable-cell-hover: #253352;
    --timetable-header-bg: #0c1222;
    --timetable-border: #253352;
    --timetable-lesson-bg: rgba(129, 140, 248, 0.22);
    
    /* Modal */
    --modal-bg: #161f33;
    --modal-header-bg: #0c1222;
    --modal-border: #253352;
    --modal-backdrop: rgba(0, 0, 0, 0.75);
    
    /* Scrollbar */
    --scrollbar-track: rgba(22, 31, 51, 0.4);
    --scrollbar-thumb: rgba(129, 140, 248, 0.5);
    --scrollbar-thumb-hover: rgba(129, 140, 248, 0.75);
    
    /* Cards */
    --card-bg: rgba(12, 18, 34, 0.97);
    --card-border: #253352;
    --card-header-bg: rgba(22, 31, 51, 0.6);
    
    /* Quick access cards */
    --quick-card-bg: rgba(22, 31, 51, 0.7);
    --quick-card-hover: rgba(37, 51, 82, 0.85);
    --quick-card-border: #3a4d73;
    
    /* Avatar */
    --avatar-bg: rgba(129, 140, 248, 0.2);
    --avatar-border: rgba(167, 139, 250, 0.5);
    
    /* Dropdown */
    --dropdown-bg: #161f33;
    --dropdown-border: #253352;
    --dropdown-item-hover: rgba(129, 140, 248, 0.12);
    
    /* Progress */
    --progress-bg: #161f33;
    --progress-fill: linear-gradient(90deg, #818cf8 0%, #a78bfa 100%);
    
    /* Tags/Badges */
    --badge-primary-bg: rgba(129, 140, 248, 0.22);
    --badge-primary-text: #c7d2fe;
    --badge-success-bg: rgba(34, 197, 94, 0.22);
    --badge-success-text: #86efac;
}

/* ============================================
   GOLD TEAL THEME
   ============================================ */
:root[data-theme="gold-teal"] {
    --bg-body: #0d3b3b;
    --bg-primary: #0d3b3b;
    --bg-secondary: #145454;
    --bg-tertiary: #1a6b6b;
    --bg-card: rgba(13, 59, 59, 0.95);
    --bg-card-hover: rgba(20, 84, 84, 0.95);
    --bg-input: rgba(20, 84, 84, 0.6);
    --bg-input-focus: rgba(20, 84, 84, 0.8);
    
    --sidebar-bg: #0d3b3b;
    --sidebar-border: #145454;
    --sidebar-item-bg: transparent;
    --sidebar-item-hover: rgba(212, 175, 55, 0.1);
    --sidebar-item-active: rgba(212, 175, 55, 0.2);
    
    --navbar-bg: linear-gradient(135deg, #0d3b3b 0%, #145454 50%, #0d3b3b 100%);
    --navbar-border: rgba(212, 175, 55, 0.3);
    --navbar-text: #e8f0f0;
    
    --text-primary: #e8f0f0;
    --text-secondary: #a0c4c4;
    --text-muted: #6b9999;
    --text-heading: #D4AF37;
    --text-link: #D4AF37;
    --text-link-hover: #E5C75F;
    
    --accent-primary: #D4AF37;
    --accent-primary-hover: #E5C75F;
    --accent-primary-rgb: 212, 175, 55;
    --accent-secondary: #20B2AA;
    --accent-gradient: linear-gradient(135deg, #D4AF37 0%, #20B2AA 100%);
    
    --border-color: #1a6b6b;
    --border-color-light: #238787;
    --border-color-focus: #D4AF37;
    
    --success-color: #20B2AA;
    --success-color-rgb: 32, 178, 170;
    --success-bg: rgba(32, 178, 170, 0.15);
    --success-text: #7DD8D3;
    --error-color: #dc3545;
    --error-color-rgb: 220, 53, 69;
    --error-bg: rgba(220, 53, 69, 0.15);
    --error-text: #f5a5ae;
    --warning-color: #D4AF37;
    --warning-color-rgb: 212, 175, 55;
    --warning-bg: rgba(212, 175, 55, 0.15);
    --warning-text: #E5C75F;
    --info-color: #20B2AA;
    --info-color-rgb: 32, 178, 170;
    --info-bg: rgba(32, 178, 170, 0.15);
    --info-text: #7DD8D3;
    
    --btn-primary-bg: #B8941F;
    --btn-primary-border: #D4AF37;
    --btn-primary-text: #0d3b3b;
    --btn-primary-hover-bg: #D4AF37;
    --btn-primary-hover-border: #E5C75F;
    --btn-secondary-bg: rgba(26, 107, 107, 0.6);
    --btn-secondary-border: #238787;
    --btn-secondary-text: #a0c4c4;
    
    --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.3);
    --shadow-md: 0 4px 6px rgba(0, 0, 0, 0.3);
    --shadow-lg: 0 10px 15px rgba(0, 0, 0, 0.4);
    --shadow-accent: 0 4px 15px rgba(212, 175, 55, 0.3);
    
    --table-header-bg: #145454;
    --table-row-hover: rgba(212, 175, 55, 0.1);
    --table-border: #1a6b6b;
    
    --timetable-cell-bg: #145454;
    --timetable-cell-hover: #1a6b6b;
    --timetable-header-bg: #0d3b3b;
    --timetable-border: #1a6b6b;
    --timetable-lesson-bg: rgba(212, 175, 55, 0.2);
    
    --modal-bg: #145454;
    --modal-header-bg: #0d3b3b;
    --modal-border: #1a6b6b;
    --modal-backdrop: rgba(0, 0, 0, 0.7);
    
    --scrollbar-track: rgba(20, 84, 84, 0.3);
    --scrollbar-thumb: rgba(212, 175, 55, 0.5);
    --scrollbar-thumb-hover: rgba(212, 175, 55, 0.7);
    
    --card-bg: rgba(13, 59, 59, 0.95);
    --card-border: #1a6b6b;
    --card-header-bg: rgba(20, 84, 84, 0.5);
    
    --quick-card-bg: rgba(20, 84, 84, 0.6);
    --quick-card-hover: rgba(20, 84, 84, 0.8);
    --quick-card-border: #238787;
    
    --avatar-bg: rgba(212, 175, 55, 0.2);
    --avatar-border: rgba(212, 175, 55, 0.5);
    
    --dropdown-bg: #145454;
    --dropdown-border: #1a6b6b;
    --dropdown-item-hover: rgba(212, 175, 55, 0.1);
    
    --progress-bg: #145454;
    --progress-fill: linear-gradient(90deg, #D4AF37 0%, #20B2AA 100%);
    
    --badge-primary-bg: rgba(212, 175, 55, 0.2);
    --badge-primary-text: #E5C75F;
    --badge-success-bg: rgba(32, 178, 170, 0.2);
    --badge-success-text: #7DD8D3;
}

/* ============================================
   WHITE OCEAN THEME
   ============================================ */
:root[data-theme="white-ocean"] {
    --bg-body: #f0f9ff;
    --bg-primary: #f0f9ff;
    --bg-secondary: #e0f2fe;
    --bg-tertiary: #bae6fd;
    --bg-card: rgba(255, 255, 255, 0.95);
    --bg-card-hover: rgba(240, 249, 255, 0.95);
    --bg-input: rgba(255, 255, 255, 0.8);
    --bg-input-focus: rgba(255, 255, 255, 1);
    
    --sidebar-bg: #ffffff;
    --sidebar-border: #bae6fd;
    --sidebar-item-bg: transparent;
    --sidebar-item-hover: rgba(14, 116, 144, 0.1);
    --sidebar-item-active: rgba(14, 116, 144, 0.2);
    
    --navbar-bg: linear-gradient(135deg, #0e7490 0%, #0891b2 50%, #0e7490 100%);
    --navbar-border: rgba(14, 116, 144, 0.3);
    --navbar-text: #ffffff;
    
    --text-primary: #0c4a6e;
    --text-secondary: #0369a1;
    --text-muted: #0284c7;
    --text-heading: #0e7490;
    --text-link: #0891b2;
    --text-link-hover: #06b6d4;
    
    --accent-primary: #0891b2;
    --accent-primary-hover: #06b6d4;
    --accent-primary-rgb: 8, 145, 178;
    --accent-secondary: #0ea5e9;
    --accent-gradient: linear-gradient(135deg, #0891b2 0%, #0ea5e9 100%);
    
    --border-color: #bae6fd;
    --border-color-light: #7dd3fc;
    --border-color-focus: #0891b2;
    
    --success-color: #059669;
    --success-color-rgb: 5, 150, 105;
    --success-bg: rgba(16, 185, 129, 0.15);
    --success-text: #047857;
    --error-color: #dc2626;
    --error-color-rgb: 220, 38, 38;
    --error-bg: rgba(239, 68, 68, 0.15);
    --error-text: #b91c1c;
    --warning-color: #d97706;
    --warning-color-rgb: 217, 119, 6;
    --warning-bg: rgba(245, 158, 11, 0.15);
    --warning-text: #b45309;
    --info-color: #0284c7;
    --info-color-rgb: 2, 132, 199;
    --info-bg: rgba(14, 165, 233, 0.15);
    --info-text: #0369a1;
    
    --btn-primary-bg: #0891b2;
    --btn-primary-border: #0e7490;
    --btn-primary-text: #ffffff;
    --btn-primary-hover-bg: #0e7490;
    --btn-primary-hover-border: #155e75;
    --btn-secondary-bg: rgba(186, 230, 253, 0.6);
    --btn-secondary-border: #7dd3fc;
    --btn-secondary-text: #0369a1;
    
    --shadow-sm: 0 1px 2px rgba(14, 116, 144, 0.1);
    --shadow-md: 0 4px 6px rgba(14, 116, 144, 0.15);
    --shadow-lg: 0 10px 15px rgba(14, 116, 144, 0.2);
    --shadow-accent: 0 4px 15px rgba(8, 145, 178, 0.3);
    
    --table-header-bg: #e0f2fe;
    --table-row-hover: rgba(14, 165, 233, 0.1);
    --table-border: #bae6fd;
    
    --timetable-cell-bg: #ffffff;
    --timetable-cell-hover: #f0f9ff;
    --timetable-header-bg: #e0f2fe;
    --timetable-border: #bae6fd;
    --timetable-lesson-bg: rgba(8, 145, 178, 0.2);
    
    --modal-bg: #ffffff;
    --modal-header-bg: #e0f2fe;
    --modal-border: #bae6fd;
    --modal-backdrop: rgba(0, 0, 0, 0.5);
    
    --scrollbar-track: rgba(186, 230, 253, 0.5);
    --scrollbar-thumb: rgba(8, 145, 178, 0.5);
    --scrollbar-thumb-hover: rgba(8, 145, 178, 0.7);
    
    --card-bg: rgba(255, 255, 255, 0.95);
    --card-border: #bae6fd;
    --card-header-bg: rgba(224, 242, 254, 0.5);
    
    --quick-card-bg: rgba(255, 255, 255, 0.8);
    --quick-card-hover: rgba(255, 255, 255, 1);
    --quick-card-border: #7dd3fc;
    
    --avatar-bg: rgba(8, 145, 178, 0.2);
    --avatar-border: rgba(8, 145, 178, 0.5);
    
    --dropdown-bg: #ffffff;
    --dropdown-border: #bae6fd;
    --dropdown-item-hover: rgba(14, 165, 233, 0.1);
    
    --progress-bg: #e0f2fe;
    --progress-fill: linear-gradient(90deg, #0891b2 0%, #0ea5e9 100%);
    
    --badge-primary-bg: rgba(8, 145, 178, 0.2);
    --badge-primary-text: #0e7490;
    --badge-success-bg: rgba(5, 150, 105, 0.2);
    --badge-success-text: #047857;
}

/* ============================================
   1. LEŚNY MINIMALIZM
   ============================================ */
:root[data-theme="forest-minimal"] {
    --bg-body: #1B4332;
    --bg-primary: #1B4332;
    --bg-secondary: #2D6A4F;
    --bg-tertiary: #40916C;
    --bg-card: rgba(27, 67, 50, 0.95);
    --bg-card-hover: rgba(45, 106, 79, 0.95);
    --bg-input: rgba(45, 106, 79, 0.6);
    --bg-input-focus: rgba(45, 106, 79, 0.8);
    
    --sidebar-bg: #1B4332;
    --sidebar-border: #2D6A4F;
    --sidebar-item-hover: rgba(149, 213, 178, 0.1);
    --sidebar-item-active: rgba(149, 213, 178, 0.2);
    
    --navbar-bg: linear-gradient(135deg, #1B4332 0%, #2D6A4F 50%, #1B4332 100%);
    --navbar-border: rgba(149, 213, 178, 0.3);
    --navbar-text: #D8F3DC;
    
    --text-primary: #D8F3DC;
    --text-secondary: #95D5B2;
    --text-muted: #74C69D;
    --text-heading: #D8F3DC;
    --text-link: #95D5B2;
    --text-link-hover: #B7E4C7;
    
    --accent-primary: #52B788;
    --accent-primary-hover: #74C69D;
    --accent-primary-rgb: 82, 183, 136;
    --accent-secondary: #40916C;
    --accent-gradient: linear-gradient(135deg, #52B788 0%, #40916C 100%);
    
    --border-color: #2D6A4F;
    --border-color-light: #40916C;
    --border-color-focus: #52B788;
    
    --btn-primary-bg: #40916C;
    --btn-primary-border: #52B788;
    --btn-primary-text: #ffffff;
    --btn-primary-hover-bg: #52B788;
    --btn-primary-hover-border: #74C69D;
    
    --card-bg: rgba(27, 67, 50, 0.95);
    --card-border: #2D6A4F;
    
    --timetable-cell-bg: #2D6A4F;
    --timetable-header-bg: #1B4332;
    --timetable-lesson-bg: rgba(82, 183, 136, 0.2);
    
    --shadow-accent: 0 4px 15px rgba(82, 183, 136, 0.3);
    --scrollbar-thumb: rgba(82, 183, 136, 0.5);
}

/* ============================================
   2. ZIEMIA & GLINA
   ============================================ */
:root[data-theme="earth-clay"] {
    --bg-body: #5A3E2B;
    --bg-primary: #5A3E2B;
    --bg-secondary: #7A5539;
    --bg-tertiary: #A47148;
    --bg-card: rgba(90, 62, 43, 0.95);
    --bg-card-hover: rgba(122, 85, 57, 0.95);
    --bg-input: rgba(122, 85, 57, 0.6);
    --bg-input-focus: rgba(122, 85, 57, 0.8);
    
    --sidebar-bg: #5A3E2B;
    --sidebar-border: #7A5539;
    --sidebar-item-hover: rgba(230, 204, 178, 0.1);
    --sidebar-item-active: rgba(230, 204, 178, 0.2);
    
    --navbar-bg: linear-gradient(135deg, #5A3E2B 0%, #A47148 50%, #5A3E2B 100%);
    --navbar-border: rgba(230, 204, 178, 0.3);
    --navbar-text: #FFF1E6;
    
    --text-primary: #FFF1E6;
    --text-secondary: #E6CCB2;
    --text-muted: #C4A77D;
    --text-heading: #FFF1E6;
    --text-link: #E6CCB2;
    --text-link-hover: #F5DFC5;
    
    --accent-primary: #C4A77D;
    --accent-primary-hover: #D4BA91;
    --accent-primary-rgb: 196, 167, 125;
    --accent-secondary: #A47148;
    --accent-gradient: linear-gradient(135deg, #C4A77D 0%, #A47148 100%);
    
    --border-color: #7A5539;
    --border-color-light: #A47148;
    --border-color-focus: #C4A77D;
    
    --btn-primary-bg: #A47148;
    --btn-primary-border: #C4A77D;
    --btn-primary-text: #ffffff;
    
    --card-bg: rgba(90, 62, 43, 0.95);
    --card-border: #7A5539;
    
    --timetable-cell-bg: #7A5539;
    --timetable-header-bg: #5A3E2B;
    --timetable-lesson-bg: rgba(196, 167, 125, 0.2);
    
    --shadow-accent: 0 4px 15px rgba(196, 167, 125, 0.3);
    --scrollbar-thumb: rgba(196, 167, 125, 0.5);
}

/* ============================================
   3. TROPIKALNA DŻUNGLA
   ============================================ */
:root[data-theme="tropical-jungle"] {
    --bg-body: #006D5B;
    --bg-primary: #006D5B;
    --bg-secondary: #008B74;
    --bg-tertiary: #00AF91;
    --bg-card: rgba(0, 109, 91, 0.95);
    --bg-card-hover: rgba(0, 139, 116, 0.95);
    --bg-input: rgba(0, 139, 116, 0.6);
    --bg-input-focus: rgba(0, 139, 116, 0.8);
    
    --sidebar-bg: #006D5B;
    --sidebar-border: #008B74;
    --sidebar-item-hover: rgba(247, 197, 159, 0.1);
    --sidebar-item-active: rgba(255, 107, 107, 0.2);
    
    --navbar-bg: linear-gradient(135deg, #006D5B 0%, #00AF91 50%, #006D5B 100%);
    --navbar-border: rgba(255, 107, 107, 0.3);
    --navbar-text: #F7C59F;
    
    --text-primary: #F7C59F;
    --text-secondary: #FFD4B2;
    --text-muted: #E0A87A;
    --text-heading: #FF6B6B;
    --text-link: #FF6B6B;
    --text-link-hover: #FF8787;
    
    --accent-primary: #FF6B6B;
    --accent-primary-hover: #FF8787;
    --accent-primary-rgb: 255, 107, 107;
    --accent-secondary: #00AF91;
    --accent-gradient: linear-gradient(135deg, #FF6B6B 0%, #00AF91 100%);
    
    --border-color: #008B74;
    --border-color-light: #00AF91;
    --border-color-focus: #FF6B6B;
    
    --btn-primary-bg: #FF6B6B;
    --btn-primary-border: #FF8787;
    --btn-primary-text: #006D5B;
    
    --card-bg: rgba(0, 109, 91, 0.95);
    --card-border: #008B74;
    
    --timetable-cell-bg: #008B74;
    --timetable-header-bg: #006D5B;
    --timetable-lesson-bg: rgba(255, 107, 107, 0.2);
    
    --shadow-accent: 0 4px 15px rgba(255, 107, 107, 0.3);
    --scrollbar-thumb: rgba(255, 107, 107, 0.5);
}

/* ============================================
   4. OCEAN TECH
   ============================================ */
:root[data-theme="ocean-tech"] {
    --bg-body: #0A2540;
    --bg-primary: #0A2540;
    --bg-secondary: #14375A;
    --bg-tertiary: #1E6091;
    --bg-card: rgba(10, 37, 64, 0.95);
    --bg-card-hover: rgba(20, 55, 90, 0.95);
    --bg-input: rgba(20, 55, 90, 0.6);
    --bg-input-focus: rgba(20, 55, 90, 0.8);
    
    --sidebar-bg: #0A2540;
    --sidebar-border: #14375A;
    --sidebar-item-hover: rgba(95, 168, 211, 0.1);
    --sidebar-item-active: rgba(95, 168, 211, 0.2);
    
    --navbar-bg: linear-gradient(135deg, #0A2540 0%, #1E6091 50%, #0A2540 100%);
    --navbar-border: rgba(95, 168, 211, 0.3);
    --navbar-text: #EAF4F4;
    
    --text-primary: #EAF4F4;
    --text-secondary: #5FA8D3;
    --text-muted: #4A90B8;
    --text-heading: #EAF4F4;
    --text-link: #5FA8D3;
    --text-link-hover: #7FBCE0;
    
    --accent-primary: #5FA8D3;
    --accent-primary-hover: #7FBCE0;
    --accent-primary-rgb: 95, 168, 211;
    --accent-secondary: #1E6091;
    --accent-gradient: linear-gradient(135deg, #5FA8D3 0%, #1E6091 100%);
    
    --border-color: #14375A;
    --border-color-light: #1E6091;
    --border-color-focus: #5FA8D3;
    
    --btn-primary-bg: #1E6091;
    --btn-primary-border: #5FA8D3;
    --btn-primary-text: #ffffff;
    
    --card-bg: rgba(10, 37, 64, 0.95);
    --card-border: #14375A;
    
    --timetable-cell-bg: #14375A;
    --timetable-header-bg: #0A2540;
    --timetable-lesson-bg: rgba(95, 168, 211, 0.2);
    
    --shadow-accent: 0 4px 15px rgba(95, 168, 211, 0.3);
    --scrollbar-thumb: rgba(95, 168, 211, 0.5);
}

/* ============================================
   5. SKANDYNAWSKI CHŁÓD
   ============================================ */
:root[data-theme="nordic-cool"] {
    --bg-body: #2E3440;
    --bg-primary: #2E3440;
    --bg-secondary: #3B4252;
    --bg-tertiary: #4C566A;
    --bg-card: rgba(46, 52, 64, 0.95);
    --bg-card-hover: rgba(59, 66, 82, 0.95);
    --bg-input: rgba(59, 66, 82, 0.6);
    --bg-input-focus: rgba(59, 66, 82, 0.8);
    
    --sidebar-bg: #2E3440;
    --sidebar-border: #3B4252;
    --sidebar-item-hover: rgba(216, 222, 233, 0.1);
    --sidebar-item-active: rgba(216, 222, 233, 0.2);
    
    --navbar-bg: linear-gradient(135deg, #2E3440 0%, #4C566A 50%, #2E3440 100%);
    --navbar-border: rgba(216, 222, 233, 0.3);
    --navbar-text: #ECEFF4;
    
    --text-primary: #ECEFF4;
    --text-secondary: #D8DEE9;
    --text-muted: #A3BE8C;
    --text-heading: #ECEFF4;
    --text-link: #88C0D0;
    --text-link-hover: #8FBCBB;
    
    --accent-primary: #88C0D0;
    --accent-primary-hover: #8FBCBB;
    --accent-primary-rgb: 136, 192, 208;
    --accent-secondary: #81A1C1;
    --accent-gradient: linear-gradient(135deg, #88C0D0 0%, #81A1C1 100%);
    
    --border-color: #3B4252;
    --border-color-light: #4C566A;
    --border-color-focus: #88C0D0;
    
    --btn-primary-bg: #5E81AC;
    --btn-primary-border: #81A1C1;
    --btn-primary-text: #ffffff;
    
    --card-bg: rgba(46, 52, 64, 0.95);
    --card-border: #3B4252;
    
    --timetable-cell-bg: #3B4252;
    --timetable-header-bg: #2E3440;
    --timetable-lesson-bg: rgba(136, 192, 208, 0.2);
    
    --shadow-accent: 0 4px 15px rgba(136, 192, 208, 0.3);
    --scrollbar-thumb: rgba(136, 192, 208, 0.5);
}

/* ============================================
   6. ARKTYCZNY MINIMAL
   ============================================ */
:root[data-theme="arctic-minimal"] {
    --bg-body: #0B132B;
    --bg-primary: #0B132B;
    --bg-secondary: #1C2541;
    --bg-tertiary: #3A506B;
    --bg-card: rgba(11, 19, 43, 0.95);
    --bg-card-hover: rgba(28, 37, 65, 0.95);
    --bg-input: rgba(28, 37, 65, 0.6);
    --bg-input-focus: rgba(28, 37, 65, 0.8);
    
    --sidebar-bg: #0B132B;
    --sidebar-border: #1C2541;
    --sidebar-item-hover: rgba(234, 234, 234, 0.1);
    --sidebar-item-active: rgba(234, 234, 234, 0.2);
    
    --navbar-bg: linear-gradient(135deg, #0B132B 0%, #1C2541 50%, #0B132B 100%);
    --navbar-border: rgba(58, 80, 107, 0.3);
    --navbar-text: #EAEAEA;
    
    --text-primary: #EAEAEA;
    --text-secondary: #C0C0C0;
    --text-muted: #8E8E8E;
    --text-heading: #EAEAEA;
    --text-link: #5BC0BE;
    --text-link-hover: #6FFFE9;
    
    --accent-primary: #5BC0BE;
    --accent-primary-hover: #6FFFE9;
    --accent-primary-rgb: 91, 192, 190;
    --accent-secondary: #3A506B;
    --accent-gradient: linear-gradient(135deg, #5BC0BE 0%, #3A506B 100%);
    
    --border-color: #1C2541;
    --border-color-light: #3A506B;
    --border-color-focus: #5BC0BE;
    
    --btn-primary-bg: #3A506B;
    --btn-primary-border: #5BC0BE;
    --btn-primary-text: #ffffff;
    
    --card-bg: rgba(11, 19, 43, 0.95);
    --card-border: #1C2541;
    
    --timetable-cell-bg: #1C2541;
    --timetable-header-bg: #0B132B;
    --timetable-lesson-bg: rgba(91, 192, 190, 0.2);
    
    --shadow-accent: 0 4px 15px rgba(91, 192, 190, 0.3);
    --scrollbar-thumb: rgba(91, 192, 190, 0.5);
}

/* ============================================
   7. ZACHÓD SŁOŃCA
   ============================================ */
:root[data-theme="sunset-warm"] {
    --bg-body: #1A1A2E;
    --bg-primary: #1A1A2E;
    --bg-secondary: #2D2D44;
    --bg-tertiary: #FF9F1C;
    --bg-card: rgba(26, 26, 46, 0.95);
    --bg-card-hover: rgba(45, 45, 68, 0.95);
    --bg-input: rgba(45, 45, 68, 0.6);
    --bg-input-focus: rgba(45, 45, 68, 0.8);
    
    --sidebar-bg: #1A1A2E;
    --sidebar-border: #2D2D44;
    --sidebar-item-hover: rgba(255, 159, 28, 0.1);
    --sidebar-item-active: rgba(255, 159, 28, 0.2);
    
    --navbar-bg: linear-gradient(135deg, #FF9F1C 0%, #FFBF69 50%, #FF9F1C 100%);
    --navbar-border: rgba(46, 196, 182, 0.3);
    --navbar-text: #1A1A2E;
    
    --text-primary: #FFBF69;
    --text-secondary: #CBF3F0;
    --text-muted: #2EC4B6;
    --text-heading: #FF9F1C;
    --text-link: #2EC4B6;
    --text-link-hover: #CBF3F0;
    
    --accent-primary: #FF9F1C;
    --accent-primary-hover: #FFBF69;
    --accent-primary-rgb: 255, 159, 28;
    --accent-secondary: #2EC4B6;
    --accent-gradient: linear-gradient(135deg, #FF9F1C 0%, #2EC4B6 100%);
    
    --border-color: #2D2D44;
    --border-color-light: #FF9F1C;
    --border-color-focus: #FF9F1C;
    
    --btn-primary-bg: #FF9F1C;
    --btn-primary-border: #FFBF69;
    --btn-primary-text: #1A1A2E;
    
    --card-bg: rgba(26, 26, 46, 0.95);
    --card-border: #2D2D44;
    
    --timetable-cell-bg: #2D2D44;
    --timetable-header-bg: #1A1A2E;
    --timetable-lesson-bg: rgba(255, 159, 28, 0.2);
    
    --shadow-accent: 0 4px 15px rgba(255, 159, 28, 0.3);
    --scrollbar-thumb: rgba(255, 159, 28, 0.5);
}

/* ============================================
   8. RETRO 70S
   ============================================ */
:root[data-theme="retro-70s"] {
    --bg-body: #264653;
    --bg-primary: #264653;
    --bg-secondary: #2A9D8F;
    --bg-tertiary: #E9C46A;
    --bg-card: rgba(38, 70, 83, 0.95);
    --bg-card-hover: rgba(42, 157, 143, 0.95);
    --bg-input: rgba(42, 157, 143, 0.6);
    --bg-input-focus: rgba(42, 157, 143, 0.8);
    
    --sidebar-bg: #264653;
    --sidebar-border: #2A9D8F;
    --sidebar-item-hover: rgba(244, 162, 97, 0.1);
    --sidebar-item-active: rgba(231, 111, 81, 0.2);
    
    --navbar-bg: linear-gradient(135deg, #F4A261 0%, #E76F51 50%, #F4A261 100%);
    --navbar-border: rgba(42, 157, 143, 0.3);
    --navbar-text: #264653;
    
    --text-primary: #F4A261;
    --text-secondary: #E9C46A;
    --text-muted: #2A9D8F;
    --text-heading: #E76F51;
    --text-link: #E76F51;
    --text-link-hover: #F4A261;
    
    --accent-primary: #E76F51;
    --accent-primary-hover: #F4A261;
    --accent-primary-rgb: 231, 111, 81;
    --accent-secondary: #2A9D8F;
    --accent-gradient: linear-gradient(135deg, #E76F51 0%, #2A9D8F 100%);
    
    --border-color: #2A9D8F;
    --border-color-light: #E9C46A;
    --border-color-focus: #E76F51;
    
    --btn-primary-bg: #E76F51;
    --btn-primary-border: #F4A261;
    --btn-primary-text: #264653;
    
    --card-bg: rgba(38, 70, 83, 0.95);
    --card-border: #2A9D8F;
    
    --timetable-cell-bg: #2A9D8F;
    --timetable-header-bg: #264653;
    --timetable-lesson-bg: rgba(231, 111, 81, 0.2);
    
    --shadow-accent: 0 4px 15px rgba(231, 111, 81, 0.3);
    --scrollbar-thumb: rgba(231, 111, 81, 0.5);
}

/* ============================================
   9. NEON VIBES
   ============================================ */
:root[data-theme="neon-vibes"] {
    --bg-body: #0F0F0F;
    --bg-primary: #0F0F0F;
    --bg-secondary: #1A1A1A;
    --bg-tertiary: #252525;
    --bg-card: rgba(15, 15, 15, 0.95);
    --bg-card-hover: rgba(26, 26, 26, 0.95);
    --bg-input: rgba(26, 26, 26, 0.6);
    --bg-input-focus: rgba(26, 26, 26, 0.8);
    
    --sidebar-bg: #0F0F0F;
    --sidebar-border: #1A1A1A;
    --sidebar-item-hover: rgba(255, 0, 110, 0.1);
    --sidebar-item-active: rgba(131, 56, 236, 0.2);
    
    --navbar-bg: linear-gradient(135deg, #FF006E 0%, #8338EC 50%, #3A86FF 100%);
    --navbar-border: rgba(131, 56, 236, 0.5);
    --navbar-text: #ffffff;
    
    --text-primary: #ffffff;
    --text-secondary: #FF006E;
    --text-muted: #8338EC;
    --text-heading: #FF006E;
    --text-link: #3A86FF;
    --text-link-hover: #8338EC;
    
    --accent-primary: #FF006E;
    --accent-primary-hover: #FF3385;
    --accent-primary-rgb: 255, 0, 110;
    --accent-secondary: #8338EC;
    --accent-gradient: linear-gradient(135deg, #FF006E 0%, #8338EC 50%, #3A86FF 100%);
    
    --border-color: #1A1A1A;
    --border-color-light: #252525;
    --border-color-focus: #FF006E;
    
    --btn-primary-bg: #8338EC;
    --btn-primary-border: #FF006E;
    --btn-primary-text: #ffffff;
    
    --card-bg: rgba(15, 15, 15, 0.95);
    --card-border: #1A1A1A;
    
    --timetable-cell-bg: #1A1A1A;
    --timetable-header-bg: #0F0F0F;
    --timetable-lesson-bg: rgba(131, 56, 236, 0.2);
    
    --shadow-accent: 0 4px 15px rgba(255, 0, 110, 0.4);
    --scrollbar-thumb: rgba(131, 56, 236, 0.5);
}

/* ============================================
   10. DARK SAAS
   ============================================ */
:root[data-theme="dark-saas"] {
    --bg-body: #0D1117;
    --bg-primary: #0D1117;
    --bg-secondary: #161B22;
    --bg-tertiary: #21262D;
    --bg-card: rgba(13, 17, 23, 0.95);
    --bg-card-hover: rgba(22, 27, 34, 0.95);
    --bg-input: rgba(22, 27, 34, 0.6);
    --bg-input-focus: rgba(22, 27, 34, 0.8);
    
    --sidebar-bg: #0D1117;
    --sidebar-border: #161B22;
    --sidebar-item-hover: rgba(88, 166, 255, 0.1);
    --sidebar-item-active: rgba(88, 166, 255, 0.2);
    
    --navbar-bg: linear-gradient(135deg, #0D1117 0%, #161B22 50%, #0D1117 100%);
    --navbar-border: rgba(88, 166, 255, 0.3);
    --navbar-text: #C9D1D9;
    
    --text-primary: #C9D1D9;
    --text-secondary: #8B949E;
    --text-muted: #6E7681;
    --text-heading: #C9D1D9;
    --text-link: #58A6FF;
    --text-link-hover: #79B8FF;
    
    --accent-primary: #58A6FF;
    --accent-primary-hover: #79B8FF;
    --accent-primary-rgb: 88, 166, 255;
    --accent-secondary: #238636;
    --accent-gradient: linear-gradient(135deg, #58A6FF 0%, #238636 100%);
    
    --border-color: #21262D;
    --border-color-light: #30363D;
    --border-color-focus: #58A6FF;
    
    --btn-primary-bg: #238636;
    --btn-primary-border: #2EA043;
    --btn-primary-text: #ffffff;
    
    --card-bg: rgba(13, 17, 23, 0.95);
    --card-border: #21262D;
    
    --timetable-cell-bg: #161B22;
    --timetable-header-bg: #0D1117;
    --timetable-lesson-bg: rgba(88, 166, 255, 0.2);
    
    --shadow-accent: 0 4px 15px rgba(88, 166, 255, 0.3);
    --scrollbar-thumb: rgba(88, 166, 255, 0.5);
}

/* ============================================
   11. CYBERPUNK
   ============================================ */
:root[data-theme="cyberpunk"] {
    --bg-body: #0F172A;
    --bg-primary: #0F172A;
    --bg-secondary: #1E293B;
    --bg-tertiary: #334155;
    --bg-card: rgba(15, 23, 42, 0.95);
    --bg-card-hover: rgba(30, 41, 59, 0.95);
    --bg-input: rgba(30, 41, 59, 0.6);
    --bg-input-focus: rgba(30, 41, 59, 0.8);
    
    --sidebar-bg: #0F172A;
    --sidebar-border: #1E293B;
    --sidebar-item-hover: rgba(34, 211, 238, 0.1);
    --sidebar-item-active: rgba(244, 63, 94, 0.2);
    
    --navbar-bg: linear-gradient(135deg, #0F172A 0%, #22D3EE 50%, #F43F5E 100%);
    --navbar-border: rgba(34, 211, 238, 0.5);
    --navbar-text: #E5E7EB;
    
    --text-primary: #E5E7EB;
    --text-secondary: #22D3EE;
    --text-muted: #F43F5E;
    --text-heading: #22D3EE;
    --text-link: #F43F5E;
    --text-link-hover: #22D3EE;
    
    --accent-primary: #22D3EE;
    --accent-primary-hover: #67E8F9;
    --accent-primary-rgb: 34, 211, 238;
    --accent-secondary: #F43F5E;
    --accent-gradient: linear-gradient(135deg, #22D3EE 0%, #F43F5E 100%);
    
    --border-color: #1E293B;
    --border-color-light: #334155;
    --border-color-focus: #22D3EE;
    
    --btn-primary-bg: #F43F5E;
    --btn-primary-border: #22D3EE;
    --btn-primary-text: #ffffff;
    
    --card-bg: rgba(15, 23, 42, 0.95);
    --card-border: #1E293B;
    
    --timetable-cell-bg: #1E293B;
    --timetable-header-bg: #0F172A;
    --timetable-lesson-bg: rgba(34, 211, 238, 0.2);
    
    --shadow-accent: 0 4px 15px rgba(244, 63, 94, 0.4);
    --scrollbar-thumb: rgba(34, 211, 238, 0.5);
}

/* ============================================
   12. AI LAB
   ============================================ */
:root[data-theme="ai-lab"] {
    --bg-body: #111827;
    --bg-primary: #111827;
    --bg-secondary: #1F2937;
    --bg-tertiary: #374151;
    --bg-card: rgba(17, 24, 39, 0.95);
    --bg-card-hover: rgba(31, 41, 55, 0.95);
    --bg-input: rgba(31, 41, 55, 0.6);
    --bg-input-focus: rgba(31, 41, 55, 0.8);
    
    --sidebar-bg: #111827;
    --sidebar-border: #1F2937;
    --sidebar-item-hover: rgba(56, 189, 248, 0.1);
    --sidebar-item-active: rgba(165, 243, 252, 0.2);
    
    --navbar-bg: linear-gradient(135deg, #111827 0%, #38BDF8 50%, #111827 100%);
    --navbar-border: rgba(56, 189, 248, 0.3);
    --navbar-text: #A5F3FC;
    
    --text-primary: #A5F3FC;
    --text-secondary: #38BDF8;
    --text-muted: #0EA5E9;
    --text-heading: #A5F3FC;
    --text-link: #38BDF8;
    --text-link-hover: #A5F3FC;
    
    --accent-primary: #38BDF8;
    --accent-primary-hover: #7DD3FC;
    --accent-primary-rgb: 56, 189, 248;
    --accent-secondary: #0EA5E9;
    --accent-gradient: linear-gradient(135deg, #38BDF8 0%, #0EA5E9 100%);
    
    --border-color: #1F2937;
    --border-color-light: #374151;
    --border-color-focus: #38BDF8;
    
    --btn-primary-bg: #0EA5E9;
    --btn-primary-border: #38BDF8;
    --btn-primary-text: #111827;
    
    --card-bg: rgba(17, 24, 39, 0.95);
    --card-border: #1F2937;
    
    --timetable-cell-bg: #1F2937;
    --timetable-header-bg: #111827;
    --timetable-lesson-bg: rgba(56, 189, 248, 0.2);
    
    --shadow-accent: 0 4px 15px rgba(56, 189, 248, 0.3);
    --scrollbar-thumb: rgba(56, 189, 248, 0.5);
}

/* ============================================
   13. PASTEL DREAM
   ============================================ */
:root[data-theme="pastel-dream"] {
    --bg-body: #FFF0F5;
    --bg-primary: #FFF0F5;
    --bg-secondary: #FFD6E0;
    --bg-tertiary: #CDB4DB;
    --bg-card: rgba(255, 240, 245, 0.95);
    --bg-card-hover: rgba(255, 214, 224, 0.95);
    --bg-input: rgba(255, 255, 255, 0.8);
    --bg-input-focus: rgba(255, 255, 255, 1);
    
    --sidebar-bg: #FFF0F5;
    --sidebar-border: #CDB4DB;
    --sidebar-item-hover: rgba(189, 224, 254, 0.3);
    --sidebar-item-active: rgba(205, 180, 219, 0.3);
    
    --navbar-bg: linear-gradient(135deg, #FFD6E0 0%, #CDB4DB 50%, #BDE0FE 100%);
    --navbar-border: rgba(205, 180, 219, 0.5);
    --navbar-text: #5C4B6A;
    
    --text-primary: #5C4B6A;
    --text-secondary: #7B6B8A;
    --text-muted: #9B8BA8;
    --text-heading: #5C4B6A;
    --text-link: #A78BBA;
    --text-link-hover: #CDB4DB;
    
    --accent-primary: #CDB4DB;
    --accent-primary-hover: #E2D0E8;
    --accent-primary-rgb: 205, 180, 219;
    --accent-secondary: #BDE0FE;
    --accent-gradient: linear-gradient(135deg, #FFD6E0 0%, #CDB4DB 50%, #BDE0FE 100%);
    
    --border-color: #CDB4DB;
    --border-color-light: #E2D0E8;
    --border-color-focus: #A78BBA;
    
    --btn-primary-bg: #CDB4DB;
    --btn-primary-border: #A78BBA;
    --btn-primary-text: #5C4B6A;
    
    --card-bg: rgba(255, 240, 245, 0.95);
    --card-border: #CDB4DB;
    
    --timetable-cell-bg: #FFD6E0;
    --timetable-header-bg: #FFF0F5;
    --timetable-lesson-bg: rgba(205, 180, 219, 0.3);
    
    --shadow-accent: 0 4px 15px rgba(205, 180, 219, 0.4);
    --scrollbar-thumb: rgba(205, 180, 219, 0.5);
}

/* ============================================
   14. MEMPHIS STYLE
   ============================================ */
:root[data-theme="memphis-style"] {
    --bg-body: #1A1A2E;
    --bg-primary: #1A1A2E;
    --bg-secondary: #2E2E4A;
    --bg-tertiary: #3A86FF;
    --bg-card: rgba(26, 26, 46, 0.95);
    --bg-card-hover: rgba(46, 46, 74, 0.95);
    --bg-input: rgba(46, 46, 74, 0.6);
    --bg-input-focus: rgba(46, 46, 74, 0.8);
    
    --sidebar-bg: #1A1A2E;
    --sidebar-border: #2E2E4A;
    --sidebar-item-hover: rgba(255, 190, 11, 0.1);
    --sidebar-item-active: rgba(251, 86, 7, 0.2);
    
    --navbar-bg: linear-gradient(135deg, #FFBE0B 0%, #FB5607 50%, #8338EC 100%);
    --navbar-border: rgba(131, 56, 236, 0.5);
    --navbar-text: #ffffff;
    
    --text-primary: #ffffff;
    --text-secondary: #FFBE0B;
    --text-muted: #FB5607;
    --text-heading: #FFBE0B;
    --text-link: #3A86FF;
    --text-link-hover: #8338EC;
    
    --accent-primary: #FFBE0B;
    --accent-primary-hover: #FFD133;
    --accent-primary-rgb: 255, 190, 11;
    --accent-secondary: #FB5607;
    --accent-gradient: linear-gradient(135deg, #FFBE0B 0%, #FB5607 50%, #8338EC 100%);
    
    --border-color: #2E2E4A;
    --border-color-light: #3A86FF;
    --border-color-focus: #FFBE0B;
    
    --btn-primary-bg: #FB5607;
    --btn-primary-border: #FFBE0B;
    --btn-primary-text: #ffffff;
    
    --card-bg: rgba(26, 26, 46, 0.95);
    --card-border: #2E2E4A;
    
    --timetable-cell-bg: #2E2E4A;
    --timetable-header-bg: #1A1A2E;
    --timetable-lesson-bg: rgba(255, 190, 11, 0.2);
    
    --shadow-accent: 0 4px 15px rgba(251, 86, 7, 0.4);
    --scrollbar-thumb: rgba(131, 56, 236, 0.5);
}

/* ============================================
   15. ART GALLERY
   ============================================ */
:root[data-theme="art-gallery"] {
    --bg-body: #0A0A0A;
    --bg-primary: #0A0A0A;
    --bg-secondary: #1A1A1A;
    --bg-tertiary: #2A2A2A;
    --bg-card: rgba(10, 10, 10, 0.95);
    --bg-card-hover: rgba(26, 26, 26, 0.95);
    --bg-input: rgba(26, 26, 26, 0.6);
    --bg-input-focus: rgba(26, 26, 26, 0.8);
    
    --sidebar-bg: #0A0A0A;
    --sidebar-border: #1A1A1A;
    --sidebar-item-hover: rgba(185, 28, 28, 0.1);
    --sidebar-item-active: rgba(185, 28, 28, 0.2);
    
    --navbar-bg: linear-gradient(135deg, #0A0A0A 0%, #FFFFFF 50%, #0A0A0A 100%);
    --navbar-border: rgba(185, 28, 28, 0.5);
    --navbar-text: #FFFFFF;
    
    --text-primary: #FFFFFF;
    --text-secondary: #9CA3AF;
    --text-muted: #6B7280;
    --text-heading: #FFFFFF;
    --text-link: #B91C1C;
    --text-link-hover: #DC2626;
    
    --accent-primary: #B91C1C;
    --accent-primary-hover: #DC2626;
    --accent-primary-rgb: 185, 28, 28;
    --accent-secondary: #9CA3AF;
    --accent-gradient: linear-gradient(135deg, #B91C1C 0%, #FFFFFF 100%);
    
    --border-color: #1A1A1A;
    --border-color-light: #2A2A2A;
    --border-color-focus: #B91C1C;
    
    --btn-primary-bg: #B91C1C;
    --btn-primary-border: #DC2626;
    --btn-primary-text: #ffffff;
    
    --card-bg: rgba(10, 10, 10, 0.95);
    --card-border: #1A1A1A;
    
    --timetable-cell-bg: #1A1A1A;
    --timetable-header-bg: #0A0A0A;
    --timetable-lesson-bg: rgba(185, 28, 28, 0.2);
    
    --shadow-accent: 0 4px 15px rgba(185, 28, 28, 0.4);
    --scrollbar-thumb: rgba(185, 28, 28, 0.5);
}

/* ============================================
   16. LUXURY BEIGE
   ============================================ */
:root[data-theme="luxury-beige"] {
    --bg-body: #F5F1EB;
    --bg-primary: #F5F1EB;
    --bg-secondary: #E3D5C3;
    --bg-tertiary: #D4C4B0;
    --bg-card: rgba(245, 241, 235, 0.95);
    --bg-card-hover: rgba(227, 213, 195, 0.95);
    --bg-input: rgba(255, 255, 255, 0.8);
    --bg-input-focus: rgba(255, 255, 255, 1);
    
    --sidebar-bg: #F5F1EB;
    --sidebar-border: #D4C4B0;
    --sidebar-item-hover: rgba(191, 161, 129, 0.2);
    --sidebar-item-active: rgba(58, 46, 42, 0.1);
    
    --navbar-bg: linear-gradient(135deg, #3A2E2A 0%, #BFA181 50%, #3A2E2A 100%);
    --navbar-border: rgba(191, 161, 129, 0.5);
    --navbar-text: #F5F1EB;
    
    --text-primary: #3A2E2A;
    --text-secondary: #5C4B40;
    --text-muted: #8C7B6E;
    --text-heading: #3A2E2A;
    --text-link: #BFA181;
    --text-link-hover: #C9B08F;
    
    --accent-primary: #BFA181;
    --accent-primary-hover: #C9B08F;
    --accent-primary-rgb: 191, 161, 129;
    --accent-secondary: #3A2E2A;
    --accent-gradient: linear-gradient(135deg, #BFA181 0%, #3A2E2A 100%);
    
    --border-color: #D4C4B0;
    --border-color-light: #E3D5C3;
    --border-color-focus: #BFA181;
    
    --btn-primary-bg: #3A2E2A;
    --btn-primary-border: #5C4B40;
    --btn-primary-text: #F5F1EB;
    
    --card-bg: rgba(245, 241, 235, 0.95);
    --card-border: #D4C4B0;
    
    --timetable-cell-bg: #E3D5C3;
    --timetable-header-bg: #F5F1EB;
    --timetable-lesson-bg: rgba(191, 161, 129, 0.3);
    
    --shadow-accent: 0 4px 15px rgba(58, 46, 42, 0.2);
    --scrollbar-thumb: rgba(191, 161, 129, 0.5);
}

/* ============================================
   17. WELLNESS SPA
   ============================================ */
:root[data-theme="wellness-spa"] {
    --bg-body: #E8F5E9;
    --bg-primary: #E8F5E9;
    --bg-secondary: #C8E6C9;
    --bg-tertiary: #A5D6A7;
    --bg-card: rgba(232, 245, 233, 0.95);
    --bg-card-hover: rgba(200, 230, 201, 0.95);
    --bg-input: rgba(255, 255, 255, 0.8);
    --bg-input-focus: rgba(255, 255, 255, 1);
    
    --sidebar-bg: #E8F5E9;
    --sidebar-border: #A5D6A7;
    --sidebar-item-hover: rgba(102, 187, 106, 0.2);
    --sidebar-item-active: rgba(46, 125, 50, 0.1);
    
    --navbar-bg: linear-gradient(135deg, #2E7D32 0%, #66BB6A 50%, #2E7D32 100%);
    --navbar-border: rgba(102, 187, 106, 0.5);
    --navbar-text: #E8F5E9;
    
    --text-primary: #2E7D32;
    --text-secondary: #388E3C;
    --text-muted: #66BB6A;
    --text-heading: #2E7D32;
    --text-link: #43A047;
    --text-link-hover: #66BB6A;
    
    --accent-primary: #66BB6A;
    --accent-primary-hover: #81C784;
    --accent-primary-rgb: 102, 187, 106;
    --accent-secondary: #2E7D32;
    --accent-gradient: linear-gradient(135deg, #66BB6A 0%, #2E7D32 100%);
    
    --border-color: #A5D6A7;
    --border-color-light: #C8E6C9;
    --border-color-focus: #66BB6A;
    
    --btn-primary-bg: #2E7D32;
    --btn-primary-border: #388E3C;
    --btn-primary-text: #ffffff;
    
    --card-bg: rgba(232, 245, 233, 0.95);
    --card-border: #A5D6A7;
    
    --timetable-cell-bg: #C8E6C9;
    --timetable-header-bg: #E8F5E9;
    --timetable-lesson-bg: rgba(102, 187, 106, 0.3);
    
    --shadow-accent: 0 4px 15px rgba(46, 125, 50, 0.2);
    --scrollbar-thumb: rgba(102, 187, 106, 0.5);
}

/* ============================================
   18. FASHION EDITORIAL
   ============================================ */
:root[data-theme="fashion-editorial"] {
    --bg-body: #111111;
    --bg-primary: #111111;
    --bg-secondary: #1A1A1A;
    --bg-tertiary: #2A2A2A;
    --bg-card: rgba(17, 17, 17, 0.95);
    --bg-card-hover: rgba(26, 26, 26, 0.95);
    --bg-input: rgba(26, 26, 26, 0.6);
    --bg-input-focus: rgba(26, 26, 26, 0.8);
    
    --sidebar-bg: #111111;
    --sidebar-border: #1A1A1A;
    --sidebar-item-hover: rgba(212, 175, 55, 0.1);
    --sidebar-item-active: rgba(212, 175, 55, 0.2);
    
    --navbar-bg: linear-gradient(135deg, #111111 0%, #D4AF37 50%, #111111 100%);
    --navbar-border: rgba(212, 175, 55, 0.5);
    --navbar-text: #F5F5F5;
    
    --text-primary: #F5F5F5;
    --text-secondary: #D4AF37;
    --text-muted: #7C7C7C;
    --text-heading: #D4AF37;
    --text-link: #D4AF37;
    --text-link-hover: #E5C75F;
    
    --accent-primary: #D4AF37;
    --accent-primary-hover: #E5C75F;
    --accent-primary-rgb: 212, 175, 55;
    --accent-secondary: #7C7C7C;
    --accent-gradient: linear-gradient(135deg, #D4AF37 0%, #111111 100%);
    
    --border-color: #1A1A1A;
    --border-color-light: #2A2A2A;
    --border-color-focus: #D4AF37;
    
    --btn-primary-bg: #D4AF37;
    --btn-primary-border: #E5C75F;
    --btn-primary-text: #111111;
    
    --card-bg: rgba(17, 17, 17, 0.95);
    --card-border: #1A1A1A;
    
    --timetable-cell-bg: #1A1A1A;
    --timetable-header-bg: #111111;
    --timetable-lesson-bg: rgba(212, 175, 55, 0.2);
    
    --shadow-accent: 0 4px 15px rgba(212, 175, 55, 0.4);
    --scrollbar-thumb: rgba(212, 175, 55, 0.5);
}

/* ============================================
   19. PIXEL GAME
   ============================================ */
:root[data-theme="pixel-game"] {
    --bg-body: #1A1A2E;
    --bg-primary: #1A1A2E;
    --bg-secondary: #16213E;
    --bg-tertiary: #0F3460;
    --bg-card: rgba(26, 26, 46, 0.95);
    --bg-card-hover: rgba(22, 33, 62, 0.95);
    --bg-input: rgba(22, 33, 62, 0.6);
    --bg-input-focus: rgba(22, 33, 62, 0.8);
    
    --sidebar-bg: #1A1A2E;
    --sidebar-border: #16213E;
    --sidebar-item-hover: rgba(233, 69, 96, 0.1);
    --sidebar-item-active: rgba(233, 69, 96, 0.2);
    
    --navbar-bg: linear-gradient(135deg, #1A1A2E 0%, #E94560 50%, #1A1A2E 100%);
    --navbar-border: rgba(233, 69, 96, 0.5);
    --navbar-text: #E94560;
    
    --text-primary: #FFFFFF;
    --text-secondary: #E94560;
    --text-muted: #0F3460;
    --text-heading: #E94560;
    --text-link: #E94560;
    --text-link-hover: #FF6B8A;
    
    --accent-primary: #E94560;
    --accent-primary-hover: #FF6B8A;
    --accent-primary-rgb: 233, 69, 96;
    --accent-secondary: #0F3460;
    --accent-gradient: linear-gradient(135deg, #E94560 0%, #0F3460 100%);
    
    --border-color: #16213E;
    --border-color-light: #0F3460;
    --border-color-focus: #E94560;
    
    --btn-primary-bg: #E94560;
    --btn-primary-border: #FF6B8A;
    --btn-primary-text: #ffffff;
    
    --card-bg: rgba(26, 26, 46, 0.95);
    --card-border: #16213E;
    
    --timetable-cell-bg: #16213E;
    --timetable-header-bg: #1A1A2E;
    --timetable-lesson-bg: rgba(233, 69, 96, 0.2);
    
    --shadow-accent: 0 4px 15px rgba(233, 69, 96, 0.4);
    --scrollbar-thumb: rgba(233, 69, 96, 0.5);
}

/* ============================================
   20. CANDY UI
   ============================================ */
:root[data-theme="candy-ui"] {
    --bg-body: #2D1B4E;
    --bg-primary: #2D1B4E;
    --bg-secondary: #3D2963;
    --bg-tertiary: #6A4C93;
    --bg-card: rgba(45, 27, 78, 0.95);
    --bg-card-hover: rgba(61, 41, 99, 0.95);
    --bg-input: rgba(61, 41, 99, 0.6);
    --bg-input-focus: rgba(61, 41, 99, 0.8);
    
    --sidebar-bg: #2D1B4E;
    --sidebar-border: #3D2963;
    --sidebar-item-hover: rgba(255, 93, 143, 0.1);
    --sidebar-item-active: rgba(255, 159, 28, 0.2);
    
    --navbar-bg: linear-gradient(135deg, #FF5D8F 0%, #FF9F1C 50%, #FFE066 100%);
    --navbar-border: rgba(255, 159, 28, 0.5);
    --navbar-text: #2D1B4E;
    
    --text-primary: #FFE066;
    --text-secondary: #FF5D8F;
    --text-muted: #FF9F1C;
    --text-heading: #FF5D8F;
    --text-link: #FF9F1C;
    --text-link-hover: #FFE066;
    
    --accent-primary: #FF5D8F;
    --accent-primary-hover: #FF7DA5;
    --accent-primary-rgb: 255, 93, 143;
    --accent-secondary: #FF9F1C;
    --accent-gradient: linear-gradient(135deg, #FF5D8F 0%, #FF9F1C 50%, #FFE066 100%);
    
    --border-color: #3D2963;
    --border-color-light: #6A4C93;
    --border-color-focus: #FF5D8F;
    
    --btn-primary-bg: #FF5D8F;
    --btn-primary-border: #FF9F1C;
    --btn-primary-text: #2D1B4E;
    
    --card-bg: rgba(45, 27, 78, 0.95);
    --card-border: #3D2963;
    
    --timetable-cell-bg: #3D2963;
    --timetable-header-bg: #2D1B4E;
    --timetable-lesson-bg: rgba(255, 93, 143, 0.2);
    
    --shadow-accent: 0 4px 15px rgba(255, 159, 28, 0.4);
    --scrollbar-thumb: rgba(255, 93, 143, 0.5);
}

/* ============================================
   GLOBAL THEME APPLICATION
   These rules apply theme variables to elements
   ============================================ */

/* Body Background */
body {
    background-color: var(--bg-body) !important;
    color: var(--text-primary) !important;
}

/* Sidebar */
.ps-sidebar,
.sidebar,
#sidebar {
    background: var(--sidebar-bg) !important;
    border-color: var(--sidebar-border) !important;
}

.ps-sidebar-item:hover,
.sidebar-item:hover {
    background: var(--sidebar-item-hover) !important;
}

.ps-sidebar-item.active,
.sidebar-item.active {
    background: var(--sidebar-item-active) !important;
}

/* Navbar */
.navbar,
nav.navbar {
    background: var(--navbar-bg) !important;
    border-bottom-color: var(--navbar-border) !important;
}

.navbar-text,
.nav-link,
.navbar .nav-link {
    color: var(--navbar-text) !important;
}

/* Cards */
.card,
.profile-card,
.quick-card,
.manage-card {
    background: var(--card-bg) !important;
    border-color: var(--card-border) !important;
}

.card:hover,
.quick-card:hover {
    background: var(--bg-card-hover) !important;
}

.card-header {
    background: var(--card-header-bg) !important;
    border-bottom-color: var(--border-color) !important;
}

/* Text */
h1, h2, h3, h4, h5, h6 {
    color: var(--text-heading) !important;
}

p, span, div {
    color: var(--text-primary);
}

.text-muted {
    color: var(--text-muted) !important;
}

.text-secondary {
    color: var(--text-secondary) !important;
}

a {
    color: var(--text-link);
}

a:hover {
    color: var(--text-link-hover);
}

/* Inputs */
.form-control,
.form-select,
input[type="text"],
input[type="email"],
input[type="password"],
input[type="number"],
textarea,
select {
    background: var(--bg-input) !important;
    border-color: var(--border-color) !important;
    color: var(--text-primary) !important;
}

.form-control:focus,
.form-select:focus,
input:focus,
textarea:focus,
select:focus {
    background: var(--bg-input-focus) !important;
    border-color: var(--border-color-focus) !important;
    box-shadow: 0 0 0 2px rgba(var(--accent-primary-rgb), 0.3) !important;
}

.form-control::placeholder,
input::placeholder,
textarea::placeholder {
    color: var(--text-muted) !important;
}

/* Buttons */
.btn-primary {
    background: var(--btn-primary-bg) !important;
    border-color: var(--btn-primary-border) !important;
    color: var(--btn-primary-text) !important;
}

.btn-primary:hover {
    background: var(--btn-primary-hover-bg, var(--accent-primary-hover)) !important;
    border-color: var(--btn-primary-hover-border, var(--accent-primary)) !important;
}

.btn-secondary {
    background: var(--btn-secondary-bg) !important;
    border-color: var(--btn-secondary-border) !important;
    color: var(--btn-secondary-text) !important;
}

/* Tables */
.table,
table {
    background: var(--bg-secondary) !important;
    border-color: var(--table-border) !important;
}

.table thead,
table thead,
.table th,
table th {
    background: var(--table-header-bg) !important;
    color: var(--text-heading) !important;
    border-color: var(--table-border) !important;
}

.table td,
table td {
    border-color: var(--table-border) !important;
    color: var(--text-primary) !important;
}

.table tbody tr:hover,
table tbody tr:hover {
    background: var(--table-row-hover) !important;
}

/* Timetable */
.timetable-cell,
.tt-cell {
    background: var(--timetable-cell-bg) !important;
    border-color: var(--timetable-border) !important;
}

.timetable-cell:hover,
.tt-cell:hover {
    background: var(--timetable-cell-hover, var(--bg-tertiary)) !important;
}

.timetable-header,
.tt-header {
    background: var(--timetable-header-bg) !important;
}

.lesson-block,
.tt-lesson {
    background: var(--timetable-lesson-bg) !important;
    border-color: var(--accent-primary) !important;
}

/* Modals */
.modal-content {
    background: var(--modal-bg) !important;
    border-color: var(--modal-border) !important;
}

.modal-header {
    background: var(--modal-header-bg) !important;
    border-bottom-color: var(--modal-border) !important;
    color: var(--text-heading) !important;
}

.modal-footer {
    border-top-color: var(--modal-border) !important;
}

.modal-backdrop {
    background-color: var(--modal-backdrop) !important;
}

/* Dropdowns */
.dropdown-menu {
    background: var(--dropdown-bg) !important;
    border-color: var(--dropdown-border) !important;
}

.dropdown-item {
    color: var(--text-primary) !important;
}

.dropdown-item:hover {
    background: var(--dropdown-item-hover) !important;
}

/* Alerts */
.alert-success {
    background: var(--success-bg) !important;
    color: var(--success-text) !important;
    border-color: var(--success-color) !important;
}

.alert-danger,
.alert-error {
    background: var(--error-bg) !important;
    color: var(--error-text) !important;
    border-color: var(--error-color) !important;
}

.alert-warning {
    background: var(--warning-bg) !important;
    color: var(--warning-text) !important;
    border-color: var(--warning-color) !important;
}

.alert-info {
    background: var(--info-bg) !important;
    color: var(--info-text) !important;
    border-color: var(--info-color) !important;
}

/* Badges */
.badge-primary,
.badge.bg-primary {
    background: var(--badge-primary-bg) !important;
    color: var(--badge-primary-text) !important;
}

.badge-success,
.badge.bg-success {
    background: var(--badge-success-bg) !important;
    color: var(--badge-success-text) !important;
}

/* Scrollbars */
::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

::-webkit-scrollbar-track {
    background: var(--scrollbar-track);
    border-radius: 4px;
}

::-webkit-scrollbar-thumb {
    background: var(--scrollbar-thumb);
    border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
    background: var(--scrollbar-thumb-hover);
}

/* Progress bars */
.progress {
    background: var(--progress-bg) !important;
}

.progress-bar {
    background: var(--progress-fill) !important;
}

/* Borders */
.border {
    border-color: var(--border-color) !important;
}

.border-top,
.border-bottom,
.border-left,
.border-right {
    border-color: var(--border-color) !important;
}

/* Shadows */
.shadow-sm {
    box-shadow: var(--shadow-sm) !important;
}

.shadow,
.shadow-md {
    box-shadow: var(--shadow-md) !important;
}

.shadow-lg {
    box-shadow: var(--shadow-lg) !important;
}

/* Avatar */
.avatar,
.profile-avatar {
    background: var(--avatar-bg) !important;
    border-color: var(--avatar-border) !important;
}

/* Quick access cards */
.quick-card,
.quick-access-card {
    background: var(--quick-card-bg) !important;
    border-color: var(--quick-card-border) !important;
}

.quick-card:hover,
.quick-access-card:hover {
    background: var(--quick-card-hover) !important;
}

/* Containers */
.container-fluid,
.main-content,
.content-wrapper {
    background: var(--bg-body) !important;
}

/* Profile page specific */
.profile-container {
    background: var(--bg-body) !important;
}

.profile-header {
    background: var(--card-bg) !important;
    border-color: var(--card-border) !important;
}

/* Setup page */
.setup-container {
    background: var(--bg-body) !important;
}

/* Login page */
.login-container {
    background: var(--bg-body) !important;
}

.login-box {
    background: var(--card-bg) !important;
    border-color: var(--card-border) !important;
}

/* Accent colored elements */
.accent-bg {
    background: var(--accent-primary) !important;
}

.accent-text {
    color: var(--accent-primary) !important;
}

.accent-border {
    border-color: var(--accent-primary) !important;
}

/* Portal specific */
.portal-card {
    background: var(--card-bg) !important;
    border-color: var(--card-border) !important;
}

.portal-header {
    background: var(--navbar-bg) !important;
}

/* Toastr customization */
.toast {
    background: var(--card-bg) !important;
    border-color: var(--border-color) !important;
    color: var(--text-primary) !important;
}

/* DataTables */
.dataTables_wrapper {
    background: var(--bg-body) !important;
}

.dataTables_wrapper .dataTables_length,
.dataTables_wrapper .dataTables_filter,
.dataTables_wrapper .dataTables_info,
.dataTables_wrapper .dataTables_processing,
.dataTables_wrapper .dataTables_paginate {
    color: var(--text-secondary) !important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button {
    color: var(--text-primary) !important;
    background: var(--bg-secondary) !important;
    border-color: var(--border-color) !important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button.current {
    background: var(--accent-primary) !important;
    border-color: var(--accent-primary) !important;
    color: var(--btn-primary-text) !important;
}

/* Select2 */
.select2-container--bootstrap-5 .select2-selection {
    background: var(--bg-input) !important;
    border-color: var(--border-color) !important;
    color: var(--text-primary) !important;
}

.select2-container--bootstrap-5 .select2-dropdown {
    background: var(--dropdown-bg) !important;
    border-color: var(--dropdown-border) !important;
}

.select2-container--bootstrap-5 .select2-results__option {
    color: var(--text-primary) !important;
}

.select2-container--bootstrap-5 .select2-results__option--highlighted {
    background: var(--dropdown-item-hover) !important;
}

/* List groups */
.list-group-item {
    background: var(--card-bg) !important;
    border-color: var(--border-color) !important;
    color: var(--text-primary) !important;
}

.list-group-item:hover {
    background: var(--bg-card-hover) !important;
}

/* Tabs and Navs */
.nav-tabs .nav-link {
    color: var(--text-secondary) !important;
    border-color: var(--border-color) !important;
}

.nav-tabs .nav-link.active {
    background: var(--bg-secondary) !important;
    border-color: var(--border-color) !important;
    color: var(--accent-primary) !important;
}

.nav-pills .nav-link {
    color: var(--text-secondary) !important;
}

.nav-pills .nav-link.active {
    background: var(--accent-primary) !important;
    color: var(--btn-primary-text) !important;
}

/* Accordion */
.accordion-item {
    background: var(--card-bg) !important;
    border-color: var(--border-color) !important;
}

.accordion-button {
    background: var(--bg-secondary) !important;
    color: var(--text-primary) !important;
}

.accordion-button:not(.collapsed) {
    background: var(--accent-primary) !important;
    color: var(--btn-primary-text) !important;
}

/* Popovers and Tooltips */
.popover {
    background: var(--dropdown-bg) !important;
    border-color: var(--dropdown-border) !important;
}

.popover-header {
    background: var(--bg-secondary) !important;
    border-color: var(--border-color) !important;
    color: var(--text-heading) !important;
}

.popover-body {
    color: var(--text-primary) !important;
}

.tooltip-inner {
    background: var(--bg-tertiary) !important;
    color: var(--text-primary) !important;
}

/* Breadcrumbs */
.breadcrumb {
    background: var(--bg-secondary) !important;
}

.breadcrumb-item {
    color: var(--text-secondary) !important;
}

.breadcrumb-item.active {
    color: var(--text-primary) !important;
}

.breadcrumb-item a {
    color: var(--text-link) !important;
}

/* Pagination */
.page-item .page-link {
    background: var(--bg-secondary) !important;
    border-color: var(--border-color) !important;
    color: var(--text-primary) !important;
}

.page-item.active .page-link {
    background: var(--accent-primary) !important;
    border-color: var(--accent-primary) !important;
    color: var(--btn-primary-text) !important;
}

.page-item.disabled .page-link {
    background: var(--bg-tertiary) !important;
    color: var(--text-muted) !important;
}

/* Close buttons */
.btn-close {
    filter: invert(1);
}

/* Code blocks */
code,
pre {
    background: var(--bg-tertiary) !important;
    color: var(--accent-primary) !important;
}

/* HR */
hr {
    border-color: var(--border-color) !important;
}

/* Spinner */
.spinner-border,
.spinner-grow {
    color: var(--accent-primary) !important;
}
