@import '_content/Microsoft.AspNetCore.Components.QuickGrid/Microsoft.AspNetCore.Components.QuickGrid.boiwgh0w5b.bundle.scp.css';

/* /Components/Layout/MainLayout.razor.rz.scp.css */
/* Collapse/expand toggle for the nav drawer — sits directly on the border
   line between the drawer and the main content, half on each side, matching
   the reference (Sneat's circular chevron button). Positioned relative to
   the drawer's own box (position:fixed) so it tracks the drawer as it
   animates between full and mini width (DrawerVariant.Mini).

   Wrapped in a plain <div> (not applied via MudIconButton's Class param):
   Blazor CSS isolation only stamps its scope attribute on elements authored
   directly in this .razor file, never on a child component's own rendered
   root — a class passed into MudIconButton's Class parameter lands on the
   real DOM node with no scope attribute, so a scoped selector targeting it
   silently never matches. */
.c-sidebar-footer[b-go2hx2wqh8] {
    margin-top: auto;
    display: flex;
    justify-content: center;
    padding: 8px 0;
}

.c-drawer-toggle[b-go2hx2wqh8] {
    position: absolute;
    top: 28px;
    right: -14px;
    z-index: 10;
    width: 28px;
    height: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background-color: var(--mud-palette-white, #fff);
    border: 1px solid var(--mud-palette-lines-default, #e0e0e0);
    box-shadow: var(--mud-elevation-2, 0 2px 4px rgba(0, 0, 0, 0.15));
    overflow: hidden;
    transition: right 225ms cubic-bezier(0.4, 0, 0.2, 1);
}
/* /Components/Layout/ReconnectModal.razor.rz.scp.css */
#components-reconnect-modal[b-450fo32vyh] {
    display: none;
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1400;
    overflow: hidden;
    background-color: transparent;
    border: none;
    width: 100%;
    max-width: 100%;
    max-height: 100%;
    margin: 0;
    padding: 0;
}

    #components-reconnect-modal[b-450fo32vyh]::backdrop {
        background: rgba(10, 16, 28, 0.5);
    }

    #components-reconnect-modal.components-reconnect-show[b-450fo32vyh],
    #components-reconnect-modal[open][b-450fo32vyh],
    #components-reconnect-modal.components-reconnect-failed[b-450fo32vyh],
    #components-reconnect-modal.components-reconnect-repeated-attempt[b-450fo32vyh],
    #components-reconnect-modal.components-reconnect-paused[b-450fo32vyh],
    #components-reconnect-modal.components-reconnect-resume-failed[b-450fo32vyh],
    #components-reconnect-modal.components-pause[b-450fo32vyh],
    #components-reconnect-modal.components-resume-failed[b-450fo32vyh] {
        display: flex;
        align-items: center;
        justify-content: center;
    }

.components-reconnect-backdrop[b-450fo32vyh] {
    position: fixed;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
    background: radial-gradient(90% 60% at 80% 0%, color-mix(in srgb, var(--mud-palette-primary, #594AE2) 12%, transparent), transparent 60%), radial-gradient(80% 55% at 0% 100%, color-mix(in srgb, var(--mud-palette-info, #2196f3) 16%, transparent), transparent 62%), rgba(8, 12, 20, 0.5);
}

.components-reconnect-surface[b-450fo32vyh] {
    width: min(480px, 100%);
    border-radius: var(--mud-default-borderradius, 12px);
    border: 1px solid color-mix(in srgb, var(--mud-palette-lines-default, #e0e0e0) 70%, transparent);
    background: var(--mud-palette-surface, #fff);
    box-shadow: var(--mud-elevation-24, 0 16px 30px rgba(0, 0, 0, 0.28));
    color: var(--mud-palette-text-primary, #1f2937);
    padding: 20px 20px 18px;
}

.components-reconnect-header[b-450fo32vyh] {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 8px;
}

    .components-reconnect-header h2[b-450fo32vyh] {
        margin: 0;
        font-size: 1.05rem;
        font-weight: 600;
        line-height: 1.3;
    }

.components-reconnect-status-dot[b-450fo32vyh] {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: var(--mud-palette-warning, #f59e0b);
    box-shadow: 0 0 0 6px color-mix(in srgb, var(--mud-palette-warning, #f59e0b) 25%, transparent);
}

.components-reconnect-supporting[b-450fo32vyh],
.components-reconnect-message[b-450fo32vyh] {
    margin: 0;
    line-height: 1.45;
    font-size: 0.95rem;
}

.components-reconnect-supporting[b-450fo32vyh] {
    color: var(--mud-palette-text-secondary, #52607a);
    margin-bottom: 14px;
}

.components-reconnect-message[b-450fo32vyh] {
    font-weight: 500;
}

.components-reconnect-danger[b-450fo32vyh] {
    color: var(--mud-palette-error, #b00020);
}

.components-reconnect-actions[b-450fo32vyh] {
    margin-top: 14px;
    display: flex;
    gap: 10px;
    justify-content: flex-end;
}

.components-reconnect-first-attempt-visible[b-450fo32vyh],
.components-reconnect-repeated-attempt-visible[b-450fo32vyh],
.components-reconnect-failed-visible[b-450fo32vyh],
.components-pause-visible[b-450fo32vyh],
.components-resume-failed-visible[b-450fo32vyh] {
    display: none;
}

dialog[open].components-reconnect-show .components-reconnect-first-attempt-visible[b-450fo32vyh] {
    display: block;
}

dialog[open].components-reconnect-show .components-rejoin-loader[b-450fo32vyh] {
    display: inline-flex;
}

dialog[open].components-reconnect-failed .components-reconnect-failed-visible[b-450fo32vyh] {
    display: block;
}

dialog[open].components-reconnect-failed #components-reconnect-button[b-450fo32vyh] {
    display: block;
}

dialog[open].components-reconnect-repeated-attempt .components-reconnect-repeated-attempt-visible[b-450fo32vyh] {
    display: block;
}

dialog[open].components-reconnect-repeated-attempt .components-rejoin-loader[b-450fo32vyh] {
    display: inline-flex;
}

dialog[open].components-reconnect-paused .components-pause-visible[b-450fo32vyh],
dialog[open].components-pause .components-pause-visible[b-450fo32vyh] {
    display: block;
}

dialog[open].components-reconnect-paused #components-resume-button[b-450fo32vyh],
dialog[open].components-pause #components-resume-button[b-450fo32vyh],
dialog[open].components-reconnect-resume-failed #components-resume-button[b-450fo32vyh],
dialog[open].components-resume-failed #components-resume-button[b-450fo32vyh] {
    display: block;
}

dialog[open].components-reconnect-resume-failed .components-resume-failed-visible[b-450fo32vyh],
dialog[open].components-resume-failed .components-resume-failed-visible[b-450fo32vyh] {
    display: block;
}

.components-rejoin-loader[b-450fo32vyh] {
    display: none;
    margin-bottom: 10px;
    gap: 8px;
}

    .components-rejoin-loader div[b-450fo32vyh] {
        width: 9px;
        height: 9px;
        border-radius: 50%;
        background-color: var(--mud-palette-primary, #594AE2);
        animation: reconnect-pulse-b-450fo32vyh 1.2s infinite ease-in-out both;
    }

        .components-rejoin-loader div:nth-child(1)[b-450fo32vyh] {
            animation-delay: -0.24s;
        }

        .components-rejoin-loader div:nth-child(2)[b-450fo32vyh] {
            animation-delay: -0.12s;
        }

@keyframes reconnect-pulse-b-450fo32vyh {
    0%, 80%, 100% {
        transform: scale(0);
    }

    40% {
        transform: scale(1);
    }
}

#components-reconnect-button[b-450fo32vyh],
#components-resume-button[b-450fo32vyh] {
    display: none;
    min-width: 92px;
    cursor: pointer;
    padding: 8px 16px;
    border: 1px solid transparent;
    border-radius: 999px;
    background-color: var(--mud-palette-primary, #594AE2);
    color: #fff;
    font-size: 0.875rem;
    font-weight: 600;
    line-height: 1.2;
    transition: filter 140ms ease, transform 140ms ease;
}

    #components-reconnect-button:hover[b-450fo32vyh],
    #components-resume-button:hover[b-450fo32vyh] {
        filter: brightness(0.95);
    }

    #components-reconnect-button:active[b-450fo32vyh],
    #components-resume-button:active[b-450fo32vyh] {
        transform: translateY(1px);
    }

@media (max-width: 600px) {
    .components-reconnect-backdrop[b-450fo32vyh] {
        padding: 14px;
    }

    .components-reconnect-surface[b-450fo32vyh] {
        padding: 16px;
    }
}