/**
 * ═══════════════════════════════════════════════════════════════════
 * CSS RESPONSIVE MÁXIMO - MODALES FULLSCREEN
 * ═══════════════════════════════════════════════════════════════════
 *
 * Objetivo: Aprovechar AL MÁXIMO el espacio de pantalla
 * - Modales ocupan 98% de pantalla (ancho y alto)
 * - Título MUY pequeño (0.75rem)
 * - Tabs compactos (0.7rem, padding mínimo)
 * - Botón footer oculto o muy chico
 * - Scroll visible
 */

/* ✅ OVERLAY - Solo cuando modal VISIBLE */
[id*="Modal"][style*="display: block"],
[id*="modal"][style*="display: block"],
[id*="Modal"].show,
[id*="modal"].show {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    width: 100vw !important;
    height: 100vh !important;
    background: rgba(0,0,0,0.7) !important;
    display: flex !important;
    justify-content: center !important;
    align-items: flex-start !important;
    z-index: 10000 !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    padding: 0 !important;
    padding-top: 0 !important;
}

/* ✅ CONTENEDOR PRINCIPAL - 100% PANTALLA */
[id*="Modal"][style*="display: block"] > div:first-child,
[id*="modal"][style*="display: block"] > div:first-child,
[id*="Modal"].show > div:first-child,
[id*="modal"].show > div:first-child {
    background: #161b22 !important;
    border-radius: 0 !important;
    width: 100vw !important;
    height: 100vh !important;
    max-width: 100vw !important;
    max-height: 100vh !important;
    margin: 0 !important;
    padding: 0 !important;
    box-shadow: none !important;
    display: flex !important;
    flex-direction: column !important;
    overflow: hidden !important;
}

/* ✅ HEADER/TÍTULO - MUY CHICO (0.75rem, padding mínimo) */
[id*="Modal"][style*="display: block"] h2,
[id*="modal"][style*="display: block"] h2,
[id*="Modal"].show h2,
[id*="modal"].show h2,
[id*="Modal"][style*="display: block"] h3,
[id*="modal"][style*="display: block"] h3,
[id*="Modal"].show h3,
[id*="modal"].show h3,
[id*="Modal"][style*="display: block"] .modal-header,
[id*="modal"][style*="display: block"] .modal-header,
[id*="Modal"].show .modal-header,
[id*="modal"].show .modal-header {
    font-size: 0.75rem !important;
    margin: 0 !important;
    padding: 4px 10px !important;
    background: #21262d !important;
    border-bottom: 1px solid #dee2e6 !important;
    flex-shrink: 0 !important;
    font-weight: 600 !important;
    line-height: 1.2 !important;
}

/* ✅ ÁREA DE CONTENIDO - Scroll visible */
[id*="Modal"][style*="display: block"] .modal-body,
[id*="modal"][style*="display: block"] .modal-body,
[id*="Modal"].show .modal-body,
[id*="modal"].show .modal-body {
    flex: 1 !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    padding: 10px 15px !important;
    font-size: 0.85rem !important;
    line-height: 1.4 !important;
}

/* ✅ SCROLL VISIBLE - 14px */
[id*="Modal"][style*="display: block"] *::-webkit-scrollbar,
[id*="modal"][style*="display: block"] *::-webkit-scrollbar,
[id*="Modal"].show *::-webkit-scrollbar,
[id*="modal"].show *::-webkit-scrollbar {
    width: 14px !important;
    height: 14px !important;
}

[id*="Modal"][style*="display: block"] *::-webkit-scrollbar-track,
[id*="modal"][style*="display: block"] *::-webkit-scrollbar-track,
[id*="Modal"].show *::-webkit-scrollbar-track,
[id*="modal"].show *::-webkit-scrollbar-track {
    background: #f1f1f1 !important;
    border-radius: 10px !important;
}

[id*="Modal"][style*="display: block"] *::-webkit-scrollbar-thumb,
[id*="modal"][style*="display: block"] *::-webkit-scrollbar-thumb,
[id*="Modal"].show *::-webkit-scrollbar-thumb,
[id*="modal"].show *::-webkit-scrollbar-thumb {
    background: #888 !important;
    border-radius: 10px !important;
    border: 2px solid #f1f1f1 !important;
}

[id*="Modal"][style*="display: block"] *::-webkit-scrollbar-thumb:hover,
[id*="modal"][style*="display: block"] *::-webkit-scrollbar-thumb:hover,
[id*="Modal"].show *::-webkit-scrollbar-thumb:hover,
[id*="modal"].show *::-webkit-scrollbar-thumb:hover {
    background: #555 !important;
}

/* ✅ TABS - MUY COMPACTOS (0.7rem, padding mínimo) */
[id*="Modal"][style*="display: block"] .nav-tabs,
[id*="modal"][style*="display: block"] .nav-tabs,
[id*="Modal"].show .nav-tabs,
[id*="modal"].show .nav-tabs {
    flex-shrink: 0 !important;
    margin-bottom: 5px !important;
    border-bottom: 1px solid #dee2e6 !important;
}

[id*="Modal"][style*="display: block"] .nav-tabs button,
[id*="modal"][style*="display: block"] .nav-tabs button,
[id*="Modal"].show .nav-tabs button,
[id*="modal"].show .nav-tabs button,
[id*="Modal"][style*="display: block"] .nav-tabs .nav-link,
[id*="modal"][style*="display: block"] .nav-tabs .nav-link,
[id*="Modal"].show .nav-tabs .nav-link,
[id*="modal"].show .nav-tabs .nav-link {
    font-size: 0.7rem !important;
    padding: 4px 8px !important;
    margin: 0 2px !important;
    line-height: 1.2 !important;
    border-radius: 4px 4px 0 0 !important;
}

/* ✅ CARDS - Compactas */
[id*="Modal"][style*="display: block"] .card,
[id*="modal"][style*="display: block"] .card,
[id*="Modal"].show .card,
[id*="modal"].show .card {
    margin-bottom: 10px !important;
    font-size: 0.85rem !important;
}

[id*="Modal"][style*="display: block"] .card-header,
[id*="modal"][style*="display: block"] .card-header,
[id*="Modal"].show .card-header,
[id*="modal"].show .card-header {
    padding: 6px 10px !important;
    font-size: 0.8rem !important;
    font-weight: 600 !important;
}

[id*="Modal"][style*="display: block"] .card-body,
[id*="modal"][style*="display: block"] .card-body,
[id*="Modal"].show .card-body,
[id*="modal"].show .card-body {
    padding: 8px 10px !important;
}

/* ✅ LABELS Y TEXTOS - Compactos */
[id*="Modal"][style*="display: block"] label,
[id*="modal"][style*="display: block"] label,
[id*="Modal"].show label,
[id*="modal"].show label {
    font-size: 0.75rem !important;
    margin-bottom: 2px !important;
}

[id*="Modal"][style*="display: block"] p,
[id*="modal"][style*="display: block"] p,
[id*="Modal"].show p,
[id*="modal"].show p {
    font-size: 0.8rem !important;
    margin-bottom: 6px !important;
}

/* ✅ INPUTS Y SELECTS */
[id*="Modal"][style*="display: block"] input,
[id*="Modal"][style*="display: block"] select,
[id*="Modal"][style*="display: block"] textarea,
[id*="modal"][style*="display: block"] input,
[id*="modal"][style*="display: block"] select,
[id*="modal"][style*="display: block"] textarea,
[id*="Modal"].show input,
[id*="Modal"].show select,
[id*="Modal"].show textarea,
[id*="modal"].show input,
[id*="modal"].show select,
[id*="modal"].show textarea {
    font-size: 0.8rem !important;
    padding: 5px 8px !important;
}

/* ✅ BOTONES - Compactos */
[id*="Modal"][style*="display: block"] button,
[id*="modal"][style*="display: block"] button,
[id*="Modal"].show button,
[id*="modal"].show button {
    font-size: 0.75rem !important;
    padding: 5px 10px !important;
    margin: 2px !important;
}

/* ✅ FOOTER - MUY CHICO Y COMPACTO (oculta botón si es muy grande) */
[id*="Modal"][style*="display: block"] .modal-footer,
[id*="modal"][style*="display: block"] .modal-footer,
[id*="Modal"].show .modal-footer,
[id*="modal"].show .modal-footer {
    flex-shrink: 0 !important;
    padding: 5px 10px !important;
    background: #21262d !important;
    border-top: 1px solid #dee2e6 !important;
    display: flex !important;
    gap: 5px !important;
    justify-content: flex-end !important;
    min-height: 30px !important;
}

/* ✅ OCULTAR BOTONES FOOTER MUY GRANDES (como "Cerrar Expediente") */
[id*="Modal"][style*="display: block"] .modal-footer button.btn-lg,
[id*="modal"][style*="display: block"] .modal-footer button.btn-lg,
[id*="Modal"].show .modal-footer button.btn-lg,
[id*="modal"].show .modal-footer button.btn-lg,
[id*="Modal"][style*="display: block"] .modal-footer button[style*="font-size: 1.2"],
[id*="modal"][style*="display: block"] .modal-footer button[style*="font-size: 1.2"],
[id*="Modal"].show .modal-footer button[style*="font-size: 1.2"],
[id*="modal"].show .modal-footer button[style*="font-size: 1.2"] {
    display: none !important;
}

/* ✅ TABLAS */
[id*="Modal"][style*="display: block"] table,
[id*="modal"][style*="display: block"] table,
[id*="Modal"].show table,
[id*="modal"].show table {
    font-size: 0.75rem !important;
}

[id*="Modal"][style*="display: block"] th,
[id*="Modal"][style*="display: block"] td,
[id*="modal"][style*="display: block"] th,
[id*="modal"][style*="display: block"] td,
[id*="Modal"].show th,
[id*="Modal"].show td,
[id*="modal"].show th,
[id*="modal"].show td {
    padding: 4px 6px !important;
}

/* ✅ LISTAS */
[id*="Modal"][style*="display: block"] ul,
[id*="Modal"][style*="display: block"] ol,
[id*="modal"][style*="display: block"] ul,
[id*="modal"][style*="display: block"] ol,
[id*="Modal"].show ul,
[id*="Modal"].show ol,
[id*="modal"].show ul,
[id*="modal"].show ol {
    padding-left: 15px !important;
    margin-bottom: 8px !important;
}

[id*="Modal"][style*="display: block"] li,
[id*="modal"][style*="display: block"] li,
[id*="Modal"].show li,
[id*="modal"].show li {
    font-size: 0.8rem !important;
    margin-bottom: 3px !important;
}

/* ✅ BADGES */
[id*="Modal"][style*="display: block"] .badge,
[id*="modal"][style*="display: block"] .badge,
[id*="Modal"].show .badge,
[id*="modal"].show .badge {
    font-size: 0.7rem !important;
    padding: 2px 6px !important;
}

/* ✅ ICONOS */
[id*="Modal"][style*="display: block"] i,
[id*="Modal"][style*="display: block"] svg,
[id*="modal"][style*="display: block"] i,
[id*="modal"][style*="display: block"] svg,
[id*="Modal"].show i,
[id*="Modal"].show svg,
[id*="modal"].show i,
[id*="modal"].show svg {
    font-size: 0.9rem !important;
}

/* ✅ ESPACIADO FORMULARIOS */
[id*="Modal"][style*="display: block"] .form-group,
[id*="Modal"][style*="display: block"] .mb-3,
[id*="modal"][style*="display: block"] .form-group,
[id*="modal"][style*="display: block"] .mb-3,
[id*="Modal"].show .form-group,
[id*="Modal"].show .mb-3,
[id*="modal"].show .form-group,
[id*="modal"].show .mb-3 {
    margin-bottom: 8px !important;
}

/* ✅ ROWS Y COLUMNAS */
[id*="Modal"][style*="display: block"] .row,
[id*="modal"][style*="display: block"] .row,
[id*="Modal"].show .row,
[id*="modal"].show .row {
    margin-left: -6px !important;
    margin-right: -6px !important;
}

[id*="Modal"][style*="display: block"] [class*="col-"],
[id*="modal"][style*="display: block"] [class*="col-"],
[id*="Modal"].show [class*="col-"],
[id*="modal"].show [class*="col-"] {
    padding-left: 6px !important;
    padding-right: 6px !important;
}

/* ✅ TAB-CONTENT con scroll */
[id*="Modal"][style*="display: block"] .tab-content,
[id*="modal"][style*="display: block"] .tab-content,
[id*="Modal"].show .tab-content,
[id*="modal"].show .tab-content {
    flex: 1 !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    padding: 10px !important;
}

/* ✅ TAB-PANE con altura */
[id*="Modal"][style*="display: block"] .tab-pane,
[id*="modal"][style*="display: block"] .tab-pane,
[id*="Modal"].show .tab-pane,
[id*="modal"].show .tab-pane {
    height: 100% !important;
    overflow-y: auto !important;
}

/* ✅ RESPONSIVE - Pantallas pequeñas */
@media (max-width: 1200px) {
    [id*="Modal"][style*="display: block"] > div:first-child,
    [id*="modal"][style*="display: block"] > div:first-child,
    [id*="Modal"].show > div:first-child,
    [id*="modal"].show > div:first-child {
        width: 99vw !important;
        height: 98vh !important;
    }
}

/* ✅ MÓVILES */
@media (max-width: 768px) {
    [id*="Modal"][style*="display: block"] > div:first-child,
    [id*="modal"][style*="display: block"] > div:first-child,
    [id*="Modal"].show > div:first-child,
    [id*="modal"].show > div:first-child {
        width: 100vw !important;
        height: 100vh !important;
        border-radius: 0 !important;
    }
}

/* ═══════════════════════════════════════════════════════════════════
 * EXCEPCIÓN: employeeFileModal - Modal de Expediente de Usuario
 * Este modal tiene su propia estructura y NO debe ser afectado
 * ═══════════════════════════════════════════════════════════════════ */
/* ── Layout base ── */
#employeeFileModal {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    width: 100vw !important;
    height: 100vh !important;
    max-width: none !important;
    max-height: none !important;
    overflow: hidden !important;
    padding: 0 !important;
    margin: 0 !important;
    border: none !important;
    background: #0d1117 !important;
    box-sizing: border-box !important;
}

#employeeFileModal > div:first-child {
    display: flex !important;
    flex-direction: column !important;
    width: 100vw !important;
    height: 100vh !important;
    max-width: none !important;
    max-height: none !important;
    overflow: hidden !important;
    border-radius: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    background: #0d1117 !important;
    box-sizing: border-box !important;
}

/* ── DARK THEME: Tabs (pestañas) ── */
#employeeFileModal .file-tab {
    background: #21262d !important;
    color: #8b949e !important;
    border: 1px solid #30363d !important;
    border-radius: 6px 6px 0 0 !important;
    font-size: 11px !important;
    padding: 5px 10px !important;
    cursor: pointer !important;
    transition: all 0.2s !important;
}

#employeeFileModal .file-tab:hover {
    background: #30363d !important;
    color: #e6edf3 !important;
}

#employeeFileModal .file-tab.active {
    background: #58a6ff !important;
    color: #ffffff !important;
    border-color: #58a6ff !important;
    font-weight: 600 !important;
}

/* ── DARK THEME: Área de contenido (scroll) ── */
#employeeFileModal .file-tab-content,
#employeeFileModal [id$="-tab"] {
    color: #e6edf3 !important;
}

/* ── DARK THEME: Títulos ── */
#employeeFileModal h3 {
    color: #58a6ff !important;
    border-bottom: 1px solid #21262d !important;
    padding-bottom: 8px !important;
}

#employeeFileModal h4 {
    color: #e6edf3 !important;
}

#employeeFileModal h5 {
    color: #8b949e !important;
}

/* ── DARK THEME: Textos ── */
#employeeFileModal p,
#employeeFileModal span,
#employeeFileModal div,
#employeeFileModal small,
#employeeFileModal li {
    color: #c9d1d9 !important;
}

#employeeFileModal .info-label {
    color: #8b949e !important;
}

#employeeFileModal .info-value {
    color: #e6edf3 !important;
}

/* ── DARK THEME: CATCH-ALL para fondos claros ── */
/* Hex que empiezan con #f (white, #f8f9fa, #fff3cd, #fce4ec, #ffebee, #f3e5f5, etc.) */
#employeeFileModal div[style*="background: #f"],
#employeeFileModal div[style*="background:#f"] {
    background: #161b22 !important;
    border-color: #30363d !important;
}

/* Hex que empiezan con #e (#e8f4f8, #e8f5e8, #e3f2fd, #e1f5fe, #e9ecef, #ede7f6, etc.) */
#employeeFileModal div[style*="background: #e"],
#employeeFileModal div[style*="background:#e"] {
    background: #161b22 !important;
    border-color: #30363d !important;
}

/* Hex que empiezan con #d (#d1ecf1, #d4edda, #ddd, etc.) */
#employeeFileModal div[style*="background: #d"],
#employeeFileModal div[style*="background:#d"] {
    background: #161b22 !important;
    border-color: #30363d !important;
}

/* Hex que empiezan con #c (#cce5ff, etc.) */
#employeeFileModal div[style*="background: #c"],
#employeeFileModal div[style*="background:#c"] {
    background: #161b22 !important;
    border-color: #30363d !important;
}

/* White explícito */
#employeeFileModal div[style*="background: white"],
#employeeFileModal div[style*="background:white"] {
    background: #161b22 !important;
}

/* rgba blanco (rgba(255,255,255,...)) */
#employeeFileModal div[style*="background: rgba(255"],
#employeeFileModal div[style*="background:rgba(255"] {
    background: rgba(255,255,255,0.05) !important;
}

/* Gradientes claros (que empiezan con colores #e o #f) */
#employeeFileModal div[style*="linear-gradient"][style*="#e8f5"],
#employeeFileModal div[style*="linear-gradient"][style*="#e3f2"],
#employeeFileModal div[style*="linear-gradient"][style*="#e0f"],
#employeeFileModal div[style*="linear-gradient"][style*="#fce"],
#employeeFileModal div[style*="linear-gradient"][style*="#f8f9"],
#employeeFileModal div[style*="linear-gradient"][style*="#f3e5"],
#employeeFileModal div[style*="linear-gradient"][style*="#fff8"],
#employeeFileModal div[style*="linear-gradient"][style*="#667eea"] {
    background: #161b22 !important;
}

/* Bordes claros → oscuros */
#employeeFileModal div[style*="border: 1px solid #ddd"],
#employeeFileModal div[style*="border:1px solid #ddd"],
#employeeFileModal div[style*="border: 1px solid #ccc"],
#employeeFileModal div[style*="border: 2px solid #ddd"],
#employeeFileModal .info-card {
    background: #161b22 !important;
    border-color: #30363d !important;
}

/* ── DARK THEME: Textos con color inline oscuro → claro ── */
#employeeFileModal [style*="color: #333"],
#employeeFileModal [style*="color:#333"],
#employeeFileModal [style*="color: #555"],
#employeeFileModal [style*="color: #666"],
#employeeFileModal [style*="color:#666"],
#employeeFileModal [style*="color: #495057"],
#employeeFileModal [style*="color: #2c3e50"],
#employeeFileModal [style*="color:#2c3e50"] {
    color: #e6edf3 !important;
}

#employeeFileModal [style*="color: #856404"],
#employeeFileModal [style*="color:#856404"] {
    color: #d29922 !important;
}

#employeeFileModal [style*="color: #0c5460"],
#employeeFileModal [style*="color:#0c5460"] {
    color: #58a6ff !important;
}

#employeeFileModal [style*="color: #d84315"],
#employeeFileModal [style*="color:#d84315"] {
    color: #f85149 !important;
}

#employeeFileModal [style*="color: #2e7d32"],
#employeeFileModal [style*="color:#2e7d32"],
#employeeFileModal [style*="color: #1b5e20"] {
    color: #3fb950 !important;
}

#employeeFileModal [style*="color: #004085"],
#employeeFileModal [style*="color: #0d47a1"],
#employeeFileModal [style*="color: #1565c0"],
#employeeFileModal [style*="color: #2a4365"] {
    color: #58a6ff !important;
}

#employeeFileModal [style*="color: #512da8"],
#employeeFileModal [style*="color: #7b1fa2"],
#employeeFileModal [style*="color: #6f42c1"] {
    color: #d2a8ff !important;
}

/* strong/bold siempre visible */
#employeeFileModal strong,
#employeeFileModal b {
    color: #e6edf3 !important;
}

/* ── DARK THEME: Inputs, selects, textareas ── */
#employeeFileModal input,
#employeeFileModal select,
#employeeFileModal textarea {
    background: #0d1117 !important;
    color: #e6edf3 !important;
    border: 1px solid #30363d !important;
    border-radius: 6px !important;
}

#employeeFileModal input:focus,
#employeeFileModal select:focus,
#employeeFileModal textarea:focus {
    border-color: #58a6ff !important;
    outline: none !important;
    box-shadow: 0 0 0 2px rgba(88, 166, 255, 0.3) !important;
}

#employeeFileModal input::placeholder,
#employeeFileModal textarea::placeholder {
    color: #484f58 !important;
}

/* ── DARK THEME: Labels ── */
#employeeFileModal label {
    color: #8b949e !important;
    font-weight: 500 !important;
}

/* ── DARK THEME: Botones generales ── */
#employeeFileModal .btn-primary,
#employeeFileModal button.btn-primary {
    background: #238636 !important;
    border-color: #238636 !important;
    color: #fff !important;
}

#employeeFileModal .btn-outline-primary,
#employeeFileModal button.btn-outline-primary {
    background: transparent !important;
    border: 1px solid #58a6ff !important;
    color: #58a6ff !important;
}

#employeeFileModal .btn-outline-primary:hover {
    background: #58a6ff !important;
    color: #fff !important;
}

#employeeFileModal .btn-outline-secondary,
#employeeFileModal button.btn-outline-secondary {
    background: transparent !important;
    border: 1px solid #8b949e !important;
    color: #8b949e !important;
}

#employeeFileModal .btn-outline-secondary:hover {
    background: #30363d !important;
    color: #e6edf3 !important;
}

#employeeFileModal .btn-outline-success,
#employeeFileModal button.btn-outline-success {
    background: transparent !important;
    border: 1px solid #3fb950 !important;
    color: #3fb950 !important;
}

#employeeFileModal .btn-outline-success:hover {
    background: #238636 !important;
    color: #fff !important;
}

#employeeFileModal .btn-outline-info,
#employeeFileModal button.btn-outline-info {
    background: transparent !important;
    border: 1px solid #58a6ff !important;
    color: #58a6ff !important;
}

#employeeFileModal .btn-outline-danger,
#employeeFileModal button.btn-outline-danger {
    background: transparent !important;
    border: 1px solid #f85149 !important;
    color: #f85149 !important;
}

#employeeFileModal .btn-outline-danger:hover {
    background: #f85149 !important;
    color: #fff !important;
}

/* ── DARK THEME: Tablas ── */
#employeeFileModal table {
    color: #c9d1d9 !important;
    border-color: #30363d !important;
}

#employeeFileModal th {
    background: #161b22 !important;
    color: #8b949e !important;
    border-color: #30363d !important;
    font-weight: 600 !important;
}

#employeeFileModal td {
    background: #0d1117 !important;
    color: #c9d1d9 !important;
    border-color: #21262d !important;
}

#employeeFileModal tr:hover td {
    background: #161b22 !important;
}

/* ── DARK THEME: Status badges ── */
#employeeFileModal .status-badge.active,
#employeeFileModal .status-badge.success {
    background: rgba(63, 185, 80, 0.15) !important;
    color: #3fb950 !important;
    border: 1px solid rgba(63, 185, 80, 0.3) !important;
}

#employeeFileModal .status-badge.inactive,
#employeeFileModal .status-badge.danger {
    background: rgba(248, 81, 73, 0.15) !important;
    color: #f85149 !important;
    border: 1px solid rgba(248, 81, 73, 0.3) !important;
}

#employeeFileModal .status-badge.warning {
    background: rgba(210, 153, 34, 0.15) !important;
    color: #d29922 !important;
    border: 1px solid rgba(210, 153, 34, 0.3) !important;
}

#employeeFileModal .status-badge.secondary {
    background: rgba(139, 148, 158, 0.15) !important;
    color: #8b949e !important;
}

/* ── DARK THEME: Info banners - ya cubiertos por catch-all ── */

/* ── DARK THEME: Scrollbar ── */
#employeeFileModal *::-webkit-scrollbar {
    width: 10px !important;
}

#employeeFileModal *::-webkit-scrollbar-track {
    background: #0d1117 !important;
}

#employeeFileModal *::-webkit-scrollbar-thumb {
    background: #30363d !important;
    border-radius: 5px !important;
}

#employeeFileModal *::-webkit-scrollbar-thumb:hover {
    background: #484f58 !important;
}

/* ── DARK THEME: Stat cards y grid - ya cubiertos por catch-all ── */

/* ── DARK THEME: Links ── */
#employeeFileModal a {
    color: #58a6ff !important;
}

#employeeFileModal a:hover {
    color: #79c0ff !important;
}

/* ══════════════════════════════════════════════════════════
 * DARK THEME: Calendario de Trabajo Personal
 * ══════════════════════════════════════════════════════════ */
#employeeFileModal .user-calendar-container {
    background: #0d1117 !important;
    padding: 15px !important;
}

#employeeFileModal .calendar-header {
    background: #161b22 !important;
    border: 1px solid #30363d !important;
    box-shadow: none !important;
    color: #e6edf3 !important;
}

#employeeFileModal .month-title {
    color: #e6edf3 !important;
}

#employeeFileModal .calendar-legend span {
    color: #c9d1d9 !important;
}

#employeeFileModal .legend-color {
    border-color: #30363d !important;
}

#employeeFileModal .calendar-grid-wrapper {
    background: #161b22 !important;
    border: 1px solid #30363d !important;
    box-shadow: none !important;
}

#employeeFileModal .calendar-day-header {
    background: #21262d !important;
    color: #8b949e !important;
}

#employeeFileModal .calendar-day {
    background: #0d1117 !important;
    border-color: #30363d !important;
    color: #c9d1d9 !important;
}

#employeeFileModal .calendar-day:hover {
    box-shadow: 0 4px 8px rgba(0,0,0,0.4) !important;
}

#employeeFileModal .calendar-day.other-month {
    background: #0d1117 !important;
    opacity: 0.3 !important;
}

#employeeFileModal .calendar-day.today {
    border-color: #58a6ff !important;
}

#employeeFileModal .calendar-day.work-day {
    background: rgba(25, 118, 210, 0.15) !important;
    border-color: #1976d2 !important;
}

#employeeFileModal .calendar-day.rest-day {
    background: rgba(158, 158, 158, 0.1) !important;
    border-color: #484f58 !important;
}

#employeeFileModal .calendar-day.absent-day {
    background: rgba(248, 81, 73, 0.15) !important;
    border-color: #f85149 !important;
}

#employeeFileModal .calendar-day.late-day {
    background: rgba(245, 124, 0, 0.15) !important;
    border-color: #f57c00 !important;
}

#employeeFileModal .calendar-day.present-day {
    background: rgba(63, 185, 80, 0.15) !important;
    border-color: #3fb950 !important;
}

#employeeFileModal .calendar-day.non-working-day {
    background: rgba(210, 153, 34, 0.15) !important;
    border-color: #d29922 !important;
}

#employeeFileModal .calendar-day.holiday-national-day {
    background: rgba(248, 81, 73, 0.15) !important;
    border-color: #f85149 !important;
}

#employeeFileModal .calendar-day.holiday-provincial-day {
    background: rgba(245, 124, 0, 0.15) !important;
    border-color: #f57c00 !important;
}

#employeeFileModal .day-number {
    color: #e6edf3 !important;
}

#employeeFileModal .day-shift {
    color: #58a6ff !important;
}

#employeeFileModal .day-hours {
    color: #8b949e !important;
}

#employeeFileModal .day-status.present {
    color: #3fb950 !important;
}

#employeeFileModal .day-status.late {
    color: #f57c00 !important;
}

#employeeFileModal .day-status.absent {
    color: #f85149 !important;
}

/* Resumen del mes */
#employeeFileModal .calendar-summary {
    background: #161b22 !important;
    border: 1px solid #30363d !important;
    box-shadow: none !important;
    color: #e6edf3 !important;
}

#employeeFileModal .summary-card.work {
    background: rgba(25, 118, 210, 0.15) !important;
    border-color: #1976d2 !important;
}

#employeeFileModal .summary-card.rest {
    background: rgba(158, 158, 158, 0.1) !important;
    border-color: #484f58 !important;
}

#employeeFileModal .summary-card.present {
    background: rgba(63, 185, 80, 0.15) !important;
    border-color: #3fb950 !important;
}

#employeeFileModal .summary-card.late {
    background: rgba(245, 124, 0, 0.15) !important;
    border-color: #f57c00 !important;
}

#employeeFileModal .summary-card.absent {
    background: rgba(248, 81, 73, 0.15) !important;
    border-color: #f85149 !important;
}

#employeeFileModal .summary-value {
    color: #e6edf3 !important;
}

#employeeFileModal .summary-label {
    color: #8b949e !important;
}

#employeeFileModal .bg-light {
    background: #161b22 !important;
    color: #e6edf3 !important;
}