/* Lo que se ve mientras baja el ensamblado .NET del mostrador.

   Es CSS a mano y no MudBlazor a propósito: esto tiene que dibujarse ANTES de que exista Blazor.
   Un componente de MudBlazor necesita que el runtime ya esté cargado, que es exactamente lo que
   todavía no pasó — se vería recién cuando ya no hace falta.

   NO se borra solo. Vive fuera del árbol de Blazor —es hermano del componente WebAssembly, no su
   contenedor—, así que arrancar no lo toca. Lo saca mostrador-cargando.js cuando el layout dibuja, y
   mientras tanto MostradorLayout se dibuja por encima con fondo opaco para que la pantalla se vea aun
   si esa llamada falla. Creer que se borraba solo lo dejó tapando el mostrador durante días. */

.mostrador-cargando {
    position: fixed;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #1a1a27;
    color: #e8e8f0;
    font-family: 'Inter', system-ui, sans-serif;
    z-index: 1;
}

.mostrador-cargando-caja {
    max-width: 420px;
    padding: 0 24px;
    text-align: center;
}

.mostrador-cargando-caja p {
    margin: 20px 0 6px;
    font-size: 1.05rem;
    font-weight: 500;
}

.mostrador-cargando-caja small {
    display: block;
    line-height: 1.45;
    opacity: .6;
    font-size: .82rem;
}

/* Barra indeterminada: no se sabe cuánto falta —el navegador no informa el progreso de la descarga
   del runtime— y una barra que dice 40 % y se queda ahí es peor que uno que sólo se mueve. */
.mostrador-cargando-barra {
    height: 4px;
    border-radius: 2px;
    background: rgba(255, 255, 255, .12);
    overflow: hidden;
}

.mostrador-cargando-barra span {
    display: block;
    width: 40%;
    height: 100%;
    border-radius: 2px;
    background: #4c8dff;
    animation: mostrador-cargando-desliza 1.1s ease-in-out infinite;
}

@keyframes mostrador-cargando-desliza {
    0%   { transform: translateX(-100%); }
    100% { transform: translateX(250%); }
}

/* Sin animación para quien la pidió apagada en el sistema. */
@media (prefers-reduced-motion: reduce) {
    .mostrador-cargando-barra span {
        animation: none;
        width: 100%;
    }
}
