/* ==========================================
   Theme System - CSS Custom Properties
   Dark/Light mode support via data-bs-theme

   Token contract: tokens defined here are the runtime
   source of truth. Maps 1:1 to docs/Design System.html.
   Never reference raw hex values from product code —
   always go through a variable defined in this file.
   ========================================== */

/* ==========================================
   Theme-independent product tokens
   These don't change between light and dark modes.
   ========================================== */
:root {
    /* Brand */
    --udst-navy:        #003366;
    --udst-navy-deep:   #002244;
    --udst-blue:        #0066cc;
    --udst-blue-hover:  #004499;

    /* Section accents — one per top-level area of the app.
       Use as 3px underline / left bar / chart accent.
       Never use one section's accent in another section. */
    --accent-scheduler: #4facfe;
    --accent-simulator: #a855f7;
    --accent-reports:   #f97316;
    --accent-analytics: #00f2fe;
    --accent-admin:     #fbbf24;
    --accent-demand:    #10b981;

    /* Section types — used in calendar events and section badges.
       RESERVED. Never use for any other meaning. */
    --sec-lecture:         #007bff;
    --sec-lecture-theater: #6f42c1;
    --sec-lab:             #28a745;
    --sec-tutorial:        #17a2b8;
    --sec-seminar:         #e83e8c;
    --sec-workshop:        #fd7e14;

    /* Capacity scale — fill a room as it fills up.
       FIXED. Used by .capacity-low/medium/high/full/over. */
    --cap-low:    #28a745;
    --cap-medium: #ffc107;
    --cap-high:   #fd7e14;
    --cap-full:   #dc3545;
    --cap-over:   #6f42c1;

    /* Status — semantic colors for alerts, validations, badges. */
    --primary-color:  #0066cc;
    --secondary-color: #6c757d;
    --success-color:  #28a745;
    --warning-color:  #ffc107;
    --danger-color:   #dc3545;
    --info-color:     #17a2b8;

    /* Spacing — 8pt grid with 4px half-step */
    --s-1: 4px;
    --s-2: 8px;
    --s-3: 12px;
    --s-4: 16px;
    --s-5: 24px;
    --s-6: 32px;
    --s-7: 48px;
    --s-8: 64px;

    /* Radius */
    --r-xs:   4px;   /* Thin progress bars, capacity fills, dot indicators */
    --r-sm:   6px;
    --r-md:   8px;   /* Buttons & inputs */
    --r-lg:   12px;  /* Cards */
    --r-xl:   20px;  /* Modals & mode pickers */
    --r-pill: 999px; /* Status pills */

    /* Type */
    --font-sans: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    --font-mono: 'JetBrains Mono', 'SF Mono', 'Fira Code', Consolas, monospace;

    /* Simulator-only signature gradient.
       NEVER use outside the simulator surface. */
    --simulator-gradient: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    --simulator-gradient-deep: linear-gradient(135deg, #3a4a8a 0%, #4a2d6a 100%);
}

/* Light Theme (default) */
[data-bs-theme="light"] {
    /* Body */
    --theme-body-bg: #f5f7fa;
    --theme-body-fg: #212529;

    /* Surfaces */
    --theme-surface-bg: #ffffff;
    --theme-surface-fg: #212529;
    --theme-surface-secondary: #f8f9fa;
    --theme-surface-secondary-fg: #495057;
    --theme-surface-tertiary: #e9ecef;

    /* Borders */
    --theme-border-color: #dee2e6;
    --theme-border-light: #e9ecef;

    /* Shadows */
    --theme-shadow-sm: 0 2px 4px rgba(0, 0, 0, 0.08);
    --theme-shadow-md: 0 4px 12px rgba(0, 0, 0, 0.1);
    --theme-shadow-lg: 0 8px 32px rgba(0, 0, 0, 0.1);

    /* Inputs */
    --theme-input-bg: #ffffff;
    --theme-input-border: #dee2e6;
    --theme-input-focus-border: #0066cc;

    /* Text */
    --theme-text-primary: #212529;
    --theme-text-secondary: #495057;
    --theme-text-muted: #6c757d;

    /* Context Menu */
    --theme-context-bg: #ffffff;
    --theme-context-hover: #f8f9fa;
    --theme-context-border: #dee2e6;
    --theme-context-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);

    /* Search Highlight */
    --theme-search-highlight-bg: #fff3cd;
    --theme-search-highlight-border: #ffeaa7;

    /* Tables */
    --theme-table-header-bg: #343a40;
    --theme-table-header-fg: #ffffff;
    --theme-table-header-muted-fg: #ced4da;
    --theme-table-hover-bg: rgba(0, 102, 204, 0.05);
    --theme-table-border: #dee2e6;
    --theme-table-stripe-bg: rgba(0, 0, 0, 0.02);

    /* Scrollbar */
    --theme-scrollbar-track: #f1f1f1;
    --theme-scrollbar-thumb: #6c757d;
    --theme-scrollbar-thumb-hover: #343a40;

    /* Loading Overlay */
    --theme-loading-bg: linear-gradient(135deg, #f8f9fa, #e9ecef);
    --theme-loading-surface: #ffffff;

    /* Dropdown */
    --theme-dropdown-bg: #ffffff;
    --theme-dropdown-hover: #f8f9fa;
    --theme-dropdown-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);

    /* Slot Finder */
    --theme-slot-finder-bg: #ffffff;
    --theme-slot-results-header: #f8f9fa;

    /* Pattern Grid */
    --theme-pattern-header-bg: #e9ecef;
    --theme-pattern-time-bg: #f8f9fa;
    --theme-pattern-cell-bg: #ffffff;
    --theme-pattern-grid-border: #dee2e6;

    /* College Faculty Card */
    --theme-faculty-card-bg: #ffffff;
    --theme-faculty-card-border: #e9ecef;
    --theme-faculty-card-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
    --theme-faculty-card-hover-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);

    /* Expanded Content */
    --theme-expanded-bg: #ffffff;
    --theme-expanded-border: #e9ecef;

    /* Misc */
    --theme-code-bg: #f8f9fa;
    --theme-badge-muted-bg: #e9ecef;

    /* Navbar */
    --theme-navbar-bg: rgba(0, 51, 102, 0.95);
    --theme-page-title-bg: linear-gradient(135deg, #003366 0%, #004d99 100%);

    /* Ramadan Mode */
    --theme-ramadan-banner-bg: linear-gradient(135deg, #fff8e1, #ffecb3);
    --theme-ramadan-banner-border: #f9a825;
    --theme-ramadan-banner-fg: #5d4037;
    --theme-ramadan-accent: #f9a825;
    --theme-ramadan-accent-deep: #f57f17;
    --theme-ramadan-glow: 0 4px 16px rgba(249, 168, 37, 0.4);

    /* Inline alert tokens (shared with .alert.ok/err/warn/info) */
    --alert-ok-bg:      #d4edda;
    --alert-ok-border:  #c3e6cb;
    --alert-ok-fg:      #155724;
    --alert-err-bg:     #f8d7da;
    --alert-err-border: #f5c6cb;
    --alert-err-fg:     #721c24;
    --alert-warn-bg:    #fff3cd;
    --alert-warn-border: #ffeaa7;
    --alert-warn-fg:    #5a4400;
    --alert-info-bg:    #cff4fc;
    --alert-info-border: #b6effb;
    --alert-info-fg:    #055160;

    /* Hover/focus utility tokens */
    --primary-color-hover: #004499;
    --focus-ring-primary: 0 0 0 0.2rem rgba(0, 102, 204, 0.25);
    --focus-ring-success: 0 0 0 0.2rem rgba(40, 167, 69, 0.25);
}

/* Dark Theme */
[data-bs-theme="dark"] {
    /* Body */
    --theme-body-bg: #1a1d21;
    --theme-body-fg: #e9ecef;

    /* Surfaces */
    --theme-surface-bg: #212529;
    --theme-surface-fg: #e9ecef;
    --theme-surface-secondary: #2b3035;
    --theme-surface-secondary-fg: #adb5bd;
    --theme-surface-tertiary: #343a40;

    /* Borders */
    --theme-border-color: #495057;
    --theme-border-light: #343a40;

    /* Shadows */
    --theme-shadow-sm: 0 2px 4px rgba(0, 0, 0, 0.3);
    --theme-shadow-md: 0 4px 12px rgba(0, 0, 0, 0.4);
    --theme-shadow-lg: 0 8px 32px rgba(0, 0, 0, 0.5);

    /* Inputs */
    --theme-input-bg: #2b3035;
    --theme-input-border: #495057;
    --theme-input-focus-border: #4d94ff;

    /* Text */
    --theme-text-primary: #e9ecef;
    --theme-text-secondary: #adb5bd;
    --theme-text-muted: #8c959d;

    /* Context Menu */
    --theme-context-bg: #2b3035;
    --theme-context-hover: #343a40;
    --theme-context-border: #495057;
    --theme-context-shadow: 0 4px 12px rgba(0, 0, 0, 0.5);

    /* Search Highlight */
    --theme-search-highlight-bg: #5c4b1f;
    --theme-search-highlight-border: #7a6423;

    /* Tables */
    --theme-table-header-bg: #2b3035;
    --theme-table-header-fg: #e9ecef;
    --theme-table-header-muted-fg: #adb5bd;
    --theme-table-hover-bg: rgba(77, 148, 255, 0.08);
    --theme-table-border: #495057;
    --theme-table-stripe-bg: rgba(255, 255, 255, 0.02);

    /* Scrollbar */
    --theme-scrollbar-track: #2b3035;
    --theme-scrollbar-thumb: #495057;
    --theme-scrollbar-thumb-hover: #6c757d;

    /* Loading Overlay */
    --theme-loading-bg: linear-gradient(135deg, #1a1d21, #212529);
    --theme-loading-surface: #2b3035;

    /* Dropdown */
    --theme-dropdown-bg: #2b3035;
    --theme-dropdown-hover: #343a40;
    --theme-dropdown-shadow: 0 4px 12px rgba(0, 0, 0, 0.5);

    /* Slot Finder */
    --theme-slot-finder-bg: #2b3035;
    --theme-slot-results-header: #343a40;

    /* Pattern Grid */
    --theme-pattern-header-bg: #343a40;
    --theme-pattern-time-bg: #2b3035;
    --theme-pattern-cell-bg: #212529;
    --theme-pattern-grid-border: #495057;

    /* College Faculty Card */
    --theme-faculty-card-bg: #212529;
    --theme-faculty-card-border: #343a40;
    --theme-faculty-card-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
    --theme-faculty-card-hover-shadow: 0 4px 16px rgba(0, 0, 0, 0.4);

    /* Expanded Content */
    --theme-expanded-bg: #2b3035;
    --theme-expanded-border: #343a40;

    /* Misc */
    --theme-code-bg: #2b3035;
    --theme-badge-muted-bg: #343a40;

    /* Navbar */
    --theme-navbar-bg: rgba(0, 51, 102, 0.97);
    --theme-page-title-bg: linear-gradient(135deg, #002244 0%, #003d7a 100%);

    /* Ramadan Mode */
    --theme-ramadan-banner-bg: linear-gradient(135deg, #3e2723, #4e342e);
    --theme-ramadan-banner-border: #f9a825;
    --theme-ramadan-banner-fg: #ffe082;
    --theme-ramadan-accent: #f9a825;
    --theme-ramadan-accent-deep: #ffd54f;
    --theme-ramadan-glow: 0 4px 16px rgba(249, 168, 37, 0.6);

    /* Inline alert tokens — dark mode */
    --alert-ok-bg:      rgba(40, 167, 69, 0.18);
    --alert-ok-border:  rgba(40, 167, 69, 0.4);
    --alert-ok-fg:      #6ee7a3;
    --alert-err-bg:     rgba(220, 53, 69, 0.18);
    --alert-err-border: rgba(220, 53, 69, 0.4);
    --alert-err-fg:     #f5a3ab;
    --alert-warn-bg:    rgba(255, 193, 7, 0.16);
    --alert-warn-border: rgba(255, 193, 7, 0.4);
    --alert-warn-fg:    #ffd966;
    --alert-info-bg:    rgba(23, 162, 184, 0.18);
    --alert-info-border: rgba(23, 162, 184, 0.4);
    --alert-info-fg:    #76d3e3;

    /* Hover/focus utility tokens — dark mode */
    --primary-color-hover: #4d94ff;
    --focus-ring-primary: 0 0 0 0.2rem rgba(77, 148, 255, 0.35);
    --focus-ring-success: 0 0 0 0.2rem rgba(40, 167, 69, 0.35);

    /* FullCalendar Dark Mode Overrides */
    --fc-border-color: #495057;
    --fc-page-bg-color: #212529;
    --fc-neutral-bg-color: #2b3035;
    --fc-today-bg-color: rgba(77, 148, 255, 0.08);
    --fc-list-event-hover-bg-color: #343a40;
    --fc-highlight-color: rgba(77, 148, 255, 0.12);
}

/* Smooth theme transition */
.theme-transition,
.theme-transition *,
.theme-transition *::before,
.theme-transition *::after {
    transition: background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease !important;
}

/* Theme toggle button */
.theme-toggle {
    border: none;
    background: transparent;
    cursor: pointer;
    padding: 0.375rem 0.75rem;
    border-radius: 8px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s ease;
}

.theme-toggle .theme-icon {
    font-size: 1rem;
    transition: transform 0.3s ease;
}

.theme-toggle:hover .theme-icon {
    transform: rotate(30deg);
}

/* Fixed position toggle (for login, landing pages) */
.theme-toggle-fixed {
    position: fixed;
    top: 1rem;
    right: 1rem;
    z-index: 1050;
    background: rgba(255, 255, 255, 0.15);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.2);
    color: white;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.2s ease;
}

.theme-toggle-fixed:hover {
    background: rgba(255, 255, 255, 0.25);
    transform: scale(1.1);
}

[data-bs-theme="light"] .theme-toggle-fixed {
    background: rgba(0, 0, 0, 0.1);
    border-color: rgba(0, 0, 0, 0.15);
    color: #333;
}

[data-bs-theme="light"] .theme-toggle-fixed:hover {
    background: rgba(0, 0, 0, 0.2);
}