/**
 * PAuLMARA Dark Theme
 * Zentrale Overrides für html[data-theme="dark"]
 */

/* ==========================================================================
   CORE VARIABLES — Grauskala invertiert, Primary aufgehellt
   ========================================================================== */
html[data-theme="dark"] {
    --gray-50:  #0f172a;
    --gray-100: #1e293b;
    --gray-200: #334155;
    --gray-300: #475569;
    --gray-400: #64748b;
    --gray-500: #94a3b8;
    --gray-600: #cbd5e1;
    --gray-700: #e2e8f0;
    --gray-800: #f1f5f9;
    --gray-900: #f8fafc;

    --primary-color: #22a5b8;
    --primary-dark: #60a5fa;

    /* LeO / HuBI Variablen */
    --text-dark: #e2e8f0;
    --text-muted: #94a3b8;
    --bg-light: #0f172a;
    --white: #1e293b;

    /* LeO Status */
    --status-neu-bg: #450a0a;
    --status-neu-text: #fca5a5;
    --status-termin-bg: #0c2d48;
    --status-termin-text: #7dd3fc;
    --status-arbeit-bg: #1e293b;
    --status-arbeit-text: #cbd5e1;
    --status-ok-bg: #052e16;
    --status-ok-text: #86efac;
    --status-warn-bg: #451a03;
    --status-warn-text: #fcd34d;

    /* HuBI Status */
    --green-light: #052e16;
    --green-dark: #86efac;
    --red-light: #450a0a;
    --red-dark: #fca5a5;
    --yellow-light: #451a03;
    --yellow-dark: #fcd34d;

    color-scheme: dark;
}

/* ==========================================================================
   BODY
   ========================================================================== */
html[data-theme="dark"] body {
    background-color: #0f172a;
    color: #e2e8f0;
}

/* ==========================================================================
   CARDS
   ========================================================================== */
html[data-theme="dark"] .card,
html[data-theme="dark"] .stat-card,
html[data-theme="dark"] .kpi-card {
    background: #1e293b;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.4);
    border-color: #334155;
}

/* ==========================================================================
   TABLES
   ========================================================================== */
html[data-theme="dark"] .table-container {
    background: #1e293b;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.4);
}

html[data-theme="dark"] th {
    background: #0f172a;
    color: #cbd5e1;
    border-bottom-color: #475569;
}

html[data-theme="dark"] td {
    border-bottom-color: #334155;
}

html[data-theme="dark"] tr:hover td,
html[data-theme="dark"] .table tr:hover,
html[data-theme="dark"] .data-table tr:hover {
    background: #334155;
}

html[data-theme="dark"] .data-table th {
    background-color: #0f172a;
    color: #94a3b8;
    border-bottom-color: #475569;
}

html[data-theme="dark"] .data-table td {
    border-bottom-color: #334155;
}

/* ==========================================================================
   FORMS
   ========================================================================== */
html[data-theme="dark"] input[type="text"],
html[data-theme="dark"] input[type="email"],
html[data-theme="dark"] input[type="password"],
html[data-theme="dark"] input[type="search"],
html[data-theme="dark"] input[type="date"],
html[data-theme="dark"] input[type="datetime-local"],
html[data-theme="dark"] input[type="number"],
html[data-theme="dark"] select,
html[data-theme="dark"] textarea,
html[data-theme="dark"] .form-input,
html[data-theme="dark"] .form-select,
html[data-theme="dark"] .form-textarea {
    background: #0f172a;
    color: #e2e8f0;
    border-color: #475569;
}

html[data-theme="dark"] input:focus,
html[data-theme="dark"] select:focus,
html[data-theme="dark"] textarea:focus,
html[data-theme="dark"] .form-input:focus,
html[data-theme="dark"] .form-select:focus,
html[data-theme="dark"] .form-textarea:focus {
    border-color: #22a5b8;
    box-shadow: 0 0 0 3px rgba(34, 165, 184, 0.2);
}

html[data-theme="dark"] label {
    color: #cbd5e1;
}

html[data-theme="dark"] .form-hint {
    color: #94a3b8;
}

/* ==========================================================================
   BUTTONS
   ========================================================================== */
html[data-theme="dark"] .btn-primary {
    background: #22a5b8;
    color: #0f172a;
}

html[data-theme="dark"] .btn-primary:hover {
    background: #2dd4bf;
}

html[data-theme="dark"] .btn-secondary {
    background: #334155;
    color: #e2e8f0;
}

html[data-theme="dark"] .btn-secondary:hover {
    background: #475569;
}

/* ==========================================================================
   MODALS
   ========================================================================== */
html[data-theme="dark"] .modal-content,
html[data-theme="dark"] .modal-box,
html[data-theme="dark"] .file-modal {
    background: #1e293b;
    color: #e2e8f0;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.5);
}

html[data-theme="dark"] .modal-header,
html[data-theme="dark"] .file-modal-header {
    border-bottom-color: #334155;
}

html[data-theme="dark"] .modal-footer,
html[data-theme="dark"] .file-modal-actions {
    border-top-color: #334155;
    background: #0f172a;
}

html[data-theme="dark"] .modal-overlay,
html[data-theme="dark"] .file-modal-overlay {
    background: rgba(0, 0, 0, 0.7);
}

/* ==========================================================================
   NAVIGATION TABS
   ========================================================================== */
html[data-theme="dark"] .nav-tabs {
    background: #1e293b;
    border-bottom-color: #334155;
}

html[data-theme="dark"] .nav-tab {
    color: #94a3b8;
}

html[data-theme="dark"] .nav-tab:hover {
    color: #e2e8f0;
}

html[data-theme="dark"] .nav-tab.active {
    color: #22a5b8;
    border-bottom-color: #22a5b8;
    background-color: rgba(34, 165, 184, 0.1);
}

/* ==========================================================================
   ALERTS / BADGES (Dark-taugliche Varianten)
   ========================================================================== */
html[data-theme="dark"] .alert-success,
html[data-theme="dark"] .badge-success {
    background: #052e16;
    color: #86efac;
    border-color: #10b981;
}

html[data-theme="dark"] .alert-error,
html[data-theme="dark"] .alert-danger,
html[data-theme="dark"] .badge-danger {
    background: #450a0a;
    color: #fca5a5;
    border-color: #ef4444;
}

html[data-theme="dark"] .alert-warning,
html[data-theme="dark"] .badge-warning {
    background: #451a03;
    color: #fcd34d;
    border-color: #f59e0b;
}

html[data-theme="dark"] .alert-info,
html[data-theme="dark"] .badge-info {
    background: #0c2d48;
    color: #7dd3fc;
    border-color: #3b82f6;
}

html[data-theme="dark"] .badge-secondary {
    background: #334155;
    color: #cbd5e1;
}

/* ==========================================================================
   SIDEBAR (IdP Admin, System Admin)
   ========================================================================== */
html[data-theme="dark"] .admin-sidebar {
    background: #0f172a;
    border-right: 1px solid #334155;
}

html[data-theme="dark"] .sidebar-header {
    border-bottom-color: #334155;
}

html[data-theme="dark"] .nav-link:hover {
    background: rgba(34, 165, 184, 0.1);
}

html[data-theme="dark"] .nav-link.active {
    background: rgba(34, 165, 184, 0.2);
    border-left-color: #22a5b8;
}

/* ==========================================================================
   FILTERS BAR
   ========================================================================== */
html[data-theme="dark"] .filters-bar {
    background: #1e293b;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.4);
}

/* ==========================================================================
   PAGINATION
   ========================================================================== */
html[data-theme="dark"] .page-link {
    background: #1e293b;
    color: #cbd5e1;
    border-color: #475569;
}

html[data-theme="dark"] .page-link:hover {
    background: #334155;
}

html[data-theme="dark"] .page-link.active {
    background: #22a5b8;
    color: #0f172a;
    border-color: #22a5b8;
}

/* ==========================================================================
   JSON DETAILS (Audit-Log)
   ========================================================================== */
html[data-theme="dark"] .json-full {
    background: #1e293b;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.5);
}

html[data-theme="dark"] .json-preview {
    color: #94a3b8;
}

/* ==========================================================================
   HR / DIVIDERS
   ========================================================================== */
html[data-theme="dark"] hr {
    border-color: #334155;
}

/* ==========================================================================
   CHECKBOX DESCRIPTION
   ========================================================================== */
html[data-theme="dark"] .checkbox-description {
    color: #94a3b8;
}

/* ==========================================================================
   FORM SECTIONS (MARA)
   ========================================================================== */
html[data-theme="dark"] .form-section,
html[data-theme="dark"] .form-section-compact {
    background: #0f172a;
    border-color: #334155;
}

/* ==========================================================================
   SCROLLBARS
   ========================================================================== */
html[data-theme="dark"] ::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

html[data-theme="dark"] ::-webkit-scrollbar-track {
    background: #0f172a;
}

html[data-theme="dark"] ::-webkit-scrollbar-thumb {
    background: #475569;
    border-radius: 4px;
}

html[data-theme="dark"] ::-webkit-scrollbar-thumb:hover {
    background: #64748b;
}

/* ==========================================================================
   LINKS
   ========================================================================== */
html[data-theme="dark"] a {
    color: #22a5b8;
}

html[data-theme="dark"] a:hover {
    color: #2dd4bf;
}

/* ==========================================================================
   CODE BLOCKS
   ========================================================================== */
html[data-theme="dark"] code {
    background: #0f172a;
    color: #e2e8f0;
}

/* ==========================================================================
   LOADING SPINNER
   ========================================================================== */
html[data-theme="dark"] .spinner {
    border-color: #334155;
    border-top-color: #22a5b8;
}

/* ==========================================================================
   SUB-NAV (MARA)
   ========================================================================== */
html[data-theme="dark"] .sub-nav-tabs {
    border-bottom-color: #334155;
}

html[data-theme="dark"] .sub-nav-tab:hover {
    background: #1e293b;
}

html[data-theme="dark"] .sub-nav-tab.active {
    color: #22a5b8;
    border-bottom-color: #22a5b8;
    background: #1e293b;
}

html[data-theme="dark"] .sub-nav-hamburger {
    background: #1e293b;
    border-color: #475569;
    color: #e2e8f0;
}

/* ==========================================================================
   MARA STATUS BADGES
   ========================================================================== */
html[data-theme="dark"] .status-offen {
    background: #334155;
    color: #e2e8f0;
}

html[data-theme="dark"] .status-in-bearbeitung {
    background: #451a03;
    color: #fcd34d;
}

html[data-theme="dark"] .status-in-erledigung {
    background: #0c2d48;
    color: #7dd3fc;
}

html[data-theme="dark"] .status-erledigt {
    background: #052e16;
    color: #86efac;
}

html[data-theme="dark"] .status-geschlossen {
    background: #334155;
    color: #94a3b8;
}

/* ==========================================================================
   MARA TOURMELDUNG WARNING
   ========================================================================== */
html[data-theme="dark"] .tourmeldung-warning {
    background: linear-gradient(135deg, #0c2d48 0%, #1e3a5f 100%);
    border-color: #3b82f6;
    color: #7dd3fc;
}

/* ==========================================================================
   MARA FRAKTION ROW COLORS
   ========================================================================== */
html[data-theme="dark"] .fraktion-lvp {
    background-color: rgba(234, 179, 8, 0.15);
}
html[data-theme="dark"] tr.fraktion-lvp:hover {
    background-color: rgba(234, 179, 8, 0.25);
}
html[data-theme="dark"] .fraktion-hm {
    background-color: rgba(148, 163, 184, 0.15);
}
html[data-theme="dark"] tr.fraktion-hm:hover {
    background-color: rgba(148, 163, 184, 0.25);
}
html[data-theme="dark"] .fraktion-bio {
    background-color: rgba(34, 197, 94, 0.15);
}
html[data-theme="dark"] tr.fraktion-bio:hover {
    background-color: rgba(34, 197, 94, 0.25);
}
html[data-theme="dark"] .fraktion-ppk {
    background-color: rgba(96, 165, 250, 0.15);
}
html[data-theme="dark"] tr.fraktion-ppk:hover {
    background-color: rgba(96, 165, 250, 0.25);
}
html[data-theme="dark"] .pruefen,
html[data-theme="dark"] .status-pruefen {
    background-color: rgba(248, 113, 113, 0.2);
}
html[data-theme="dark"] tr.pruefen:hover,
html[data-theme="dark"] tr.status-pruefen:hover {
    background-color: rgba(248, 113, 113, 0.35);
}

/* ==========================================================================
   MARA RECURRING WARNING
   ========================================================================== */
html[data-theme="dark"] .recurring-warning {
    background: #451a03;
    border-color: #f59e0b;
    color: #fcd34d;
}

/* ==========================================================================
   LEO — Termin-Box, Readonly, File-Indicator
   ========================================================================== */
html[data-theme="dark"] .termin-box {
    background: #0f172a;
    border-left-color: #475569;
}

html[data-theme="dark"] .termin-box--pending {
    border-left-color: var(--status-warn-text);
    background: var(--status-warn-bg);
}

html[data-theme="dark"] .termin-box--confirmed {
    border-left-color: var(--status-ok-text);
    background: var(--status-ok-bg);
}

html[data-theme="dark"] .termin-box--rejected {
    border-left-color: var(--status-neu-text);
    background: var(--status-neu-bg);
}

html[data-theme="dark"] .file-indicator {
    background-color: #0c2d48;
    color: #7dd3fc;
}

html[data-theme="dark"] .file-indicator:hover {
    background-color: #1e3a5f;
}

html[data-theme="dark"] .card-header {
    border-bottom-color: #334155;
}

/* ==========================================================================
   HuBI — Waste Cards (behalten ihre bunten Farben, aber angepasst)
   ========================================================================== */
html[data-theme="dark"] .waste-card.status-green {
    background: linear-gradient(135deg, #052e16 0%, #064e3b 100%);
    border-color: #10b981;
}

html[data-theme="dark"] .waste-card.status-red {
    background: linear-gradient(135deg, #450a0a 0%, #7f1d1d 100%);
    border-color: #ef4444;
}

html[data-theme="dark"] .waste-card.status-yellow {
    background: linear-gradient(135deg, #451a03 0%, #78350f 100%);
    border-color: #f59e0b;
}

html[data-theme="dark"] .waste-card h3 {
    color: #e2e8f0;
}

html[data-theme="dark"] .status-indicator {
    background: rgba(0, 0, 0, 0.4);
}

/* HuBI — License Plate */
html[data-theme="dark"] .license-plate {
    background: #f8fafc;
    color: #000;
    border-color: #475569;
}

/* HuBI — Vehicle Card */
html[data-theme="dark"] .vehicle-card {
    background: #1e293b;
    border-color: #334155;
}

html[data-theme="dark"] .vehicle-card:hover {
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);
}

/* HuBI — Legend Badges */
html[data-theme="dark"] .badge-legend.green {
    background: #052e16;
    color: #86efac;
    border-color: #10b981;
}

html[data-theme="dark"] .badge-legend.red {
    background: #450a0a;
    color: #fca5a5;
    border-color: #ef4444;
}

html[data-theme="dark"] .badge-legend.yellow {
    background: #451a03;
    color: #fcd34d;
    border-color: #f59e0b;
}

/* HuBI — Fraction Badge */
html[data-theme="dark"] .fraction-badge {
    background: #334155;
    color: #e2e8f0;
}

/* ==========================================================================
   IdP ADMIN — Checkbox Description, Empty State
   ========================================================================== */
html[data-theme="dark"] .empty-state {
    color: #94a3b8;
}

html[data-theme="dark"] .empty-state h3 {
    color: #e2e8f0;
}

/* ==========================================================================
   SYSTEM ADMIN — Stat Cards, Header
   ========================================================================== */
html[data-theme="dark"] .admin-header {
    background: #0f172a;
    border-bottom-color: #334155;
}

html[data-theme="dark"] .stat-header .stat-icon {
    opacity: 0.9;
}

html[data-theme="dark"] .card-footer {
    background: #0f172a;
    border-top-color: #334155;
}

/* ==========================================================================
   IdP ADMIN — Stat Icon Backgrounds
   ========================================================================== */
html[data-theme="dark"] .stat-icon.users { background: #052e16; color: #86efac; }
html[data-theme="dark"] .stat-icon.logins { background: #0c2d48; color: #7dd3fc; }
html[data-theme="dark"] .stat-icon.sessions { background: #451a03; color: #fcd34d; }
html[data-theme="dark"] .stat-icon.events { background: #2d1b4e; color: #d8b4fe; }

/* ==========================================================================
   SELECTION
   ========================================================================== */
html[data-theme="dark"] ::selection {
    background: rgba(34, 165, 184, 0.3);
    color: #f8fafc;
}