/* /Components/Layout/MainLayout.razor.rz.scp.css */
.page[b-gzz0e70aj7] {
    position: relative;
    display: flex;
    flex-direction: column;
}

main[b-gzz0e70aj7] {
    flex: 1;
}

.sidebar[b-gzz0e70aj7] {
    background-image: linear-gradient(180deg, rgb(5, 39, 103) 0%, #3a0647 70%);
}

.top-row[b-gzz0e70aj7] {
    background-color: #f7f7f7;
    border-bottom: 1px solid #d6d5d5;
    justify-content: flex-end;
    height: 3.5rem;
    display: flex;
    align-items: center;
}

    .top-row[b-gzz0e70aj7]  a, .top-row[b-gzz0e70aj7]  .btn-link {
        white-space: nowrap;
        margin-left: 1.5rem;
        text-decoration: none;
    }

    .top-row[b-gzz0e70aj7]  a:hover, .top-row[b-gzz0e70aj7]  .btn-link:hover {
        text-decoration: underline;
    }

    .top-row[b-gzz0e70aj7]  a:first-child {
        overflow: hidden;
        text-overflow: ellipsis;
    }

@media (max-width: 640.98px) {
    .top-row[b-gzz0e70aj7] {
        justify-content: space-between;
    }

    .top-row[b-gzz0e70aj7]  a, .top-row[b-gzz0e70aj7]  .btn-link {
        margin-left: 0;
    }
}

@media (min-width: 641px) {
    .page[b-gzz0e70aj7] {
        flex-direction: row;
    }

    .sidebar[b-gzz0e70aj7] {
        width: 250px;
        height: 100vh;
        position: sticky;
        top: 0;
    }

    .top-row[b-gzz0e70aj7] {
        position: sticky;
        top: 0;
        z-index: 1;
    }

    .top-row.auth[b-gzz0e70aj7]  a:first-child {
        flex: 1;
        text-align: right;
        width: 0;
    }

    .top-row[b-gzz0e70aj7], article[b-gzz0e70aj7] {
        padding-left: 2rem !important;
        padding-right: 1.5rem !important;
    }
}

#blazor-error-ui[b-gzz0e70aj7] {
    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-gzz0e70aj7] {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }
/* /Components/Layout/ReconnectModal.razor.rz.scp.css */
.components-reconnect-first-attempt-visible[b-h7uhr7q4pw],
.components-reconnect-repeated-attempt-visible[b-h7uhr7q4pw],
.components-reconnect-failed-visible[b-h7uhr7q4pw],
.components-pause-visible[b-h7uhr7q4pw],
.components-resume-failed-visible[b-h7uhr7q4pw],
.components-rejoining-animation[b-h7uhr7q4pw] {
    display: none;
}

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

/* The framework leaves the "show" class in place when it adds "retrying"/"failed",
   which would render two state messages at once — later states win. */
#components-reconnect-modal.components-reconnect-retrying .components-reconnect-first-attempt-visible[b-h7uhr7q4pw],
#components-reconnect-modal.components-reconnect-failed .components-reconnect-first-attempt-visible[b-h7uhr7q4pw],
#components-reconnect-modal.components-reconnect-failed .components-reconnect-repeated-attempt-visible[b-h7uhr7q4pw],
#components-reconnect-modal.components-reconnect-failed .components-rejoining-animation[b-h7uhr7q4pw] {
    display: none;
}


#components-reconnect-modal[b-h7uhr7q4pw] {
    /* MudBlazor.min.css ships its own `#components-reconnect-modal` rule that forces
       background-color to var(--mud-palette-background) (!important) so the overlay
       tracks the active theme. Use the same palette vars for both colors so text
       always contrasts with whatever background MudBlazor picks — hardcoded colors
       end up dark-on-dark in dark mode. */
    background-color: var(--mud-palette-background, white);
    color: var(--mud-palette-text-primary, #333);
    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-h7uhr7q4pw 0.5s both;
    &[open]

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

}

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

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

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

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

    100% {
        opacity: 1;
    }
}

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

    100% {
        opacity: 0;
    }
}

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

.components-reconnect-image[b-h7uhr7q4pw] {
    max-width: 150px;
}

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

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

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

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

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

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

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

@keyframes components-rejoining-animation-b-h7uhr7q4pw {
    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/Admin/EditEventVehicleModels.razor.rz.scp.css */
/* The model list is short and narrow: size the grid to its content rather than the full page
   width, and keep every cell on one line. Elevation 0 keeps the paper edge unobtrusive. */
.vehicle-models-grid[b-ydnjb8q26m] {
    display: inline-block;
    max-width: 100%;
}

.vehicle-models-grid[b-ydnjb8q26m]  .mud-table-root {
    width: auto;
}

.vehicle-models-grid[b-ydnjb8q26m]  .mud-table-cell {
    white-space: nowrap;
}
/* /Components/Pages/Admin/EditVehicleDialog.razor.rz.scp.css */
/* The add-vehicle form: labels down the left, entries down the right. */
.vehicle-form[b-28fxekd96z] {
    border-collapse: collapse;
    width: 100%;
}

/* The label column hugs its text; the entry column takes the rest. Entries fill the cell up to
   their max-width, so they stay compact on a desktop and shrink to the screen on a phone. */
.vehicle-form th[b-28fxekd96z] {
    width: 1%;
}

.vehicle-form[b-28fxekd96z]  .vehicle-entry {
    width: 100%;
}

/* The caps sit on the control's root (the class lands there; an inline style lands on the inner
   input), so a field in a shared row stops growing at its cap and the next field sits beside it. */
.vehicle-form[b-28fxekd96z]  .max-120 { max-width: 120px; }
.vehicle-form[b-28fxekd96z]  .max-140 { max-width: 140px; }
.vehicle-form[b-28fxekd96z]  .max-220 { max-width: 220px; }
.vehicle-form[b-28fxekd96z]  .max-300 { max-width: 300px; }

.vehicle-form[b-28fxekd96z]  .d-flex > .vehicle-entry {
    min-width: 0;
}

/* A select wraps its capped input in an outer box that grows to fill the row, which leaves the
   gap between the dropdown and the Other textbox. Size that box to the cap instead. */
.vehicle-form[b-28fxekd96z]  .d-flex > .mud-select {
    flex: 0 1 220px;
    min-width: 0;
}

.vehicle-form th[b-28fxekd96z] {
    text-align: right;
    font-weight: 500;
    vertical-align: middle;
    padding: 4px 12px 4px 0;
    white-space: nowrap;
}

.vehicle-form td[b-28fxekd96z] {
    padding: 4px 0;
}

/* Plates, states, and VINs read in capitals as they are typed, and they save that way too. */
.vehicle-form[b-28fxekd96z]  .upper input {
    text-transform: uppercase;
}
/* /Components/Pages/Admin/RegistrantList.razor.rz.scp.css */
/* Tighter cells than MudBlazor's dense default, so the fixed-content columns sit close together
   and Name and Email keep the room to wrap instead of forcing a horizontal scrollbar. */
.registrants-grid[b-ccggqmlc62]  .mud-table-cell {
    padding-left: 8px;
    padding-right: 8px;
}

.registrants-grid[b-ccggqmlc62]  .mud-table-container {
    overflow-x: hidden;
}

/* The Search and Clear buttons keep their natural width at every breakpoint; a squeezed
   button lets its label run outside the button. */
.registrant-search[b-ccggqmlc62]  .search-actions .mud-button-root {
    flex-shrink: 0;
}
/* /Components/Shared/VehicleForm.razor.rz.scp.css */
/* The add-vehicle form: labels down the left, entries down the right. */
.vehicle-form[b-kkyydziqxg] {
    border-collapse: collapse;
    width: 100%;
}

/* The label column hugs its text; the entry column takes the rest. Entries fill the cell up to
   their max-width, so they stay compact on a desktop and shrink to the screen on a phone. */
.vehicle-form th[b-kkyydziqxg] {
    width: 1%;
}

.vehicle-form[b-kkyydziqxg]  .vehicle-entry {
    width: 100%;
}

/* The caps sit on the control's root (the class lands there; an inline style lands on the inner
   input), so a field in a shared row stops growing at its cap and the next field sits beside it. */
.vehicle-form[b-kkyydziqxg]  .max-120 { max-width: 120px; }
.vehicle-form[b-kkyydziqxg]  .max-140 { max-width: 140px; }
.vehicle-form[b-kkyydziqxg]  .max-220 { max-width: 220px; }
.vehicle-form[b-kkyydziqxg]  .max-300 { max-width: 300px; }

.vehicle-form[b-kkyydziqxg]  .d-flex > .vehicle-entry {
    min-width: 0;
}

/* A select wraps its capped input in an outer box that grows to fill the row, which leaves the
   gap between the dropdown and the Other textbox. Size that box to the cap instead. */
.vehicle-form[b-kkyydziqxg]  .d-flex > .mud-select {
    flex: 0 1 220px;
    min-width: 0;
}

.vehicle-form th[b-kkyydziqxg] {
    text-align: right;
    font-weight: 500;
    vertical-align: middle;
    padding: 4px 12px 4px 0;
    white-space: nowrap;
}

.vehicle-form td[b-kkyydziqxg] {
    padding: 4px 0;
}
/* A class row: the whole row is the click target, and the chosen row is outlined in the
   brand color so the selection reads from across the room, not only from the radio dot. */
.class-option[b-kkyydziqxg] {
    border: 1px solid transparent;
    border-radius: 4px;
    padding: 2px 8px;
    margin-bottom: 2px;
    cursor: pointer;
}

.class-option.selected[b-kkyydziqxg] {
    border-color: var(--mud-palette-primary);
    background-color: rgba(var(--mud-palette-primary-rgb), 0.08);
}

/* Plates, states, and VINs read in capitals as they are typed, and they save that way too. */
.vehicle-form[b-kkyydziqxg]  .upper input {
    text-transform: uppercase;
}