@import '_content/Blazor.Bootstrap/Blazor.Bootstrap.olwso25aue.bundle.scp.css';

/* /Components/Layout/ReconnectModal.razor.rz.scp.css */
.components-reconnect-first-attempt-visible[b-lfeqc32utb],
.components-reconnect-repeated-attempt-visible[b-lfeqc32utb],
.components-reconnect-failed-visible[b-lfeqc32utb],
.components-pause-visible[b-lfeqc32utb],
.components-resume-failed-visible[b-lfeqc32utb],
.components-rejoining-animation[b-lfeqc32utb] {
    display: none;
}

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


#components-reconnect-modal[b-lfeqc32utb] {
    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-lfeqc32utb 0.5s both;
    &[open]

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

}

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

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

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

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

    100% {
        opacity: 1;
    }
}

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

    100% {
        opacity: 0;
    }
}

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

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

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

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

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

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

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

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

@keyframes components-rejoining-animation-b-lfeqc32utb {
    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/Pages/ManufacturerReport.razor.rz.scp.css */
/*
    While a new report query runs the outgoing results stay on screen rather than being cleared,
    so the page keeps its height and nothing jumps. They are dimmed and made inert to signal that
    what is shown is about to be replaced.
*/

.sc-results[b-kp54u5dicv] {
    position: relative;
}

/* Secondary line under a result, carrying the dimensions not pinned by a filter.
   Mirrors .sc-mover-detail in MoversPanel so a row and a tile read the same way;
   the two are separate rules only because CSS isolation is per component. */
.sc-result-detail[b-kp54u5dicv] {
    font-size: 0.8125rem;
    color: var(--bs-secondary-color, #6c757d);
}

.sc-results-pending[b-kp54u5dicv] {
    opacity: 0.4;
    pointer-events: none;
    user-select: none;
    transition: opacity 0.15s ease-in-out;
}

/* Absolutely positioned so showing it costs no layout, and outside the dimmed
   wrapper so it stays at full contrast */
.sc-results-spinner[b-kp54u5dicv] {
    position: absolute;
    top: 3rem;
    left: 50%;
    transform: translateX(-50%);
    z-index: 5;

    padding: 0.375rem 0.875rem;
    border-radius: 2rem;

    background-color: var(--bs-body-bg, #fff);
    border: 1px solid var(--bs-border-color, #dee2e6);
    box-shadow: 0 0.25rem 0.75rem rgba(0, 0, 0, 0.1);

    font-size: 0.875rem;
    color: var(--bs-secondary-color, #6c757d);
    white-space: nowrap;
}

@media (prefers-reduced-motion: reduce) {
    .sc-results-pending[b-kp54u5dicv] {
        transition: none;
    }
}
/* /Components/Shared/MoversPanel.razor.rz.scp.css */
/*
    Cards carry a tinted left edge matching the velocity badge inside them, so a row of risers
    reads as a group at a glance without repeating the colour across the whole card.
    Hues match VelocityBadge: indigo rising, orange falling.
*/

.sc-mover-card[b-jdp4f04bwk] {
    border-left-width: 3px;
}

.sc-mover-rising[b-jdp4f04bwk] {
    border-left-color: #6366f1;
}

.sc-mover-falling[b-jdp4f04bwk] {
    border-left-color: #f97316;
}

.sc-mover-detail[b-jdp4f04bwk] {
    font-size: 0.8125rem;
    color: var(--bs-secondary-color, #6c757d);
}
/* /Components/Shared/VelocityBadge.razor.rz.scp.css */
/*
    Indigo and orange rather than green and red, for two reasons: the rank arrows in the same row
    already use green and red for a different signal, and red/green is the axis most commonly lost
    to colour vision deficiency. Indigo against orange stays separable across all common types.

    Both are also held clear of the Bootstrap contextual colours already in play on this page -
    primary blue, secondary grey, warning amber and info cyan - so a velocity badge does not read
    as a filter chip or a count.
*/

.sc-velocity[b-mjwi4khpl9] {
    display: inline-flex;
    align-items: center;
    white-space: nowrap;
    vertical-align: middle;

    padding: 0.125rem 0.5rem;
    border-radius: 2rem;
    border: 1px solid transparent;

    font-size: 0.75rem;
    font-weight: 600;
    line-height: 1.4;
}

.sc-velocity-rising[b-mjwi4khpl9] {
    color: #3730a3;
    background-color: #eef2ff;
    border-color: #c7d2fe;
}

.sc-velocity-falling[b-mjwi4khpl9] {
    color: #9a3412;
    background-color: #fff7ed;
    border-color: #fed7aa;
}