.restricted-tab, .restricted-content {
    display: none;
}

/* Asegurarse de que las pestañas no activas estén ocultas */
.tab-pane:not(.active) {
    display: none !important;
}

/* Mantener la visibilidad para la pestaña activa */
.tab-pane.active {
    display: block !important;
}

/* Contenedor principal */
#historialGeneralSolicitudes {
    max-width: 1000px;
    margin: auto;
    background: #fff;
    padding: 24px;
    border-radius: 12px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    overflow: hidden;
    transition: all 0.3s ease;
    animation: fadeIn 0.5s ease-in-out;
    min-height: auto;
}

/* Tabs */
#historialGeneralTabs {
    justify-content: center;
    border-bottom: 3px solid #2e7d32;
}

#historialGeneralTabs .nav-link {
    color: #2e7d32;
    font-weight: bold;
    transition: all 0.3s ease;
}

#historialGeneralTabs .nav-link.active {
    background-color: #2e7d32;
    color: #fff;
    border: none;
}

/* Contenedor de tablas con scroll */
.table-container {
    max-height: 200px; /* Ajustado para mostrar 3 filas (148px + 16px de padding) */
    height: auto; /* Ajustar la altura al contenido si hay menos de 3 filas */
    overflow-y: auto;
    overflow-x: auto; /* Permitir scroll horizontal */
    border-radius: 5px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    padding: 8px; /* Reducido de 10px a 8px */
    position: relative; /* Para posicionamiento de la columna fija */
}

/* Tabla - Solo para historial general */
#historialGeneralSolicitudes .table {
    width: 100%;
    margin-bottom: 0;
    border-collapse: collapse;
    table-layout: auto;
    min-width: 1200px; /* Hacer la tabla más ancha */
}

/* Encabezados de tabla */
.table thead {
    background-color: #2e7d32;
    color: white;
    text-align: center;
    position: sticky;
    top: 0;
    z-index: 10;
}

/* Celdas de encabezados */
.table thead th {
    padding: 10px; /* Reducido de 12px a 10px */
    font-size: 15px;
    font-weight: bold;
    white-space: nowrap; /* Evitar que el texto se divida */
}

/* Columna Seleccionar fija - SOLO para permisos y vacaciones en historial general */
#historialGeneralSolicitudes #genPermisos .table thead th:first-child,
#historialGeneralSolicitudes #genPermisos .table tbody td:first-child,
#historialGeneralSolicitudes #genVacaciones .table thead th:first-child,
#historialGeneralSolicitudes #genVacaciones .table tbody td:first-child {
    position: sticky;
    left: 0;
    background-color: inherit;
    z-index: 5;
    min-width: 80px;
    width: 80px;
}

/* Asegurar que la columna fija tenga el fondo correcto - SOLO para permisos y vacaciones */
#historialGeneralSolicitudes #genPermisos .table thead th:first-child,
#historialGeneralSolicitudes #genVacaciones .table thead th:first-child {
    background-color: #2e7d32;
    z-index: 15; /* Mayor z-index para estar por encima */
}

#historialGeneralSolicitudes #genPermisos .table tbody tr:nth-child(even) td:first-child,
#historialGeneralSolicitudes #genVacaciones .table tbody tr:nth-child(even) td:first-child {
    background-color: #f8f9fa;
}

#historialGeneralSolicitudes #genPermisos .table tbody tr:nth-child(odd) td:first-child,
#historialGeneralSolicitudes #genVacaciones .table tbody tr:nth-child(odd) td:first-child {
    background-color: #ffffff;
}

#historialGeneralSolicitudes #genPermisos .table tbody tr:hover td:first-child,
#historialGeneralSolicitudes #genVacaciones .table tbody tr:hover td:first-child {
    background-color: #e8f5e9;
}

/* Cuerpo de la tabla */
.table tbody {
    display: table-row-group;
}

/* Filas */
.table tbody tr {
    transition: background-color 0.3s ease-in-out, transform 0.2s ease-in-out;
}

/* Animación al pasar el mouse */
.table tbody tr:hover {
    background-color: #e8f5e9;
    transform: scale(1.0);
}

/* Columnas - Ajuste de espacios */
.table th,
.table td {
    padding: 8px; /* Reducido de 10px a 8px para ahorrar espacio vertical */
    text-align: center;
    vertical-align: middle;
    word-wrap: break-word;
    white-space: nowrap; /* Evitar que el texto se divida en varias líneas */
}

/* Ajustar anchos de columnas para permisos - más anchas - SOLO historial general */
#historialGeneralSolicitudes .table#permisos th:nth-child(1), #historialGeneralSolicitudes .table#permisos td:nth-child(1) { width: 80px; } /* Seleccionar - fija */
#historialGeneralSolicitudes .table#permisos th:nth-child(2), #historialGeneralSolicitudes .table#permisos td:nth-child(2) { width: 100px; } /* Cédula */
#historialGeneralSolicitudes .table#permisos th:nth-child(3), #historialGeneralSolicitudes .table#permisos td:nth-child(3) { width: 120px; } /* Nombre */
#historialGeneralSolicitudes .table#permisos th:nth-child(4), #historialGeneralSolicitudes .table#permisos td:nth-child(4) { width: 100px; } /* Área */
#historialGeneralSolicitudes .table#permisos th:nth-child(5), #historialGeneralSolicitudes .table#permisos td:nth-child(5) { width: 100px; } /* Empresa */
#historialGeneralSolicitudes .table#permisos th:nth-child(6), #historialGeneralSolicitudes .table#permisos td:nth-child(6) { width: 100px; } /* Sede */
#historialGeneralSolicitudes .table#permisos th:nth-child(7), #historialGeneralSolicitudes .table#permisos td:nth-child(7) { width: 120px; } /* Fecha Solicitud */
#historialGeneralSolicitudes .table#permisos th:nth-child(8), #historialGeneralSolicitudes .table#permisos td:nth-child(8) { width: 120px; } /* Fecha Permiso */
#historialGeneralSolicitudes .table#permisos th:nth-child(9), #historialGeneralSolicitudes .table#permisos td:nth-child(9) { width: 80px; } /* Hora */
#historialGeneralSolicitudes .table#permisos th:nth-child(10), #historialGeneralSolicitudes .table#permisos td:nth-child(10) { width: 140px; } /* Motivo */
#historialGeneralSolicitudes .table#permisos th:nth-child(11), #historialGeneralSolicitudes .table#permisos td:nth-child(11) { width: 120px; } /* Tipo */
#historialGeneralSolicitudes .table#permisos th:nth-child(12), #historialGeneralSolicitudes .table#permisos td:nth-child(12) { width: 100px; } /* Horas Permitidas */
#historialGeneralSolicitudes .table#permisos th:nth-child(13), #historialGeneralSolicitudes .table#permisos td:nth-child(13) { width: 120px; } /* ¿Compensará el tiempo? */
#historialGeneralSolicitudes .table#permisos th:nth-child(14), #historialGeneralSolicitudes .table#permisos td:nth-child(14) { width: 120px; } /* Cómo compensa */
#historialGeneralSolicitudes .table#permisos th:nth-child(15), #historialGeneralSolicitudes .table#permisos td:nth-child(15) { width: 120px; } /* Aprobación Líder */
#historialGeneralSolicitudes .table#permisos th:nth-child(16), #historialGeneralSolicitudes .table#permisos td:nth-child(16) { width: 140px; } /* Aprobación Talento Humano */

/* Ajustar anchos de columnas para vacaciones - más anchas - SOLO historial general */
#historialGeneralSolicitudes #genVacaciones .table th:nth-child(1), #historialGeneralSolicitudes #genVacaciones .table td:nth-child(1) { width: 80px; } /* Seleccionar - fija */
#historialGeneralSolicitudes #genVacaciones .table th:nth-child(2), #historialGeneralSolicitudes #genVacaciones .table td:nth-child(2) { width: 100px; } /* Cédula */
#historialGeneralSolicitudes #genVacaciones .table th:nth-child(3), #historialGeneralSolicitudes #genVacaciones .table td:nth-child(3) { width: 120px; } /* Nombre */
#historialGeneralSolicitudes #genVacaciones .table th:nth-child(4), #historialGeneralSolicitudes #genVacaciones .table td:nth-child(4) { width: 100px; } /* Sede */
#historialGeneralSolicitudes #genVacaciones .table th:nth-child(5), #historialGeneralSolicitudes #genVacaciones .table td:nth-child(5) { width: 100px; } /* Área */
#historialGeneralSolicitudes #genVacaciones .table th:nth-child(6), #historialGeneralSolicitudes #genVacaciones .table td:nth-child(6) { width: 100px; } /* Empresa */
#historialGeneralSolicitudes #genVacaciones .table th:nth-child(7), #historialGeneralSolicitudes #genVacaciones .table td:nth-child(7) { width: 120px; } /* Fecha Solicitud */
#historialGeneralSolicitudes #genVacaciones .table th:nth-child(8), #historialGeneralSolicitudes #genVacaciones .table td:nth-child(8) { width: 120px; } /* Fecha Inicio */
#historialGeneralSolicitudes #genVacaciones .table th:nth-child(9), #historialGeneralSolicitudes #genVacaciones .table td:nth-child(9) { width: 120px; } /* Fecha Fin */
#historialGeneralSolicitudes #genVacaciones .table th:nth-child(10), #historialGeneralSolicitudes #genVacaciones .table td:nth-child(10) { width: 100px; } /* Días Hábiles */
#historialGeneralSolicitudes #genVacaciones .table th:nth-child(11), #historialGeneralSolicitudes #genVacaciones .table td:nth-child(11) { width: 120px; } /* Días Disponibles */
#historialGeneralSolicitudes #genVacaciones .table th:nth-child(12), #historialGeneralSolicitudes #genVacaciones .table td:nth-child(12) { width: 80px; } /* Año */
#historialGeneralSolicitudes #genVacaciones .table th:nth-child(13), #historialGeneralSolicitudes #genVacaciones .table td:nth-child(13) { width: 120px; } /* Aprobación Líder */
#historialGeneralSolicitudes #genVacaciones .table th:nth-child(14), #historialGeneralSolicitudes #genVacaciones .table td:nth-child(14) { width: 140px; } /* Aprobación Talento Humano */

#historialGeneralSolicitudes #genPermisos .table td:nth-child(13) {
    max-width: 0; /* Forza que respete el ancho definido */
    overflow: hidden; /* Oculta contenido que desborde */
    text-overflow: ellipsis; /* Agrega puntos suspensivos si el texto es muy largo */
}

/* Botón de descarga */
#btnDescargarExcel {
    background: #28a745;
    color: white;
    font-weight: bold;
    border-radius: 8px;
    transition: all 0.3s ease;
    padding: 10px 20px;
    margin-right: 10px;
    position: relative;
}

/* Estilo del texto "Haga clic para descargar" */
#btnDescargarExcel .download-tooltip {
    position: absolute;
    bottom: -20px;
    left: 50%;
    transform: translateX(-50%) scale(0.8);
    background: #1a3c34;
    color: white;
    font-size: 12px;
    padding: 2px 8px;
    border-radius: 4px;
    white-space: nowrap;
    opacity: 0;
    transition: opacity 0.3s ease, transform 0.3s ease;
    pointer-events: none;
}

/* Mostrar el texto al hacer hover */
#btnDescargarExcel:hover .download-tooltip {
    opacity: 1;
    transform: translateX(-50%) scale(1);
}

/* Botón regresar */
#btnRegresarGeneral {
    background: #2e7d32;
    color: #ffffff;
    font-weight: bold;
    border-radius: 8px;
    transition: all 0.3s ease;
    padding: 10px 20px;
}

#btnRegresarGeneral:hover {
    background: #1b5e20;
    transform: scale(1.05);
}

/* Animación de aparición */
@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Media query para móviles */
@media (max-width: 768px) {
    #historialGeneralSolicitudes {
        max-width: 100%;
        padding: 10px 5px;
        margin: 0;
    }

    .table-container {
        max-height: 60vh;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        border-radius: 8px;
        box-shadow: 0 2px 4px rgba(0,0,0,0.1);
    }

    .table {
        min-width: 800px;
        font-size: 12px;
    }

    .table th,
    .table td {
        font-size: 11px;
        padding: 6px 4px;
        white-space: nowrap;
        vertical-align: middle;
    }

    .table th {
        font-size: 10px;
        font-weight: 600;
        background-color: #f8f9fa;
        position: sticky;
        top: 0;
        z-index: 10;
    }

    #btnRegresarGeneral,
    #btnDescargarExcel,
    #btnActualizar,
    #btnEliminar {
        width: 100%;
        margin: 5px 0;
        font-size: 12px;
        padding: 8px 12px;
    }

    #btnDescargarExcel .download-tooltip {
        display: none; /* Ocultar tooltip en móviles */
    }

    /* Filtros responsive */
    .d-flex.justify-content-center {
        flex-direction: column;
        gap: 10px;
    }

    .d-flex.justify-content-center > * {
        width: 100%;
        margin: 0;
    }

    #filtroCedula {
        max-width: 100%;
        margin-bottom: 10px;
    }

    .btn-success,
    .btn-secondary {
        width: 100%;
        margin: 5px 0;
    }

    /* Tabs responsive */
    .nav-tabs {
        flex-wrap: wrap;
        border-bottom: 2px solid #dee2e6;
    }

    .nav-tabs .nav-item {
        flex: 1 1 auto;
        min-width: 0;
    }

    .nav-tabs .nav-link {
        padding: 8px 6px;
        font-size: 12px;
        text-align: center;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        border: none;
        border-bottom: 2px solid transparent;
    }

    .nav-tabs .nav-link.active {
        border-bottom-color: #007bff;
        background-color: #f8f9fa;
    }
}

@media (max-width: 576px) {
    #historialGeneralSolicitudes {
        padding: 5px 2px;
    }

    .table {
        min-width: 600px;
        font-size: 10px;
    }

    .table th,
    .table td {
        padding: 4px 2px;
        font-size: 10px;
    }

    .table th {
        font-size: 9px;
    }

    .nav-tabs .nav-link {
        padding: 6px 4px;
        font-size: 11px;
    }

    #btnRegresarGeneral,
    #btnDescargarExcel,
    #btnActualizar,
    #btnEliminar {
        font-size: 11px;
        padding: 6px 10px;
    }

    /* Scroll horizontal con indicador */
    .table-container::after {
        content: "← Desliza para ver más →";
        display: block;
        text-align: center;
        padding: 5px;
        font-size: 10px;
        color: #666;
        background: #f8f9fa;
        border-top: 1px solid #dee2e6;
    }
}

/* Estilos para botones */
#btnActualizar, #btnEliminar {
    margin-left: 10px;
    font-weight: bold;
    border-radius: 8px;
    transition: 0.3s ease;
    padding: 10px 20px;
}

#btnActualizar {
    background: #0288d1; /* Azul para actualizar */
    color: #ffffff;
}

#btnEliminar {
    background: #d32f2f; /* Rojo para eliminar */
    color: #ffffff;
}

#btnActualizar:hover, #btnEliminar:hover {
    transform: scale(1.05);
}

#btnActualizar:disabled, #btnEliminar:disabled {
    opacity: 0.6;
    cursor: not-allowed;
}

.disabled-row {
    opacity: 0.5;
    pointer-events: none;
}