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

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


#components-reconnect-modal[b-q5t5fiez5l] {
    background-color: var(--rz-dialog-background-color);
    width: 20rem;
    margin: 20vh auto;
    padding: 2rem;
    border: 0;
    border-radius: var(--rz-dialog-border-radius);
    box-shadow: var(--rz-dialog-shadow);
    opacity: 0;
    transition: display 0.5s allow-discrete, overlay 0.5s allow-discrete;
    animation: components-reconnect-modal-fadeOutOpacity-b-q5t5fiez5l 0.5s both;
    &[open] {
        animation: components-reconnect-modal-slideUp-b-q5t5fiez5l 1.5s cubic-bezier(.05, .89, .25, 1.02) 0.3s, components-reconnect-modal-fadeInOpacity-b-q5t5fiez5l 0.5s ease-in-out 0.3s;
        animation-fill-mode: both;
    }

}

#components-reconnect-modal[b-q5t5fiez5l]::backdrop {
    background-color: var(--rz-dialog-mask-background-color);
    animation: components-reconnect-modal-fadeInOpacity-b-q5t5fiez5l 0.5s ease-in-out;
    opacity: 1;
}

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

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

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

    100% {
        opacity: 1;
    }
}

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

    100% {
        opacity: 0;
    }
}

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

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

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

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

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

@keyframes components-rejoining-animation-b-q5t5fiez5l {
    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/Dealer/LicenseDirectDocument.razor.rz.scp.css */
/* The program documents are Markdown rendered by RadzenMarkdown, which emits plain h1/h2/table
   elements — and the Material theme sizes a bare h1 as a display heading, far too large for a
   document. These keep them at reading size. ::deep because the elements are rendered by the
   Radzen component, outside this page's CSS scope. */

.license-direct-document[b-iv69a5tau7]  h1 {
    font-size: 1.75rem;
    line-height: 1.25;
    margin: 0 0 0.25rem;
}

.license-direct-document[b-iv69a5tau7]  h2 {
    font-size: 1.25rem;
    line-height: 1.3;
    margin: 1.5rem 0 0.5rem;
}

.license-direct-document[b-iv69a5tau7]  p,
.license-direct-document[b-iv69a5tau7]  li {
    line-height: 1.55;
}

/* Radzen styles the tables itself (shaded header, rounded frame), but it also truncates a cell with an
   ellipsis — which clipped "$43.20 base + $1.80/floor" to "$1.80/fl…" in the price table. In a
   contract every word of a price has to be visible, so cells wrap instead. */
.license-direct-document[b-iv69a5tau7]  th,
.license-direct-document[b-iv69a5tau7]  td {
    white-space: normal;
    overflow: visible;
    text-overflow: clip;
    vertical-align: top;
}
/* /Components/Shared/DataTableGrid.razor.rz.scp.css */
/* DataTables-style chrome around RadzenDataGrid:
   "Show N entries" + Search on top, "Showing X to Y of Z entries" + pager on the bottom. */

.dt-toolbar[b-huwsi1tjtb] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 0.75rem;
    margin-bottom: 0.75rem;
}

.dt-toolbar-left[b-huwsi1tjtb],
.dt-toolbar-right[b-huwsi1tjtb] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.dt-actions[b-huwsi1tjtb] {
    margin-inline-start: 0.75rem;
}

.dt-label[b-huwsi1tjtb] {
    font-size: 0.875rem;
    color: var(--rz-text-secondary-color);
    white-space: nowrap;
}

.dt-pagesize[b-huwsi1tjtb] {
    width: 5.5rem;
}

.dt-search[b-huwsi1tjtb] {
    width: 15rem;
}

/* Striped rows — Radzen 10/11 emits no even/odd row classes, so use nth-child. */
.dt-wrapper[b-huwsi1tjtb]  .rz-datatable-data > tr:nth-child(even):not(.rz-state-highlight) {
    background-color: var(--rz-base-200, #f9f9f9);
}

/* DataTables keeps the header/footer flush with the body — no card chrome. */
.dt-wrapper[b-huwsi1tjtb]  .rz-datatable {
    border: none;
}

.dt-wrapper[b-huwsi1tjtb]  .rz-datatable-thead th {
    border-bottom: 2px solid var(--rz-base-400, #d0d0d0);
}

.dt-wrapper[b-huwsi1tjtb]  .rz-pager {
    border: none;
    padding-inline: 0;
}

.dt-wrapper[b-huwsi1tjtb]  .rz-pager-summary {
    font-size: 0.875rem;
}

/* HORIZONTAL SCROLL BELONGS TO THE TABLE, NOT THE PAGE.
   Every column in these grids has either a fixed width or content that will not wrap (badges,
   buttons, email addresses), so on a narrow viewport the total exceeds the available width. Without
   this the overflow is simply clipped and the last column -- which is the Actions column on every one
   of these pages -- disappears off the right-hand edge with nothing to indicate it is there.
   Scrolling the grid keeps the page chrome still and makes the overflow discoverable. */
.dt-wrapper[b-huwsi1tjtb]  .rz-data-grid,
.dt-wrapper[b-huwsi1tjtb]  .rz-datatable {
    overflow-x: auto;
}

/* Stops the buttons inside an Actions cell wrapping onto a second line, which made rows uneven and
   pushed the last button out of the cell's own box. */
.dt-wrapper[b-huwsi1tjtb]  .rz-datatable-data td .rz-button {
    white-space: nowrap;
}

/* THE TOOLBAR ON A NARROW VIEWPORT.
   The search box is 15rem, which is right on a desktop and wider than some phones. Fixed, it forces
   the toolbar to overflow sideways and takes the page's horizontal scrollbar with it -- so the whole
   page slides, not just the table, which is the one thing the grid's own overflow rule is there to
   prevent. Below 640px the search and the group it sits in take the full row instead, so the toolbar
   stacks and the table keeps its scrolling to itself. */
@media (max-width: 640px) {
    .dt-toolbar-left[b-huwsi1tjtb],
    .dt-toolbar-right[b-huwsi1tjtb] {
        width: 100%;
    }

    .dt-search[b-huwsi1tjtb] {
        width: 100%;
    }

    /* Left in the flow rather than hidden: "Showing 1 to 10 of 34" is how a dealer knows the list
       continues, and it is the pager's only label. */
    .dt-toolbar-right[b-huwsi1tjtb] {
        justify-content: flex-start;
    }
}

/* The minimum set by DataTableGrid's MinWidth parameter, applied to the TABLE.
   Not to the columns: Radzen's table is table-layout:auto, and in an auto-layout table a min-width
   on a cell is advisory -- the browser's column algorithm overrides it. A minimum on the table is
   honoured, so the columns keep their share and the excess becomes the horizontal scroll the rules
   above already provide. Defaults to 0, so a grid that does not set it behaves exactly as before. */
.dt-wrapper[b-huwsi1tjtb]  .rz-datatable table,
.dt-wrapper[b-huwsi1tjtb]  .rz-data-grid table {
    min-width: var(--dt-min-width, 0);
}

/* The minimum set by DataTableGrid's MinWidth parameter, applied to the TABLE.
   Not to the columns: Radzen's table is table-layout:auto, and in an auto-layout table a min-width
   on a cell is advisory -- the browser's column algorithm overrides it. A minimum on the table is
   honoured, so the columns keep their share and the excess becomes the horizontal scroll the rules
   above already provide. Defaults to 0, so a grid that does not set it behaves exactly as before. */
.dt-wrapper[b-huwsi1tjtb]  .rz-datatable table,
.dt-wrapper[b-huwsi1tjtb]  .rz-data-grid table {
    min-width: var(--dt-min-width, 0);
}