/* /Components/Layout/AuthLayout.razor.rz.scp.css */
/*
    Scoped styling for the authentication shell.
    Uses Metronic Tailwind theme CSS variables for colours so the page adapts to
    light and dark mode without relying on Tailwind utilities that the pre-built
    bundle may not have emitted (e.g. min-h-screen, max-w-md, gradient stops).
*/

.auth-shell[b-i9etukkxrs] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    flex-grow: 1;
    width: 100%;
    min-height: 100vh;
    padding: 2rem 1rem;
    background-color: var(--muted);
    background-image:
        radial-gradient(at 0% 0%, color-mix(in srgb, var(--primary) 12%, transparent) 0px, transparent 50%),
        radial-gradient(at 100% 100%, color-mix(in srgb, var(--primary) 10%, transparent) 0px, transparent 50%);
}

.auth-container[b-i9etukkxrs] {
    width: 100%;
    max-width: 28rem;
    display: flex;
    flex-direction: column;
}

.auth-brand[b-i9etukkxrs] {
    display: flex;
    justify-content: center;
    margin-bottom: 2rem;
}

.auth-logo[b-i9etukkxrs] {
    height: 3rem;
    width: auto;
    object-fit: contain;
}
/* /Components/Layout/MainLayout.razor.rz.scp.css */
#blazor-error-ui[b-rxm07ofwqx] {
    color-scheme: light only;
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    box-sizing: border-box;
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

    #blazor-error-ui .dismiss[b-rxm07ofwqx] {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }

/* ── Sidebar scroll ─────────────────────────────────────────────────────────
   The aside is fixed top-0 / bottom-0, giving it a known height.
   sidebar-header and sidebar-footer are shrink-0 (fixed height).
   sidebar-content must fill the remaining space and scroll on overflow.
   We reinforce this with explicit CSS because the prebuilt Tailwind bundle
   may not emit min-h-0 or overflow-y-auto utilities. */

#sidebar[b-rxm07ofwqx] {
    display: flex;
    flex-direction: column;
}

#sidebar .sidebar-header[b-rxm07ofwqx],
#sidebar .sidebar-footer[b-rxm07ofwqx] {
    flex-shrink: 0;
}

#sidebar .sidebar-content[b-rxm07ofwqx] {
    flex: 1 1 0;       /* grow + shrink relative to siblings; basis 0 so it doesn't fight header/footer */
    min-height: 0;     /* critical: allows flex child to shrink below its content size */
    overflow-y: auto;
    overflow-x: hidden;
}
/* /Components/Layout/NavMenu.razor.rz.scp.css */
/*
    Scoped styling for the sidebar navigation.
    Colour/hover/active states use Metronic Tailwind theme CSS variables so they
    work in both light and dark mode without depending on hover:* Tailwind
    utilities that the pre-built bundle does not emit.
*/

.nav-link[b-3e674snxa6] {
    color: var(--secondary-foreground);
    transition: background-color 0.15s ease, color 0.15s ease;
}

.nav-link .kt-menu-icon[b-3e674snxa6] {
    color: var(--muted-foreground);
    transition: color 0.15s ease;
}

.nav-link:hover[b-3e674snxa6] {
    background-color: var(--accent);
    color: var(--mono);
}

.nav-link:hover .kt-menu-icon[b-3e674snxa6] {
    color: var(--mono);
}

.nav-link-active[b-3e674snxa6],
.nav-link-active:hover[b-3e674snxa6] {
    background-color: var(--primary);
    color: var(--primary-foreground);
}

.nav-link-active .kt-menu-icon[b-3e674snxa6],
.nav-link-active:hover .kt-menu-icon[b-3e674snxa6] {
    color: var(--primary-foreground);
}

.nav-heading[b-3e674snxa6] {
    color: var(--muted-foreground);
}
/* /Components/Layout/ReconnectModal.razor.rz.scp.css */
.components-reconnect-first-attempt-visible[b-9ewr1vwa4u],
.components-reconnect-repeated-attempt-visible[b-9ewr1vwa4u],
.components-reconnect-failed-visible[b-9ewr1vwa4u],
.components-pause-visible[b-9ewr1vwa4u],
.components-resume-failed-visible[b-9ewr1vwa4u],
.components-rejoining-animation[b-9ewr1vwa4u] {
    display: none;
}

#components-reconnect-modal.components-reconnect-show .components-reconnect-first-attempt-visible[b-9ewr1vwa4u],
#components-reconnect-modal.components-reconnect-show .components-rejoining-animation[b-9ewr1vwa4u],
#components-reconnect-modal.components-reconnect-paused .components-pause-visible[b-9ewr1vwa4u],
#components-reconnect-modal.components-reconnect-resume-failed .components-resume-failed-visible[b-9ewr1vwa4u],
#components-reconnect-modal.components-reconnect-retrying[b-9ewr1vwa4u],
#components-reconnect-modal.components-reconnect-retrying .components-reconnect-repeated-attempt-visible[b-9ewr1vwa4u],
#components-reconnect-modal.components-reconnect-retrying .components-rejoining-animation[b-9ewr1vwa4u],
#components-reconnect-modal.components-reconnect-failed[b-9ewr1vwa4u],
#components-reconnect-modal.components-reconnect-failed .components-reconnect-failed-visible[b-9ewr1vwa4u] {
    display: block;
}


#components-reconnect-modal[b-9ewr1vwa4u] {
    background-color: white;
    width: 20rem;
    margin: 20vh auto;
    padding: 2rem;
    border: 0;
    border-radius: 0.5rem;
    box-shadow: 0 3px 6px 2px rgba(0, 0, 0, 0.3);
    opacity: 0;
    transition: display 0.5s allow-discrete, overlay 0.5s allow-discrete;
    animation: components-reconnect-modal-fadeOutOpacity-b-9ewr1vwa4u 0.5s both;
    &[open]

{
    animation: components-reconnect-modal-slideUp-b-9ewr1vwa4u 1.5s cubic-bezier(.05, .89, .25, 1.02) 0.3s, components-reconnect-modal-fadeInOpacity-b-9ewr1vwa4u 0.5s ease-in-out 0.3s;
    animation-fill-mode: both;
}

}

#components-reconnect-modal[b-9ewr1vwa4u]::backdrop {
    background-color: rgba(0, 0, 0, 0.4);
    animation: components-reconnect-modal-fadeInOpacity-b-9ewr1vwa4u 0.5s ease-in-out;
    opacity: 1;
}

@keyframes components-reconnect-modal-slideUp-b-9ewr1vwa4u {
    0% {
        transform: translateY(30px) scale(0.95);
    }

    100% {
        transform: translateY(0);
    }
}

@keyframes components-reconnect-modal-fadeInOpacity-b-9ewr1vwa4u {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@keyframes components-reconnect-modal-fadeOutOpacity-b-9ewr1vwa4u {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

.components-reconnect-container[b-9ewr1vwa4u] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
}

#components-reconnect-modal p[b-9ewr1vwa4u] {
    margin: 0;
    text-align: center;
}

#components-reconnect-modal button[b-9ewr1vwa4u] {
    border: 0;
    background-color: #6b9ed2;
    color: white;
    padding: 4px 24px;
    border-radius: 4px;
}

    #components-reconnect-modal button:hover[b-9ewr1vwa4u] {
        background-color: #3b6ea2;
    }

    #components-reconnect-modal button:active[b-9ewr1vwa4u] {
        background-color: #6b9ed2;
    }

.components-rejoining-animation[b-9ewr1vwa4u] {
    position: relative;
    width: 80px;
    height: 80px;
}

    .components-rejoining-animation div[b-9ewr1vwa4u] {
        position: absolute;
        border: 3px solid #0087ff;
        opacity: 1;
        border-radius: 50%;
        animation: components-rejoining-animation-b-9ewr1vwa4u 1.5s cubic-bezier(0, 0.2, 0.8, 1) infinite;
    }

        .components-rejoining-animation div:nth-child(2)[b-9ewr1vwa4u] {
            animation-delay: -0.5s;
        }

@keyframes components-rejoining-animation-b-9ewr1vwa4u {
    0% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 0;
    }

    4.9% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 0;
    }

    5% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 1;
    }

    100% {
        top: 0px;
        left: 0px;
        width: 80px;
        height: 80px;
        opacity: 0;
    }
}
/* /Components/Shared/ConfirmDialog.razor.rz.scp.css */
/*
    Scoped overlay/positioning for ConfirmDialog.
    Overlay and z-index utilities (inset-0, z-50, max-w-sm) are not emitted by the
    pre-built Metronic bundle, so positioning is defined here while the dialog
    surface itself uses the kt-card component.
*/

.confirm-overlay[b-ev8ve2cskx] {
    position: fixed;
    inset: 0;
    z-index: 50;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem;
    background-color: color-mix(in srgb, var(--color-black, #000) 50%, transparent);
}

.confirm-dialog[b-ev8ve2cskx] {
    width: 100%;
    max-width: 24rem;
    box-shadow: 0 20px 25px -5px rgb(0 0 0 / 0.15), 0 8px 10px -6px rgb(0 0 0 / 0.15);
}
/* /Components/Shared/QuickActionLink.razor.rz.scp.css */
/*
    Scoped hover styling for QuickActionLink.
    Uses Metronic theme variables so hover states work in light and dark mode
    without depending on hover:* Tailwind utilities that the pre-built bundle
    does not emit.
*/

.quick-action[b-hdus0x68yo] {
    transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

.quick-action:hover[b-hdus0x68yo] {
    background-color: var(--accent);
    border-color: var(--primary);
    color: var(--mono);
}

.quick-action:hover .quick-action-icon[b-hdus0x68yo] {
    background-color: var(--primary);
    color: var(--primary-foreground);
}

.quick-action-icon[b-hdus0x68yo] {
    transition: background-color 0.15s ease, color 0.15s ease;
}