@use "../configuraciones/variables";
@use "../herramientas/mixins";

.m-modal-carga {
    & {
        @include mixins.centradoVertical;
        flex-direction: column;
        position: absolute;
        top: 0;
        z-index: 10;
        width: 100vw;
        height: 100vh;
        background-color: variables.$color-background;
        visibility: visible;
    }
    
    &--oculto {
        animation-name: modal-difuminado;
        animation-duration: 1s;
        animation-fill-mode: forwards;
    }

    &__cargando {
        font-size: variables.$fs-movil-title-m;
        color: variables.$color-texto;
    }
}

@keyframes modal-difuminado{
    0%{
        transform: scale(1);
        background-color: variables.$color-background;    
    }

    100% {
        transform: scale(0);
        background-color: transparent;
        pointer-events: none;
    }
}




