html,

/*tipo de letra sena para el año 2024*/
.letra-sena-2024 {
    font-family: 'Work Sans' , sans-serif;
}
/*fin tipo de letra sena para el año 2024*/

body {
    overflow-x: hidden;
    overflow-y: auto;
}

.fondo {
    opacity: 0.8;
    background-size: cover;
    background-position: bottom;
    position: absolute;
    width: 100%;
    height: 100%;
}

#logo-sena {
    max-width: 120px;
}

.bg-gradient-custom {
    background-color: #00304D;
    background-image: linear-gradient(180deg, #00304D 10%, #00304D 100%);
    background-size: cover;
}

.centro {
    padding-left: 30%;
}

.btn-success {
    background-color: #38a900 !important;
}

.scrollable-container {
    /*max-height: 75vh; */
    overflow-y: auto;
}

/* Estilos para spinner de carga */
#overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.8);
    /* Fondo más oscuro */
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 9999;
    display: none;
}

.loader-container {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    height: 100vh;
}

.loader {
    width: 70px;
    height: 70px;
    position: relative;
}

.loader:before {
    content: "";
    width: 70px;
    height: 70px;
    border-radius: 50%;
    border: 6px solid #ffffff;
    /* Spinner blanco */
    position: absolute;
    top: 0;
    left: 0;
    animation: pulse 1s ease-in-out infinite;
}

.loader:after {
    content: "";
    width: 70px;
    height: 70px;
    border-radius: 50%;
    border: 6px solid transparent;
    border-top-color: #ffffff;
    /* Spinner blanco */
    position: absolute;
    top: 0;
    left: 0;
    animation: spin 2s linear infinite;
}

.loader-text {
    font-size: 24px;
    margin-top: 20px;
    color: #ffffff;
    /* Texto blanco */
    font-family: Arial, sans-serif;
    text-align: center;
    text-transform: uppercase;
}

@keyframes pulse {
    0% {
        transform: scale(0.6);
        opacity: 1;
    }

    50% {
        transform: scale(1.2);
        opacity: 0;
    }

    100% {
        transform: scale(0.6);
        opacity: 1;
    }
}

@keyframes spin {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

.content {
    display: none;
}

.loaded .loader-container {
    display: none;
}

.loaded .content {
    display: block;
}

.clock {
    font-size: 0.8rem;
}
/* Fin estilos para spinner de carga */

/*color del texto*/
.text-black {
    color: black !important;
}
/*contenedor diseño*/

.custom-container {
    max-width: 1400px; /* O el tamaño que prefieras */
    width: 100%;
}

/**
    * Estilos para el checkbox personalizado
 */