/* ===== SISTEMA SAI ===== */

/*
 * La barra y sus menús deben quedar sobre encabezados sticky de tablas.
 * 1030 coincide con la capa "fixed" de Bootstrap y permanece bajo modales
 * (1055) y notificaciones (1080+).
 */
body > nav.navbar {
    position: relative;
    z-index: 1030;
}

body > nav.navbar .dropdown-menu {
    z-index: 1040;
}

textarea.dirty{
border:2px solid orange !important;
background:#fff7e6 !important;
}

textarea.saving{
border:2px solid #4da3ff !important;
background:#e8f3ff !important;
}

textarea.saved{
border:2px solid #28a745 !important;
background:#e9f7ef !important;
}


.nota-input.dirty{
border:2px solid orange !important;
background:#fff7e6 !important;
}

.nota-input.saving{
border:2px solid #4da3ff !important;
background:#e8f3ff !important;
}

.nota-input.saved{
border:2px solid #28a745 !important;
background:#e9f7ef !important;
}


/* estado normal */
.asistencia {
    transition: background-color 0.2s ease;
}

/* mientras se guarda */
.asistencia.saving {
    background-color: #75b8ff;
    border-color: #e8f3ff;
}

/* guardado exitoso */
.asistencia.saved {
    background-color: #d4edda;
    border-color: #c3e6cb;
}

/* error */
.asistencia.error {
    background-color: #f8d7da;
    border-color: #f5c6cb;
}


.fecha-clase.saving {
    background-color: #75b8ff;
}

.fecha-clase.saved {
    background-color: #d4edda;
}

.fecha-clase.error {
    background-color: #f8d7da;
}

/* Al final de static/css/sai.css */

/* Adaptación de tablas y componentes personalizados para Modo Oscuro Nativo */
html[data-bs-theme="dark"] .table-responsive {
    background-color: #1e1e24 !important;
}

html[data-bs-theme="dark"] .card-body.bg-light {
    background-color: #212529 !important; /* Reemplaza fondos grises por oscuros en Dark Mode */
}

html[data-bs-theme="dark"] .bg-white {
    background-color: #1a191f !important;
}

/* Optimización de los inputs de notas en modo oscuro para que no encandilen */
html[data-bs-theme="dark"] textarea.dirty, 
html[data-bs-theme="dark"] .nota-input.dirty {
    background-color: #3d2d10 !important;
    color: #ffc107 !important;
}

html[data-bs-theme="dark"] textarea.saved, 
html[data-bs-theme="dark"] .nota-input.saved {
    background-color: #0f3d1e !important;
    color: #20c997 !important;
}