/* Blazor Server circuit reconnection UI. Kept out of the Tailwind pipeline since it must
   render correctly from the very first static HTML paint, before the app is interactive. */

#components-reconnect-modal {
    position: fixed;
    bottom: 1rem;
    right: 1rem;
    z-index: 10000;
    display: none;
    pointer-events: none;
}

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

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

#components-reconnect-modal .reconnect-banner {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.625rem 1rem;
    border-radius: 0.75rem;
    background: var(--card-bg, #182b49);
    color: var(--card-text, #d1dff0);
    border: 1px solid var(--card-border, #273959);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.25);
    font-size: 0.875rem;
    font-weight: 500;
}

#components-reconnect-modal .reconnect-spin {
    animation: components-reconnect-spin 1s linear infinite;
}

@keyframes components-reconnect-spin {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}