/*
 * Estilos del modal de reconexión del circuito de Blazor Server.
 * Blazor añade/quita estas clases automáticamente al div #components-reconnect-modal:
 *   - components-reconnect-show     → reconectando (mostrar)
 *   - components-reconnect-hide     → conectado (ocultar)
 *   - components-reconnect-failed   → reconexión agotada (mostrar UI de retry)
 *   - components-reconnect-rejected → servidor rechazó la reconexión (mostrar UI de recarga)
 *
 * Por defecto sólo se muestra el contenido "show". Las otras vistas se activan
 * intercambiando display vía las clases que aplica Blazor.
 */

#components-reconnect-modal {
    display: none;
    position: fixed;
    inset: 0;
    z-index: 10500;
    background-color: rgba(15, 23, 42, 0.55);
    backdrop-filter: blur(2px);
    align-items: center;
    justify-content: center;
}

#components-reconnect-modal.components-reconnect-show,
#components-reconnect-modal.components-reconnect-failed,
#components-reconnect-modal.components-reconnect-rejected {
    display: flex;
}

#components-reconnect-modal .components-reconnect-dialog {
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
    padding: 2rem 2.5rem;
    min-width: 320px;
    max-width: 480px;
    text-align: center;
}

#components-reconnect-modal .components-reconnect-content {
    display: none;
}

#components-reconnect-modal.components-reconnect-show .components-reconnect-show-content {
    display: block;
}

#components-reconnect-modal.components-reconnect-failed .components-reconnect-failed-content {
    display: block;
}

#components-reconnect-modal.components-reconnect-rejected .components-reconnect-rejected-content {
    display: block;
}

[data-bs-theme="dark"] #components-reconnect-modal .components-reconnect-dialog {
    background: #1e293b;
    color: #e2e8f0;
}