/* EduAdmin — Dark mode overrides (html[data-theme="dark"]) */

/* ====== TOPBAR & SIDEBAR ====== */
html[data-theme="dark"] .topbar {
  background: var(--nav-bg);
  border-bottom-color: var(--nav-border);
  box-shadow: 0 1px 0 rgba(0, 0, 0, 0.25), 0 4px 16px rgba(0, 0, 0, 0.2);
}

html[data-theme="dark"] .topbar-context-form select {
  background: var(--input-bg);
  border-color: var(--border);
  color: var(--text);
}

html[data-theme="dark"] .topbar-logo strong { color: var(--text); }
html[data-theme="dark"] .topbar-logo small { color: var(--text-light); }

html[data-theme="dark"] .topbar-btn,
html[data-theme="dark"] .sidebar-toggle {
  background: var(--nav-icon-bg);
  border-color: var(--border);
  color: var(--text-light);
}

html[data-theme="dark"] .topbar-btn:hover,
html[data-theme="dark"] .sidebar-toggle:hover {
  background: var(--nav-hover);
  color: var(--text);
}

html[data-theme="dark"] .topbar-search-btn {
  background: var(--input-bg);
  border-color: var(--border);
  color: var(--text-light);
}

html[data-theme="dark"] .topbar-search-btn:hover {
  background: var(--nav-hover);
  border-color: var(--border-dk);
  color: var(--text);
}

html[data-theme="dark"] .topbar-anio-consulta {
  background: var(--input-bg);
  border-color: var(--border);
  color: var(--text-light);
}
html[data-theme="dark"] .topbar-anio-consulta-badge {
  background: #422006;
  color: #fcd34d;
}

html[data-theme="dark"] .edu-pwa-install-banner-inner {
  background: linear-gradient(135deg, #1e1b4b 0%, #0f172a 100%);
  border-color: #4338ca;
}
html[data-theme="dark"] .edu-pwa-install-banner-text strong { color: #e0e7ff; }
html[data-theme="dark"] .edu-pwa-install-banner-text span { color: #94a3b8; }
html[data-theme="dark"] .edu-pwa-install-modal-card {
  background: var(--surface, #1e293b);
  color: var(--text, #e2e8f0);
}
html[data-theme="dark"] .edu-pwa-install-modal-card h2 { color: var(--text, #f1f5f9); }
html[data-theme="dark"] .edu-pwa-install-modal-card p,
html[data-theme="dark"] .edu-pwa-install-steps,
html[data-theme="dark"] .edu-pwa-install-hint { color: var(--text-light, #cbd5e1); }
html[data-theme="dark"] .edu-pwa-install-hint {
  background: var(--input-bg, #0f172a);
  border-color: var(--border, #334155);
}

html[data-theme="dark"] .topbar-search-btn kbd {
  background: var(--nav-icon-bg);
  border-color: var(--border);
  color: var(--text-muted);
}

html[data-theme="dark"] .sidebar {
  background: var(--nav-bg);
  border-right-color: var(--nav-border);
  box-shadow: 4px 0 24px rgba(0, 0, 0, 0.25);
}

html[data-theme="dark"] .nav-section-title::after {
  background: linear-gradient(90deg, var(--border), transparent);
}

html[data-theme="dark"] .nav-item.active,
html[data-theme="dark"] .nav-subitem.active {
  background: var(--nav-active-bg);
  color: var(--nav-active-text);
}

html[data-theme="dark"] .nav-item:hover,
html[data-theme="dark"] .nav-group-header:hover,
html[data-theme="dark"] .nav-subitem:hover {
  background: var(--nav-hover);
}

html[data-theme="dark"] .nav-group:nth-of-type(4n + 1) .nav-group-header i:first-child { background: #1e3a5f; color: #93c5fd; }
html[data-theme="dark"] .nav-group:nth-of-type(4n + 2) .nav-group-header i:first-child { background: #064e3b; color: #6ee7b7; }
html[data-theme="dark"] .nav-group:nth-of-type(4n + 3) .nav-group-header i:first-child { background: #422006; color: #fcd34d; }
html[data-theme="dark"] .nav-group:nth-of-type(4n + 4) .nav-group-header i:first-child { background: #4c1d95; color: #c4b5fd; }

/* ====== TABLAS ====== */
html[data-theme="dark"] thead tr { background: var(--surface-muted); }
html[data-theme="dark"] th.sortable-th:hover { background: var(--nav-active-bg); color: var(--nav-active-text); }
html[data-theme="dark"] th.sortable-th.sorted-asc,
html[data-theme="dark"] th.sortable-th.sorted-desc { background: var(--nav-active-bg); }
html[data-theme="dark"] tbody tr:hover { background: var(--nav-hover); }
html[data-theme="dark"] tbody tr:nth-child(even) { background: rgba(255, 255, 255, 0.02); }

/* ====== BOTONES ====== */
html[data-theme="dark"] .btn-secondary:hover { background: var(--nav-hover); }

/* ====== PAGE HEADER ====== */
html[data-theme="dark"] .page-header {
  background: linear-gradient(180deg, var(--white) 0%, var(--bg) 100%);
  border-color: var(--border);
}

html[data-theme="dark"] .page-header::before {
  background: linear-gradient(135deg, var(--nav-active-bg) 0%, transparent 60%);
}

/* ====== NOTIFICACIONES ====== */
html[data-theme="dark"] .notifications-panel {
  background: var(--surface-elevated);
  border-color: var(--border);
  box-shadow: var(--card-shadow-lg);
}

html[data-theme="dark"] .notifications-head {
  background: var(--surface-muted);
  border-bottom-color: var(--border);
}

html[data-theme="dark"] .notification-mini:hover { background: var(--nav-hover); }
html[data-theme="dark"] .notification-mini.unread { background: var(--nav-active-bg); }
html[data-theme="dark"] .notification-mini-icon { background: var(--nav-icon-bg); }

html[data-theme="dark"] .notif-mark-all {
  color: var(--nav-accent);
  background: var(--nav-active-bg);
}

html[data-theme="dark"] .notifications-empty { color: var(--text-light); }

/* ====== USER MENU ====== */
html[data-theme="dark"] .user-dropdown {
  background: var(--surface-elevated);
  border-color: var(--border);
  box-shadow: var(--card-shadow-lg);
}

html[data-theme="dark"] .user-dropdown a:hover { background: var(--nav-hover); }

/* ====== MODALES & OVERLAYS ====== */
html[data-theme="dark"] .estu-modal-head,
html[data-theme="dark"] .enc-modal-head,
html[data-theme="dark"] .enc-card-head {
  background: var(--surface-muted);
  border-bottom-color: var(--border);
}

html[data-theme="dark"] .estu-modal-card,
html[data-theme="dark"] .enc-modal,
html[data-theme="dark"] .enc-stat-card,
html[data-theme="dark"] .enc-card,
html[data-theme="dark"] .enc-item-card {
  background: var(--surface-elevated);
  border-color: var(--border);
  color: var(--text);
}

html[data-theme="dark"] .estu-modal-close {
  background: var(--input-bg);
  border-color: var(--border);
  color: var(--text-light);
}

html[data-theme="dark"] .enc-modal-overlay {
  background: var(--overlay);
}

html[data-theme="dark"] .vc-modal-backdrop,
html[data-theme="dark"] .modal-backdrop,
html[data-theme="dark"] .edu-modal-backdrop,
html[data-theme="dark"] .edu-modal-overlay,
html[data-theme="dark"] .piar-modal-overlay,
html[data-theme="dark"] .db-modal {
  background: var(--overlay);
}

html[data-theme="dark"] .vc-modal,
html[data-theme="dark"] .modal-content,
html[data-theme="dark"] .edu-modal-panel,
html[data-theme="dark"] .edu-modal,
html[data-theme="dark"] .piar-modal,
html[data-theme="dark"] .db-modal-panel {
  background: var(--surface-elevated);
  border-color: var(--border);
  color: var(--text);
}

html[data-theme="dark"] .vc-modal-head,
html[data-theme="dark"] .modal-header,
html[data-theme="dark"] .edu-modal-head,
html[data-theme="dark"] .piar-modal-head,
html[data-theme="dark"] .db-modal-head {
  background: var(--surface-muted);
  border-bottom-color: var(--border);
}

html[data-theme="dark"] .vc-search,
html[data-theme="dark"] .vc-modal-toolbar input {
  background: var(--input-bg);
  border-color: var(--border);
  color: var(--text);
}

html[data-theme="dark"] .vc-user-row:hover { background: var(--nav-hover); }

/* ====== COMMAND PALETTE ====== */
html[data-theme="dark"] .edu-cmd-backdrop { background: var(--overlay); }

html[data-theme="dark"] .edu-cmd-panel {
  background: var(--surface-elevated);
  border-color: var(--border);
  box-shadow: var(--card-shadow-lg);
}

html[data-theme="dark"] .edu-cmd-head {
  background: var(--surface-muted);
  border-bottom-color: var(--border);
}

html[data-theme="dark"] .edu-cmd-head input {
  background: transparent;
  color: var(--text);
}

html[data-theme="dark"] .edu-cmd-item:hover,
html[data-theme="dark"] .edu-cmd-item.active { background: var(--nav-hover); }

html[data-theme="dark"] .edu-cmd-item-icon { background: var(--nav-icon-bg); }
html[data-theme="dark"] .edu-cmd-item-body small,
html[data-theme="dark"] .edu-cmd-empty { color: var(--text-light); }

/* ====== DESIGN SYSTEM ====== */
html[data-theme="dark"] .edu-card,
html[data-theme="dark"] .edu-panel,
html[data-theme="dark"] .edu-stat {
  background: var(--white);
  border-color: var(--border);
}

html[data-theme="dark"] .edu-page-hero {
  background: linear-gradient(135deg, var(--nav-active-bg) 0%, var(--bg) 100%);
  border-color: var(--border);
}

html[data-theme="dark"] .edu-alert-danger {
  background: linear-gradient(180deg, var(--danger-bg) 0%, var(--white) 100%);
  border-color: color-mix(in srgb, var(--danger) 40%, var(--border));
}

html[data-theme="dark"] .edu-filter-bar {
  background: var(--surface-muted);
  border-color: var(--border);
}

html[data-theme="dark"] .db-role-widget {
  background: var(--white);
  border-color: var(--border);
}

html[data-theme="dark"] .db-role-widget a:hover { background: var(--nav-hover); }

/* ====== BOTTOM NAV (MÓVIL) ====== */
html[data-theme="dark"] .edu-bottom-nav {
  background: var(--nav-bg);
  border-top-color: var(--nav-border);
  box-shadow: 0 -4px 16px rgba(0, 0, 0, 0.25);
}

html[data-theme="dark"] .edu-bottom-nav a { color: var(--text-light); }
html[data-theme="dark"] .edu-bottom-nav a.is-active { color: var(--nav-accent); }

/* ====== FOOTER ====== */
html[data-theme="dark"] .app-footer {
  background: var(--nav-bg);
  border-top-color: var(--border);
  color: var(--text-light);
}

/* ====== FORMULARIOS ====== */
html[data-theme="dark"] .form-group input,
html[data-theme="dark"] .form-group select,
html[data-theme="dark"] .form-group textarea {
  background: var(--input-bg);
  border-color: var(--border);
  color: var(--text);
}

html[data-theme="dark"] .form-group input:focus,
html[data-theme="dark"] .form-group select:focus,
html[data-theme="dark"] .form-group textarea:focus {
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary) 25%, transparent);
}

html[data-theme="dark"] .search-box {
  background: var(--input-bg);
  border-color: var(--border);
}

html[data-theme="dark"] .search-box input { color: var(--text); }

/* ====== TABS & PILLS ====== */
html[data-theme="dark"] .tab-btn,
html[data-theme="dark"] .pill-tab {
  background: var(--nav-icon-bg);
  border-color: var(--border);
  color: var(--text-light);
}

html[data-theme="dark"] .tab-btn.active,
html[data-theme="dark"] .pill-tab.active {
  background: var(--nav-active-bg);
  color: var(--nav-active-text);
  border-color: color-mix(in srgb, var(--primary) 40%, var(--border));
}

/* ====== BADGES & ALERTAS ====== */
html[data-theme="dark"] .alert-info { background: var(--info-bg); border-color: color-mix(in srgb, var(--info) 35%, var(--border)); }
html[data-theme="dark"] .alert-success { background: var(--success-bg); border-color: color-mix(in srgb, var(--success) 35%, var(--border)); }
html[data-theme="dark"] .alert-warning { background: var(--warning-bg); border-color: color-mix(in srgb, var(--warning) 35%, var(--border)); }
html[data-theme="dark"] .alert-error,
html[data-theme="dark"] .alert-danger { background: var(--danger-bg); border-color: color-mix(in srgb, var(--danger) 35%, var(--border)); }

/* ====== LOGIN ====== */
html[data-theme="dark"] .login-card {
  background: var(--surface-elevated) !important;
  border-color: var(--border) !important;
  box-shadow: 0 16px 48px rgba(0, 0, 0, 0.45) !important;
}

html[data-theme="dark"] .login-card-foot {
  background: var(--surface) !important;
  border-top-color: var(--border) !important;
}

html[data-theme="dark"] .login-header-logo {
  background: var(--surface) !important;
  border-color: var(--border) !important;
}

html[data-theme="dark"] .login-header-text strong,
html[data-theme="dark"] .login-title { color: var(--text) !important; }

html[data-theme="dark"] .login-header-text span,
html[data-theme="dark"] .login-subtitle { color: var(--text-light) !important; }

html[data-theme="dark"] .login-school-chip {
  background: color-mix(in srgb, var(--login-accent, var(--primary)) 12%, var(--surface)) !important;
  border-color: var(--border) !important;
}

html[data-theme="dark"] .login-school-chip span { color: var(--text) !important; }

html[data-theme="dark"] .login-progress { background: var(--border) !important; }

html[data-theme="dark"] .login-card .form-group label,
html[data-theme="dark"] .login-card label { color: var(--text) !important; }

html[data-theme="dark"] .login-field input,
html[data-theme="dark"] .login-card .form-group input,
html[data-theme="dark"] .login-card input {
  background: var(--input-bg) !important;
  border-color: var(--border) !important;
  color: var(--text) !important;
}

html[data-theme="dark"] .school-results {
  background: var(--surface-elevated) !important;
  border-color: var(--border) !important;
  box-shadow: var(--card-shadow-lg) !important;
}

html[data-theme="dark"] .school-option,
html[data-theme="dark"] .school-empty { color: var(--text) !important; }

html[data-theme="dark"] .school-option:hover,
html[data-theme="dark"] .school-option.is-active {
  background: var(--nav-active-bg) !important;
}

html[data-theme="dark"] .login-wrapper .login-card .form-group input {
  background: var(--input-bg) !important;
  border-color: var(--border) !important;
  color: var(--text) !important;
}

html[data-theme="dark"] .login-wrapper .alert-info,
html[data-theme="dark"] .login-wrapper .alert.alert-info {
  background: var(--info-bg) !important;
  border-color: color-mix(in srgb, var(--info) 35%, var(--border)) !important;
  color: var(--text) !important;
}

html[data-theme="dark"] .login-footer { color: var(--text-light) !important; }
html[data-theme="dark"] .login-hint { color: var(--text-light) !important; }
html[data-theme="dark"] .login-note { color: var(--text-muted) !important; }
html[data-theme="dark"] .login-note strong { color: var(--text-light) !important; }
html[data-theme="dark"] .login-legal { color: var(--text-muted) !important; }
html[data-theme="dark"] .login-divider { color: var(--text-muted) !important; }
html[data-theme="dark"] .login-divider::before,
html[data-theme="dark"] .login-divider::after { background: var(--border) !important; }

html[data-theme="dark"] .login-toggle-pwd:hover {
  background: var(--surface) !important;
  color: var(--text) !important;
}

html[data-theme="dark"] .school-selected { color: #6ee7b7 !important; }

html[data-theme="dark"] .alert-error {
  background: var(--danger-bg) !important;
  border-color: color-mix(in srgb, var(--danger) 40%, var(--border)) !important;
  color: #fca5a5 !important;
}

/* ====== TOGGLE TEMA ====== */
.theme-toggle {
  position: relative;
}

html[data-theme="dark"] .theme-toggle i.fa-sun {
  color: #fcd34d;
}

.login-theme-toggle {
  position: fixed;
  top: 16px;
  right: 16px;
  z-index: 100;
  width: 42px;
  height: 42px;
  border-radius: 12px;
  border: 1px solid rgba(255, 255, 255, 0.25);
  background: rgba(15, 23, 42, 0.55);
  color: #f8fafc;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  cursor: pointer;
  backdrop-filter: blur(8px);
  transition: background 0.2s, transform 0.15s;
}

.login-theme-toggle:hover {
  background: rgba(30, 41, 59, 0.85);
  transform: scale(1.04);
}

html[data-theme="dark"] .login-theme-toggle {
  border-color: var(--border);
  background: var(--surface-elevated);
  color: var(--text);
}

/* ====== SCROLLBAR (WebKit) ====== */
html[data-theme="dark"] ::-webkit-scrollbar { width: 10px; height: 10px; }
html[data-theme="dark"] ::-webkit-scrollbar-track { background: var(--bg); }
html[data-theme="dark"] ::-webkit-scrollbar-thumb {
  background: var(--border-dk);
  border-radius: 5px;
}
html[data-theme="dark"] ::-webkit-scrollbar-thumb:hover { background: var(--text-muted); }

/* ====== MÓDULO ACADÉMICO ====== */
html[data-theme="dark"] .acad-page {
  --acad-accent-soft: color-mix(in srgb, var(--acad-accent, #4f46e5) 20%, #1e293b);
  --acad-border: var(--border);
  --acad-muted: var(--text-light);
  --acad-shadow: var(--card-shadow);
}

html[data-theme="dark"] .acad-back-link,
html[data-theme="dark"] .acad-toolbar,
html[data-theme="dark"] .acad-stat-card,
html[data-theme="dark"] .acad-card,
html[data-theme="dark"] .acad-panel,
html[data-theme="dark"] .acad-table-wrap,
html[data-theme="dark"] .acad-planilla-shell,
html[data-theme="dark"] .acad-context-bar,
html[data-theme="dark"] .acad-filter-card,
html[data-theme="dark"] .acad-empty-state {
  background: var(--white);
  border-color: var(--border);
  color: var(--text);
}

html[data-theme="dark"] .acad-toolbar select {
  background: var(--input-bg);
  border-color: var(--border);
  color: var(--text);
}

html[data-theme="dark"] .acad-toolbar select:focus {
  background: var(--input-bg);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary) 25%, transparent);
}

html[data-theme="dark"] .acad-back-link:hover {
  background: var(--nav-active-bg);
  border-color: color-mix(in srgb, var(--primary) 35%, var(--border));
}

html[data-theme="dark"] .acad-stat-card,
html[data-theme="dark"] .acad-card-header {
  background: linear-gradient(180deg, var(--white) 0%, var(--bg) 100%);
}

html[data-theme="dark"] .acad-table thead tr,
html[data-theme="dark"] .acad-table tbody tr:hover {
  background: var(--surface-muted);
}

/* ====== MÓDULOS (mensajería, calendario, convivencia, etc.) ====== */
html[data-theme="dark"] .msg-sidebar,
html[data-theme="dark"] .msg-thread,
html[data-theme="dark"] .msg-compose,
html[data-theme="dark"] .conv-card,
html[data-theme="dark"] .adm-stat,
html[data-theme="dark"] .adm-hero,
html[data-theme="dark"] .notif-item,
html[data-theme="dark"] .notif-side a,
html[data-theme="dark"] .notif-side form button,
html[data-theme="dark"] .reporte-card,
html[data-theme="dark"] .cal-head,
html[data-theme="dark"] .cal-day,
html[data-theme="dark"] .cal-time-wrap,
html[data-theme="dark"] .anios-stat,
html[data-theme="dark"] .anios-panel,
html[data-theme="dark"] .anio-card,
html[data-theme="dark"] .enc-stat-card,
html[data-theme="dark"] .enc-card,
html[data-theme="dark"] .enc-item-card,
html[data-theme="dark"] .enc-modal,
html[data-theme="dark"] .settings-tab-panel,
html[data-theme="dark"] .eva-student-card,
html[data-theme="dark"] .eva-criterio-card {
  background: var(--surface-elevated);
  border-color: var(--border);
  color: var(--text);
}

html[data-theme="dark"] .msg-folder.active,
html[data-theme="dark"] .notif-side a.active,
html[data-theme="dark"] .cal-view-tab.active {
  background: var(--nav-active-bg);
  color: var(--nav-active-text);
}

html[data-theme="dark"] .notif-item.unread {
  background: color-mix(in srgb, var(--primary) 12%, var(--surface-elevated));
  border-color: color-mix(in srgb, var(--primary) 35%, var(--border));
}

html[data-theme="dark"] .conv-head,
html[data-theme="dark"] .anios-panel-head,
html[data-theme="dark"] .adm-hero {
  background: linear-gradient(180deg, var(--surface-elevated), var(--surface-muted));
}

html[data-theme="dark"] .roles-modal-panel,
html[data-theme="dark"] .eva-modal-panel {
  background: var(--surface-elevated);
  border-color: var(--border);
}

html[data-theme="dark"] .perfil-hero,
html[data-theme="dark"] .perfil-card,
html[data-theme="dark"] .perfil-upload {
  background: var(--surface-elevated);
  border-color: var(--border);
  color: var(--text);
}

html[data-theme="dark"] .perfil-hero-title,
html[data-theme="dark"] .perfil-card-title {
  color: var(--text);
}

html[data-theme="dark"] .db-hero {
  --db-hero-from: color-mix(in srgb, var(--primary-dk) 75%, #020617);
  --db-hero-to: color-mix(in srgb, var(--primary) 42%, #0f172a);
  box-shadow: 0 18px 45px rgba(0, 0, 0, 0.35);
}

/* ====== IMPRESIÓN ====== */
@media print {
  html[data-theme="dark"] * {
    color-scheme: light;
  }
}
