/*
 * DARK MODE ADDON para SGA
 * Fecha: 27 de diciembre de 2025
 * Descripción: Estilos adicionales para dark mode usando Bootstrap 5.3 nativo
 * NOTA: Este archivo NO modifica estilos existentes, solo agrega dark mode
 */

/* ========================================
   VARIABLES CSS PARA DARK MODE
   ======================================== */

/* Modo claro (ya existe, solo extendemos) */
:root {
    --bs-body-bg: #ffffff;
    --bs-body-color: #212529;
}

/* Modo oscuro - usando data-bs-theme de Bootstrap 5.3 */
[data-bs-theme="dark"] {
    /* Colores base */
    --bs-body-bg: #0f172a;
    --bs-body-color: #e2e8f0;

    /* Colores primarios ajustados para dark mode */
    --primary-color: #818cf8;
    --primary-dark: #6366f1;
    --secondary-color: #94a3b8;
    --accent-color: #fbbf24;
    --success-color: #34d399;
    --danger-color: #f87171;
    --warning-color: #fbbf24;
    --info-color: #60a5fa;
    --dark-color: #e2e8f0;
    --light-color: #1e293b;

    /* Backgrounds */
    --bg-primary: #0f172a;
    --bg-secondary: #1e293b;
    --bg-tertiary: #334155;

    /* Texto */
    --text-primary: #f1f5f9;
    --text-secondary: #cbd5e1;
    --text-tertiary: #94a3b8;

    /* Bordes */
    --border-primary: #334155;
    --bs-border-color: #334155;

    /* Sombras */
    --shadow-sm: 0 4px 12px rgba(0, 0, 0, 0.5);
    --shadow-md: 0 8px 20px rgba(0, 0, 0, 0.7);
    --shadow-lg: 0 12px 30px rgba(0, 0, 0, 0.9);

    /* Links */
    --bs-link-color: #818cf8;
    --bs-link-hover-color: #a5b4fc;
}

/* ========================================
   ESTILOS ESPECÍFICOS DARK MODE
   ======================================== */

/* Body y contenedor principal */
[data-bs-theme="dark"] body {
    background-color: var(--bg-primary);
    color: var(--text-primary);
}

/* Cards */
[data-bs-theme="dark"] .card {
    background-color: var(--bg-secondary);
    border-color: var(--border-primary);
    color: var(--text-primary);
}

[data-bs-theme="dark"] .card-header {
    background-color: var(--bg-tertiary);
    border-color: var(--border-primary);
    color: var(--text-primary);
}

/* Tables */
[data-bs-theme="dark"] .table {
    --bs-table-bg: var(--bg-secondary);
    --bs-table-striped-bg: var(--bg-tertiary);
    --bs-table-hover-bg: #475569;
    --bs-table-color: var(--text-primary);
    --bs-table-border-color: var(--border-primary);
}

[data-bs-theme="dark"] .table-light {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
}

/* Forms */
[data-bs-theme="dark"] .form-control,
[data-bs-theme="dark"] .form-select {
    background-color: var(--bg-tertiary);
    border-color: var(--border-primary);
    color: var(--text-primary);
}

[data-bs-theme="dark"] .form-control:focus,
[data-bs-theme="dark"] .form-select:focus {
    background-color: var(--bg-secondary);
    border-color: var(--primary-color);
    color: var(--text-primary);
}

[data-bs-theme="dark"] .form-control::placeholder {
    color: var(--text-tertiary);
}

/* Modals */
[data-bs-theme="dark"] .modal-content {
    background-color: var(--bg-secondary);
    border-color: var(--border-primary);
    color: var(--text-primary);
}

[data-bs-theme="dark"] .modal-header,
[data-bs-theme="dark"] .modal-footer {
    border-color: var(--border-primary);
}

/* Dropdowns */
[data-bs-theme="dark"] .dropdown-menu {
    background-color: var(--bg-secondary);
    border-color: var(--border-primary);
}

[data-bs-theme="dark"] .dropdown-item {
    color: var(--text-primary);
}

[data-bs-theme="dark"] .dropdown-item:hover,
[data-bs-theme="dark"] .dropdown-item:focus {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
}

/* Breadcrumbs */
[data-bs-theme="dark"] .breadcrumb {
    background-color: var(--bg-secondary);
}

[data-bs-theme="dark"] .breadcrumb-item a {
    color: var(--secondary-color);
}

[data-bs-theme="dark"] .breadcrumb-item.active {
    color: var(--primary-color);
}

/* Alertas - Ajuste para dark mode */
[data-bs-theme="dark"] .alert-success {
    background-color: rgba(52, 211, 153, 0.15);
    border-color: var(--success-color);
    color: #6ee7b7;
}

[data-bs-theme="dark"] .alert-danger {
    background-color: rgba(248, 113, 113, 0.15);
    border-color: var(--danger-color);
    color: #fca5a5;
}

[data-bs-theme="dark"] .alert-warning {
    background-color: rgba(251, 191, 36, 0.15);
    border-color: var(--warning-color);
    color: #fcd34d;
}

[data-bs-theme="dark"] .alert-info {
    background-color: rgba(96, 165, 250, 0.15);
    border-color: var(--info-color);
    color: #93c5fd;
}

/* Navbar - mantener oscuro en ambos modos */
[data-bs-theme="dark"] .navbar {
    background: linear-gradient(135deg, #1e293b 0%, #0f172a 100%) !important;
}

/* Footer - mantener oscuro en ambos modos */
[data-bs-theme="dark"] .footer {
    background: linear-gradient(135deg, #1e293b 0%, #0f172a 100%);
}

/* Badges — solo sobrescribe badges SIN clase de color explícita */
[data-bs-theme="dark"] .badge:not([class*="bg-"]):not([class*="text-bg-"]) {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
}
/* Badges con color: ajustar texto a blanco para contraste (amarillo/warning queda con texto oscuro) */
[data-bs-theme="dark"] .badge.bg-warning,
[data-bs-theme="dark"] .badge.bg-light {
    color: #1e293b !important;
}

/* Pagination */
[data-bs-theme="dark"] .page-link {
    background-color: var(--bg-secondary);
    border-color: var(--border-primary);
    color: var(--text-primary);
}

[data-bs-theme="dark"] .page-link:hover {
    background-color: var(--bg-tertiary);
    border-color: var(--border-primary);
    color: var(--text-primary);
}

[data-bs-theme="dark"] .page-item.active .page-link {
    background-color: var(--primary-color);
    border-color: var(--primary-color);
}

/* List groups */
[data-bs-theme="dark"] .list-group-item {
    background-color: var(--bg-secondary);
    border-color: var(--border-primary);
    color: var(--text-primary);
}

[data-bs-theme="dark"] .list-group-item:hover {
    background-color: var(--bg-tertiary);
}

/* Calendario de horarios - ajustes dark mode */
[data-bs-theme="dark"] .fc {
    background-color: var(--bg-secondary);
    color: var(--text-primary);
}

[data-bs-theme="dark"] .fc-theme-standard td,
[data-bs-theme="dark"] .fc-theme-standard th {
    border-color: var(--border-primary);
}

[data-bs-theme="dark"] .fc-theme-standard .fc-scrollgrid {
    border-color: var(--border-primary);
}

[data-bs-theme="dark"] .fc .fc-button-primary {
    background-color: var(--primary-color);
    border-color: var(--primary-color);
}

[data-bs-theme="dark"] .fc .fc-button-primary:hover {
    background-color: var(--primary-dark);
    border-color: var(--primary-dark);
}

[data-bs-theme="dark"] .fc-col-header-cell {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
}

[data-bs-theme="dark"] .fc-daygrid-day {
    background-color: var(--bg-secondary);
}

[data-bs-theme="dark"] .fc-daygrid-day:hover {
    background-color: var(--bg-tertiary);
}

/* Tooltips */
[data-bs-theme="dark"] .tooltip-inner {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
}

/* Toggle button específico */
#theme-toggle {
    background: transparent;
    border: none;
    color: inherit;
    cursor: pointer;
    padding: 0.5rem;
    transition: all 0.3s ease;
}

#theme-toggle:hover {
    color: var(--primary-color);
    transform: rotate(20deg);
}

#theme-toggle i {
    font-size: 1.2rem;
}

/* Animación de transición suave */
body,
.card,
.modal-content,
.dropdown-menu,
.form-control,
.form-select,
.table,
.navbar,
.footer {
    transition: background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease;
}

/* ========================================
   MEDIA QUERY: Auto Dark Mode
   Respeta preferencia del sistema operativo
   ======================================== */

@media (prefers-color-scheme: dark) {
    /* Solo aplica si no hay preferencia manual guardada */
    :root:not([data-bs-theme]) {
        color-scheme: dark;
    }
}

/* ========================================
   PRINT: Forzar modo claro para impresión
   ======================================== */

@media print {
    [data-bs-theme="dark"] body,
    [data-bs-theme="dark"] .card,
    [data-bs-theme="dark"] .table {
        background-color: white !important;
        color: black !important;
    }
}

/* ========================================
   MEJORA DE CONTRASTE GLOBAL
   Aplica a MODO CLARO y MODO OSCURO
   ======================================== */

/* === MODO CLARO - Mejorar contraste de textos grises === */

/* text-muted más oscuro para mejor legibilidad */
.text-muted {
    color: #4b5563 !important;
}

/* Textos secundarios en cards y listas */
.card-footer.text-muted,
.estudiante-header .text-muted,
.asignatura-header .text-muted,
.stat-badge .text-muted,
small.text-muted {
    color: #4b5563 !important;
}

/* Headers de secciones - fondos claros con mejor contraste */
.estudiante-header,
.asignatura-header {
    background: #f1f5f9;
}

.estudiante-header h5,
.estudiante-header h6,
.asignatura-header h5,
.asignatura-header h6 {
    color: #1e293b;
}

/* Filas de lista (estudiante-row, asignatura-row, etc.) */
.estudiante-row h6,
.asignatura-row h6 {
    color: #1e293b;
}

.estudiante-row small,
.asignatura-row small {
    color: #4b5563;
}

/* Iconos con texto */
.estudiante-row i.text-muted,
.asignatura-row i.text-muted {
    color: #6b7280 !important;
}

/* Stat badges más legibles */
.stat-badge {
    background: #f1f5f9;
    color: #374151;
}

.stat-badge strong {
    color: #1e293b;
}

/* Footer de cards */
.card-footer {
    color: #4b5563;
}

.card-footer i {
    color: #6b7280;
}

/* Breadcrumbs más legibles */
.breadcrumb-item a {
    color: #4b5563;
}

.breadcrumb-item.active {
    color: #1e293b;
}

/* === MODO OSCURO - Todos los textos visibles === */

[data-bs-theme="dark"] .text-muted {
    color: #94a3b8 !important;
}

[data-bs-theme="dark"] small.text-muted,
[data-bs-theme="dark"] .card-footer.text-muted {
    color: #94a3b8 !important;
}

/* Headers de secciones en dark mode */
[data-bs-theme="dark"] .estudiante-header,
[data-bs-theme="dark"] .asignatura-header {
    background: #334155;
}

[data-bs-theme="dark"] .estudiante-header h5,
[data-bs-theme="dark"] .estudiante-header h6,
[data-bs-theme="dark"] .asignatura-header h5,
[data-bs-theme="dark"] .asignatura-header h6 {
    color: #f1f5f9;
}

[data-bs-theme="dark"] .estudiante-header .text-muted,
[data-bs-theme="dark"] .asignatura-header .text-muted {
    color: #94a3b8 !important;
}

/* Filas de lista en dark mode */
[data-bs-theme="dark"] .estudiante-row,
[data-bs-theme="dark"] .asignatura-row {
    background: #1e293b;
}

[data-bs-theme="dark"] .estudiante-row h6,
[data-bs-theme="dark"] .asignatura-row h6 {
    color: #f1f5f9;
}

[data-bs-theme="dark"] .estudiante-row small,
[data-bs-theme="dark"] .asignatura-row small {
    color: #94a3b8;
}

[data-bs-theme="dark"] .estudiante-row i.text-muted,
[data-bs-theme="dark"] .asignatura-row i.text-muted {
    color: #64748b !important;
}

/* Stat badges en dark mode */
[data-bs-theme="dark"] .stat-badge {
    background: #334155;
    color: #cbd5e1;
}

[data-bs-theme="dark"] .stat-badge strong {
    color: #f1f5f9;
}

[data-bs-theme="dark"] .stat-badge .text-muted {
    color: #94a3b8 !important;
}

/* Cards en dark mode - contenido completo */
[data-bs-theme="dark"] .card-body {
    color: #e2e8f0;
}

[data-bs-theme="dark"] .card-body h5,
[data-bs-theme="dark"] .card-body h6 {
    color: #f1f5f9;
}

[data-bs-theme="dark"] .card-body p {
    color: #cbd5e1;
}

[data-bs-theme="dark"] .card-body small {
    color: #94a3b8;
}

/* Footer de cards en dark mode */
[data-bs-theme="dark"] .card-footer {
    background: #1e293b;
    border-color: #334155;
    color: #94a3b8;
}

/* Estudiante/Asignatura cards completos */
[data-bs-theme="dark"] .estudiante-card,
[data-bs-theme="dark"] .asignatura-card {
    background: #1e293b;
    border-color: #334155;
}

[data-bs-theme="dark"] .estudiante-card .card-body,
[data-bs-theme="dark"] .asignatura-card .card-body {
    background: #1e293b;
}

/* Search section mantiene gradiente pero textos claros */
[data-bs-theme="dark"] .search-section strong {
    color: #f1f5f9;
}

/* Filter badges en dark mode */
[data-bs-theme="dark"] .filter-badge {
    background: #334155;
    color: #e2e8f0;
}

/* View toggle en dark mode */
[data-bs-theme="dark"] .view-toggle {
    background: #334155;
}

[data-bs-theme="dark"] .view-toggle .btn {
    color: #cbd5e1;
}

[data-bs-theme="dark"] .view-toggle .btn.active {
    background: #6366f1;
    color: white;
}

/* Info badges en dark mode */
[data-bs-theme="dark"] .info-badge {
    background: #334155;
    color: #e2e8f0;
}

/* Títulos principales */
[data-bs-theme="dark"] h1,
[data-bs-theme="dark"] h2,
[data-bs-theme="dark"] h3,
[data-bs-theme="dark"] h4,
[data-bs-theme="dark"] h5,
[data-bs-theme="dark"] h6 {
    color: #f1f5f9;
}

/* Textos de formulario */
[data-bs-theme="dark"] label {
    color: #e2e8f0;
}

/* Stats cards con gradiente - ajustar texto */
[data-bs-theme="dark"] .stats-card h4,
[data-bs-theme="dark"] .stats-card small {
    color: inherit;
}

/* Border bottom en listas */
[data-bs-theme="dark"] .border-bottom {
    border-color: #334155 !important;
}

/* Iconos con colores específicos - mantener en dark mode */
[data-bs-theme="dark"] .text-primary {
    color: #818cf8 !important;
}

[data-bs-theme="dark"] .text-success {
    color: #34d399 !important;
}

[data-bs-theme="dark"] .text-warning {
    color: #fbbf24 !important;
}

[data-bs-theme="dark"] .text-danger {
    color: #f87171 !important;
}

[data-bs-theme="dark"] .text-info {
    color: #60a5fa !important;
}

/* Grado strip mantiene colores */
[data-bs-theme="dark"] .grado-strip,
[data-bs-theme="dark"] .area-strip {
    opacity: 0.9;
}

/* ========================================
   CORRECCIONES DE CONTRASTE DARK MODE
   Elementos que Bootstrap no adapta automáticamente
   ======================================== */

/* bg-white y bg-light fuerzan fondo claro aunque estemos en dark mode.
   Los sobreescribimos con !important para ganar la cascada.
   No se toca el color de texto: lo manejan las reglas hijas. */
[data-bs-theme="dark"] .bg-white {
    background-color: var(--bg-secondary) !important;
}
[data-bs-theme="dark"] .bg-light {
    background-color: var(--bg-tertiary) !important;
}
/* Borde del card-header adaptado */
[data-bs-theme="dark"] .card-header.bg-white,
[data-bs-theme="dark"] .card-header.bg-light {
    border-bottom-color: var(--border-primary) !important;
}
/* Texto dentro de bg-white / bg-light: debe verse sobre fondo oscuro */
[data-bs-theme="dark"] .bg-white .text-dark,
[data-bs-theme="dark"] .bg-light .text-dark {
    color: var(--text-primary) !important;
}
[data-bs-theme="dark"] .bg-white h1, [data-bs-theme="dark"] .bg-white h2,
[data-bs-theme="dark"] .bg-white h3, [data-bs-theme="dark"] .bg-white h4,
[data-bs-theme="dark"] .bg-white h5, [data-bs-theme="dark"] .bg-white h6,
[data-bs-theme="dark"] .bg-light h1, [data-bs-theme="dark"] .bg-light h2,
[data-bs-theme="dark"] .bg-light h3, [data-bs-theme="dark"] .bg-light h4,
[data-bs-theme="dark"] .bg-light h5, [data-bs-theme="dark"] .bg-light h6 {
    color: var(--text-primary);
}
[data-bs-theme="dark"] .bg-white p, [data-bs-theme="dark"] .bg-white span,
[data-bs-theme="dark"] .bg-light p,  [data-bs-theme="dark"] .bg-light span {
    color: inherit;
}

/* table-light en dark mode (thead, tfoot, etc.) */
[data-bs-theme="dark"] .table-light,
[data-bs-theme="dark"] .table-light th,
[data-bs-theme="dark"] .table-light td {
    background-color: var(--bg-tertiary) !important;
    color: var(--text-primary) !important;
    border-color: var(--border-primary) !important;
}

/* Hover de filas de tabla (base.html fuerza #f8fafc pero dark addon tiene mayor especificidad) */
[data-bs-theme="dark"] .table tbody tr:hover {
    background-color: #334155 !important;
    color: var(--text-primary) !important;
}

/* Filas coloreadas Bootstrap (table-danger, table-warning, etc.) en dark mode */
[data-bs-theme="dark"] .table-danger,
[data-bs-theme="dark"] .table-danger td,
[data-bs-theme="dark"] .table-danger th {
    background-color: rgba(248, 113, 113, 0.12) !important;
    color: #fca5a5 !important;
    border-color: rgba(248, 113, 113, 0.2) !important;
}
[data-bs-theme="dark"] .table-success,
[data-bs-theme="dark"] .table-success td,
[data-bs-theme="dark"] .table-success th {
    background-color: rgba(52, 211, 153, 0.12) !important;
    color: #6ee7b7 !important;
    border-color: rgba(52, 211, 153, 0.2) !important;
}
[data-bs-theme="dark"] .table-warning,
[data-bs-theme="dark"] .table-warning td,
[data-bs-theme="dark"] .table-warning th {
    background-color: rgba(251, 191, 36, 0.12) !important;
    color: #fcd34d !important;
    border-color: rgba(251, 191, 36, 0.2) !important;
}

/* Links en dark mode: usar la variable de color primario ajustada */
[data-bs-theme="dark"] a:not(.btn):not(.nav-link):not(.sidebar-item):not(.sidebar-subitem):not(.dropdown-item) {
    color: #818cf8;
}
[data-bs-theme="dark"] a:not(.btn):not(.nav-link):not(.sidebar-item):not(.sidebar-subitem):not(.dropdown-item):hover {
    color: #a5b4fc;
}

/* ========================================
   SIDEBAR — contraste explícito en ambos modos
   El sidebar es siempre oscuro (#0f172a), aseguramos
   que ninguna regla de Bootstrap lo "aclare".
   ======================================== */

/* Forzar fondo oscuro del sidebar independientemente del tema */
.sga-sidebar {
    background: #0f172a !important;
    color: #e2e8f0;
}

/* Items de navegación — siempre visibles sobre fondo oscuro */
.sga-sidebar .sidebar-item {
    color: #94a3b8 !important;
}
.sga-sidebar .sidebar-item:hover,
.sga-sidebar .sidebar-item.active {
    color: #ffffff !important;
}

/* Sub-items */
.sga-sidebar .sidebar-subitem {
    color: rgba(255, 255, 255, 0.72) !important;
}
.sga-sidebar .sidebar-subitem:hover,
.sga-sidebar .sidebar-subitem.active {
    color: #ffffff !important;
}

/* Texto del botón de grupo (acordeón) */
.sga-sidebar .sidebar-group-btn {
    color: #94a3b8 !important;
}
.sga-sidebar .sidebar-group.open .sidebar-group-btn {
    color: #ffffff !important;
}

/* Nombre de institución y subtítulo */
.sga-sidebar .sidebar-brand {
    color: #ffffff !important;
}
.sga-sidebar .sidebar-brand small {
    color: #94a3b8 !important;
}

/* Nombre y rol del usuario */
.sga-sidebar .sidebar-username {
    color: #f1f5f9 !important;
}
.sga-sidebar .sidebar-userrole {
    color: #94a3b8 !important;
}

/* Botones de control rápido (tema / navbar) */
.sga-sidebar .sidebar-ctrl-btn {
    color: #94a3b8 !important;
    border-color: rgba(255, 255, 255, 0.1) !important;
    background: rgba(255, 255, 255, 0.04) !important;
}
.sga-sidebar .sidebar-ctrl-btn:hover {
    color: #ffffff !important;
    background: rgba(255, 255, 255, 0.1) !important;
}

/* Badge de licencia */
.sga-sidebar .slic-text {
    color: #94a3b8 !important;
}
.sga-sidebar .sidebar-license-badge {
    border-color: rgba(255, 255, 255, 0.08) !important;
}

/* Cerrar sesión */
.sga-sidebar .sidebar-item[style*="color:#ef4444"],
.sga-sidebar .sidebar-item[style*="color: #ef4444"] {
    color: #ef4444 !important;
}

/* Divisor del sidebar */
.sga-sidebar .sidebar-sub-divider {
    border-color: rgba(255, 255, 255, 0.1) !important;
}

/* Sección label */
.sga-sidebar .sidebar-section-label {
    color: #64748b !important;
}

/* Tab lateral de colapso */
.sidebar-toggle-tab {
    background: #1d4ed8 !important;
    color: #ffffff !important;
}

/* ========================================
   NAVBAR (modo navbar) — contraste en dark mode
   ======================================== */

/* Asegurar que los dropdown-item dentro del navbar sean legibles */
[data-bs-theme="dark"] .navbar .dropdown-menu {
    background-color: #1e293b;
    border-color: #334155;
}
[data-bs-theme="dark"] .navbar .dropdown-item {
    color: #e2e8f0;
}
[data-bs-theme="dark"] .navbar .dropdown-item:hover {
    background-color: #334155;
    color: #ffffff;
}
[data-bs-theme="dark"] .navbar .dropdown-divider {
    border-color: #334155;
}

/* Texto del toggler */
[data-bs-theme="dark"] .navbar-toggler {
    border-color: rgba(255, 255, 255, 0.3);
}

/* ========================================
   FORMULARIOS — labels y texto de ayuda
   ======================================== */

/* En dark mode, labels dentro de fondos oscuros deben ser claros */
[data-bs-theme="dark"] .form-label,
[data-bs-theme="dark"] .form-check-label,
[data-bs-theme="dark"] .col-form-label {
    color: #e2e8f0 !important;
}

[data-bs-theme="dark"] .form-text,
[data-bs-theme="dark"] .form-hint,
[data-bs-theme="dark"] small.form-text {
    color: #94a3b8 !important;
}

/* Input group text */
[data-bs-theme="dark"] .input-group-text {
    background-color: var(--bg-tertiary);
    border-color: var(--border-primary);
    color: var(--text-primary);
}

/* ========================================
   ELEMENTOS VARIOS
   ======================================== */

/* Select2 / choices si se usan */
[data-bs-theme="dark"] .choices__inner,
[data-bs-theme="dark"] .choices__list--dropdown {
    background-color: var(--bg-secondary);
    border-color: var(--border-primary);
    color: var(--text-primary);
}

/* Texto dentro de divs con fondo blanco explícito (inline style) */
[data-bs-theme="dark"] [style*="background-color: white"],
[data-bs-theme="dark"] [style*="background-color:#fff"],
[data-bs-theme="dark"] [style*="background-color: #fff"],
[data-bs-theme="dark"] [style*="background: white"],
[data-bs-theme="dark"] [style*="background:#fff"],
[data-bs-theme="dark"] [style*="background: #fff"] {
    color: #1e293b;
}

/* Paginación — texto en dark mode */
[data-bs-theme="dark"] .page-item.disabled .page-link {
    background-color: var(--bg-tertiary);
    border-color: var(--border-primary);
    color: #64748b;
}

/* Tabs — active tab border */
[data-bs-theme="dark"] .nav-tabs .nav-link.active {
    background-color: var(--bg-secondary);
    border-color: var(--border-primary) var(--border-primary) var(--bg-secondary);
    color: #818cf8;
}
[data-bs-theme="dark"] .nav-tabs .nav-link:not(.active) {
    color: #94a3b8;
}
[data-bs-theme="dark"] .nav-tabs .nav-link:not(.active):hover {
    color: #e2e8f0;
    border-color: var(--border-primary);
}
[data-bs-theme="dark"] .nav-tabs {
    border-bottom-color: var(--border-primary);
}

/* Pills nav */
[data-bs-theme="dark"] .nav-pills .nav-link:not(.active) {
    color: #94a3b8;
}
[data-bs-theme="dark"] .nav-pills .nav-link:hover:not(.active) {
    background-color: var(--bg-tertiary);
    color: #e2e8f0;
}