/*overlay*/
.loader-overlay {
    position: fixed; /* Se pega a la pantalla */
    inset: 0; /* top:0 right:0 bottom:0 left:0 */
    background: rgba(255,255,255,0.85); /* Fondo blanco translúcido */
    display: none; /* Oculto por defecto */
    justify-content: center;
    align-items: center;
    z-index: 99999; /* Más alto que AdminLTE */
}

.loader-overlay.active {
    display: flex;
}

/*loader*/
.loader {
    display: flex;
    align-items: center;
    justify-content: center;
    background: #141218;
}

.iconLoaderProgress {
    display: flex;
    align-items: center;
    justify-content: center;
    animation-duration: 2s;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
    animation-name: rotateLoader;
}

.iconLoaderProgress svg {
    stroke-width: 16px;
    fill: none;
    transform-origin: center;
    z-index: 999;
}

.iconLoaderProgressFirst circle,
.iconLoaderProgressSecond circle,
.iconLoaderProgressFirst,
.iconLoaderProgressSecond {
    animation-timing-function: ease-in-out;
    animation-iteration-count: infinite;
}

.iconLoaderProgressFirst circle,
.iconLoaderProgressSecond circle {
    animation-duration: 3s;
    border-radius: 15px;
}

.iconLoaderProgressFirst,
.iconLoaderProgressSecond {
    position: absolute;
    animation-duration: 6s;
}

.iconLoaderProgressFirst circle {
    animation-name: circleFirst;
    stroke-dasharray: 628, 628;
    stroke-dashoffset: 0;
    stroke: #555150;
    stroke-linecap: round;
}

.iconLoaderProgressSecond {
    transform: rotate(-14deg);
}

.iconLoaderProgressSecond circle {
    animation-name: circleSecond;
    stroke-dasharray: 628, 628;
    stroke-dashoffset: 0;
    stroke: #DA9500;
    stroke-linecap: round;
}

@keyframes circleFirst {
    from, to {
        stroke-dashoffset: 50;
    }

    50% {
        stroke-dashoffset: 625;
    }
}

@keyframes circleSecond {
    from, to {
        stroke-dashoffset: -625;
    }

    50% {
        stroke-dashoffset: -50;
    }
}

@keyframes rotateLoader {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}


.modal-dialog.custom-modal {
    max-width: 95% !important;
}