/* /Components/AccountSidebar.razor.rz.scp.css */
.account-sidebar[b-6ptuegkcqw] {
    width: 232px;
    background: #FFFFFF;
    border-right: 1px solid #E5E7EB;
    padding: 16px 12px;
    gap: 4px;
    flex-shrink: 0;
}

.account-tab-btn[b-6ptuegkcqw] {
    display: flex;
    align-items: center;
    padding: 10px 14px;
    border: none;
    background: transparent;
    border-radius: 10px;
    color: #475569;
    font-size: 14px;
    font-weight: 500;
    text-align: left;
    transition: all 0.2s ease;
    cursor: pointer;
    width: 100%;
}

.account-tab-btn:hover[b-6ptuegkcqw] {
    background: #F1F5F9CC;
    color: var(--dark-txt);
}

.account-tab-btn.active[b-6ptuegkcqw] {
    background: #F1F5F9CC;
    color: var(--dark-txt);
    font-weight: 600;
}

.tab-icon[b-6ptuegkcqw] {
    width: 20px;
    height: 20px;
    margin-right: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    /* The icons draw with currentColor, so the tint follows the button's state. */
    color: #5F6E85;
}

.account-tab-btn.active .tab-icon[b-6ptuegkcqw] {
    color: #5263FF;
}
/* /Components/Complaints/ComplaintDeadlineBadge.razor.rz.scp.css */
/* Sized and shaped like the status pill and the dispatch chip it sits beside in the complaints
   table, so a row reads as one line of badges rather than three competing ones. */
.cdl-badge[b-dnyabqnf2o] {
    display: inline-block;
    font-size: 11px;
    font-weight: 700;
    border-radius: 6px;
    padding: 2px 8px;
    white-space: nowrap;
    letter-spacing: 0.02em;
}

.cdl-compact[b-dnyabqnf2o] {
    margin-left: 6px;
}

/* Still inside the promised time: informative, not alarming. */
.cdl-counting[b-dnyabqnf2o] {
    background: #2563EB14;
    color: #2563EB;
}

/* Past the deadline and still open: the one state that should catch an eye across a list. */
.cdl-overdue[b-dnyabqnf2o] {
    background: #DC26261F;
    color: #DC2626;
}

/* Settled. The two outcomes are the same shape as resolved/open elsewhere: met is green,
   missed is amber rather than red, because the work IS done and the row is now history. */
.cdl-in-time[b-dnyabqnf2o] {
    background: #16A34A1F;
    color: #15803D;
}

.cdl-late[b-dnyabqnf2o] {
    background: #D9770614;
    color: #B45309;
}

/* Resolved as redone by another supplier: missed, for the supplier held responsible. */
.cdl-taken-over[b-dnyabqnf2o] {
    background: #DC26261F;
    color: #B91C1C;
}
/* /Components/Complaints/ComplaintDetailsSlider.razor.rz.scp.css */
/* Right-hand slider shell, matching the customer and subcontractor sliders: the dialog is
   pinned to the right edge at full height and the body is the only part that scrolls. */
.complaint-slider.right .modal-dialog[b-5yo672whd4] {
    position: fixed;
    margin: 0;
    right: 0;
    top: 0;
    height: 100%;
    max-width: 640px;
    width: 100%;
}

.complaint-slider.right .modal-content[b-5yo672whd4] {
    height: 100vh;
    border-radius: 0 !important;
    padding: 0 !important;
    display: flex;
    flex-direction: column;
    border: none;
}

.complaint-slider.right.fade .modal-dialog[b-5yo672whd4] {
    transform: translateX(100%);
    transition: transform 0.3s ease-out;
}

.complaint-slider.right.show .modal-dialog[b-5yo672whd4] {
    transform: translateX(0);
}

/* ── Header: the dispatch slider's (DispatchDetailsSlider .dds-*) proportions ── */
.cds-header[b-5yo672whd4] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    padding: 16px 24px;
    border: none;
    flex-shrink: 0;
}

.cds-header-main[b-5yo672whd4] {
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 0;
}

.cds-header-icon[b-5yo672whd4] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    border-radius: 10px;
    background: #5263FF1F;
    flex-shrink: 0;
}

.cds-header-icon img[b-5yo672whd4] {
    width: 22px;
    height: 22px;
}

.cds-header-text[b-5yo672whd4] {
    min-width: 0;
}

.cds-title[b-5yo672whd4] {
    margin: 0;
    color: #1E293B;
    font-size: 18px;
    font-weight: 800;
    line-height: 24px;
    letter-spacing: -0.2px;
    overflow-wrap: anywhere;
    word-break: normal;
}

.cds-subtitle[b-5yo672whd4] {
    margin: 2px 0 0;
    color: #5F6E85;
    font-size: 13px;
    font-weight: 600;
    line-height: 20px;
}

/* Top-right, the same square grey button every platform slider closes with. */
.cds-close[b-5yo672whd4] {
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    margin: 0;
    padding: 0;
    border-radius: 10px;
    background-color: #F1F5F9CC;
    background-size: 13px;
    opacity: 1;
}

.complaint-slider .modal-body[b-5yo672whd4] {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    scrollbar-width: thin;
    padding: 0;
}

/* The modal body carries no padding of its own by convention, so the content supplies it. */
.cds-body[b-5yo672whd4] {
    display: flex;
    flex-direction: column;
    gap: 20px;
    padding: 0 24px 24px 24px;
}

.cds-badges[b-5yo672whd4] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

/* Status pills at the dispatch slider's header-status size (.dds-header-status): 12px bold,
   fully rounded. The deadline badges are their own component, sized here to match. */
.cds-pill[b-5yo672whd4],
.cds-badges[b-5yo672whd4]  .cdl-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    font-weight: 700;
    line-height: 16px;
    border-radius: 99px;
    padding: 4px 12px;
    white-space: nowrap;
    letter-spacing: 0;
}

.cds-author[b-5yo672whd4] {
    font-size: 12px;
    color: #1E293B;
    font-weight: 700;
}

/* Who registered it, as one pill: the label, the role tag inside it, then the name. */
.cds-registered[b-5yo672whd4] {
    background: #F1F5F9;
    color: #475569;
    max-width: 100%;
    overflow: hidden;
}

.cds-registered .cds-author[b-5yo672whd4] {
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Blazor scopes component CSS, so these live here rather than being shared from elsewhere. */
.complaint-role-badge[b-5yo672whd4] {
    font-size: 11px;
    font-weight: 700;
    line-height: 14px;
    border-radius: 99px;
    padding: 1px 8px;
    background: #FFFFFF;
    color: #475569;
}

.complaint-role-customer[b-5yo672whd4] {
    background: #0D6EFD1F;
    color: #0D6EFD;
}

.complaint-role-subcontractor[b-5yo672whd4] {
    background: #F59E0B1F;
    color: #B45309;
}

/* Open complaints are the ones still owed an answer, so they read as the warning state, same
   as the table's row badge; the fills are the dispatch slider's cancelled and completed ones. */
.cds-status-open[b-5yo672whd4] {
    background: #FEE2E2;
    color: #B91C1C;
}

.cds-status-resolved[b-5yo672whd4] {
    background: #DCFCE7;
    color: #15803D;
}

.cds-status-archived[b-5yo672whd4] {
    background: #F1F5F9;
    color: #475569;
}

/* Two-column fact list; each dt/dd pair is wrapped so it stays together when wrapping. Label
   over value in the platform's detail typography (the dispatch and subcontractor sliders):
   the label bold and dark, the value regular and grey, both 13px on a 20px line. */
.cds-facts[b-5yo672whd4] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px 24px;
    margin: 0;
    padding: 16px;
    background: #FFFFFF;
    border: 1px solid #1E293B17;
    border-radius: 12px;
    box-shadow: 0 3px 3px -1.5px #1E293B08;
}

.cds-facts dt[b-5yo672whd4] {
    font-size: 13px;
    font-weight: 700;
    line-height: 20px;
    letter-spacing: -0.2px;
    color: #1E293B;
    margin: 0;
}

.cds-facts dd[b-5yo672whd4] {
    font-size: 13px;
    font-weight: 500;
    line-height: 20px;
    letter-spacing: -0.2px;
    color: #475569;
    margin: 0;
    overflow-wrap: anywhere;
}

.cds-section[b-5yo672whd4] {
    display: flex;
    flex-direction: column;
}

/* Section headings as the other sliders write them (.sds-section-title, the dispatch
   overview's box headings): sentence case, 18px extra bold. */
.cds-heading[b-5yo672whd4] {
    font-size: 18px;
    font-weight: 800;
    line-height: 24px;
    letter-spacing: -0.2px;
    color: #1E293B;
    text-transform: none;
    margin: 0 0 12px 0;
}

.cds-description[b-5yo672whd4] {
    margin: 0;
    font-size: 14px;
    color: #0F172A;
    white-space: pre-wrap;
    overflow-wrap: anywhere;
}

.cds-textarea[b-5yo672whd4] {
    resize: vertical;
    min-height: 110px;
}

.cds-edit-actions[b-5yo672whd4] {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    margin-top: 12px;
}

.cds-photo-grid[b-5yo672whd4] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.cds-photo-thumb[b-5yo672whd4] {
    width: 84px;
    height: 84px;
    border-radius: 8px;
    overflow: hidden;
    border: 1px solid #EBECED;
    display: block;
}

.cds-photo-thumb img[b-5yo672whd4] {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.cds-comments[b-5yo672whd4] {
    list-style: none;
    margin: 0 0 12px 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.cds-comment[b-5yo672whd4] {
    padding: 10px 12px;
    background: #F8FAFC;
    border-radius: 8px;
}

.cds-comment-head[b-5yo672whd4] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.cds-comment-date[b-5yo672whd4] {
    font-size: 11px;
    color: #94A3B8;
}

.cds-comment-text[b-5yo672whd4] {
    margin: 4px 0 0 0;
    font-size: 13px;
    color: #0F172A;
    white-space: pre-wrap;
    overflow-wrap: anywhere;
}

.cds-comment-form[b-5yo672whd4] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.cds-comment-form .form-input[b-5yo672whd4] {
    flex: 1;
    min-width: 0;
}

/* Actions sit on the right, with the way back to the address anchored opposite them. */
.cds-footer[b-5yo672whd4] {
    flex-shrink: 0;
    padding: 16px 24px;
    border-top: 1px solid #1E293B14 !important;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    flex-wrap: wrap;
}

.cds-footer-actions[b-5yo672whd4] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.cds-danger[b-5yo672whd4] {
    color: #DC2626;
}

/* Dispatches made on the complaint: small link chips, short code first, planned day after. */
.cds-dispatches[b-5yo672whd4] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.cds-dispatch-link[b-5yo672whd4] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 2px 10px;
    border-radius: 99px;
    background: #2563EB14;
    text-decoration: none;
}

.cds-dispatch-link:hover[b-5yo672whd4] {
    background: #2563EB29;
}

.cds-dispatch-code[b-5yo672whd4] {
    font-size: 12px;
    font-weight: 700;
    color: #2563EB;
    letter-spacing: 0.02em;
}

.cds-dispatch-date[b-5yo672whd4] {
    font-size: 12px;
    color: #475569;
}

/* A fact that needs the full width of the grid, such as the assessment control. */
.cds-fact-wide[b-5yo672whd4] {
    grid-column: 1 / -1;
}

.cds-justification-justified[b-5yo672whd4] {
    background: #DC26261F;
    color: #B91C1C;
}

.cds-justification-not-justified[b-5yo672whd4] {
    background: #16A34A1F;
    color: #15803D;
}

.cds-justification-not-assessed[b-5yo672whd4] {
    background: #64748B1F;
    color: #475569;
}

.cds-justification[b-5yo672whd4] {
    display: inline-block;
    font-size: 12px;
    font-weight: 700;
    line-height: 16px;
    border-radius: 99px;
    padding: 4px 12px;
}

.cds-registered-label[b-5yo672whd4] {
    font-size: 12px;
    font-weight: 600;
    color: #5F6E85;
}

/* Phone width: the facts stack, and the header keeps its close button in the corner. */
@media (max-width: 480px) {
    .cds-header[b-5yo672whd4] {
        padding: 12px 16px;
    }

    .cds-body[b-5yo672whd4] {
        padding: 0 16px 16px 16px;
    }

    .cds-facts[b-5yo672whd4] {
        grid-template-columns: minmax(0, 1fr);
    }

    .cds-footer[b-5yo672whd4] {
        padding: 12px 16px;
    }
}

/* Who complained: the name, then the ways to reach them as links. */
.cds-complainant[b-5yo672whd4] {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 4px 12px;
}

.cds-complainant-name[b-5yo672whd4] {
    font-weight: 600;
}

.cds-complainant-link[b-5yo672whd4] {
    color: #2563EB;
    text-decoration: none;
}

.cds-complainant-link:hover[b-5yo672whd4] {
    text-decoration: underline;
}

.cds-complainant-edit[b-5yo672whd4] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
}

.cds-complainant-wide[b-5yo672whd4] {
    grid-column: 1 / -1;
}

/* The resolve panel's outcome and charge-back. */
.cds-resolve-loading[b-5yo672whd4] {
    display: flex;
    justify-content: center;
    padding: 12px 0;
    color: #0D6EFD;
}

.cds-switch[b-5yo672whd4] {
    display: flex;
    align-items: center;
    gap: 10px;
    cursor: pointer;
    font-size: 13px;
    font-weight: 600;
    color: #1E293B;
}

.cds-switch input[b-5yo672whd4] {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
}

.cds-switch-track[b-5yo672whd4] {
    position: relative;
    flex-shrink: 0;
    width: 34px;
    height: 20px;
    border-radius: 10px;
    background: #CBD5E1;
    transition: background 0.15s ease;
}

.cds-switch-track[b-5yo672whd4]::after {
    content: "";
    position: absolute;
    top: 2px;
    left: 2px;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background: #FFFFFF;
    transition: transform 0.15s ease;
}

.cds-switch input:checked + .cds-switch-track[b-5yo672whd4] {
    background: #0D6EFD;
}

.cds-switch input:checked + .cds-switch-track[b-5yo672whd4]::after {
    transform: translateX(14px);
}

.cds-switch input:disabled + .cds-switch-track[b-5yo672whd4] {
    opacity: 0.6;
}

.cds-hint[b-5yo672whd4] {
    margin-top: 6px;
    font-size: 12px;
    color: #64748B;
}

.cds-hint-warning[b-5yo672whd4] {
    color: #B45309;
}

/* The standing charge in the facts, and its inline editor. */
.cds-charge[b-5yo672whd4] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
}

.cds-charge-edit[b-5yo672whd4] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
}

.cds-charge-edit .form-input[b-5yo672whd4] {
    width: 140px;
}

.cds-link-button[b-5yo672whd4] {
    border: none;
    background: none;
    padding: 0;
    font-size: 12px;
    font-weight: 600;
    color: #0D6EFD;
    cursor: pointer;
}
/* /Components/Complaints/ComplaintJustificationPicker.razor.rz.scp.css */
/* The platform's segmented control, as the dispatch slider draws its tabs (.dds-tabs): a
   soft grey track, the chosen option lifted onto a white chip. The chosen answer also takes
   its colour, the same colours the complaints table's assessment chip uses: a justified
   complaint counts against the work (red), one that did not hold up is cleared (green). */
.cjp-segmented[b-zun8ng4m4r] {
    display: inline-flex;
    flex-wrap: wrap;
    max-width: 100%;
    gap: 4px;
    padding: 4px;
    background: #F1F5F9CC;
    border: 1px solid #1E293B08;
    border-radius: 12px;
}

.cjp-segment[b-zun8ng4m4r] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-height: 32px;
    padding: 4px 12px;
    border: 1px solid transparent;
    border-radius: 8px;
    background: transparent;
    color: #5F6E85;
    font-size: 13px;
    font-weight: 700;
    line-height: 20px;
    white-space: nowrap;
    cursor: pointer;
    transition: background-color 0.15s ease, color 0.15s ease;
}

.cjp-segment[b-zun8ng4m4r]::before {
    content: "";
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #CBD5E1;
    flex-shrink: 0;
}

.cjp-segment:hover:not(:disabled):not(.active)[b-zun8ng4m4r] {
    color: #1E293B;
}

.cjp-segment:disabled[b-zun8ng4m4r] {
    cursor: not-allowed;
    opacity: 0.6;
}

.cjp-segment.active[b-zun8ng4m4r] {
    background: linear-gradient(180deg, #FFFFFF 0%, #F8FAFC 100%);
    border-color: #1E293B0F;
    box-shadow: 0 4px 10px #1E293B0F;
    color: #1E293B;
}

.cjp-segment-justified[b-zun8ng4m4r]::before {
    background: #DC2626;
}

.cjp-segment-not-justified[b-zun8ng4m4r]::before {
    background: #16A34A;
}

.cjp-segment-not-assessed[b-zun8ng4m4r]::before {
    background: #94A3B8;
}

.cjp-segment.active.cjp-segment-justified[b-zun8ng4m4r] {
    color: #B91C1C;
}

.cjp-segment.active.cjp-segment-not-justified[b-zun8ng4m4r] {
    color: #15803D;
}

@media (max-width: 480px) {
    .cjp-segmented[b-zun8ng4m4r] {
        display: flex;
    }

    .cjp-segment[b-zun8ng4m4r] {
        flex: 1 1 auto;
    }
}
/* /Components/Complaints/ComplaintsTable.razor.rz.scp.css */
/* The card and the table styling come from the app's own `.dispatch … .main-table` rules,
   which every host supplies the outer classes for; this only covers the row contents. */

.ct-filter[b-vvac2pz1mn] {
    width: 180px;
    min-width: 180px;
}

.ct-placeholder[b-vvac2pz1mn] {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 300px;
    color: #5F6E85;
}

.ct-status[b-vvac2pz1mn] {
    font-size: 11px;
    font-weight: 600;
    border-radius: 6px;
    padding: 2px 8px;
    white-space: nowrap;
}

/* Open complaints are the ones still owed an answer, so they read as the warning state. */
.ct-status-open[b-vvac2pz1mn] {
    background: #DC26261F;
    color: #DC2626;
}

.ct-status-resolved[b-vvac2pz1mn] {
    background: #16A34A1F;
    color: #15803D;
}

.ct-status-archived[b-vvac2pz1mn] {
    background: #64748B1F;
    color: #475569;
}

/* Cell type matches the app's list pages, which set it per page (13px, 800 for the names,
   600 gray for secondary text — see the Locations table rules in style.css). Those rules are
   scoped to other pages' wrappers, so the same scale lives here with the cells it styles. */
.ct-name[b-vvac2pz1mn] {
    font-size: 13px;
    font-weight: 800;
    line-height: 20px;
    letter-spacing: -0.2px;
    color: var(--dark-txt);
}

.ct-date[b-vvac2pz1mn] {
    font-size: 13px;
    font-weight: 600;
    line-height: 20px;
    letter-spacing: -0.2px;
    color: var(--gray-txt);
}

/* Addresses are the longest column; let one wrap rather than stretching the table. The cap
   is relative so the column gives way in a modal tab, where there is far less room than on
   the full-width page. */
.ct-location[b-vvac2pz1mn] {
    margin: 0;
    max-width: min(360px, 40vw);
    overflow-wrap: anywhere;
    font-size: 13px;
    font-weight: 800;
    line-height: 20px;
    letter-spacing: -0.2px;
    color: var(--dark-txt);
}

/* The location's own name, under its address. */
.ct-location-name[b-vvac2pz1mn] {
    display: block;
    max-width: min(360px, 40vw);
    overflow-wrap: anywhere;
    font-size: 12px;
    line-height: 18px;
    color: var(--gray-txt);
}

/* A dispatch was made on this complaint — the short code it goes by, next to the status. */
.ct-dispatch-chip[b-vvac2pz1mn] {
    font-size: 11px;
    font-weight: 700;
    border-radius: 6px;
    padding: 2px 8px;
    margin-left: 6px;
    white-space: nowrap;
    background: #2563EB14;
    color: #2563EB;
    letter-spacing: 0.02em;
}

/* The owner's assessment. A justified complaint counts against the work, so it takes the
   warning colour; one that did not hold up reads as cleared. */
.ct-justification[b-vvac2pz1mn] {
    font-size: 11px;
    font-weight: 600;
    border-radius: 6px;
    padding: 2px 8px;
    margin-left: 6px;
    white-space: nowrap;
}

.ct-justification-justified[b-vvac2pz1mn] {
    background: #DC26261F;
    color: #B91C1C;
}

.ct-justification-not-justified[b-vvac2pz1mn] {
    background: #16A34A1F;
    color: #15803D;
}

.ct-charge-back[b-vvac2pz1mn] {
    font-size: 11px;
    font-weight: 600;
    border-radius: 6px;
    padding: 2px 8px;
    margin-left: 6px;
    white-space: nowrap;
    background: #EA580C1F;
    color: #9A3412;
}
/* /Components/Complaints/NewComplaintPopup.razor.rz.scp.css */
/* WMPopup zeroes the padding on .modal-body, so each popup supplies its own form surface —
   same treatment as the location rule popup. */
.complaint-popup-body[b-8524umovtw] {
    padding: 16px 20px !important;
    background-color: #F1F5F9;
    display: flex;
    flex-direction: column;
    gap: 16px;
    max-height: 60vh;
    overflow-y: auto;
    scrollbar-width: thin;
}

.complaint-popup-field[b-8524umovtw] {
    display: flex;
    flex-direction: column;
    background: #FFFFFF;
    border: 1px solid #1E293B0F;
    border-radius: 10px;
    padding: 12px 14px;
    box-shadow: 0px 1px 1px -0.5px #1E293B08;
}

.complaint-popup-actions[b-8524umovtw] {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    width: 100%;
}

.complaint-textarea[b-8524umovtw] {
    resize: vertical;
}

/* The file input is stretched over the whole zone so the browser handles a dropped file
   itself — no JS interop needed to read DataTransfer — and a click still opens the picker. */
.complaint-dropzone[b-8524umovtw] {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 2px;
    margin-top: 10px;
    padding: 18px 12px;
    border: 1px dashed #CBD5E1;
    border-radius: 10px;
    background: #F8FAFC;
    text-align: center;
    transition: border-color 0.15s ease, background-color 0.15s ease;
}

.complaint-dropzone.dragover[b-8524umovtw] {
    border-color: var(--purple);
    background: #5263FF14;
}

.complaint-dropzone.disabled[b-8524umovtw] {
    opacity: 0.6;
}

.complaint-dropzone[b-8524umovtw]  input[type="file"] {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    cursor: pointer;
}

.complaint-dropzone.disabled[b-8524umovtw]  input[type="file"] {
    cursor: not-allowed;
}

.complaint-dropzone-title[b-8524umovtw] {
    font-size: 13px;
    font-weight: 600;
    color: #0D6EFD;
}

.complaint-dropzone-hint[b-8524umovtw] {
    font-size: 11px;
    color: #5F6E85;
}

.complaint-photo-grid[b-8524umovtw] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 10px;
}

.complaint-photo-thumb[b-8524umovtw] {
    position: relative;
    width: 72px;
    height: 72px;
    border-radius: 8px;
    overflow: hidden;
    border: 1px solid #EBECED;
    display: block;
}

.complaint-photo-thumb img[b-8524umovtw] {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.complaint-photo-remove[b-8524umovtw] {
    position: absolute;
    top: 2px;
    right: 2px;
    width: 18px;
    height: 18px;
    border: none;
    border-radius: 50%;
    background: rgba(15, 23, 42, 0.65);
    color: #FFFFFF;
    font-size: 14px;
    line-height: 1;
    cursor: pointer;
    padding: 0;
    z-index: 1;
}

/* Who raised it: the contact pick and the name span the row, phone and e-mail share one. */
.complaint-complainant[b-8524umovtw] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
}

.complaint-complainant-wide[b-8524umovtw] {
    grid-column: 1 / -1;
}

.complaint-popup-hint[b-8524umovtw] {
    font-size: 12px;
    color: #94A3B8;
    margin-bottom: 6px;
}
/* /Components/EditPhonePopup.razor.rz.scp.css */
/* Scoped CSS does not cross a component boundary, so the rules the moved markup relies on come
   with it. The account screens that host this popup keep their own copies for their other steps. */

.cu-body-wrap[b-yiw1d0g2p2] {
    padding: 20px;
    background: #f1f5f9;
}

    .cu-body-wrap label[b-yiw1d0g2p2] {
        font-size: 13px;
        font-weight: 500;
        color: #1e293b;
    }

        .cu-body-wrap label span[b-yiw1d0g2p2] {
            color: #ef4444;
        }

    .cu-body-wrap input[b-yiw1d0g2p2] {
        height: 40px;
        width: 100%;
    }

        .cu-body-wrap input:focus[b-yiw1d0g2p2] {
            outline: none;
        }

        .cu-body-wrap input.is-invalid:focus[b-yiw1d0g2p2] {
            border-color: #ef4444;
            box-shadow: 0 0 0 3px rgba(239, 68, 68, 0.1);
        }

.email-otp-body[b-yiw1d0g2p2] {
    padding: 16px 20px;
    background: #F5F7FA;
}

.otp-boxes[b-yiw1d0g2p2] {
    display: flex;
    gap: 8px;
    justify-content: center;
    align-items: center;
}

.otp-input[b-yiw1d0g2p2] {
    width: 53.33px;
    height: 60px;
    background: #FFFFFF;
    border: 1px solid #1E293B1F;
    border-radius: 10px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
    text-align: center;
    font-size: 24px;
    font-weight: 600;
    color: #475467;
    transition: all .2s ease;
}

    .otp-input:focus[b-yiw1d0g2p2] {
        outline: none;
        border-color: #C7D2FE;
        box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.15), 0 2px 4px rgba(0, 0, 0, 0.05);
    }

    .otp-input.is-invalid[b-yiw1d0g2p2] {
        border: 2px solid #FDA4AF !important;
    }

.otp-container[b-yiw1d0g2p2] {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
}

.invalid-code-message[b-yiw1d0g2p2] {
    width: 360px;
    font-size: 13px;
    font-weight: 500;
    color: #D92D20;
    text-align: left;
    margin-top: 12px;
}
/* /Components/EditProfilePicturePopup.razor.rz.scp.css */
.epp-picture-popup[b-3aq320q4wp] {
    padding: 20px;
    background: #F1F5F9;
}

.epp-picture-preview[b-3aq320q4wp] {
    display: flex;
    justify-content: center;
}

.epp-picture-large[b-3aq320q4wp] {
    width: 96px;
    height: 96px;
    border-radius: 100%;
    object-fit: cover;
}

.epp-picture-popup .btn-wm-primary[b-3aq320q4wp] {
    height: 48px;
}

[b-3aq320q4wp] .epp-upload-wrapper {
    position: relative;
    width: 100%;
}

    .epp-upload-wrapper .btn-wm-primary[b-3aq320q4wp] {
        width: 100%;
    }

[b-3aq320q4wp] .epp-upload-input {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    cursor: pointer;
    z-index: 10;
}

    .epp-upload-input[b-3aq320q4wp]  input[type="file"] {
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
        opacity: 0;
        cursor: pointer;
    }
/* /Components/Layouts/CustomerPortalLayout.razor.rz.scp.css */
.customer-shell[b-9hpaolv47f] {
    min-height: 100vh;
    background: #f8fafc;
    color: #1e293b;
}

.customer-topbar[b-9hpaolv47f] {
    position: sticky;
    top: 0;
    z-index: 50;
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 64px;
    padding-inline: max(24px, calc((100vw - 1680px) / 2 + 24px));
    border-bottom: 1px solid #1e293b0f;
    background: #fff;
}

.customer-topbar h1[b-9hpaolv47f] {
    margin: 0;
    color: #1e293b;
    font-size: 22px;
    font-weight: 700;
    line-height: 28px;
    letter-spacing: -1px;
}

.topbar-actions[b-9hpaolv47f] {
    display: flex;
    align-items: center;
    gap: 16px;
}

.viewing-as[b-9hpaolv47f] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 7px 10px;
    border: 1px solid #f2d98c;
    border-radius: 9px;
    background: #fff7df;
    font-size: 13px;
}

.viewing-as button[b-9hpaolv47f],
.menu-action[b-9hpaolv47f] {
    border: 0;
    background: none;
    color: #4f5fe7;
    font-weight: 600;
}

.icon-button[b-9hpaolv47f] {
    position: relative;
    display: grid;
    place-items: center;
    width: 40px;
    height: 40px;
    border: 1px solid #1e293b0f;
    border-radius: 10px;
    background: #f1f5f9cc;
}

.icon-button > img[b-9hpaolv47f] {
    width: 20px;
    height: 20px;
}

.alert-count[b-9hpaolv47f] {
    position: absolute;
    top: -5px;
    right: -5px;
    display: grid;
    place-items: center;
    min-width: 18px;
    height: 18px;
    padding: 0 4px;
    border: 1px solid #1e293b17;
    border-radius: 50px;
    background: #ed4030;
    color: #fff;
    font-size: 10px;
    font-weight: 600;
}

.profile-button[b-9hpaolv47f] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 0;
    border: 0;
    background: transparent;
    text-align: left;
}

.profile-avatar[b-9hpaolv47f] {
    position: relative;
    display: block;
}

.profile-avatar > img[b-9hpaolv47f],
.profile-avatar-fallback[b-9hpaolv47f] {
    display: grid;
    place-items: center;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    object-fit: cover;
    color: #fff;
    font-size: 11px;
    font-weight: 700;
}

.profile-avatar > small[b-9hpaolv47f] {
    position: absolute;
    bottom: -6px;
    left: 50%;
    transform: translateX(-50%);
    display: grid;
    place-items: center;
    width: 25px;
    height: 16px;
    border: 1px solid #1e293b17;
    border-radius: 6px;
    background: #5263ff;
    color: #fff;
    font-size: 9px;
    font-weight: 600;
}

.profile-copy[b-9hpaolv47f] {
    display: flex;
    flex-direction: column;
    max-width: 220px;
}

.profile-copy strong[b-9hpaolv47f] {
    color: #1e293b;
    font-size: 13px;
    line-height: 20px;
}

.profile-copy small[b-9hpaolv47f] {
    overflow: hidden;
    color: #5F6E85;
    font-size: 12px;
    line-height: 16px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.customer-main[b-9hpaolv47f] {
    width: min(100%, 1680px);
    margin: 0 auto;
    padding: 24px;
}

.portal-popover[b-9hpaolv47f] {
    position: absolute;
    top: 72px;
    right: max(24px, calc((100vw - 1680px) / 2 + 24px));
    z-index: 60;
    width: 340px;
    padding: 16px;
    border: 1px solid #1e293b08;
    border-radius: 20px;
    background: #fff;
    box-shadow: 0 1px 1px -.5px #1e293b08, 0 3px 3px -1.5px #1e293b08, 0 32px 32px -16px #1e293b17;
}

.alerts-popover[b-9hpaolv47f] {
    right: max(210px, calc((100vw - 1680px) / 2 + 210px));
}

.portal-popover h3[b-9hpaolv47f] {
    margin: 0 0 12px;
    font-size: 15px;
}

.portal-popover p[b-9hpaolv47f] {
    margin: 8px;
    color: #7b8497;
}

.alerts-popover button[b-9hpaolv47f] {
    width: 100%;
    padding: 10px;
    border: 0;
    border-radius: 8px;
    background: #f7f8fc;
    text-align: left;
}

.profile-popover[b-9hpaolv47f] {
    width: 360px;
    max-height: calc(100dvh - 86px);
    display: flex;
    flex-direction: column;
    padding: 32px 16px 16px;
    gap: 16px;
    border-radius: 28px;
    box-shadow: 0 72px 72px -36px #1e293b08, 0 1px 1px -.5px #1e293b08, 0 3px 3px -1.5px #1e293b08, 0 20px 20px -12px #1e293b08, 0 32px 32px -16px #1e293b08, 0 56px 56px -28px #1e293b08;
}

.profile-close[b-9hpaolv47f] {
    position: absolute;
    top: 14px;
    right: 14px;
    display: grid;
    place-items: center;
    width: 32px;
    height: 32px;
    padding: 0;
    border: 0;
    background: transparent;
}

.profile-close img[b-9hpaolv47f] { width: 18px; height: 18px; }

.profile-summary[b-9hpaolv47f] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    padding: 0;
    text-align: center;
}

.profile-summary > img[b-9hpaolv47f],
.avatar.large[b-9hpaolv47f] {
    display: grid;
    place-items: center;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    object-fit: cover;
    background: linear-gradient(180deg, #5263ff, #aeb6ff);
    color: #fff;
    font-size: 13px;
    font-weight: 700;
}

.profile-summary > div[b-9hpaolv47f] {
    display: flex;
    flex-direction: column;
}

.profile-summary strong[b-9hpaolv47f] {
    color: #1e293b;
    font-size: 18px;
    line-height: 24px;
}

.profile-summary small[b-9hpaolv47f] {
    color: #5F6E85;
    font-size: 12px;
    line-height: 20px;
}

.manage-account[b-9hpaolv47f] {
    height: 32px;
    padding: 0 12px;
    border: 1px solid #1e293b0f;
    border-radius: 8px;
    background: #f8fafc;
    color: #1e293b;
    font-size: 12px;
    font-weight: 600;
}

.context-groups[b-9hpaolv47f] {
    width: 100%;
    max-height: 340px;
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-width: none;
}

.context-groups[b-9hpaolv47f]::-webkit-scrollbar { display: none; }

.context-group[b-9hpaolv47f] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    margin-bottom: 4px;
}

.context-group-header[b-9hpaolv47f] {
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: space-between;
    height: 36px;
    padding: 0 16px;
    border: 0;
    border-radius: 4px;
    background: #e2e8f0;
    color: #1e293b;
    font-family: inherit;
    font-size: 13px;
    text-align: left;
}

.context-group:first-child .context-group-header[b-9hpaolv47f] { border-radius: 24px 24px 4px 4px; }
.context-group:last-child .context-role:last-child[b-9hpaolv47f] { border-radius: 4px 4px 24px 24px; }

.context-group-header img[b-9hpaolv47f] {
    width: 16px;
    height: 16px;
    transition: transform .16s ease;
}

.context-group-header img.collapsed[b-9hpaolv47f] { transform: rotate(180deg); }

.context-role[b-9hpaolv47f] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    height: 40px;
    padding: 0 16px;
    border: 0;
    border-radius: 4px;
    background: #f1f5f9;
    color: #1e293b;
    text-align: left;
}

.context-role:not(:disabled):hover[b-9hpaolv47f] { background: #5263ff1f; }

.context-role > span[b-9hpaolv47f],
.context-role > small[b-9hpaolv47f] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.context-role > span[b-9hpaolv47f] {
    flex: 1 1 auto;
    min-width: 0;
    font-size: 13px;
    font-weight: 500;
}

.context-role > span b[b-9hpaolv47f] {
    overflow: hidden;
    font-weight: 600;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.context-role > span img[b-9hpaolv47f] {
    flex: 0 0 auto;
    width: 18px;
    height: 18px;
}

.context-role > small[b-9hpaolv47f] {
    flex: 0 0 auto;
    color: #5263ff;
    font-size: 12px;
    font-weight: 600;
}

.context-role > small img[b-9hpaolv47f] {
    width: 14px;
    height: 14px;
}

.context-role:disabled > small[b-9hpaolv47f] {
    color: #5F6E85;
}

.profile-logout[b-9hpaolv47f] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 100%;
    height: 32px;
    margin-top: 0;
    border: 1px solid #1e293b0f;
    border-radius: 8px;
    background: #f8fafc;
    color: #1e293b;
    font-size: 12px;
    font-weight: 600;
}

.profile-logout img[b-9hpaolv47f] {
    width: 16px;
    height: 16px;
}

.context-empty[b-9hpaolv47f] {
    padding: 16px 8px;
    text-align: center;
    font-size: 12px;
}

.customer-main :deep(.wm-toast-container)[b-9hpaolv47f] {
    z-index: 1000;
}

@media (max-width: 760px) {
    .customer-topbar[b-9hpaolv47f] {
        height: 66px;
        padding: 0 14px;
    }

    .customer-topbar h1[b-9hpaolv47f] {
        font-size: 20px;
    }

    .profile-copy[b-9hpaolv47f],
    .viewing-as span[b-9hpaolv47f] {
        display: none;
    }

    .customer-main[b-9hpaolv47f] {
        padding: 14px;
    }

    .alerts-popover[b-9hpaolv47f] {
        right: 70px;
    }

    .portal-popover[b-9hpaolv47f] {
        right: 14px;
        max-width: calc(100vw - 28px);
    }
}

/* Says whose list this is: an administrator's impersonation picker, not the signed-in
   person's own accounts. */
.context-scope-note[b-9hpaolv47f] {
    margin: 0 0 6px;
    color: #64748b;
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .04em;
}

.manage-account-hint[b-9hpaolv47f] {
    display: block;
    margin-top: 4px;
    color: #64748b;
    font-size: 11px;
    line-height: 15px;
}

/* The collected count beside a business in the contact's business switcher. */
.context-role em[b-9hpaolv47f] {
    font-style: normal;
    color: #64748B;
    font-size: 12px;
    margin-left: 6px;
}
/* /Components/MyAccountPopup.razor.rz.scp.css */
.account-section[b-gd53v8o3sp] {
    display: flex;
    flex-direction: column;
}

.account-row[b-gd53v8o3sp] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 16px 24px;
    border-bottom: 1px solid #E5E7EB;
}

    .account-row:last-child[b-gd53v8o3sp] {
        border-bottom: none;
    }

.account-row-content[b-gd53v8o3sp] {
    flex: 1;
}

.account-row label[b-gd53v8o3sp] {
    display: block;
    font-size: 15px;
    font-weight: 700;
    color: var(--dark-txt);
}

.account-row p[b-gd53v8o3sp] {
    margin: 0;
    font-size: 13px;
    font-weight: 500;
    color: #5F6E85;
    overflow-wrap: anywhere;
    word-break: normal;
}

.phone-code-plus[b-gd53v8o3sp] {
    position: relative;
    top: -1px;
}

.account-edit-btn[b-gd53v8o3sp] {
    width: 40px;
    height: 40px;
    min-width: 40px;
    border: none;
    border-radius: 10px;
    background: #EEF2FF;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: .2s;
}

    .account-edit-btn:hover[b-gd53v8o3sp] {
        background: #E0E7FF;
    }

    .account-edit-btn img[b-gd53v8o3sp] {
        width: 20px;
        height: 20px;
    }

.notifications-section[b-gd53v8o3sp] {
    padding: 16px 24px;
    border-bottom: 1px solid #E5E7EB;
}

.notifications-title[b-gd53v8o3sp] {
    margin-bottom: 16px;
    font-size: 14px;
    font-weight: 700;
    color: #1F2937;
}

.notification-item[b-gd53v8o3sp] {
    display: flex;
    align-items: center;
    gap: 12px;
}

    .notification-item + .notification-item[b-gd53v8o3sp] {
        margin-top: 12px;
    }

    .notification-item label[b-gd53v8o3sp] {
        margin: 0;
        font-size: 14px;
        font-weight: 500;
        color: #1F2937;
    }

.account-section .det-toggle-item[b-gd53v8o3sp] {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 12px;
}

.account-section .det-toggle-switch[b-gd53v8o3sp] {
    position: relative;
    display: inline-block;
    width: 46px;
    height: 28px;
    background: linear-gradient( 180deg, rgba(226, 232, 240, 1) 0%, rgba(248, 250, 252, 1) 100% );
    border-radius: 50px;
    padding: 3px;
    flex-shrink: 0;
}

    .account-section .det-toggle-switch.disabled[b-gd53v8o3sp] {
        opacity: 0.6;
        cursor: not-allowed;
    }

    .account-section .det-toggle-switch input[b-gd53v8o3sp] {
        opacity: 0;
        width: 0;
        height: 0;
    }

.account-section .det-toggle-slider[b-gd53v8o3sp] {
    position: absolute;
    cursor: pointer;
    border-radius: 30px;
    background-color: #d3dde8;
    transition: 0.3s;
    height: 22px;
    width: 40px;
}

    .account-section .det-toggle-switch.disabled .det-toggle-slider[b-gd53v8o3sp] {
        cursor: not-allowed;
    }

    .account-section .det-toggle-slider[b-gd53v8o3sp]:before {
        content: "";
        position: absolute;
        height: 18px;
        width: 18px;
        left: 2px;
        top: 2px;
        border-radius: 1000px;
        background: linear-gradient(180deg, #e2e8f0 0%, #ffffff 100%);
        border: 3.5px solid #f9fbfc;
        box-shadow: 0 2px 4px rgba(0, 0, 0, 0.15);
        transition: 0.3s;
    }

.account-section .det-toggle-switch input:checked + .det-toggle-slider[b-gd53v8o3sp] {
    background: linear-gradient(135deg, #5b67f6, #4c57e0);
}

    .account-section .det-toggle-switch input:checked + .det-toggle-slider[b-gd53v8o3sp]:before {
        transform: translateX(18px);
        background: #fff;
    }

    .account-section .det-toggle-switch input:checked + .det-toggle-slider[b-gd53v8o3sp]:after {
        content: "";
        position: absolute;
        right: 5px;
        top: 7.5px;
        width: 11px;
        height: 11px;
        background-image: url("../img/icons/toggle-check-icon.svg");
        background-size: contain;
        background-repeat: no-repeat;
    }

.account-section .det-toggle-label[b-gd53v8o3sp] {
    font-size: 13px;
    font-weight: 600;
    color: var(--dark-txt);
}

.share-profile-text[b-gd53v8o3sp] {
    max-width: 360px;
    line-height: 20px;
    color: #6B7280;
    word-break: break-word;
}

.cu-body-wrap[b-gd53v8o3sp] {
    padding: 20px;
    background: #f1f5f9;
}

    .cu-body-wrap label[b-gd53v8o3sp] {
        font-size: 13px;
        font-weight: 500;
        color: #1e293b;
    }

        .cu-body-wrap label span[b-gd53v8o3sp] {
            color: #ef4444;
        }

    .cu-body-wrap input[b-gd53v8o3sp] {
        height: 40px;
        width: 100%;
    }

        /* Input focus */

        .cu-body-wrap input:focus[b-gd53v8o3sp] {
            outline: none;
        }

        .cu-body-wrap input.is-invalid:focus[b-gd53v8o3sp] {
            border-color: #ef4444;
            box-shadow: 0 0 0 3px rgba(239, 68, 68, 0.1);
        }


.email-otp-body[b-gd53v8o3sp] {
    padding: 16px 20px;
    background: #F5F7FA;
}

.otp-boxes[b-gd53v8o3sp] {
    display: flex;
    gap: 8px;
    justify-content: center;
    align-items: center;
}

.otp-input[b-gd53v8o3sp] {
    width: 53.33px;
    height: 60px;
    background: #FFFFFF;
    border: 1px solid #1E293B1F;
    border-radius: 10px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
    text-align: center;
    font-size: 24px;
    font-weight: 600;
    color: #475467;
    transition: all .2s ease;
}

    .otp-input:focus[b-gd53v8o3sp] {
        outline: none;
        border-color: #C7D2FE;
        box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.15), 0 2px 4px rgba(0, 0, 0, 0.05);
    }

    .otp-input.is-invalid[b-gd53v8o3sp] {
        border: 2px solid #FDA4AF !important;
    }

.otp-container[b-gd53v8o3sp] {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
}

.invalid-code-message[b-gd53v8o3sp] {
    width: 360px;
    font-size: 13px;
    font-weight: 500;
    color: #D92D20;
    text-align: left;
    margin-top: 12px;
}

.cu-contractors-box[b-gd53v8o3sp] {
    border: none;
    border-radius: 16px;
    overflow: hidden;
    background: #ffffff;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05) !important;
}

.cu-contractors-header[b-gd53v8o3sp] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 14px;
    font-size: 13px;
    font-weight: 500;
    color: #1e293b;
    border-bottom: 1px solid #1e293b0f;
}

.cu-contractors-count[b-gd53v8o3sp] {
    color: #5F6E85;
    font-weight: 500;
    font-size: 12px;
}

.cu-contractors-list[b-gd53v8o3sp] {
    max-height: 180px;
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: #c3c8cf transparent;
}

.cu-contractors-item[b-gd53v8o3sp] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 9px 14px;
    cursor: pointer;
    font-size: 13px;
    color: #1e293b;
    margin: 0;
    user-select: none;
}

    .cu-contractors-item:hover[b-gd53v8o3sp] {
        background-color: #eef0ff;
    }

.cu-contractors-checkbox[b-gd53v8o3sp] {
    width: 18px !important;
    height: 18px !important;
    border-radius: 6px !important;
    padding: 2px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    transition: all 0.2s !important;
    background: linear-gradient(180deg, #f1f5f9 0%, #ffffff 100%) !important;
    border: 2.5px solid #d9dee3 !important;
    backdrop-filter: blur(24px) !important;
    box-shadow: 0px 1px 1px -0.5px #1e293b08, 0px 3px 3px 0px #ffffff1f inset !important;
    flex-shrink: 0 !important;
}

    .cu-contractors-checkbox.checked[b-gd53v8o3sp] {
        background: linear-gradient(180deg, #5263ff 0%, #5263ff 100%) !important;
        color: white !important;
        backdrop-filter: blur(24px) !important;
        box-shadow: 0px 1px 1px -0.5px #1e293b08, 0px 3px 3px 0px #ffffff1f inset !important;
        border: none !important;
    }

.cu-contractors-checkbox-icon[b-gd53v8o3sp] {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    font-size: 15px !important;
    font-weight: initial !important;
    line-height: initial !important;
    letter-spacing: initial !important;
    color: white !important;
}

.account-header-menu-btn[b-gd53v8o3sp] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border: none;
    border-radius: 6px;
    background: transparent;
    cursor: pointer;
    transition: background .12s;
}

    .account-header-menu-btn:hover[b-gd53v8o3sp] {
        background: #f1f5f9;
    }

.account-menu[b-gd53v8o3sp] {
    /* min-width: 180px; */
    padding: 8px;
}

.account-menu-item[b-gd53v8o3sp] {
    width: 100%;
    border: none;
    background: transparent;
    text-align: left;
    padding: 10px 12px;
    border-radius: 16px;
    font-size: 14px;
    color: #475569;
    font-weight: 600;
    text-align: center;
}

    .account-menu-item:hover[b-gd53v8o3sp] {
        background: #EEF2FF;
    }

    .account-menu-item.delete[b-gd53v8o3sp] {
        color: #B82213;
    }

        .account-menu-item.delete:hover[b-gd53v8o3sp] {
            background: #fff5f5;
        }
/* /Components/NoAccess.razor.rz.scp.css */
.no-access[b-8taxllqsx1] {
    height: 85vh;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    padding: 0 1rem;
    font-size: larger;
}
/* /Components/NotificationsPopup.razor.rz.scp.css */
/* ── Mark all as read (popup header action) ─────────────────────────────── */
.np-mark-all[b-16fx0c4iud] {
    padding: 6px 10px;
    background: transparent;
    border: 1px solid transparent;
    border-radius: 10px;
    outline: none;
    font-size: 13px;
    font-weight: 600;
    line-height: 20px;
    letter-spacing: -0.2px;
    color: #5263FF;
    white-space: nowrap;
    transition: background 0.12s, color 0.12s;
}

.np-mark-all:hover:not(:disabled)[b-16fx0c4iud] {
    background: #5263FF14;
}

.np-mark-all:disabled[b-16fx0c4iud] {
    opacity: 0.6;
    cursor: not-allowed;
}

/* ── Unread / All tabs ──────────────────────────────────────────────────── */
.np-tabs-wrap[b-16fx0c4iud] {
    padding: 16px 20px 0;
    background: #f1f5f9;
}

.np-tabs[b-16fx0c4iud] {
    gap: 6px;
    background-color: #FFFFFFCC;
    border: 1px #1E293B08 solid;
    border-radius: 16px;
    padding: 6px 8px;
}

.np-tabs button.tab[b-16fx0c4iud] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 6px;
    background-color: transparent;
    border: 1px transparent solid;
    border-radius: 10px;
    outline: none;
    font-size: 13px;
    font-weight: 600;
    line-height: 24px;
    letter-spacing: -0.2px;
    color: #5F6E85;
    width: 100%;
    transition: background-color 0.2s, border-color 0.2s, box-shadow 0.2s, color 0.2s;
}

.np-tabs button.tab:hover[b-16fx0c4iud] {
    color: #1E293B;
}

.np-tabs button.tab.active[b-16fx0c4iud] {
    background: linear-gradient(to bottom, rgba(255, 255, 255, 1), rgba(248, 250, 252, 1));
    border: 1px solid rgba(15, 23, 42, 0.06);
    box-shadow:
        0 1px 1px rgba(15, 23, 42, 0.03),
        0 4px 10px rgba(15, 23, 42, 0.06),
        inset 0 1px 0 rgba(255, 255, 255, 0.8);
    color: #1E293B;
}

.np-tab-count[b-16fx0c4iud] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 20px;
    height: 20px;
    padding: 0 6px;
    border-radius: 10px;
    background: #5263FF;
    color: #fff;
    font-size: 11px;
    font-weight: 600;
    line-height: 20px;
}

/* ── List container ─────────────────────────────────────────────────────── */
.np-list[b-16fx0c4iud] {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 16px 20px;
    background: #f1f5f9;
    max-height: 490px;
    overflow-y: auto;
}

/* ── Individual notification card ───────────────────────────────────────── */
.np-item[b-16fx0c4iud] {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 12px;
    border-radius: 16px;
    border: 1.5px solid transparent;
    cursor: pointer;
    transition: border-color 0.12s, background 0.12s;
    background: #fff;
    box-shadow: 
        0px 20px 20px -12px #1E293B08,
        0px 3px 3px -1.5px #1E293B08,
        0px 1px 1px -0.5px #1E293B08;
}

.np-item:hover[b-16fx0c4iud] {
    border-color: #c7d2fe;
}

.np-item.unread[b-16fx0c4iud] {
    background: #FAFBFF;
    border-color: #5263ff30;
}

.np-item.unread:hover[b-16fx0c4iud] {
    border-color: #5263ff66;
}

/* ── Notification icon circle ───────────────────────────────────────────── */
.np-icon-wrap[b-16fx0c4iud] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 10px;
    background: #5263FF1F;
    flex-shrink: 0;
}

.np-icon-wrap.declined[b-16fx0c4iud],
.np-icon-wrap.reject[b-16fx0c4iud] {
    background: #ED40301F;
}

.np-icon-wrap.accepted[b-16fx0c4iud],
.np-icon-wrap.approve[b-16fx0c4iud] {
    background: #409B3F1F;
}

.np-icon[b-16fx0c4iud] {
    width: 22px;
    height: 22px;
    object-fit: contain;
}

/* ── Text content ───────────────────────────────────────────────────────── */
.np-content[b-16fx0c4iud] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.np-title[b-16fx0c4iud] {
    margin: 0;
    font-size: 14px;
    font-weight: 600;
    color: #1E293B;
    line-height: 20px;
    letter-spacing: -0.2px;
    overflow-wrap: anywhere;
    word-break: normal;
}

.np-time[b-16fx0c4iud] {
    font-size: 12px;
    font-weight: 500;
    color: #5F6E85;
    line-height: 16px;
    letter-spacing: -0.2px;
}

/* ── Chevron ─────────────────────────────────────────────────────────────── */
.np-chevron[b-16fx0c4iud] {
    flex-shrink: 0;
}

/* ── Empty state ────────────────────────────────────────────────────────── */
.np-empty[b-16fx0c4iud] {
    height: 490px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 12px;
    padding: 48px 24px;
    background: #f1f5f9;
}

.np-empty-icon[b-16fx0c4iud] {
    width: 48px;
    height: 48px;
    opacity: 0.4;
}

.np-empty-text[b-16fx0c4iud] {
    margin: 0;
    font-size: 14px;
    font-weight: 500;
    color: #94A3B8;
}

/* ── Load more ──────────────────────────────────────────────────────────── */
.np-load-more[b-16fx0c4iud] {
    display: flex;
    justify-content: center;
    padding: 6px 0 2px;
}
/* /Components/Settings/Integrations/QuickBooksDesktopSetupWizard.razor.rz.scp.css */
.qbd-wizard-head[b-k9g6jnrzn5] {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 12px;
}

.qbd-wizard-progress[b-k9g6jnrzn5] {
    flex: 1;
    height: 4px;
    border-radius: 999px;
    background: #E2E8F0;
    overflow: hidden;
}

.qbd-wizard-progress-bar[b-k9g6jnrzn5] {
    height: 100%;
    border-radius: 999px;
    background: #0D6EFD;
    transition: width 160ms ease-out;
}

.qbd-wizard-counter[b-k9g6jnrzn5] {
    font-size: 12px;
    color: #5F6E85;
    white-space: nowrap;
}

/* The screenshots are wide Windows dialogs; cap the height so a step still fits on screen
   next to its instruction rather than pushing the buttons out of view. */
.qbd-wizard-shot[b-k9g6jnrzn5] {
    display: block;
    width: 100%;
    max-height: 380px;
    object-fit: contain;
    object-position: left top;
    border: 1px solid #E2E8F0;
    border-radius: 8px;
    background: #F8FAFC;
}

/* Credentials are read off the screen and typed into another program, so they need to be
   unambiguous — a proportional font makes l/1 and O/0 a guessing game. */
.qbd-credential[b-k9g6jnrzn5] {
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    letter-spacing: 0.02em;
}
/* /Components/Settings/SettingsContent.razor.rz.scp.css */
.settings-modal-right-panel[b-tyen36chv0] {
    height: 100%;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.settings-modal-content[b-tyen36chv0] {
    overflow-y: auto;
    -ms-overflow-style: none;
    scrollbar-width: none;
}

.settings-modal-content:has(.business-tab-wrapper)[b-tyen36chv0],
.settings-modal-content:has(.prices-tab-wrapper)[b-tyen36chv0] {
    overflow-y: hidden !important;
}

.settings-modal-content[b-tyen36chv0]::-webkit-scrollbar {
    display: none;
}

.tab-placeholder h5[b-tyen36chv0] {
    font-weight: 600;
    color: var(--gray-txt);
}
/* /Components/Settings/SettingsPopup.razor.rz.scp.css */
[b-4cxq6zivkd] .settings-popup .wm-popup-modal-content {
    padding: 0 !important;
    border-radius: 12px !important;
    overflow: hidden;
}

/* The accounting tab carries far more than the others — defaults, work-type and customer
   mapping tables, the setup walkthrough — so the dialog grows with the viewport instead of
   sitting at a fixed height. Capped so it never outgrows a laptop screen, and floored so a
   short window still shows a usable pane rather than collapsing to nothing. The inner panes
   own their own scrolling, so only the available room changes here. */
.settings-modal-body[b-4cxq6zivkd] {
    height: clamp(520px, 78vh, 860px);
    background: #FFFFFF;
    overflow: hidden;
}
/* /Components/Settings/SettingsSidebar.razor.rz.scp.css */
.settings-modal-sidebar[b-x3d40jo6sw] {
    width: 288px;
    background: #FFFFFF;
    border-right: 1px solid #E5E7EB;
    padding: 24px 16px;
    gap: 8px;
    flex-shrink: 0;
}

.settings-tab-btn[b-x3d40jo6sw] {
    display: flex;
    align-items: center;
    padding: 12px 16px;
    border: none;
    background: transparent;
    border-radius: 10px;
    color: #475569;
    font-size: 14px;
    font-weight: 500;
    text-align: left;
    transition: all 0.2s ease;
    cursor: pointer;
    width: 100%;
}

.settings-tab-btn:hover[b-x3d40jo6sw] {
    background: #F1F5F9CC;
    color: var(--dark-txt);
}

.settings-tab-btn.active[b-x3d40jo6sw] {
    background: #F1F5F9CC;
    color: var(--dark-txt);
    font-weight: 600;
}

.tab-icon[b-x3d40jo6sw] {
    width: 20px;
    height: 20px;
    margin-right: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.settings-tab-btn.active .tab-icon[b-x3d40jo6sw] {
    color: #5263FF;
}

.settings-tab-btn:not(.active) .tab-icon[b-x3d40jo6sw] {
    color: #5F6E85;
}
/* /Components/Settings/SettingsTabs/AccountingIntegrations.razor.rz.scp.css */
/* Sits directly in the tab body alongside .settings-section-card blocks, which inset
   their content by 16px 20px — without the same the section runs flush to the edges.
   Extra at the bottom because this is the last thing in the tab. */
.integration-section[b-036k8502oh] {
    padding: 16px 20px 24px;
}

.integration-card[b-036k8502oh] {
    border: 1px solid #E2E8F0;
    border-radius: 10px;
    background: #FFFFFF;
    overflow: hidden;
}

.integration-card-expanded[b-036k8502oh] {
    border-color: #C7D2FE;
    box-shadow: 0 2px 8px rgba(79, 70, 229, 0.06);
}

.integration-card-header[b-036k8502oh] {
    display: flex;
    align-items: center;
    gap: 12px;
    width: 100%;
    padding: 14px 16px;
    border: none;
    background: transparent;
    text-align: left;
    cursor: pointer;
}

.integration-card-header:hover[b-036k8502oh] {
    background: #F8FAFC;
}

.integration-logo[b-036k8502oh] {
    width: 40px;
    height: 40px;
    border-radius: 8px;
    object-fit: contain;
    flex-shrink: 0;
    border: 1px solid #F1F5F9;
    background: #FFFFFF;
    padding: 4px;
}

/* The header identifies the picked provider; it is no longer a button, so it must not
   pick up the hover/pointer affordances of the clickable version. */
.integration-card-header-static[b-036k8502oh] {
    cursor: default;
    background: transparent;
}

.integration-card-header-static:hover[b-036k8502oh] {
    background: transparent;
}

/* Stand-in for providers whose brand logo we do not ship. */
.integration-logo-monogram[b-036k8502oh] {
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 600;
    font-size: 16px;
    color: #475569;
    background: #F8FAFC;
}

.integration-card-titles[b-036k8502oh] {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.integration-card-subtitle[b-036k8502oh] {
    font-size: 12px;
    color: #5F6E85;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 420px;
}

.integration-chevron[b-036k8502oh] {
    flex-shrink: 0;
    transition: transform 0.15s ease;
}

.integration-chevron-open[b-036k8502oh] {
    transform: rotate(180deg);
}

.integration-card-body[b-036k8502oh] {
    padding: 16px;
    border-top: 1px solid #F1F5F9;
}

.integration-divider[b-036k8502oh] {
    margin: 16px 0 12px;
    border-color: #F1F5F9;
    opacity: 1;
}

.integration-provider-name[b-036k8502oh] {
    font-size: 15px;
    font-weight: 600;
    color: #0F172A;
}

.integration-chip[b-036k8502oh] {
    display: inline-flex;
    align-items: center;
    padding: 2px 10px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 600;
    white-space: nowrap;
}

.integration-chip-success[b-036k8502oh] {
    background: #DCFCE7;
    color: #166534;
}

.integration-chip-info[b-036k8502oh] {
    background: #DBEAFE;
    color: #1E40AF;
}

.integration-chip-error[b-036k8502oh] {
    background: #FEE2E2;
    color: #B91C1C;
}

.integration-chip-warning[b-036k8502oh] {
    background: #FEF3C7;
    color: #92400E;
}

.integration-chip-muted[b-036k8502oh] {
    background: #F1F5F9;
    color: #5F6E85;
}

.integration-alert[b-036k8502oh] {
    border-radius: 6px;
    padding: 10px 12px;
    font-size: 13px;
}

.integration-alert-warning[b-036k8502oh] {
    background: #FEF3C7;
    color: #92400E;
}

.integration-alert-error[b-036k8502oh] {
    background: #FEE2E2;
    color: #B91C1C;
    white-space: pre-wrap;
    word-break: break-word;
}

.integration-connect-steps ol[b-036k8502oh] {
    padding-left: 18px;
    font-size: 13px;
    color: #475569;
}

.integration-install-link[b-036k8502oh] {
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    height: 42px;
    padding: 0 14px;
}

.integration-meta[b-036k8502oh] {
    display: flex;
    gap: 16px;
    flex-wrap: wrap;
    align-items: center;
    font-size: 12px;
    color: #5F6E85;
}

.integration-settings-grid[b-036k8502oh] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
    gap: 12px;
}

.integration-table-scroll[b-036k8502oh] {
    max-height: min(48vh, 480px);
    overflow-y: auto;
    overflow-x: auto;
}

.integration-table[b-036k8502oh] {
    border-collapse: collapse;
    font-size: 13px;
}

.integration-table th[b-036k8502oh] {
    text-align: left;
    color: #5F6E85;
    font-weight: 600;
    padding: 6px 8px;
    border-bottom: 1px solid #E2E8F0;
    position: sticky;
    top: 0;
    background: #FFFFFF;
}

.integration-table td[b-036k8502oh] {
    padding: 6px 8px;
    border-bottom: 1px solid #F1F5F9;
    vertical-align: middle;
}

.integration-row-unmapped[b-036k8502oh] {
    background: #FFFBEB;
}

.integration-empty-row[b-036k8502oh] {
    text-align: center;
    color: #16A34A;
    padding: 14px 8px !important;
}

.integration-remap-editor[b-036k8502oh] {
    position: relative;
}

.integration-remap-results[b-036k8502oh] {
    border: 1px solid #E2E8F0;
    border-radius: 6px;
    margin-top: 4px;
    max-height: 220px;
    overflow-y: auto;
    background: #FFFFFF;
}

.integration-remap-result[b-036k8502oh] {
    display: flex;
    justify-content: space-between;
    gap: 8px;
    width: 100%;
    padding: 6px 10px;
    border: none;
    background: transparent;
    text-align: left;
    font-size: 13px;
    cursor: pointer;
}

.integration-remap-result:hover[b-036k8502oh] {
    background: #F1F5F9;
}

.integration-remap-id[b-036k8502oh] {
    color: #94A3B8;
    font-size: 12px;
}

/* section-subtitle and form-label are per-tab scoped classes in this codebase (each
   settings tab defines its own copy) — mirror the shared look from the other tabs. */
.section-subtitle[b-036k8502oh] {
    font-size: 12px;
    color: #5F6E85;
    margin-bottom: 10px;
}

small.section-subtitle[b-036k8502oh] {
    display: block;
    margin: 4px 0 0;
}

.form-label[b-036k8502oh] {
    font-size: 13px;
    font-weight: 600;
    color: #334155;
    margin-bottom: 4px;
}

.integration-card-body .integration-provider-name[b-036k8502oh] {
    font-size: 14px;
}

/* form-input is a per-tab scoped class in this codebase (each settings tab defines its
   own copy) — mirror the shared look from the other tabs. */
.form-input[b-036k8502oh] {
    width: 100%;
    height: 42px;
    padding: 8px 12px;
    background-color: #FFFFFF;
    border: 1px #1E293B1F solid;
    border-radius: 10px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
    outline: none;
    font-size: 13px;
    font-weight: 600;
}

.form-input:focus[b-036k8502oh] {
    box-shadow: 0 0 0 0.2rem #dce0ff;
}

.form-select[b-036k8502oh] {
    font-size: 13px;
    border-radius: 10px;
    border: 1px #1E293B1F solid;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
}

.btn-sm[b-036k8502oh] {
    height: 30px;
    padding: 0 10px;
    font-size: 12px;
}
/* /Components/Settings/SettingsTabs/BusinessTab.razor.rz.scp.css */
.settings-form-section[b-hcfuzqhxmb] {
    display: flex;
    flex-direction: column;
    height: 100%;
    overflow: hidden;
}

.settings-scroll-content[b-hcfuzqhxmb] {
    flex-grow: 1;
    overflow-y: auto;
    -ms-overflow-style: none;
    scrollbar-width: none;
}

.settings-scroll-content[b-hcfuzqhxmb]::-webkit-scrollbar {
    display: none;
}

.settings-section-card[b-hcfuzqhxmb] {
    background: transparent;
    border: none;
    border-bottom: 1px solid #E5E7EB;
    border-radius: 0;
    padding: 16px 20px;
}

.settings-section-card:first-child[b-hcfuzqhxmb] {
    padding: 16px 20px;
}

.settings-section-card:last-child[b-hcfuzqhxmb] {
    border-bottom: none;
    padding-bottom: 8px;
}

.section-title[b-hcfuzqhxmb] {
    font-size: 15px;
    font-weight: 600;
    color: var(--dark-txt);
    margin-bottom: 2px;
}

.section-subtitle[b-hcfuzqhxmb] {
    font-size: 12.5px;
    color: var(--gray-txt-2);
    margin-bottom: 8px;
}

.form-label[b-hcfuzqhxmb] {
    font-size: 13px;
    font-weight: 600;
    line-height: 20px;
    letter-spacing: -0.2px;
    color: var(--gray-txt);
    margin-bottom: 4px;
}

.form-label.required[b-hcfuzqhxmb]::after {
    content: " *";
    color: var(--danger);
}

.label-optional[b-hcfuzqhxmb] {
    font-size: 12px;
    font-weight: 500;
    line-height: 16px;
    letter-spacing: -0.2px;
    color: var(--gray-txt-2);
    margin-left: 4px;
}

.form-input[b-hcfuzqhxmb] {
    width: 100%;
    padding: 8px 10px;
    background-color: var(--white);
    border: 1px #1E293B1F solid;
    border-radius: 10px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
    outline: none;
    font-size: 13px;
    font-weight: 600;
    line-height: 24px;
    letter-spacing: -0.2px;
    color: var(--dark-txt);
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.form-input:focus[b-hcfuzqhxmb] {
    box-shadow: 0 0 0 0.2rem #dce0ff;
    outline: none;
    border-color: #1E293B1F;
}

.form-input.is-invalid[b-hcfuzqhxmb] {
    border-color: var(--danger);
    box-shadow: 0 0 0 0.2rem rgba(239, 68, 68, 0.1);
}

.invalid-feedback[b-hcfuzqhxmb] {
    display: block;
    font-size: 12px;
    color: var(--danger);
    margin-top: 4px;
}

.form-select[b-hcfuzqhxmb] {
    width: 100%;
    padding: 8px 10px;
    background-color: var(--white);
    border: 1px #1E293B1F solid;
    border-radius: 10px;
    box-shadow: 0 3px 3px -1.5px #1E293B08;
    font-size: 13px;
    font-weight: 600;
    line-height: 24px;
    letter-spacing: -0.2px;
    color: var(--dark-txt);
    outline: none;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    background-image: url('img/icons/Chevron_down.svg');
    background-repeat: no-repeat;
    background-position: right 14px center;
    background-size: 12px;
    padding-right: 36px;
}

.form-select:focus[b-hcfuzqhxmb] {
    box-shadow: 0 0 0 0.2rem #dce0ff;
    outline: none;
    border-color: #1E293B1F;
}

.cvr-input-group[b-hcfuzqhxmb] {
    position: relative;
    width: 100%;
    display: flex;
    align-items: center;
}

.cvr-input-group .form-input[b-hcfuzqhxmb] {
    padding-right: 80px;
}

.btn-wm-find-inline[b-hcfuzqhxmb] {
    position: absolute;
    top: 50%;
    right: 4px;
    transform: translateY(-50%);
    min-width: 56px;
    height: 33px;
    padding: 0 12px;
    background-color: var(--purple);
    border: 1px var(--purple) solid;
    border-radius: 10px;
    font-size: 13px;
    font-weight: 600;
    color: var(--white);
    cursor: pointer;
    transition: opacity 0.2s ease;
}
.btn-wm-find-inline:hover[b-hcfuzqhxmb] {
    opacity: 0.9;
}

.upload-img-box[b-hcfuzqhxmb] {
/*    background-color: #F1F5F9;
    border: 1px #1E293B1F dashed;
    padding: 16px;
    border-radius: 16px;
    display: flex;
    align-items: center;
    justify-content: space-between;*/
    height: 64px;
    background-color: #F1F5F9 !important;
    border: 1px #1E293B1F dashed !important;
    padding: 16px !important;
    border-radius: 16px !important;
    border-width: 2px !important;
    border-style: dashed !important;
}

.upload-img-box .left[b-hcfuzqhxmb] {
  display: flex;
  align-items: center;
  gap: 12px;
}

.upload-img-box .left img[b-hcfuzqhxmb] {
  height: 24px;
}

.upload-img-box .left span[b-hcfuzqhxmb] {
  font-size: 13px;
  font-weight: 500;
  line-height: 20px;
  letter-spacing: -0.2px;
  color: var(--gray-txt-2);
}

.upload-img-box button[b-hcfuzqhxmb] {
  background-color: var(--white);
  border: 1px #1E293B17 solid;
  border-radius: 8px;
  outline: none;
  box-shadow: 0 2px 1.5px -0.5px #1E293B08;
  gap: 2px;
  padding: 8px;
  position: relative;
  cursor: pointer;
}

.upload-img-box button img[b-hcfuzqhxmb] {
  height: 16px;
}

.upload-img-box button span[b-hcfuzqhxmb] {
  font-size: 12px;
  font-weight: 600;
  line-height: 16px;
  letter-spacing: -0.2px;
  color: var(--gray-txt);
  padding: 0 4px;
}

.upload-img-box button input[b-hcfuzqhxmb] {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  opacity: 0;
  cursor: pointer;
}

    .upload-img-box.img-box-loading[b-hcfuzqhxmb] {
        height: 64px;
    }

    .upload-img-box.dragging[b-hcfuzqhxmb] {
        border-color: var(--purple) !important;
        background-color: #f5f3ff !important;
        transform: scale(1.01) !important;
        transition: all 0.2s ease !important;
    }

.dispatch-user-item[b-hcfuzqhxmb] {
    background: #F1F5F9;
    border-radius: 12px;
    padding: 10px 16px !important;
}.user-name[b-hcfuzqhxmb] {
    font-size: 13px;
    letter-spacing: -0.2px;
    line-height: 20px;
    font-weight: 700;
    color: #475569;
    font-family: "Plus Jakarta Sans", sans-serif;
}

.user-phone[b-hcfuzqhxmb] {
    color: #475569;
    font-weight: 700;
    font-size: 13px;
    line-height: 20px;
    letter-spacing: -0.2px;
}

.btn-remove-user[b-hcfuzqhxmb] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    border: none;
    border-radius: 6px;
    background: #ED40301F;
    cursor: pointer;
    transition: background 0.12s, transform 0.2s;
    flex-shrink: 0;
}

.toggle-title[b-hcfuzqhxmb] {
    font-size: 15px;
    font-weight: 600;
    color: var(--dark-txt);
}

.det-toggle-switch[b-hcfuzqhxmb] {
    position: relative;
    display: inline-block;
    width: 46px;
    height: 28px;
    background: linear-gradient( 180deg, rgba(226, 232, 240, 1) 0%, rgba(248, 250, 252, 1) 100% );
    border-radius: 50px;
    padding: 3px;
    flex-shrink: 0;
}

.det-toggle-switch input[b-hcfuzqhxmb] {
    opacity: 0;
    width: 0;
    height: 0;
}

.det-toggle-slider[b-hcfuzqhxmb] {
    position: absolute;
    cursor: pointer;
    border-radius: 30px;
    background-color: #d3dde8;
    transition: 0.3s;
    height: 22px;
    width: 40px;
}

.det-toggle-slider[b-hcfuzqhxmb]:before {
    content: "";
    position: absolute;
    height: 18px;
    width: 18px;
    left: 2px;
    top: 2px;
    border-radius: 1000px;
    background: linear-gradient(180deg, #e2e8f0 0%, #ffffff 100%);
    border: 3.5px solid #f9fbfc;
    box-shadow: 0 2px 4px rgba(0,0,0,.15);
    transition: .3s;
}

.det-toggle-switch input:checked + .det-toggle-slider[b-hcfuzqhxmb] {
    background: linear-gradient(135deg, #5b67f6, #4c57e0);
}

.det-toggle-switch input:checked + .det-toggle-slider[b-hcfuzqhxmb]:before {
    transform: translateX(18px);
    background: #fff;
}

.det-toggle-switch input:checked + .det-toggle-slider[b-hcfuzqhxmb]:after {
    content: "";
    position: absolute;
    right: 5px;
    top: 7.5px;
    width: 11px;
    height: 11px;
    background-image: url("../img/icons/toggle-check-icon.svg");
    background-size: contain;
    background-repeat: no-repeat;
}

.season-range-selector[b-hcfuzqhxmb] {
    background-color: var(--white);
    border: 1px #1E293B1F solid;
    border-radius: 10px;
    box-shadow: 0 3px 3px -1.5px #1E293B08;
    height: 42px;
    overflow: hidden;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
    flex: 1;
}

.season-range-selector:focus-within[b-hcfuzqhxmb] {
    box-shadow: 0 0 0 0.2rem #dce0ff;
    border-color: #1E293B1F;
}

.season-day-dropdown-container[b-hcfuzqhxmb] {
    width: 65px;
    height: 100%;
}

.season-month-dropdown-container[b-hcfuzqhxmb] {
    flex-grow: 1;
    height: 100%;
}

.season-range-selector[b-hcfuzqhxmb]  .dropdown {
    height: 100% !important;
}

.season-range-selector[b-hcfuzqhxmb]  .season-day-merged {
    border: none !important;
    box-shadow: none !important;
    border-radius: 0 !important;
    background: transparent !important;
    height: 100% !important;
    width: 100% !important;
    padding: 0 8px 0 14px !important;
    outline: none !important;
}

.season-range-selector[b-hcfuzqhxmb]  .season-month-merged {
    border: none !important;
    box-shadow: none !important;
    border-radius: 0 !important;
    background: transparent !important;
    height: 100% !important;
    width: 100% !important;
    padding: 0 14px !important;
    outline: none !important;
}

.season-range-selector[b-hcfuzqhxmb]  .season-day-merged:focus,
.season-range-selector[b-hcfuzqhxmb]  .season-month-merged:focus {
    box-shadow: none !important;
}

.season-selector-divider[b-hcfuzqhxmb] {
    width: 1px;
    height: 24px;
    background-color: #E2E8F0;
    flex-shrink: 0;
}

.settings-modal-footer[b-hcfuzqhxmb] {
    height: 80px;
    border-top: 1px solid #E2E8F0;
    background: var(--white);
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding: 0 24px;
    flex-shrink: 0;
}

.det-img-thumb[b-hcfuzqhxmb] {
  position: relative;
  flex-shrink: 0;
  width: 100px;
  height: 100px;
  border-radius: 8px;
  overflow: hidden;
  border: 1px solid #E2E8F0;
  cursor: pointer;
  background-color: #fff;
}

.det-img-thumb img[b-hcfuzqhxmb] {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}

.det-img-thumb-delete[b-hcfuzqhxmb] {
  position: absolute;
  top: 4px;
  right: 4px;
  width: 24px;
  height: 24px;
  background-color: #B82213;
  border: none;
  border-radius: 6px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background-color 0.12s;
}

.det-img-thumb-delete:hover[b-hcfuzqhxmb] {
  background-color: #f54a3b;
}

.det-img-thumb-delete img[b-hcfuzqhxmb] {
  height: 15px;
  width: 15px;
}

/* ── Business name + municipality switch on one row ──────────────────── */
.business-identity-row[b-hcfuzqhxmb] {
    display: flex;
    align-items: flex-start;
    gap: 12px;
}

.business-identity-name[b-hcfuzqhxmb] {
    flex: 1;
    min-width: 0;
}

.business-identity-toggle[b-hcfuzqhxmb] {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-shrink: 0;
    height: 42.19px;
    padding: 0 16px;
    border: 1px solid #1E293B17;
    border-radius: 10px;
    background: #F8FAFC;
}

.business-identity-toggle .toggle-title[b-hcfuzqhxmb] {
    white-space: nowrap;
}

/* Same chip as the municipality switch, holding the colour picker instead of a toggle. */
.business-identity-colour[b-hcfuzqhxmb] {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-shrink: 0;
    height: 42.19px;
    padding: 0 16px;
    border: 1px solid #1E293B17;
    border-radius: 10px;
    background: #F8FAFC;
}

.business-identity-colour .toggle-title[b-hcfuzqhxmb] {
    white-space: nowrap;
}

@media (max-width: 767.98px) {
    .business-identity-row[b-hcfuzqhxmb] {
        flex-direction: column;
        align-items: stretch;
    }

    .business-identity-toggle[b-hcfuzqhxmb],
    .business-identity-colour[b-hcfuzqhxmb] {
        justify-content: space-between;
    }
}
/* /Components/Settings/SettingsTabs/CustomerInvoiceTab.razor.rz.scp.css */
.settings-form-section[b-4pgyu8mi5j] {
    display: flex;
    flex-direction: column;
}

.settings-section-card[b-4pgyu8mi5j] {
    background: transparent;
    border: none;
    border-bottom: 1px solid #E2E8F0 !important;
    border-radius: 0;
    padding: 16px 20px;
}

.section-title[b-4pgyu8mi5j] {
    font-size: 15px;
    font-weight: 600;
    color: var(--dark-txt);
    margin-bottom: 2px;
}

.section-subtitle[b-4pgyu8mi5j] {
    font-size: 12.5px;
    color: var(--gray-txt-2);
    margin-bottom: 8px;
}

.invoice-line-desc-input[b-4pgyu8mi5j] {
    border: 1px solid #E2E8F0;
    border-radius: 8px;
    flex: 1;
    font-size: 13px;
    min-width: 280px;
    padding: 9px 12px;
}

.invoice-line-desc-vars .var-pill[b-4pgyu8mi5j] {
    background: #eef1fb;
    border: none;
    border-radius: 999px;
    color: #4a5aa8;
    cursor: pointer;
    font-size: 12px;
    font-weight: 600;
    padding: 3px 10px;
}

/* Toggle switch. The markup is shared with the other settings tabs, but Blazor's scoped CSS
   does not travel between components, so each tab that uses it carries its own copy. */
.det-toggle-item[b-4pgyu8mi5j] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.det-toggle-switch[b-4pgyu8mi5j] {
    position: relative;
    display: inline-block;
    width: 46px;
    height: 28px;
    background: linear-gradient(180deg, rgba(226, 232, 240, 1) 0%, rgba(248, 250, 252, 1) 100%);
    border-radius: 50px;
    padding: 3px;
    flex-shrink: 0;
}

.det-toggle-switch input[b-4pgyu8mi5j] {
    opacity: 0;
    width: 0;
    height: 0;
}

.det-toggle-slider[b-4pgyu8mi5j] {
    position: absolute;
    cursor: pointer;
    border-radius: 30px;
    background-color: #d3dde8;
    transition: 0.3s;
    height: 22px;
    width: 40px;
}

.det-toggle-slider[b-4pgyu8mi5j]:before {
    content: "";
    position: absolute;
    height: 18px;
    width: 18px;
    left: 2px;
    top: 2px;
    border-radius: 1000px;
    background: linear-gradient(180deg, #e2e8f0 0%, #ffffff 100%);
    border: 3.5px solid #f9fbfc;
    box-shadow: 0 2px 4px rgba(0, 0, 0, .15);
    transition: .3s;
}

.det-toggle-switch input:checked + .det-toggle-slider[b-4pgyu8mi5j] {
    background: linear-gradient(135deg, #5b67f6, #4c57e0);
}

.det-toggle-switch input:checked + .det-toggle-slider[b-4pgyu8mi5j]:before {
    transform: translateX(18px);
    background: #fff;
}

.det-toggle-switch input:checked + .det-toggle-slider[b-4pgyu8mi5j]:after {
    content: "";
    position: absolute;
    right: 5px;
    top: 7.5px;
    width: 11px;
    height: 11px;
    background-image: url("../img/icons/toggle-check-icon.svg");
    background-size: contain;
    background-repeat: no-repeat;
}

.det-toggle-label[b-4pgyu8mi5j] {
    font-size: 14px;
    font-weight: 600;
    color: #475569;
}
/* /Components/Settings/SettingsTabs/DrawingToolTab.razor.rz.scp.css */
.settings-form-section[b-8t8457n6kp] {
    display: flex;
    flex-direction: column;
    height: 100%; /* fill the modal's content area */
    min-height: 0;
}

.settings-section-card[b-8t8457n6kp] {
    background: transparent;
    border: none;
    border-bottom: 1px solid #E5E7EB;
    border-radius: 0;
    padding: 16px 20px;
}

.settings-section-card.no-border-bottom[b-8t8457n6kp] {
    border-bottom: none;
}

.section-title[b-8t8457n6kp] {
    font-size: 15px;
    font-weight: 600;
    color: var(--dark-txt);
    margin-bottom: 2px;
}

.section-subtitle[b-8t8457n6kp] {
    font-size: 13px;
    color: var(--gray-txt-2);
    margin-bottom: 8px;
}

.tools-list-container[b-8t8457n6kp] {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto; /* take up all remaining space in the modal */
    min-height: 0;
}

.tools-scrollable-list[b-8t8457n6kp] {
    flex: 1 1 auto; /* grow to fill available space above the footer */
    overflow-y: auto; /* scrolls internally once list gets long */
    min-height: 0;

    /* Firefox */
    scrollbar-width: none;

    /* IE / old Edge */
    -ms-overflow-style: none;
}

    /* Chrome, Safari, new Edge (WebKit-based) */
    .tools-scrollable-list[b-8t8457n6kp]::-webkit-scrollbar {
        display: none;
    }

.tool-row-card[b-8t8457n6kp] {
    background: #F1F5F9;
    border-radius: 16px;
    padding: 12px 16px;
    transition: background-color 0.15s ease, border-color 0.15s ease;
}

    .tool-row-card.active-editing-card[b-8t8457n6kp] {
        background: #F1F5F9;
    }

.color-indicator-dot[b-8t8457n6kp] {
    width: 20px;
    height: 20px;
    border-radius: 6px;
    display: inline-block;
    flex-shrink: 0;
}

.color-indicator-dot.static-dot[b-8t8457n6kp] {
    border-radius: 50%;
    width: 16px;
    height: 16px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 9px;
    line-height: 1;
}

.tool-title[b-8t8457n6kp] {
    font-size: 14.5px;
    font-weight: 700;
    color: #1E293B;
}

.badge-type[b-8t8457n6kp] {
    border: 1px solid #E2E8F0;
    background: #FFFFFF;
    color: #475569;
    border-radius: 8px;
    padding: 4px 14px;
    font-size: 12px;
    font-weight: 600;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.btn-tool-action[b-8t8457n6kp] {
    display: flex;
    align-items: center;
    justify-content: center;
    border: none !important;
    background: transparent !important;
    cursor: pointer;
    padding: 6px;
    transition: opacity 0.15s ease;
    box-shadow: none !important;
    outline: none !important;
}

.btn-tool-action:hover[b-8t8457n6kp] {
    opacity: 0.7;
}

.form-label[b-8t8457n6kp] {
    font-size: 13px;
    font-weight: 600;
    line-height: 20px;
    letter-spacing: -0.2px;
    color: var(--gray-txt);
    margin-bottom: 4px;
}

.form-input[b-8t8457n6kp] {
    width: 100%;
    height: 42px;
    padding: 8px 12px;
    background-color: var(--white);
    border: 1px #1E293B1F solid;
    border-radius: 10px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
    outline: none;
    font-size: 13px;
    font-weight: 600;
    color: var(--dark-txt);
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.form-input:focus[b-8t8457n6kp] {
    box-shadow: 0 0 0 0.2rem #dce0ff;
    outline: none;
    border-color: #1E293B1F;
}

.select-input[b-8t8457n6kp] {
    appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6' fill='none'%3E%3Cpath d='M1 1L5 5L9 1' stroke='%2364748B' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 12px center;
    background-size: 10px 6px;
    padding-right: 32px;
}

.btn-tool-delete-editing[b-8t8457n6kp] {
    background: transparent;
    border: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    border-radius: 10px;
    transition: background 0.15s ease;
}

.btn-tool-delete-editing:hover[b-8t8457n6kp] {
    background: rgba(223, 41, 23, 0.05);
}

.btn-save-inline-tool[b-8t8457n6kp] {
    background: #363AF5;
    color: #FFFFFF;
    border: none;
    height: 42px;
    padding: 0 24px;
    font-size: 13.5px;
    font-weight: 700;
    border-radius: 10px;
    cursor: pointer;
    transition: background 0.15s ease;
}

.btn-save-inline-tool:hover[b-8t8457n6kp] {
    background: #2528D8;
}

.settings-modal-footer[b-8t8457n6kp] {
    height: 80px;
    border-top: 1px solid #E2E8F0;
    background: var(--white);
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding: 0 24px;
    flex-shrink: 0;
}

.sticky-footer[b-8t8457n6kp] {
    position: static;
    flex-shrink: 0;
    background: var(--white);
    border-top: 1px solid #E2E8F0;
    margin-left: -1rem;
    margin-right: -1rem;
    margin-bottom: -1rem;
    padding: 1rem;
    height: 80px;
    display: flex;
    align-items: center;
}
/* /Components/Settings/SettingsTabs/HolidaysTab.razor.rz.scp.css */
.settings-form-section[b-zu92jyupt2] {
    display: flex;
    flex-direction: column;
}

.settings-section-card[b-zu92jyupt2] {
    background: transparent;
    border: none;
    border-bottom: 1px solid #E5E7EB;
    border-radius: 0;
    padding: 16px 20px;
}

.settings-section-card:last-child[b-zu92jyupt2] {
    border-bottom: none;
}

.section-title[b-zu92jyupt2] {
    font-size: 15px;
    font-weight: 600;
    color: var(--dark-txt);
    margin-bottom: 2px;
}

.section-subtitle[b-zu92jyupt2] {
    font-size: 12.5px;
    color: var(--gray-txt-2);
    margin-bottom: 8px;
}

.form-label[b-zu92jyupt2] {
    font-size: 13px;
    font-weight: 600;
    line-height: 20px;
    letter-spacing: -0.2px;
    color: var(--gray-txt);
    margin-bottom: 4px;
}

.form-input[b-zu92jyupt2] {
    width: 100%;
    padding: 8px 10px;
    background-color: var(--white);
    border: 1px #1E293B1F solid;
    border-radius: 10px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
    outline: none;
    font-size: 13px;
    font-weight: 600;
    line-height: 24px;
    letter-spacing: -0.2px;
    color: var(--dark-txt);
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.form-input:focus[b-zu92jyupt2] {
    box-shadow: 0 0 0 0.2rem #dce0ff;
    outline: none;
    border-color: #1E293B1F;
}

.form-input[b-zu92jyupt2]::placeholder {
    color: #5F6E85 !important;
    font-weight: 600 !important;
}

.worktype-item[b-zu92jyupt2] {
    background: #F8FAFC;
    border: 1px solid #E2E8F0;
    border-radius: 12px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 16px !important;
}

.worktype-name[b-zu92jyupt2] {
    font-size: 13.5px;
    font-weight: 600;
    color: var(--dark-txt);
}

.edit-card[b-zu92jyupt2] {
    background: #F8FAFC;
    border: 1px solid #CBD5E1;
    border-radius: 12px;
    padding: 16px !important;
}

.btn-remove-icon[b-zu92jyupt2] {
    background: transparent;
    border: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 4px;
    transition: opacity 0.2s ease;
}

.btn-remove-icon:hover[b-zu92jyupt2] {
    opacity: 0.7;
}

.fee-badge[b-zu92jyupt2] {
    background: var(--white);
    border: 1px solid #E2E8F0;
    border-radius: 6px;
    padding: 4px 8px;
    font-size: 12px;
    font-weight: 600;
    color: #475569;
}

.det-toggle-switch[b-zu92jyupt2] {
    position: relative;
    display: inline-block;
    width: 46px;
    height: 28px;
    background: linear-gradient( 180deg, rgba(226, 232, 240, 1) 0%, rgba(248, 250, 252, 1) 100% );
    border-radius: 50px;
    padding: 3px;
    flex-shrink: 0;
}

.det-toggle-switch input[b-zu92jyupt2] {
    opacity: 0;
    width: 0;
    height: 0;
}

.det-toggle-slider[b-zu92jyupt2] {
    position: absolute;
    cursor: pointer;
    border-radius: 30px;
    background-color: #d3dde8;
    transition: 0.3s;
    height: 22px;
    width: 40px;
}

.det-toggle-slider[b-zu92jyupt2]:before {
    content: "";
    position: absolute;
    height: 18px;
    width: 18px;
    left: 2px;
    top: 2px;
    border-radius: 1000px;
    background: linear-gradient(180deg, #e2e8f0 0%, #ffffff 100%);
    border: 3.5px solid #f9fbfc;
    box-shadow: 0 2px 4px rgba(0,0,0,.15);
    transition: .3s;
}

.det-toggle-switch input:checked + .det-toggle-slider[b-zu92jyupt2] {
    background: linear-gradient(135deg, #5b67f6, #4c57e0);
}

.det-toggle-switch input:checked + .det-toggle-slider[b-zu92jyupt2]:before {
    transform: translateX(18px);
    background: #fff;
}

.det-toggle-switch input:checked + .det-toggle-slider[b-zu92jyupt2]:after {
    content: "";
    position: absolute;
    right: 5px;
    top: 7.5px;
    width: 11px;
    height: 11px;
    background-image: url("../img/icons/toggle-check-icon.svg");
    background-size: contain;
    background-repeat: no-repeat;
}
/* /Components/Settings/SettingsTabs/ImportTab.razor.rz.scp.css */
.settings-form-section[b-187mt4secu] {
    display: flex;
    flex-direction: column;
    height: 100%; /* fill the modal's content area */
    min-height: 0;
}

.settings-section-card[b-187mt4secu] {
    background: transparent;
    border: none;
    border-bottom: 1px solid #E5E7EB;
    border-radius: 0;
    padding: 16px 20px;
}

.section-title[b-187mt4secu] {
    font-size: 15px;
    font-weight: 600;
    color: var(--dark-txt);
    margin-bottom: 2px;
}

.section-subtitle[b-187mt4secu] {
    font-size: 13px;
    color: var(--gray-txt-2);
    margin-bottom: 8px;
}

.import-loading[b-187mt4secu] {
    min-height: 240px;
    width: 100%;
    color: #0D6EFD;
}

.import-body[b-187mt4secu] {
    flex: 1 1 auto;
    min-height: 0;
}

/* The import types, as a strip of chips across the top of the tab. */
.import-sections[b-187mt4secu] {
    flex-shrink: 0;
    border-bottom: 1px solid #E5E7EB;
    padding: 12px 20px;
    gap: 8px;
}

.import-section-btn[b-187mt4secu] {
    border: 1px solid transparent;
    background: transparent;
    border-radius: 999px;
    padding: 8px 16px;
    font-size: 14px;
    font-weight: 500;
    color: #475569;
    cursor: pointer;
    transition: background-color 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}

.import-section-btn:hover[b-187mt4secu] {
    background: #F1F5F9CC;
    color: var(--dark-txt);
}

.import-section-btn.active[b-187mt4secu] {
    background: #EEF2FF;
    border-color: #C7D2FE;
    color: var(--dark-txt);
    font-weight: 600;
}

.import-panel[b-187mt4secu] {
    min-width: 0;
    overflow-y: auto;
    padding: 16px 20px;

    /* Firefox */
    scrollbar-width: none;
    /* IE / old Edge */
    -ms-overflow-style: none;
}

    /* Chrome, Safari, new Edge (WebKit-based) */
    .import-panel[b-187mt4secu]::-webkit-scrollbar {
        display: none;
    }

.import-card[b-187mt4secu] {
    background: #FFFFFF;
    border: 1px solid #E5E7EB;
    border-radius: 16px;
    padding: 16px 20px;
    margin-bottom: 16px;
}

.import-card-title[b-187mt4secu] {
    font-size: 14.5px;
    font-weight: 700;
    color: #1E293B;
    margin-bottom: 2px;
}

.import-card-text[b-187mt4secu] {
    font-size: 13px;
    color: var(--gray-txt-2);
    margin-bottom: 12px;
}

.import-not-configured[b-187mt4secu] {
    background: #F8FAFC;
}

.import-name-field[b-187mt4secu] {
    width: 260px;
    max-width: 100%;
}

.form-label[b-187mt4secu] {
    font-size: 13px;
    font-weight: 600;
    line-height: 20px;
    letter-spacing: -0.2px;
    color: var(--gray-txt);
    margin-bottom: 4px;
}

.form-input[b-187mt4secu] {
    width: 100%;
    height: 42px;
    padding: 8px 12px;
    background-color: var(--white);
    border: 1px #1E293B1F solid;
    border-radius: 10px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
    outline: none;
    font-size: 13px;
    font-weight: 600;
    color: var(--dark-txt);
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.form-input:disabled[b-187mt4secu] {
    background: #F1F5F9;
    color: var(--gray-txt-2);
}

.import-dropzone[b-187mt4secu] {
    margin-top: 16px;
    border: 1px dashed #CBD5E1;
    border-radius: 16px;
    background: #F8FAFC;
    padding: 24px;
    text-align: center;
    transition: border-color 0.15s ease, background-color 0.15s ease;
}

.import-dropzone.dragging[b-187mt4secu] {
    border-color: #5263FF;
    background: #EEF2FF;
}

.import-dropzone h6[b-187mt4secu] {
    font-size: 14px;
    font-weight: 600;
    color: var(--dark-txt);
    margin: 0;
}

.import-dropzone span[b-187mt4secu] {
    font-size: 12px;
    color: var(--gray-txt-2);
}

.import-browse[b-187mt4secu] {
    cursor: pointer;
    background: #5263FF;
    color: #FFFFFF;
    border-radius: 10px;
    padding: 8px 14px;
    gap: 8px;
    font-size: 13px;
    font-weight: 600;
}

.import-file-list[b-187mt4secu] {
    margin-top: 16px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    max-height: 260px;
    overflow-y: auto;
}

.import-file-row[b-187mt4secu] {
    background: #F1F5F9;
    border-radius: 12px;
    padding: 10px 14px;
}

.import-file-row.has-error[b-187mt4secu] {
    background: #FEF2F2;
}

.import-file-name[b-187mt4secu] {
    font-size: 13px;
    font-weight: 600;
    color: #1E293B;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.import-file-size[b-187mt4secu] {
    font-size: 12px;
    color: var(--gray-txt-2);
    white-space: nowrap;
}

.import-file-done[b-187mt4secu] {
    font-size: 12px;
    font-weight: 600;
    color: #15803D;
    white-space: nowrap;
}

.import-file-error[b-187mt4secu] {
    font-size: 12px;
    color: #B82213;
    margin-top: 6px;
}

.import-file-remove[b-187mt4secu] {
    border: none;
    background: transparent;
    padding: 2px;
    cursor: pointer;
    display: flex;
    align-items: center;
}

.import-progress[b-187mt4secu] {
    height: 4px;
    border-radius: 4px;
    background: #E2E8F0;
    overflow: hidden;
    margin-top: 8px;
}

.import-progress-bar[b-187mt4secu] {
    height: 100%;
    background: #5263FF;
    border-radius: 4px;
    transition: width 0.2s ease;
}

.import-start-btn[b-187mt4secu] {
    height: 42px;
    min-width: 120px;
    padding: 0 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
}

.import-status-filter[b-187mt4secu] {
    width: 200px;
    max-width: 100%;
}

.import-empty[b-187mt4secu] {
    font-size: 13px;
    color: var(--gray-txt-2);
    padding: 24px 0;
    text-align: center;
}

.import-table-scroll[b-187mt4secu] {
    margin-top: 12px;
    overflow-x: auto;
}

.import-table[b-187mt4secu] {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0 8px;
    font-size: 13px;
}

.import-table th[b-187mt4secu] {
    font-size: 12px;
    font-weight: 600;
    color: var(--gray-txt-2);
    text-align: left;
    padding: 0 12px 4px 12px;
    white-space: nowrap;
}

.import-table td[b-187mt4secu] {
    background: #F1F5F9;
    color: #1E293B;
    padding: 10px 12px;
    vertical-align: middle;
}

.import-table td:first-child[b-187mt4secu] {
    border-top-left-radius: 12px;
    border-bottom-left-radius: 12px;
}

.import-table td:last-child[b-187mt4secu] {
    border-top-right-radius: 12px;
    border-bottom-right-radius: 12px;
}

.import-batch-name[b-187mt4secu] {
    font-weight: 700;
}

.import-batch-progress-text[b-187mt4secu] {
    font-size: 12px;
    color: var(--gray-txt-2);
    white-space: nowrap;
}

.status-pill[b-187mt4secu] {
    display: inline-flex;
    align-items: center;
    border-radius: 999px;
    padding: 3px 12px;
    font-size: 12px;
    font-weight: 600;
    white-space: nowrap;
}

.status-uploading[b-187mt4secu] {
    background: #E0E7FF;
    color: #3730A3;
}

.status-processing[b-187mt4secu] {
    background: #FEF3C7;
    color: #92400E;
}

.status-location-review[b-187mt4secu] {
    background: #FFEDD5;
    color: #9A3412;
}

.status-review[b-187mt4secu] {
    background: #DBEAFE;
    color: #1D4ED8;
}

.status-completed[b-187mt4secu] {
    background: #DCFCE7;
    color: #166534;
}

.status-cancelled[b-187mt4secu] {
    background: #E2E8F0;
    color: #475569;
}

.import-row-btn[b-187mt4secu] {
    height: 34px;
    padding: 0 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    white-space: nowrap;
}

/* ── Files already on an address ─────────────────────────────────────────── */

.import-candidate-search[b-187mt4secu] {
    width: 240px;
    max-width: 100%;
}

.import-bulk-bar[b-187mt4secu] {
    margin-top: 12px;
    background: #EEF2FF;
    border: 1px solid #C7D2FE;
    border-radius: 12px;
    padding: 8px 12px;
}

.import-select-col[b-187mt4secu] {
    width: 36px;
}

.import-candidate-address[b-187mt4secu] {
    font-size: 12px;
    color: var(--gray-txt-2);
}

.import-candidate-warning[b-187mt4secu] {
    font-size: 12px;
    color: #92400E;
    margin-top: 2px;
}

.import-candidate-chips[b-187mt4secu] {
    margin-top: 4px;
    max-width: 280px;
}

.import-candidate-chip[b-187mt4secu] {
    background: #FFFFFF;
    border: 1px solid #E2E8F0;
    border-radius: 999px;
    padding: 2px 10px;
    font-size: 11px;
    color: #475569;
    max-width: 140px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.import-batch-source[b-187mt4secu] {
    font-size: 12px;
    font-weight: 400;
    color: var(--gray-txt-2);
}

.import-bulk-bar .import-row-btn:disabled[b-187mt4secu] {
    opacity: 0.5;
    cursor: not-allowed;
}
/* /Components/Settings/SettingsTabs/NotificationsTab.razor.rz.scp.css */
.settings-form-section[b-1arapuqtfx] {
    display: flex;
    flex-direction: column;
}

.settings-section-card[b-1arapuqtfx] {
    background: transparent;
    border: none;
    border-bottom: 1px solid #E5E7EB;
    border-radius: 0;
    padding: 16px 20px;
}

.settings-section-card:first-child[b-1arapuqtfx] {
    padding: 16px 20px;
}

.settings-section-card:last-child[b-1arapuqtfx] {
    border-bottom: none;
}

.active-editing-card[b-1arapuqtfx] {
    background: #F8FAFC !important;
    border-bottom: 1px solid #E5E7EB !important;
}

.section-title[b-1arapuqtfx] {
    font-size: 15px;
    font-weight: 600;
    color: var(--dark-txt);
    margin-bottom: 2px;
}

.section-subtitle[b-1arapuqtfx] {
    font-size: 12.5px;
    color: var(--gray-txt-2);
    margin-bottom: 8px;
}

.form-label[b-1arapuqtfx] {
    font-size: 13px;
    font-weight: 600;
    line-height: 20px;
    letter-spacing: -0.2px;
    color: var(--gray-txt);
    margin-bottom: 4px;
}

.form-input[b-1arapuqtfx] {
    width: 100%;
    padding: 8px 10px;
    background-color: var(--white);
    border: 1px #1E293B1F solid;
    border-radius: 10px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
    outline: none;
    font-size: 13px;
    font-weight: 600;
    line-height: 24px;
    letter-spacing: -0.2px;
    color: var(--dark-txt);
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.form-input:focus[b-1arapuqtfx] {
    box-shadow: 0 0 0 0.2rem #dce0ff;
    outline: none;
    border-color: #1E293B1F;
}

.var-pill[b-1arapuqtfx] {
    background: #FFFFFF;
    border: 1px solid #E2E8F0;
    border-radius: 10px;
    padding: 4px 12px;
    font-size: 12.5px;
    font-weight: 500;
    color: #475569;
    cursor: pointer;
    transition: background 0.15s ease, border-color 0.15s ease;
}

.var-pill:hover[b-1arapuqtfx] {
    background: #F1F5F9;
    border-color: #CBD5E1;
}

.btn-template-action[b-1arapuqtfx] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border: 1px solid #E2E8F0;
    border-radius: 8px;
    background: #FFFFFF;
    cursor: pointer;
    transition: background 0.15s ease, border-color 0.15s ease;
    flex-shrink: 0;
}

.btn-template-action:hover[b-1arapuqtfx] {
    background: #F8FAFC;
    border-color: #CBD5E1;
}

.email-body-textarea[b-1arapuqtfx] {
    height: 180px;
    resize: none;
    line-height: 1.5;
}

.det-toggle-switch[b-1arapuqtfx] {
    position: relative;
    display: inline-block;
    width: 46px;
    height: 28px;
    background: linear-gradient( 180deg, rgba(226, 232, 240, 1) 0%, rgba(248, 250, 252, 1) 100% );
    border-radius: 50px;
    padding: 3px;
    flex-shrink: 0;
}

    .det-toggle-switch.disabled[b-1arapuqtfx] {
        opacity: 0.6;
        cursor: not-allowed;
    }

.det-toggle-switch input[b-1arapuqtfx] {
    opacity: 0;
    width: 0;
    height: 0;
}

.det-toggle-slider[b-1arapuqtfx] {
    position: absolute;
    cursor: pointer;
    border-radius: 30px;
    background-color: #d3dde8;
    transition: 0.3s;
    height: 22px;
    width: 40px;
}

    .det-toggle-switch.disabled .det-toggle-slider[b-1arapuqtfx] {
        cursor: not-allowed;
    }

.det-toggle-slider[b-1arapuqtfx]:before {
    content: "";
    position: absolute;
    height: 18px;
    width: 18px;
    left: 2px;
    top: 2px;
    border-radius: 1000px;
    background: linear-gradient(180deg, #e2e8f0 0%, #ffffff 100%);
    border: 3.5px solid #f9fbfc;
    box-shadow: 0 2px 4px rgba(0,0,0,.15);
    transition: .3s;
}

.det-toggle-switch input:checked + .det-toggle-slider[b-1arapuqtfx] {
    background: linear-gradient(135deg, #5b67f6, #4c57e0);
}

.det-toggle-switch input:checked + .det-toggle-slider[b-1arapuqtfx]:before {
    transform: translateX(18px);
    background: #fff;
}

.det-toggle-switch input:checked + .det-toggle-slider[b-1arapuqtfx]:after {
    content: "";
    position: absolute;
    right: 5px;
    top: 7.5px;
    width: 11px;
    height: 11px;
    background-image: url("../img/icons/toggle-check-icon.svg");
    background-size: contain;
    background-repeat: no-repeat;
}
/* /Components/Settings/SettingsTabs/PricesTab.razor.rz.scp.css */
.settings-form-section[b-z6owjw9rhu] {
    display: flex;
    flex-direction: column;
    height: 100%;
    overflow: hidden;
}

.settings-scroll-content[b-z6owjw9rhu] {
    flex-grow: 1;
    overflow-y: auto;
    -ms-overflow-style: none;
    scrollbar-width: none;
}

.settings-scroll-content[b-z6owjw9rhu]::-webkit-scrollbar {
    display: none;
}

.settings-section-card[b-z6owjw9rhu] {
    background: transparent;
    border: none;
    border-bottom: 1px solid #E5E7EB;
    border-radius: 0;
    padding: 16px 20px;
}

.settings-section-card:last-child[b-z6owjw9rhu] {
    border-bottom: none;
}

.section-title[b-z6owjw9rhu] {
    font-size: 15px;
    font-weight: 600;
    color: var(--dark-txt);
    margin-bottom: 2px;
}

.section-subtitle[b-z6owjw9rhu] {
    font-size: 12.5px;
    color: var(--gray-txt-2);
    margin-bottom: 8px;
}

.accordion-header[b-z6owjw9rhu] {
    background: transparent;
    border: none;
    text-align: left;
    cursor: pointer;
    padding: 0 !important;
    outline: none;
}

.accordion-title[b-z6owjw9rhu] {
    font-size: 15px;
    font-weight: 700;
    color: #1E293B;
}

.accordion-arrow[b-z6owjw9rhu] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    background: #EDEEFF;
    border-radius: 8px;
    transition: transform 0.2s ease;
}

.accordion-body-wrapper[b-z6owjw9rhu] {
    max-height: 0;
    overflow: hidden;
    opacity: 0;
    visibility: hidden;
    transition: max-height 0.3s ease-in-out, opacity 0.3s ease-in-out, visibility 0.3s ease-in-out;
}

.accordion-body-wrapper.expanded[b-z6owjw9rhu] {
    max-height: 800px;
    opacity: 1;
    visibility: visible;
}

.range-table-container[b-z6owjw9rhu] {
    border: 1px solid #E2E8F0;
    border-radius: 16px;
    background: #FFFFFF;
    overflow: hidden;
}

.range-table-header[b-z6owjw9rhu] {
    background: #F1F5F9;
    border-bottom: 1px solid #E2E8F0;
    padding: 10px 16px !important;
    font-size: 13px;
    font-weight: 700;
    color: var(--dark-txt);
}

.range-table-body[b-z6owjw9rhu] {
    background: #FFFFFF;
    padding: 16px !important;
}

/*.range-table-footer {
    background: #5263FF1F;
    border-top: 1px solid #E2E8F0;
    padding: 10px 16px !important;
}*/

.btn-new-inline[b-z6owjw9rhu] {
    background: transparent;
    border: none;
    font-size: 13px;
    font-weight: 600;
    color: #363AF5;
    display: flex;
    align-items: center;
    cursor: pointer;
    padding: 0;
}

.btn-new-inline:hover[b-z6owjw9rhu] {
    opacity: 0.8;
}

.flat-price-container[b-z6owjw9rhu] {
    border: 1px solid #E2E8F0;
    border-radius: 12px;
    background: #FFFFFF;
    overflow: hidden;
}

.flat-price-header[b-z6owjw9rhu] {
    background: #F1F5F9;
    border-bottom: 1px solid #E2E8F0;
    padding: 10px 16px !important;
    font-size: 13px;
    font-weight: 700;
    color: #5F6E85;
}

.flat-price-body[b-z6owjw9rhu] {
    background: #FFFFFF;
    padding: 16px !important;
}

.price-range-row[b-z6owjw9rhu] {
    padding: 2px 0;
}

.form-input[b-z6owjw9rhu] {
    width: 100%;
    padding: 8px 10px;
    background-color: var(--white);
    border: 1px #1E293B1F solid;
    border-radius: 10px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
    outline: none;
    font-size: 13px;
    font-weight: 600;
    line-height: 24px;
    letter-spacing: -0.2px;
    color: var(--dark-txt);
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.form-input:focus[b-z6owjw9rhu] {
    box-shadow: 0 0 0 0.2rem #dce0ff;
    outline: none;
    border-color: #1E293B1F;
}

.btn-remove-range[b-z6owjw9rhu] {
    background: transparent;
    border: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 4px;
    transition: opacity 0.2s ease;
    width: 32px;
}

.btn-remove-range:hover[b-z6owjw9rhu] {
    opacity: 0.7;
}

.prices-empty-state[b-z6owjw9rhu] {
    height: 408px;
    padding: 0 40px;
}

.prices-empty-state p[b-z6owjw9rhu] {
    font-size: 14px;
    color: var(--gray-txt-2);
}

/*.settings-modal-footer {
    height: 80px;
    border-top: 1px solid #E2E8F0;
    background: var(--white);
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding: 0 24px;
    flex-shrink: 0;
}*/

.prices-tab-wrapper[b-z6owjw9rhu] {
    display: flex;
    flex-direction: column;
    height: 100%; /* needs a bounded height from its parent modal to work */
}

.settings-scroll-content[b-z6owjw9rhu] {
    flex: 1 1 auto;
    overflow-y: auto;
    min-height: 0; /* critical in flex layouts, otherwise content won't scroll and pushes footer down */
}

.settings-modal-footer[b-z6owjw9rhu] {
    flex: 0 0 auto;
    height: 80px;
    border-top: 1px solid #E2E8F0;
    background: var(--white);
    align-items: center;
    padding: 0 24px;
}

/* ── Add row button ── */
.prices-tab-wrapper .prices-add-row-btn[b-z6owjw9rhu] {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 6.5px 16px;
    font-size: 13px;
    font-weight: 700;
    color: var(--purple);
    background-color: #eaecff;
    cursor: pointer;
    user-select: none;
    transition: background-color 0.15s;
    border-top: none;
}

    .prices-tab-wrapper .prices-add-row-btn:hover[b-z6owjw9rhu] {
        background-color: #dce0ff;
    }
.visits-label[b-z6owjw9rhu] {
    font-size: 13px;
    font-weight: 600;
    color: #374151;
    white-space: nowrap;
}

.visits-input[b-z6owjw9rhu] {
    width: 120px !important;
}
/* /Components/Settings/SettingsTabs/TwoFactorAuthentication/AuthenticatorApp/SetupAuthenticatorPopup.razor.rz.scp.css */
.cu-body-wrap[b-ubt5ixhtnk] {
    padding: 20px;
    background: #f1f5f9;
}

.sap-description[b-ubt5ixhtnk] {
    font-size: 13px;
    font-weight: 500;
    color: var(--gray-txt-2);
    line-height: 20px;
}

.qr-card[b-ubt5ixhtnk] {
    background: white;
    padding: 10px;
    border-radius: 24px;
    display: inline-flex;
}

.setup-key-group[b-ubt5ixhtnk] {
    display: flex;
    gap: 8px;
    align-items: center;
}

.btn-wm-copy-inline[b-ubt5ixhtnk] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    background-color: var(--white);
    border: 1px #1E293B1F solid;
    border-radius: 10px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
    cursor: pointer;
    transition: background-color 0.15s ease;
    padding: 0;
}

    .btn-wm-copy-inline:hover[b-ubt5ixhtnk] {
        background-color: #F8FAFC;
    }

.form-label[b-ubt5ixhtnk] {
    font-size: 13px;
    font-weight: 600;
    line-height: 20px;
    letter-spacing: -0.2px;
    color: var(--gray-txt);
    margin-bottom: 4px;
    display: inline-block;
}

.form-input[b-ubt5ixhtnk] {
    width: 100%;
    height: 42px;
    padding: 8px 10px;
    background-color: var(--white);
    border: 1px #1E293B1F solid;
    border-radius: 10px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
    outline: none;
    font-size: 13px;
    font-weight: 600;
    line-height: 24px;
    letter-spacing: -0.2px;
    color: var(--dark-txt);
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

    .form-input:focus[b-ubt5ixhtnk] {
        box-shadow: 0 0 0 0.2rem #dce0ff;
        outline: none;
        border-color: #1E293B1F;
    }
/* /Components/Settings/SettingsTabs/TwoFactorAuthentication/AuthenticatorApp/VerifyAuthenticatorPopup.razor.rz.scp.css */
.cu-body-wrap[b-xofoavhyyt] {
    padding: 20px;
    background: #f1f5f9;
}

.otp-boxes[b-xofoavhyyt] {
    display: flex;
    gap: 8px;
    justify-content: center;
    align-items: center;
}

.otp-input[b-xofoavhyyt] {
    width: 53.33px;
    height: 60px;
    background: #FFFFFF;
    border: 1px solid #1E293B1F;
    border-radius: 10px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
    text-align: center;
    font-size: 24px;
    font-weight: 600;
    color: #475467;
    transition: all .2s ease;
}

    .otp-input:focus[b-xofoavhyyt] {
        outline: none;
        border-color: #C7D2FE;
        box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.15), 0 2px 4px rgba(0, 0, 0, 0.05);
    }

.otp-container[b-xofoavhyyt] {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
}

.invalid-code-message[b-xofoavhyyt] {
    width: 360px;
    font-size: 13px;
    font-weight: 500;
    color: #D92D20;
    text-align: left;
    margin-top: 12px;
}

.otp-input.is-invalid[b-xofoavhyyt] {
    border: #ED403033;
    box-shadow: 0 0 0 3px rgba(237, 64, 48, 0.15), 0 2px 4px rgba(0, 0, 0, 0.05);
    outline: none;
}
/* /Components/Settings/SettingsTabs/TwoFactorAuthentication/RecoveryCodesPopup.razor.rz.scp.css */
.cu-body-wrap[b-caehnko0us] {
    padding: 20px;
    background: #f1f5f9;
}

.codes-container[b-caehnko0us] {
    display: flex;
    justify-content: center;
    gap: 48px;
    padding: 16px 0;
}

.codes-column[b-caehnko0us] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.code-item[b-caehnko0us] {
    font-size: 15px;
    font-weight: 600;
    color: #1E293B;
    letter-spacing: -0.2px;
    line-height: 24px;
    font-family: 'Plus Jakarta Sans';
}
/* /Components/Settings/SettingsTabs/TwoFactorAuthentication/TextSms/SetupSmsPopup.razor.rz.scp.css */
.cu-body-wrap[b-yjd5nnibfy] {
    padding: 24px;
    background: #f1f5f9;
}

label[b-yjd5nnibfy] {
    font-size: 14px !important;
    font-weight: 500 !important;
    color: #344054 !important;
}

.phone-group[b-yjd5nnibfy] {
    width: 100% !important;
    height: fit-content !important;
    display: flex !important;
    align-items: stretch !important;
    border: 1px solid #1E293B1F !important;
    border-radius: 10px !important;
    background: #fff !important;
    background-color: var(--white) !important;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05) !important;
    overflow: hidden !important;
}

    .phone-group:focus[b-yjd5nnibfy],
    .phone-group:focus-within[b-yjd5nnibfy] {
        box-shadow: 0 0 0 0.2rem #dce0ff !important;
    }

    .phone-group input:focus[b-yjd5nnibfy],
    .phone-group input:focus-within[b-yjd5nnibfy] {
        box-shadow: none !important;
    }

    .phone-group:hover:not(.disabled)[b-yjd5nnibfy] {
        border-color: #eaecff !important;
    }

    .phone-group.disabled[b-yjd5nnibfy] {
        background: transparent !important;
        box-shadow: initial !important;
        cursor: not-allowed !important;
    }

.phone-group-divider[b-yjd5nnibfy] {
    width: 1px !important;
    height: 40px !important;
    background-color: #1E293B1F;
    flex-shrink: 0 !important;
}

.phone-input[b-yjd5nnibfy] {
    flex: 1 !important;
    height: 40px !important;
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
    background: transparent !important;
    padding: 0 12px !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    color: #212529 !important;
    min-width: 0 !important;
    border-radius: 0px !important;
}

    .phone-input[b-yjd5nnibfy]::placeholder {
        color: #5F6E85 !important;
    }

[b-yjd5nnibfy] .dropdown:has(> .user-phone-code) {
    width: fit-content !important;
    height: 40px !important;
    display: flex !important;
    align-items: stretch !important;
}

[b-yjd5nnibfy] .user-phone-code.custom-select-button {
    box-shadow: none !important;
    border-radius: 0 !important;
    height: 40px !important;
    width: 100px !important;
    white-space: nowrap;
    border: none !important;
}

    [b-yjd5nnibfy] .user-phone-code.custom-select-button:focus {
        box-shadow: none !important;
    }
/* /Components/Settings/SettingsTabs/TwoFactorAuthentication/TextSms/VerifySmsPopup.razor.rz.scp.css */
.cu-body-wrap[b-wj9av6hyxg] {
    padding: 20px;
    background: #f1f5f9;
}

.otp-boxes[b-wj9av6hyxg] {
    display: flex;
    gap: 8px;
    justify-content: center;
    align-items: center;
}

.otp-input[b-wj9av6hyxg] {
    width: 53.33px;
    height: 60px;
    background: #FFFFFF;
    border: 1px solid #1E293B1F;
    border-radius: 10px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
    text-align: center;
    font-size: 24px;
    font-weight: 600;
    color: #475467;
    transition: all .2s ease;
}

.otp-input:focus[b-wj9av6hyxg] {
    outline: none;
    border-color: #C7D2FE;
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.15), 0 2px 4px rgba(0, 0, 0, 0.05);
}

.otp-container[b-wj9av6hyxg] {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
}

.invalid-code-message[b-wj9av6hyxg] {
    width: 360px;
    font-size: 13px;
    font-weight: 500;
    color: #D92D20;
    text-align: left;
    margin-top: 12px;
}

.otp-input.is-invalid[b-wj9av6hyxg] {
    border: 2px solid #FDA4AF !important;
    background-color: #FFFFFF !important;
}

.resend-container[b-wj9av6hyxg] {
    margin-top: 24px;
    display: flex;
    justify-content: center;
    width: 100%;
}

.btn-resend[b-wj9av6hyxg] {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 36px;
    padding: 0 16px;
    border: 1px solid #1E293B1F;
    border-radius: 8px;
    background: #FFFFFF;
    font-size: 13px;
    font-weight: 600;
    color: #475467;
    cursor: pointer;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
    transition: all 0.2s ease;
    outline: none;
}

.btn-resend:hover:not(:disabled)[b-wj9av6hyxg] {
    background-color: #F8FAFC;
    border-color: #CBD5E1;
}

.btn-resend:disabled[b-wj9av6hyxg] {
    background-color: #F8FAFC;
    color: #98A2B3;
    cursor: not-allowed;
    box-shadow: none;
    border-color: #1E293B0F;
}
/* /Components/Settings/SettingsTabs/WorkTypesTab.razor.rz.scp.css */
.settings-form-section[b-hn24d0v0we] {
    display: flex;
    flex-direction: column;
}

.settings-section-card[b-hn24d0v0we] {
    background: transparent;
    border: none;
    border-bottom: 1px solid #E5E7EB;
    border-radius: 0;
    padding: 16px 20px;
}

.settings-section-card:first-child[b-hn24d0v0we] {
    padding: 16px 20px;
}

.settings-section-card:last-child[b-hn24d0v0we] {
    border-bottom: none;
}

.section-title[b-hn24d0v0we] {
    font-size: 15px;
    font-weight: 600;
    color: var(--dark-txt);
    margin-bottom: 2px;
}

.section-subtitle[b-hn24d0v0we] {
    font-size: 12.5px;
    color: var(--gray-txt-2);
    margin-bottom: 8px;
}

.form-label[b-hn24d0v0we] {
    font-size: 13px;
    font-weight: 600;
    line-height: 20px;
    letter-spacing: -0.2px;
    color: var(--gray-txt);
    margin-bottom: 4px;
}

.form-input[b-hn24d0v0we] {
    width: 100%;
    padding: 8px 10px;
    background-color: var(--white);
    border: 1px #1E293B1F solid;
    border-radius: 10px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
    outline: none;
    font-size: 13px;
    font-weight: 600;
    line-height: 24px;
    letter-spacing: -0.2px;
    color: var(--dark-txt);
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.form-input:focus[b-hn24d0v0we] {
    box-shadow: 0 0 0 0.2rem #dce0ff;
    outline: none;
    border-color: #1E293B1F;
}

.worktype-item[b-hn24d0v0we] {
    background: #F8FAFC;
    border: 1px solid #E2E8F0;
    border-radius: 12px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 16px !important;
}

.wt-drag-handle[b-hn24d0v0we] {
    display: inline-flex;
    align-items: center;
    color: #94A3B8;
    cursor: grab;
    /* The row scrolls, the handle drags: without this a touch drag scrolls the settings page
       instead of moving the work type. */
    touch-action: none;
}

.wt-drag-handle:active[b-hn24d0v0we] {
    cursor: grabbing;
}

/* SortableJS puts these on the row it is carrying. The names are the library's, shared with
   the route builders and the drawing toolbar. */
.worktype-item.rlp-drag-ghost[b-hn24d0v0we] {
    opacity: 0.35;
}

.worktype-item.rlp-drag-chosen[b-hn24d0v0we] {
    cursor: grabbing;
}

.worktype-name[b-hn24d0v0we] {
    font-size: 13.5px;
    font-weight: 600;
    color: var(--dark-txt);
}

.edit-card[b-hn24d0v0we] {
    background: #F8FAFC;
    border: 1px solid #CBD5E1;
    border-radius: 12px;
    padding: 16px !important;
}

.btn-remove-icon[b-hn24d0v0we],
.btn-edit-icon[b-hn24d0v0we] {
    background: transparent;
    border: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 4px;
    transition: opacity 0.2s ease;
}

.btn-remove-icon:hover[b-hn24d0v0we],
.btn-edit-icon:hover[b-hn24d0v0we] {
    opacity: 0.7;
}

.fee-badge[b-hn24d0v0we] {
    background: var(--white);
    border: 1px solid #E2E8F0;
    border-radius: 6px;
    padding: 4px 8px;
    font-size: 12px;
    font-weight: 600;
    color: #475569;
}

.form-input[b-hn24d0v0we]::placeholder {
    color: #5F6E85 !important;
    font-weight: 600 !important;
}

.baggee[b-hn24d0v0we] {
    padding: 4px 8px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 600;
    line-height: 16px;
    letter-spacing: -0.2px;
}

    .baggee.green[b-hn24d0v0we] {
        background-color: #409B3F1F;
        color: var(--green);
    }

.no-spinner[b-hn24d0v0we]::-webkit-inner-spin-button,
.no-spinner[b-hn24d0v0we]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.no-spinner[b-hn24d0v0we] {
    -moz-appearance: textfield;
}
/* The Extra toggle: whether a work type may be added to a stop as an extra invoice line. */
.wt-extra-field[b-hn24d0v0we] {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin-top: 4px;
}

.wt-extra-inline[b-hn24d0v0we] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin: 0 8px 0 0;
    cursor: pointer;
}

.wt-extra-label[b-hn24d0v0we] {
    font-size: 13px;
    font-weight: 600;
    color: var(--dark-txt);
}

.wt-extra-hint[b-hn24d0v0we] {
    margin: 2px 0 0;
    font-size: 12px;
    color: var(--gray-txt-2);
}

.wt-extra-switch[b-hn24d0v0we] {
    position: relative;
    display: inline-block;
    width: 40px;
    height: 22px;
    flex-shrink: 0;
}

.wt-extra-switch input[b-hn24d0v0we] {
    opacity: 0;
    width: 0;
    height: 0;
}

.wt-extra-slider[b-hn24d0v0we] {
    position: absolute;
    inset: 0;
    cursor: pointer;
    border-radius: 30px;
    background-color: #d3dde8;
    transition: 0.3s;
}

.wt-extra-slider[b-hn24d0v0we]:before {
    content: "";
    position: absolute;
    height: 16px;
    width: 16px;
    left: 3px;
    top: 3px;
    border-radius: 50%;
    background: #ffffff;
    box-shadow: 0 2px 4px rgba(0, 0, 0, .15);
    transition: .3s;
}

.wt-extra-switch input:checked + .wt-extra-slider[b-hn24d0v0we] {
    background: linear-gradient(135deg, #5b67f6, #4c57e0);
}

.wt-extra-switch input:checked + .wt-extra-slider[b-hn24d0v0we]:before {
    transform: translateX(18px);
}

.wt-extra-switch input:disabled + .wt-extra-slider[b-hn24d0v0we] {
    opacity: 0.6;
    cursor: default;
}
/* /Components/Shared/WMAmountInput.razor.rz.scp.css */
/* The money box carries its own look, because it has to.
   Blazor's CSS isolation scopes a stylesheet to the component that DECLARES the markup, so the
   `prices-input` rules in LocationDetailsModal.razor.css stopped reaching these inputs the
   moment the raw `<input @bind>` became a `<WMAmountInput>` — the element is declared here now,
   and carries this component's scope attribute rather than the modal's. Every price and cost on
   the Prices tab fell back to the browser default (a 2px inset border, 28px tall, square
   corners) while the installments box beside them, still a raw input, kept its styling. A
   caller's `Class` can still lay the box out; what it cannot do any more is give it its
   appearance, so the appearance lives with the box.

   The values below are the ones those inputs had, so a styled box looks the way it did before
   the regression — with one deliberate change: amounts are right-aligned, so the digits line up
   down a column and a price and a cost can be compared at a glance. */
input[b-z5ui8la0nh] {
  width: 100%;
  height: 40px;
  padding: 6px 10px;
  background-color: var(--white);
  border: 1px solid #1e293b1f;
  border-radius: 10px;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: 13px;
  font-weight: 600;
  color: var(--dark-txt);
  text-align: right;
  font-variant-numeric: tabular-nums;
  outline: none;
  transition:
    border-color 0.15s,
    box-shadow 0.15s;
}

input:focus[b-z5ui8la0nh] {
  border-color: var(--purple);
  box-shadow: 0 0 0 0.2rem #dce0ff;
}

input[b-z5ui8la0nh]::placeholder {
  color: #5f6e85;
  text-align: right;
}

/* A box the caller has made read-only is showing a figure that belongs to somebody else — the
   price another business set for this address, say. It should not invite a caret. */
input[readonly][b-z5ui8la0nh] {
  background-color: #f8fafc;
  color: #5f6e85;
  box-shadow: none;
  cursor: default;
}
/* /Components/Shared/WMCalendar.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   WMCalendar — Scoped Component Styles
   ═══════════════════════════════════════════════════════ */

.wm-calendar-container[b-ytqstzymbp] {
    position: relative !important;
    display: inline-block !important;
    width: 100% !important;
}

.wm-calendar-input[b-ytqstzymbp] {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    width: 100% !important;
    height: 40px !important;
    padding: 0 12px !important;
    background-color: #ffffff !important;
    border: 1px solid #1E293B1F !important;
    border-radius: 10px !important;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05) !important;
    cursor: pointer !important;
    transition: all 0.2s ease-in-out !important;
    outline: none !important;
    user-select: none !important;
}

    .wm-calendar-input:hover:not(:disabled)[b-ytqstzymbp] {
        border-color: #eaecff !important;
        background-color: #f8f9fa !important;
    }

    .wm-calendar-input:focus[b-ytqstzymbp],
    .wm-calendar-input:focus-within[b-ytqstzymbp] {
        box-shadow: 0 0 0 0.2rem #dce0ff !important;
    }

    .wm-calendar-input:disabled[b-ytqstzymbp] {
        background: transparent !important;
        box-shadow: initial !important;
        cursor: not-allowed !important;
    }

    .wm-calendar-input.invalid[b-ytqstzymbp] {
        box-shadow: 0 0 0 0.2rem #f0d1d1 !important;
    }

.wm-calendar-input-date[b-ytqstzymbp] {
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
    flex: 1 !important;
    min-width: 0 !important;
}

.wm-calendar-icon[b-ytqstzymbp] {
    height: 18px !important;
    width: 18px !important;
    flex-shrink: 0 !important;
}

.wm-calendar-input-text[b-ytqstzymbp] {
    font-size: 14px !important;
    font-weight: 600 !important;
    line-height: 24px !important;
    letter-spacing: -0.2px !important;
    color: #212529 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

.wm-calendar-input.placeholder .wm-calendar-input-text[b-ytqstzymbp] {
    color: #5F6E85 !important;
}

.wm-calendar-popup[b-ytqstzymbp] {
    z-index: 9999 !important;
    background: var(--white) !important;
    border: 1px solid #1E293B17 !important;
    border-radius: 20px !important;
    padding: 12px !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.15) !important;
    width: 304px !important;
}

.wm-cal-header[b-ytqstzymbp] {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    border: 1px solid #1E293B17 !important;
    border-radius: 12px !important;
    padding: 4px !important;
    margin-bottom: 12px !important;
    background: linear-gradient(180deg, #F8FAFC 0%, #FFFFFF 100%) !important;
}

.wm-cal-nav-btn[b-ytqstzymbp] {
    height: 30px !important;
    width: 30px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background-color: var(--white) !important;
    border: 1px solid #1E293B17 !important;
    border-radius: 8px !important;
    cursor: pointer !important;
    transition: background-color 0.15s !important;
    flex-shrink: 0 !important;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
}

    .wm-cal-nav-btn:hover[b-ytqstzymbp] {
        background-color: #F1F5F9 !important;
    }

    .wm-cal-nav-btn img[b-ytqstzymbp] {
        height: 14px !important;
    }

.wm-cal-month-year-btn[b-ytqstzymbp] {
    display: flex !important;
    align-items: center !important;
    gap: 4px !important;
    background: none !important;
    border: none !important;
    cursor: pointer !important;
    padding: 4px 8px !important;
    border-radius: 8px !important;
    transition: background-color 0.15s !important;
}

    .wm-cal-month-year-btn:hover[b-ytqstzymbp] {
        background-color: #F1F5F9 !important;
    }

.wm-cal-month[b-ytqstzymbp] {
    font-size: 13px !important;
    font-weight: 700 !important;
    line-height: 20px !important;
    letter-spacing: -0.2px !important;
    color: var(--gray-txt) !important;
}

.wm-cal-year[b-ytqstzymbp] {
    font-size: 13px !important;
    font-weight: 600 !important;
    line-height: 20px !important;
    letter-spacing: -0.2px !important;
    color: var(--gray-txt-2) !important;
}

.wm-cal-dow-row[b-ytqstzymbp] {
    display: grid !important;
    grid-template-columns: repeat(7, 1fr) !important;
    text-align: center !important;
    font-size: 10px !important;
    font-weight: 600 !important;
    line-height: 16px !important;
    letter-spacing: -0.2px !important;
    color: var(--gray-txt-2) !important;
    margin-bottom: 4px !important;
}

.wm-cal-dow[b-ytqstzymbp] {
    padding: 4px 0 !important;
}

.wm-cal-dates[b-ytqstzymbp] {
    display: grid !important;
    grid-template-columns: repeat(7, 1fr) !important;
    gap: 2px !important;
}

.wm-cal-cell[b-ytqstzymbp] {
    height: 30px !important;
    width: 30px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 8px !important;
    cursor: pointer !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    line-height: 24px !important;
    color: var(--gray-txt) !important;
    transition: background-color 0.12s, color 0.12s !important;
    margin: 0 auto !important;
    user-select: none !important;
}

    .wm-cal-cell:hover:not(.other):not(.disabled):not(.selected)[b-ytqstzymbp] {
        background-color: #eaecff !important;
    }

    .wm-cal-cell.selected[b-ytqstzymbp] {
        background: linear-gradient(var(--purple), var(--purple)) padding-box, linear-gradient(90deg, #1E293B17, #1E293B2E) border-box;
        /* border: 1px solid transparent; */
        border: none;
        backdrop-filter: blur(24px);
        box-shadow: 0px 1px 1px -0.5px #1E293B08, 0px 3px 3px 0px #FFFFFF1F inset;
        color: var(--white) !important;
        z-index: 1;
    }

    .wm-cal-cell.today[b-ytqstzymbp] {
        color: var(--purple) !important;
        font-weight: 800 !important;
        border: 1.5px solid var(--purple) !important;
    }

    .wm-cal-cell.other[b-ytqstzymbp] {
        color: #C8D5E1 !important;
        pointer-events: none !important;
        cursor: default !important;
    }

    .wm-cal-cell.disabled[b-ytqstzymbp] {
        color: #CBD5E1 !important;
        pointer-events: none !important;
        cursor: not-allowed !important;
        opacity: 0.5 !important;
    }

    /* A day with something behind it. A dot under the number rather than a fill, so it can
       sit on a selected or a today cell without fighting either for the same pixels. */
    .wm-cal-cell.has-mark[b-ytqstzymbp] {
        position: relative !important;
    }

        .wm-cal-cell.has-mark[b-ytqstzymbp]::after {
            content: "";
            position: absolute;
            bottom: 3px;
            left: 50%;
            transform: translateX(-50%);
            width: 4px;
            height: 4px;
            border-radius: 50%;
            background-color: var(--purple);
        }

        .wm-cal-cell.has-mark.selected[b-ytqstzymbp]::after {
            background-color: var(--white);
        }

    /* And a whisper of a fill under the dot, so the days worth clicking read as a group from
       across the popup instead of as a handful of 4px dots. Hover still wins over it. */
    .wm-cal-cell.has-mark:not(.selected):not(.disabled)[b-ytqstzymbp] {
        background-color: #F1F2FF !important;
    }

.wm-cal-month-grid[b-ytqstzymbp] {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 6px !important;
    padding: 4px 0 !important;
}

.wm-cal-month-cell[b-ytqstzymbp] {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    height: 40px !important;
    border-radius: 10px !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    color: var(--gray-txt) !important;
    cursor: pointer !important;
    transition: background-color 0.12s, color 0.12s !important;
    user-select: none !important;
}

    .wm-cal-month-cell:hover:not(.disabled):not(.selected)[b-ytqstzymbp] {
        background-color: #eaecff !important;
    }

    .wm-cal-month-cell.selected[b-ytqstzymbp] {
        background: linear-gradient(var(--purple), var(--purple)) padding-box, linear-gradient(90deg, #1E293B17, #1E293B2E) border-box;
        /* border: 1px solid transparent; */
        border: none;
        backdrop-filter: blur(24px);
        box-shadow: 0px 1px 1px -0.5px #1E293B08, 0px 3px 3px 0px #FFFFFF1F inset;
        color: var(--white) !important;
        z-index: 1;
    }

    .wm-cal-month-cell.today[b-ytqstzymbp] {
        color: var(--purple) !important;
        font-weight: 800 !important;
        border: 1.5px solid var(--purple) !important;
    }

    .wm-cal-month-cell.disabled[b-ytqstzymbp] {
        color: #CBD5E1 !important;
        pointer-events: none !important;
        opacity: 0.5 !important;
    }

.wm-cal-footer[b-ytqstzymbp] {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    margin-top: 12px !important;
    padding-top: 12px !important;
    border-top: 1px solid #1E293B0F !important;
    gap: 8px !important;
}

.wm-cal-footer-btn[b-ytqstzymbp] {
    flex: 1 !important;
}

.wm-cal-clear-btn[b-ytqstzymbp] {
    background-color: #F1F5F9 !important;
    color: var(--gray-txt) !important;
}

    .wm-cal-clear-btn:hover[b-ytqstzymbp] {
        background-color: #E2E8F0 !important;
    }

.wm-cal-today-btn[b-ytqstzymbp] {
    background-color: var(--purple) !important;
    color: var(--white) !important;
    border-color: transparent !important;
}

    .wm-cal-today-btn:hover[b-ytqstzymbp] {
        opacity: 0.88 !important;
    }
/* /Components/Shared/WMColorPicker.razor.rz.scp.css */
.wm-colour-picker[b-hgiywubdnv] {
  position: relative !important;
}

.wm-cp-btn[b-hgiywubdnv] {
  width: 100% !important;
  height: 40px !important;
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 0px 12px !important;
  background-color: #ffffff !important;
  border: 1px solid #1e293b1f !important;
  border-radius: 10px !important;
  flex-shrink: 0 !important;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05) !important;
  transition: all 0.2s ease-in-out !important;
  outline: none !important;
}

.wm-cp-btn:hover:not(:disabled)[b-hgiywubdnv] {
  border-color: #eaecff !important;
  background-color: #f8f9fa !important;
}

.wm-cp-btn:focus[b-hgiywubdnv],
.wm-cp-btn:focus-within[b-hgiywubdnv] {
  box-shadow: 0 0 0 0.2rem #dce0ff !important;
}

.wm-cp-btn:disabled[b-hgiywubdnv] {
  background: transparent !important;
  box-shadow: initial !important;
  cursor: not-allowed !important;
}

.wm-cp-swatch-preview[b-hgiywubdnv] {
  width: 24px !important;
  height: 24px !important;
  border-radius: 8px !important;
  border: none;
  flex-shrink: 0 !important;
}

.wm-cp-popover[b-hgiywubdnv] {
  padding: 16px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 0 !important;
}

.wm-cp-grid[b-hgiywubdnv] {
  display: grid !important;
  grid-template-columns: repeat(6, 26px) !important;
  gap: 8px !important;
}

.wm-cp-swatch[b-hgiywubdnv] {
  width: 26px !important;
  height: 26px !important;
  border-radius: 8px !important;
  border: none !important;
  cursor: pointer !important;
  transition: transform 0.1s !important;
}

.wm-cp-swatch:hover[b-hgiywubdnv] {
  transform: scale(1.25) !important;
}

.wm-cp-swatch.selected[b-hgiywubdnv] {
  transform: scale(1.25) !important;
}

.wm-cp-custom-row[b-hgiywubdnv] {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  margin-top: 10px !important;
  padding-top: 10px !important;
  border-top: 1px solid #f1f5f9 !important;
}

.wm-cp-custom-label[b-hgiywubdnv] {
  font-size: 13px !important;
  font-weight: 600 !important;
  color: var(--gray-txt-2, #5F6E85) !important;
}

.wm-cp-custom-input[b-hgiywubdnv] {
  width: 26px !important;
  height: 26px !important;
  border-radius: 8px !important;
  border: none !important;
  cursor: pointer !important;
  -webkit-appearance: none !important;
  appearance: none !important;
  background: none !important;
  padding: 0 !important;
  box-shadow: initial !important;
  outline: initial !important;
}

.wm-cp-custom-input:focus[b-hgiywubdnv],
.wm-cp-custom-input:focus-within[b-hgiywubdnv],
.wm-cp-custom-input:active[b-hgiywubdnv] {
  box-shadow: 0 0 0 0.2rem #dce0ff !important;
}

.wm-cp-custom-input[b-hgiywubdnv]::-webkit-color-swatch-wrapper {
  padding: 0 !important;
}

.wm-cp-custom-input[b-hgiywubdnv]::-webkit-color-swatch {
  border: none !important;
  border-radius: 4px !important;
}
/* /Components/Shared/WMCombobox.razor.rz.scp.css */
/* The field and list mirror WMDropdown.razor.css so the two pickers match. Scoped CSS does not
   cross components, so the shared rules are repeated here rather than inherited. */
.custom-select-button[b-9fzqilovzo] {
  width: 100% !important;
  height: 40px !important;
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 0 12px !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  color: #212529 !important;
  background-color: #ffffff !important;
  border: 1px solid #1E293B1F !important;
  border-radius: 10px !important;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05) !important;
  transition: all 0.2s ease-in-out !important;
  outline: none !important;
}

.wm-combobox-field[b-9fzqilovzo] {
  cursor: text !important;
}

.wm-combobox-field:hover:not(.disabled)[b-9fzqilovzo] {
  border-color: #eaecff !important;
}

.wm-combobox-field:focus-within[b-9fzqilovzo] {
  box-shadow: 0 0 0 0.2rem #dce0ff !important;
}

.wm-combobox-field.invalid[b-9fzqilovzo] {
  box-shadow: 0 0 0 0.2rem #f0d1d1 !important;
}

.wm-combobox-field.disabled[b-9fzqilovzo] {
  background: transparent !important;
  box-shadow: initial !important;
  cursor: not-allowed !important;
}

/* The !importants are self-defense: hosts routinely style their popup's inputs with a
   generic "::deep .body input { border, height, radius }" rule, which outranks a plain
   scoped class here and draws a second bordered input inside the field shell (seen on
   the offer's choose-customer popup, 2026-09-02). This inner input is chrome of the
   component, never the host's form field, so it always stays borderless. */
.wm-combobox-input[b-9fzqilovzo] {
  flex: 1 1 auto;
  min-width: 0;
  border: none !important;
  outline: none !important;
  background: transparent !important;
  font-size: 14px;
  font-weight: 600;
  color: #212529;
  padding: 0 !important;
  height: 100% !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

.wm-combobox-input[b-9fzqilovzo]::placeholder {
  color: #5F6E85;
  font-weight: 600;
}

.wm-combobox-input:disabled[b-9fzqilovzo] {
  cursor: not-allowed;
}

.wm-combobox-clear[b-9fzqilovzo] {
  display: inline-flex;
  align-items: center;
  padding: 4px;
  cursor: pointer;
  flex: 0 0 auto;
}

.custom-dropdown-list[b-9fzqilovzo] {
  max-height: min(250px, 25vh) !important;
  overflow-y: auto !important;
  scrollbar-width: thin !important;
  padding: 4px !important;
}

.dropdown-list-item[b-9fzqilovzo] {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  gap: 10px !important;
  width: 100% !important;
  padding: 10px 10px !important;
  border: none !important;
  background: transparent !important;
  border-radius: 10px !important;
  transition: background-color 0.2s ease !important;
  text-align: left !important;
  margin-bottom: 3px !important;
}

.dropdown-list-item:hover[b-9fzqilovzo] {
  background-color: #eaecff !important;
  cursor: pointer !important;
}

.dropdown-list-item:active[b-9fzqilovzo] {
  background-color: #dce0ff !important;
}

.dropdown-list-item.active-item[b-9fzqilovzo] {
  background-color: #eaecff !important;
}

.item-name[b-9fzqilovzo] {
  font-weight: 600 !important;
  color: #2d3748 !important;
  font-size: 13px !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

.item-metadata[b-9fzqilovzo] {
  text-align: right !important;
  color: #718096 !important;
  font-size: 12px !important;
  max-width: 200px !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  margin-left: 1rem !important;
}
/* /Components/Shared/WMCountryDropdown.razor.rz.scp.css */
.custom-select-button[b-763batjoob] {
  width: 100% !important;
  height: 40px !important;
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 0 12px !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  color: #212529 !important;
  background-color: #ffffff !important;
  border: 1px solid #1E293B1F !important;
  border-radius: 10px !important;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05) !important;
  transition: all 0.2s ease-in-out !important;
  outline: none !important;
}

.custom-select-button:hover:not(:disabled)[b-763batjoob] {
  border-color: #eaecff !important;
  background-color: #f8f9fa !important;
}

.custom-select-button:focus[b-763batjoob] {
  box-shadow: 0 0 0 0.2rem #dce0ff !important;
}

.custom-select-button:disabled[b-763batjoob] {
  background: transparent !important;
  box-shadow: initial !important;
  cursor: not-allowed !important;
}

.custom-select-button.invalid[b-763batjoob] {
  box-shadow: 0 0 0 0.2rem #F0D1D1 !important;
}

.custom-select-button-label[b-763batjoob] {
  max-width: 90% !important;
}

.custom-select-button-text[b-763batjoob] {
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  text-align: start !important;
}

.search-input-box[b-763batjoob] {
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05) !important;
}

.search-input-box:focus-within[b-763batjoob] {
  box-shadow: 0 0 0 0.2rem #dce0ff !important;
}

.search-input-box input[b-763batjoob]::placeholder {
  color: #5F6E85 !important;
}

.custom-dropdown-list[b-763batjoob] {
  max-height: min(250px, 25vh) !important;
  overflow-y: auto !important;
  scrollbar-width: thin !important;
  padding: 4px !important;
}

.dropdown-list-item[b-763batjoob] {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  gap: 10px !important;
  width: 100% !important;
  padding: 10px 10px !important;
  border: none !important;
  background: transparent !important;
  border-radius: 10px !important;
  transition: background-color 0.2s ease !important;
  text-align: left !important;
  margin-bottom: 3px !important;
}

.dropdown-list-item:hover[b-763batjoob] {
  background-color: #eaecff !important;
  cursor: pointer !important;
}

.dropdown-list-item:active[b-763batjoob] {
  background-color: #dce0ff !important;
}

.dropdown-list-item.active-item[b-763batjoob] {
  background-color: #eaecff !important;
  /* border-left: 4px solid #6366f1 !important; */
  /* padding-left: 6px !important; */
}

.item-name[b-763batjoob] {
  font-weight: 600 !important;
  color: #2d3748 !important;
  font-size: 13px !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

.item-metadata[b-763batjoob] {
  text-align: right !important;
  color: #718096 !important;
  font-size: 12px !important;
  max-width: 200px !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  margin-left: 1rem !important;
}
/* /Components/Shared/WMDateRangePicker.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   WMDateRangePicker — Scoped Component Styles
   ═══════════════════════════════════════════════════════ */

/* ── Root ── */
.wm-drp-container[b-68v4le7ry2] {
    position: relative;
    display: inline-block;
    width: 100%;
    /* Size to the control's own content. Stretching to the host row made the picker
       taller than the buttons beside it in list toolbars. */
    height: auto;
}

/* ── Trigger ── */
.wm-drp-trigger[b-68v4le7ry2] {
    display: flex;
    /* Wrap the preset above the range in hosts too narrow for one row (filter popups,
       side sliders) so the date text is never truncated. No effect where there is room. */
    flex-wrap: wrap;
    align-items: center;
    width: 100%;
    height: auto;
    min-height: 32px;
    background-color: #ffffff;
    border: 1px solid #1E293B1F;
    border-radius: 10px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
    transition: all 0.2s ease-in-out;
    overflow: visible;
}

    .wm-drp-trigger:hover:not(.disabled)[b-68v4le7ry2] {
        border-color: #eaecff !important;
    }

    .wm-drp-trigger:focus-within[b-68v4le7ry2] {
        box-shadow: 0 0 0 0.2rem #dce0ff !important;
    }

    .wm-drp-trigger.disabled[b-68v4le7ry2] {
        background: transparent;
        box-shadow: initial;
        cursor: not-allowed;
    }

.wm-drp-trigger-preset[b-68v4le7ry2] {
    /* Fill the leftover space on its row. Safe because the range button below carries
       min-width: max-content, so the preset can never squeeze the date into an ellipsis. */
    flex: 1 1 auto;
    position: relative;
    height: 30px;
    overflow: visible;
    flex-shrink: 0;
}

.wm-drp-trigger.no-presets[b-68v4le7ry2] {
    overflow: hidden;
}

.wm-drp-trigger.no-presets .wm-drp-trigger-range[b-68v4le7ry2] {
    border-radius: 10px;
}

    .wm-drp-trigger-preset[b-68v4le7ry2]  .dropdown {
        height: 30px !important;
        overflow: visible !important;
    }

        .wm-drp-trigger-preset[b-68v4le7ry2]  .dropdown.show {
            overflow: visible !important;
        }

        .wm-drp-trigger-preset[b-68v4le7ry2]  .dropdown:has(> .wm-drp-preset-dropdown-btn) {
            /* Fill the preset's slot rather than shrink-wrapping, so the dropdown
               (and its hover state) spans the same width as the date field below. */
            width: 100% !important;
        }

    .wm-drp-trigger-preset[b-68v4le7ry2]  .wm-drp-preset-dropdown-btn.custom-select-button {
        border: none !important;
        border-radius: 10px 0 0 10px !important;
        box-shadow: none !important;
        background-color: transparent !important;
        height: 30px !important;
        font-size: 12px !important;
        /* Fill the preset's slot so the dropdown lines up with the date field
           (and spans the full row when the trigger wraps in narrow hosts). */
        width: 100% !important;
        min-width: 120px;
        white-space: nowrap;
        outline: none !important;
        transition: none !important;
    }

    .wm-drp-trigger-preset[b-68v4le7ry2]  .wm-drp-preset-dropdown-btn.custom-select-button:focus {
        box-shadow: none !important;
    }

/* ── Trigger Divider ── */
.wm-drp-trigger-divider[b-68v4le7ry2] {
    width: 1px;
    align-self: stretch;
    background-color: #1E293B1F;
    flex-shrink: 0;
}

/* ── Trigger — Date Range Right Part ── */
.wm-drp-trigger-range[b-68v4le7ry2] {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 0 12px;
    height: 30px;
    flex: 1;
    cursor: pointer;
    border-radius: 0 10px 10px 0;
    min-width: max-content;
    transition: background-color 0.15s;
    background: none;
    border: none;
}

    .wm-drp-trigger-range:hover[b-68v4le7ry2] {
        background-color: #f8f9fa;
    }

    .wm-drp-trigger-range:disabled[b-68v4le7ry2] {
        background: transparent !important;
        cursor: not-allowed !important;
    }

.wm-drp-icon[b-68v4le7ry2] {
    height: 16px;
    width: 16px;
    flex-shrink: 0;
}

.wm-drp-trigger-range-text[b-68v4le7ry2] {
    font-size: 12px;
    font-weight: 600;
    color: #212529;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.wm-drp-placeholder[b-68v4le7ry2] {
    color: #5F6E85;
}

/* ── Preset Dropdown List (from trigger) ── */
.wm-drp-preset-list[b-68v4le7ry2] {
    position: absolute;
    top: calc(100% + 6px);
    left: 0;
    background: var(--white);
    border: 1px solid #1E293B17;
    border-radius: 16px;
    padding: 6px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
    z-index: 99999;
    min-width: 150px;
}

.wm-drp-preset-item[b-68v4le7ry2] {
    display: flex;
    align-items: center;
    width: 100%;
    padding: 8px 12px;
    border: none;
    background: transparent;
    border-radius: 10px;
    font-size: 13px;
    font-weight: 500;
    color: var(--gray-txt);
    cursor: pointer;
    text-align: left;
    transition: background-color 0.15s, color 0.15s;
    white-space: nowrap;
}

    .wm-drp-preset-item:hover[b-68v4le7ry2] {
        background-color: #eaecff;
        color: var(--dark-txt);
    }

    .wm-drp-preset-item.active[b-68v4le7ry2] {
        background-color: #eaecff;
        color: var(--purple);
        font-weight: 600;
    }

/* ── Calendar Popup ── */
.wm-drp-popup[b-68v4le7ry2] {
    z-index: 9999;
    background: var(--white);
    border: 1px solid #1E293B17;
    border-radius: 20px;
    padding: 12px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.15);
    width: 832px;
    min-width: 832px;
}

.wm-drp-popup.no-presets[b-68v4le7ry2] {
    width: 624px;
    min-width: min(624px, calc(100vw - 24px));
}

/* ── Popup Inner ── */
.wm-drp-popup-inner[b-68v4le7ry2] {
    display: flex;
    gap: 16px;
    margin-bottom: 16px;
}

.wm-drp-popup-inner.no-presets[b-68v4le7ry2] {
    gap: 0;
}

/* ── Sidebar (inside popup) ── */
.wm-drp-sidebar[b-68v4le7ry2] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    width: 208px;
    min-width: 208px;
    max-width: 208px;
    padding-top: 4px;
    flex-shrink: 0;
}

.wm-drp-preset-btn[b-68v4le7ry2] {
    display: flex;
    align-items: center;
    width: 100%;
    padding: 8px 12px;
    border: none;
    background: transparent;
    border-radius: 10px;
    font-size: 12px;
    font-weight: 600;
    color: var(--gray-txt);
    cursor: pointer;
    text-align: left;
    transition: background-color 0.15s, color 0.15s;
    white-space: nowrap;
}

    .wm-drp-preset-btn:hover[b-68v4le7ry2] {
        background-color: #eaecff;
        color: var(--dark-txt);
    }

    .wm-drp-preset-btn.active[b-68v4le7ry2] {
        background-color: #eaecff;
        color: var(--purple);
        font-weight: 600;
    }

/* ── Calendars ── */
.wm-drp-calendars[b-68v4le7ry2] {
    flex: 1;
    min-width: 0;
}

/* ── Unified Header ── */
.wm-drp-cal-header-unified[b-68v4le7ry2] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    border: 1px solid #1E293B17;
    border-radius: 12px;
    padding: 4px;
    margin-bottom: 12px;
    background: linear-gradient(180deg, #F8FAFC 0%, #FFFFFF 100%);
}

.wm-drp-cal-header-labels[b-68v4le7ry2] {
    display: flex;
    align-items: center;
    justify-content: space-around;
    gap: 24px;
    flex: 1;
}

/* ── Dual Grids ── */
.wm-drp-cal-grids[b-68v4le7ry2] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}

.wm-drp-cal-grid[b-68v4le7ry2] {
    min-width: 0;
}

/* ── Date cells ── */
.wm-drp-dates[b-68v4le7ry2] {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 1px;
}

.wm-drp-cell[b-68v4le7ry2] {
    position: relative;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    font-size: 13px;
    font-weight: 600;
    color: var(--gray-txt);
    user-select: none;
}

.wm-drp-cell-inner[b-68v4le7ry2] {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    border-radius: 8px;
    transition: background-color 0.1s, color 0.1s;
}

.wm-drp-cell:hover:not(.other):not(.disabled):not(.range-start):not(.range-end) .wm-drp-cell-inner[b-68v4le7ry2] {
    background-color: #eaecff;
    color: var(--dark-txt);
}

.wm-drp-cell.range-start .wm-drp-cell-inner[b-68v4le7ry2] {
    background-color: var(--purple);
    color: var(--white);
}

.wm-drp-cell.range-end .wm-drp-cell-inner[b-68v4le7ry2] {
    background-color: var(--purple);
    color: var(--white);
}

.wm-drp-cell.in-range[b-68v4le7ry2] {
    background-color: #eaecff;
}

.wm-drp-cell.in-range .wm-drp-cell-inner[b-68v4le7ry2] {
    color: var(--purple);
    background: transparent;
}

.wm-drp-cell.range-start[b-68v4le7ry2] {
    background: linear-gradient(to right, transparent 50%, #eaecff 50%);
}

.wm-drp-cell.range-end[b-68v4le7ry2] {
    background: linear-gradient(to left, transparent 50%, #eaecff 50%);
}

.wm-drp-cell.range-start.range-end[b-68v4le7ry2] {
    background: transparent;
}

.wm-drp-cell.today .wm-drp-cell-inner[b-68v4le7ry2] {
    color: var(--purple);
    font-weight: 800;
    border: 1.5px solid var(--purple);
}

.wm-drp-cell.other[b-68v4le7ry2] {
    color: #C8D5E1;
    pointer-events: none;
}

.wm-drp-cell.other.in-range[b-68v4le7ry2],
.wm-drp-cell.other.range-start[b-68v4le7ry2],
.wm-drp-cell.other.range-end[b-68v4le7ry2] {
    background: transparent;
}

.wm-drp-cell.disabled[b-68v4le7ry2] {
    color: #CBD5E1;
    pointer-events: none;
    opacity: 0.5;
}

/* ── Month/Year Grid (reused from WMCalendar) ── */
.wm-cal-month-grid[b-68v4le7ry2] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 6px;
    padding: 4px 0;
}

.wm-cal-month-cell[b-68v4le7ry2] {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 40px;
    border-radius: 10px;
    font-size: 13px;
    font-weight: 600;
    color: var(--gray-txt);
    cursor: pointer;
    transition: background-color 0.12s, color 0.12s;
    user-select: none;
}

    .wm-cal-month-cell:hover:not(.disabled):not(.selected)[b-68v4le7ry2] {
        background-color: #eaecff;
    }

    .wm-cal-month-cell.selected[b-68v4le7ry2] {
        color: var(--white);
        background: linear-gradient(var(--purple), var(--purple)) padding-box, linear-gradient(90deg, #1E293B17, #1E293B2E) border-box;
        /* border: 1px solid transparent; */
        border: none;
        backdrop-filter: blur(24px);
        box-shadow: 0px 1px 1px -0.5px #1E293B08, 0px 3px 3px 0px #FFFFFF1F inset;
    }

    .wm-cal-month-cell.today[b-68v4le7ry2] {
        color: var(--purple);
        font-weight: 800;
        border: 1.5px solid var(--purple);
    }

    .wm-cal-month-cell.disabled[b-68v4le7ry2] {
        color: #CBD5E1;
        pointer-events: none;
        opacity: 0.5;
    }

/* ── Footer ── */
.wm-drp-footer[b-68v4le7ry2] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-top: 12px;
    border-top: 1px solid #1E293B0F;
    gap: 12px;
    margin-top: 0;
}

.wm-drp-footer-dates[b-68v4le7ry2] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.wm-drp-footer-date-box[b-68v4le7ry2] {
    display: flex;
    align-items: center;
    height: 30px;
    padding: 0 14px;
    border: 1px solid #1E293B1F;
    border-radius: 10px;
    font-size: 13px;
    font-weight: 600;
    color: var(--dark-txt);
    white-space: nowrap;
    min-width: 120px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
}

.wm-drp-footer-separator[b-68v4le7ry2] {
    font-size: 13px;
    font-weight: 600;
    color: var(--gray-txt-2);
}

.wm-drp-footer-actions[b-68v4le7ry2] {
    display: flex;
    align-items: center;
    gap: 8px;
}

/* ── Nav buttons (shared with WMCalendar) ── */
.wm-cal-nav-btn[b-68v4le7ry2] {
    height: 30px;
    width: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--white);
    border: 1px solid #1E293B17;
    border-radius: 8px;
    cursor: pointer;
    transition: background-color 0.15s;
    flex-shrink: 0;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
}

    .wm-cal-nav-btn:hover[b-68v4le7ry2] {
        background-color: #F1F5F9;
    }

    .wm-cal-nav-btn img[b-68v4le7ry2] {
        height: 14px;
    }

.wm-cal-month-year-btn[b-68v4le7ry2] {
    display: flex;
    align-items: center;
    gap: 4px;
    background: none;
    border: none;
    cursor: pointer;
    padding: 4px 8px;
    border-radius: 8px;
    transition: background-color 0.15s;
}

    .wm-cal-month-year-btn:hover[b-68v4le7ry2] {
        background-color: #F1F5F9;
    }

.wm-cal-month[b-68v4le7ry2] {
    font-size: 13px;
    font-weight: 700;
    line-height: 20px;
    letter-spacing: -0.2px;
    color: var(--gray-txt);
}

.wm-cal-year[b-68v4le7ry2] {
    font-size: 13px;
    font-weight: 600;
    line-height: 20px;
    letter-spacing: -0.2px;
    color: var(--gray-txt-2);
}

.wm-cal-dow-row[b-68v4le7ry2] {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    text-align: center;
    font-size: 10px;
    font-weight: 600;
    line-height: 16px;
    letter-spacing: -0.2px;
    color: var(--gray-txt-2);
    margin-bottom: 4px;
}

.wm-cal-dow[b-68v4le7ry2] {
    padding: 4px 0;
    text-align: center;
}

/* ── Selected cell style — Today button + Range Start/End ── */
.wm-drp-cell.range-start .wm-drp-cell-inner[b-68v4le7ry2],
.wm-drp-cell.range-end .wm-drp-cell-inner[b-68v4le7ry2] {
    background: linear-gradient(var(--purple), var(--purple)) padding-box, linear-gradient(90deg, #1E293B17, #1E293B2E) border-box;
    /* border: 1px solid transparent; */
    border: none;
    backdrop-filter: blur(24px);
    box-shadow: 0px 1px 1px -0.5px #1E293B08, 0px 3px 3px 0px #FFFFFF1F inset;
    color: var(--white);
    z-index: 1;
}

/* ── WMCalendar selected cell ── */
.wm-cal-cell.selected[b-68v4le7ry2] {
    background: linear-gradient(var(--purple), var(--purple)) padding-box, linear-gradient(90deg, #1E293B17, #1E293B2E) border-box;
    /* border: 1px solid transparent; */
    border: none;
    backdrop-filter: blur(24px);
    box-shadow: 0px 1px 1px -0.5px #1E293B08, 0px 3px 3px 0px #FFFFFF1F inset;
    color: var(--white) !important;
}
/* /Components/Shared/WMDrawingSwatch.razor.rz.scp.css */
.wm-swatch[b-32mmqyp88v] {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	color: #fff;
	font-size: 8px;
	line-height: 1;
}

/* An area, as the map draws it: translucent fill, a touch-darker edge. Square — a landscape
   rectangle reads as a picture frame, and next to a round pin and a diagonal line the shape
   that carries the meaning is "filled region", not "wider than tall". */
.wm-swatch-area[b-32mmqyp88v] {
	width: 13px;
	height: 13px;
	border-radius: 3px;
	border: 1.5px solid;
}

/* A pin is a point, and a point is smaller than a swatch. It still has to hold a glyph when
   the tool has one, which is what stops it shrinking any further. */
.wm-swatch-pin[b-32mmqyp88v] {
	width: 12px;
	height: 12px;
	border-radius: 50%;
}

/* The line needs the room its diagonal takes, and no background of its own. */
.wm-swatch-line[b-32mmqyp88v],
.wm-swatch-diag[b-32mmqyp88v] {
	width: 16px;
	height: 16px;
}

.wm-swatch-dot[b-32mmqyp88v] {
	width: 14px;
	height: 14px;
	border-radius: 50%;
}
/* /Components/Shared/WMDropdown.razor.rz.scp.css */
.custom-select-button[b-fgrifhexgu] {
  width: 100% !important;
  height: 40px !important;
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 0 12px !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  color: #212529 !important;
  background-color: #ffffff !important;
  border: 1px solid #1E293B1F !important;
  border-radius: 10px !important;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05) !important;
  transition: all 0.2s ease-in-out !important;
  outline: none !important;
}

.custom-select-button:hover:not(:disabled)[b-fgrifhexgu] {
  border-color: #eaecff !important;
  background-color: #f8f9fa !important;
}

.custom-select-button:focus[b-fgrifhexgu] {
  box-shadow: 0 0 0 0.2rem #dce0ff !important;
}

.custom-select-button:disabled[b-fgrifhexgu] {
  background: transparent !important;
  box-shadow: initial !important;
  cursor: not-allowed !important;
}

.custom-select-button.invalid[b-fgrifhexgu] {
  box-shadow: 0 0 0 0.2rem #f0d1d1 !important;
}

.custom-select-button-label[b-fgrifhexgu] {
  max-width: 90% !important;
}

.custom-select-button-text[b-fgrifhexgu] {
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  text-align: start !important;
}

.search-input-box[b-fgrifhexgu] {
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05) !important;
}

.search-input-box:focus-within[b-fgrifhexgu] {
  box-shadow: 0 0 0 0.2rem #dce0ff !important;
}

.search-input-box input[b-fgrifhexgu]::placeholder {
  color: #5F6E85 !important;
}

.custom-dropdown-list[b-fgrifhexgu] {
  max-height: min(250px, 25vh) !important;
  overflow-y: auto !important;
  scrollbar-width: thin !important;
  padding: 4px !important;
}

.dropdown-list-item[b-fgrifhexgu] {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  gap: 10px !important;
  width: 100% !important;
  padding: 10px 10px !important;
  border: none !important;
  background: transparent !important;
  border-radius: 10px !important;
  transition: background-color 0.2s ease !important;
  text-align: left !important;
  margin-bottom: 3px !important;
}

.dropdown-list-item:hover[b-fgrifhexgu] {
  background-color: #eaecff !important;
  cursor: pointer !important;
}

.dropdown-list-item:active[b-fgrifhexgu] {
  background-color: #dce0ff !important;
}

.dropdown-list-item.active-item[b-fgrifhexgu] {
  background-color: #eaecff !important;
  /* border-left: 4px solid #6366f1 !important; */
  /* padding-left: 6px !important; */
}

.item-name[b-fgrifhexgu] {
  font-weight: 600 !important;
  color: #2d3748 !important;
  font-size: 13px !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

.item-count-badge[b-fgrifhexgu] {
  display: inline-flex !important;
  justify-content: center !important;
  align-items: center !important;
  min-width: 20px !important;
  height: 20px !important;
  padding: 0 6px !important;
  border-radius: 10px !important;
  background-color: var(--purple) !important;
  color: #ffffff !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  margin-left: 1rem !important;
}

.item-count-badge-empty[b-fgrifhexgu] {
  background-color: #ADB5BD !important;
}

.item-metadata[b-fgrifhexgu] {
  text-align: right !important;
  color: #718096 !important;
  font-size: 12px !important;
  max-width: 200px !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  margin-left: 1rem !important;
}
/* /Components/Shared/WMEnvironmentBar.razor.rz.scp.css */
/* Slim, loud and on top of everything: sidebar 1050, Bootstrap modals 1055, full-screen map and
   editor shells up to 2000, the toast container 999999. It catches no clicks, so where a browser
   without :has() leaves the page under it, what it overlaps still works. */
.wm-environment-bar[b-az7vsouiyt] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1000001;
    height: 22px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 0 12px;
    overflow: hidden;
    white-space: nowrap;
    font-size: 12px;
    line-height: 22px;
    letter-spacing: 0.02em;
    pointer-events: none;
    user-select: none;
}

.wm-environment-bar--test[b-az7vsouiyt] {
    background: repeating-linear-gradient(135deg, #f59e0b 0 14px, #fbbf24 14px 28px);
    color: #111827;
}

.wm-environment-bar--local[b-az7vsouiyt] {
    background: #4c1d95;
    color: #ffffff;
}

.wm-environment-bar-label[b-az7vsouiyt] {
    font-weight: 800;
    letter-spacing: 0.12em;
}

.wm-environment-bar-message[b-az7vsouiyt] {
    font-weight: 600;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* A phone has room for the word, not the sentence. */
@media (max-width: 480px) {
    .wm-environment-bar-message[b-az7vsouiyt] {
        display: none;
    }
}

@media print {
    .wm-environment-bar[b-az7vsouiyt] {
        display: none;
    }
}
/* /Components/Shared/WMErrorBoundary.razor.rz.scp.css */
/* The panel that replaces a page whose render threw. It sits inside <main>, with the sidebar
   still beside it, so it is centred in the space the page would have had rather than pinned to
   the top-left corner of it — and the text is inside a card with a width, because an unbounded
   <h3> in this slot runs the full width of the content area. */

.wm-error-boundary[b-cfwonr625r] {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 60vh;
    padding: 32px 16px;
}

.wm-error-boundary-card[b-cfwonr625r] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    width: 100%;
    max-width: 420px;
    padding: 32px 24px;
    text-align: center;
    background: var(--wm-card-bg, #ffffff);
    border: 1px solid rgba(223, 41, 23, .18);
    border-radius: var(--wm-card-radius, 20px);
    box-shadow: var(--wm-card-shadow, 0 20px 20px -12px rgba(30, 41, 59, .18));
}

.wm-error-boundary-icon[b-cfwonr625r] {
    display: flex;
    margin-bottom: 4px;
    color: var(--danger, #B82213);
}

.wm-error-boundary-card h3[b-cfwonr625r] {
    margin: 0;
    font-size: 18px;
    font-weight: 600;
    color: var(--dark-txt, #1E293B);
}

.wm-error-boundary-card p[b-cfwonr625r] {
    margin: 0;
    font-size: 14px;
    line-height: 1.5;
    color: var(--gray-txt, #475569);
}

.wm-error-boundary-actions[b-cfwonr625r] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 8px;
    margin-top: 16px;
}

.wm-error-boundary-actions .btn[b-cfwonr625r] {
    border-radius: 999px;
    padding: 8px 20px;
    font-size: 14px;
}

.wm-error-boundary-actions .btn-link[b-cfwonr625r] {
    color: var(--gray-txt, #475569);
    text-decoration: none;
}

    .wm-error-boundary-actions .btn-link:hover[b-cfwonr625r],
    .wm-error-boundary-actions .btn-link:focus-visible[b-cfwonr625r] {
        color: var(--dark-txt, #1E293B);
        text-decoration: underline;
    }
/* /Components/Shared/WMErrorPanel.razor.rz.scp.css */
.wm-error-panel[b-a8dqgr3yti] {
	display: flex;
	flex-direction: column;
	width: 100%;
}

.wm-error-panel--active[b-a8dqgr3yti] {
	position: relative;
	z-index: 1205 !important;
}
/* /Components/Shared/WMErrorRow.razor.rz.scp.css */
/* ── Row wrapper ─────────────────────────────────────────────────── */
.wm-error-row[b-y711zmtkb9] {
	width: 100%;
}

/* Raise trigger row above the backdrop while overlay is open */
.wm-error-row--overlay-active[b-y711zmtkb9] {
	position: relative;
	z-index: 1202;
}

/* ── Header (trigger) row ────────────────────────────────────────── */
/* padding-left / padding-right / min-height / font-size / font-weight
   are all set via inline style from the Blazor parameters.           */
.wm-error-row-header[b-y711zmtkb9] {
	display: flex;
	align-items: center;
	gap: 10px;
	width: 100%;
	box-sizing: border-box;
	background-color: #ED40301F;
	color: #B82213;
	padding-top: 12px;
	padding-bottom: 12px;
	cursor: default;
	user-select: none;
}

/* Bottom separator shown only when a MakeSpace row is expanded */
.wm-error-row-header--expanded[b-y711zmtkb9] {
	border-bottom: 1px solid #ED403033;
}

/* ── Icon ────────────────────────────────────────────────────────── */
.wm-error-icon[b-y711zmtkb9] {
	width: 20px;
	height: 20px;
	flex-shrink: 0;
}

/* ── Label text ──────────────────────────────────────────────────── */
.wm-error-text[b-y711zmtkb9] {
	flex: 1;
	color: #B82213;
	line-height: 20px;
	letter-spacing: -0.2px;
}

	.wm-error-text strong[b-y711zmtkb9],
	.wm-error-text b[b-y711zmtkb9] {
		font-weight: 700;
		color: inherit;
	}

/* ── Action button ───────────────────────────────────────────────── */
.wm-error-action-btn[b-y711zmtkb9] {
	flex-shrink: 0;
	white-space: nowrap;
	padding: 8px 12px !important;
	border-radius: 8px !important;
	font-size: 12px !important;
	font-weight: 600 !important;
	border: 1px solid #1E293B17 !important;
}

/* ── Chevron button ──────────────────────────────────────────────── */
.wm-error-chevron[b-y711zmtkb9] {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	background: none;
	border: none;
	padding: 4px;
	cursor: pointer;
}

	.wm-error-chevron img[b-y711zmtkb9] {
		width: 16px;
		height: 16px;
		transition: transform 0.2s ease;
		filter: brightness(0) saturate(100%) invert(24%) sepia(87%) saturate(6669%) hue-rotate(357deg) brightness(94%) contrast(92%);
	}

.wm-error-chevron--open img[b-y711zmtkb9] {
	transform: rotate(180deg);
}

.wm-error-chevron--hidden[b-y711zmtkb9] {
	visibility: hidden;
	pointer-events: none;
	width: 24px;
}

/* ── MakeSpace: expanded child rows ─────────────────────────────── */
/* Children render in normal document flow.
   Each child header is transparent — the container carries the bg.  */
.wm-error-children[b-y711zmtkb9] {
	width: 100%;
	border-bottom: 1px solid #ED403033;
}


/* ── BlurOverlay: floating child panel ───────────────────────────── */
/* Position / size set by wmErrorOverlay JS (FloatingUI).
   z-index 1201: above backdrop (1200) and Bootstrap modal (1055),
   below the trigger row (1202).                                      */
.wm-error-children--overlay[b-y711zmtkb9] {
	position: fixed !important;
	z-index: 1201 !important;
	background-color: rgba(237, 64, 48, 0.12);
	backdrop-filter: blur(22px);
	-webkit-backdrop-filter: blur(22px);
	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
}

	.wm-error-children--overlay .wm-error-row-header[b-y711zmtkb9] {
		background-color: transparent;
	}

/* ── Backdrop (BlurOverlay mode only) ───────────────────────────── */
.wm-error-backdrop[b-y711zmtkb9] {
	position: fixed;
	inset: 0;
	z-index: 1200;
	background-color: rgba(15, 23, 42, 0.25);
	backdrop-filter: blur(2px);
	-webkit-backdrop-filter: blur(2px);
	pointer-events: none;
}
/* /Components/Shared/WMGoogleGeoLocationSearchBox.razor.rz.scp.css */
.custom-select-button[b-47t9gdihi1] {
  width: 100% !important;
  height: 40px !important;
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 0 12px !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  color: #212529 !important;
  background-color: #ffffff !important;
  border: 1px solid #1E293B1F !important;
  border-radius: 10px !important;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05) !important;
  transition: all 0.2s ease-in-out !important;
  outline: none !important;
}

.custom-select-button:hover:not(:disabled)[b-47t9gdihi1] {
  border-color: #eaecff !important;
  background-color: #f8f9fa !important;
}

.custom-select-button:focus[b-47t9gdihi1] {
  box-shadow: 0 0 0 0.2rem #dce0ff !important;
}

.custom-select-button:disabled[b-47t9gdihi1] {
  background: transparent !important;
  box-shadow: initial !important;
  cursor: not-allowed !important;
}

.custom-select-button.invalid[b-47t9gdihi1] {
  box-shadow: 0 0 0 0.2rem #F0D1D1 !important;
}

.custom-select-button-label[b-47t9gdihi1] {
  max-width: 90% !important;
}

.custom-select-button-text[b-47t9gdihi1] {
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  text-align: start !important;
}

.search-input-box[b-47t9gdihi1] {
  border: 1px solid #1E293B1F !important;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05) !important;
}

.search-input-box:focus[b-47t9gdihi1],
.search-input-box:focus-within[b-47t9gdihi1] {
  box-shadow: 0 0 0 0.2rem #dce0ff !important;
}

.search-input-box input[b-47t9gdihi1]::placeholder {
  color: #5F6E85 !important;
}

.search-input-box.disabled[b-47t9gdihi1] {
  background: transparent !important;
  box-shadow: initial !important;
  cursor: not-allowed !important;
}

.search-input:disabled[b-47t9gdihi1] {
  background: transparent !important;
  box-shadow: initial !important;
  cursor: not-allowed !important;
}

.custom-dropdown-list[b-47t9gdihi1] {
  max-height: min(250px, 25vh) !important;
  /* max-width: 500px !important; */
  overflow-y: auto !important;
  scrollbar-width: thin !important;
  padding: 4px !important;
}

.dropdown-list-item[b-47t9gdihi1] {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  gap: 10px !important;
  width: 100% !important;
  padding: 10px 10px !important;
  border: none !important;
  background: transparent !important;
  border-radius: 10px !important;
  transition: background-color 0.2s ease !important;
  text-align: left !important;
  margin-bottom: 3px !important;
}

.dropdown-list-item:hover[b-47t9gdihi1] {
  background-color: #eaecff !important;
  cursor: pointer !important;
}

.dropdown-list-item:active[b-47t9gdihi1] {
  background-color: #dce0ff !important;
}

.dropdown-list-item.active-item[b-47t9gdihi1] {
  background-color: #eaecff !important;
  /* border-left: 4px solid #6366f1 !important; */
  /* padding-left: 6px !important; */
}

.item-name[b-47t9gdihi1] {
  font-weight: 600 !important;
  color: #2d3748 !important;
  font-size: 13px !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

.item-metadata[b-47t9gdihi1] {
  text-align: right !important;
  color: #718096 !important;
  font-size: 12px !important;
  max-width: 200px !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  margin-left: 1rem !important;
}
/* /Components/Shared/WMGridSearch.razor.rz.scp.css */
.wm-search-input[b-nakqdb58n8] {
  padding: 8px 13px;
  background-color: var(--white);
  border: 1px #1e293b1f solid;
  border-radius: 50px;
  box-shadow: 0 1.5px 2px 0.5px rgba(0, 0, 0, 0.06);
  width: 100%;
  max-width: 300px;
}

.wm-search-input.disabled[b-nakqdb58n8] {
  background: transparent !important;
  box-shadow: initial !important;
  cursor: not-allowed !important;
}

.wm-search-input input[b-nakqdb58n8] {
  border: none;
  outline: none;
  font-size: 13px;
  font-weight: 600;
  line-height: 18px;
  letter-spacing: -0.2px;
  color: var(--gray-txt);
}

.wm-search-input input[b-nakqdb58n8]::placeholder {
  color: #5F6E85;
}

.wm-search-input input:disabled[b-nakqdb58n8] {
  background: transparent !important;
  box-shadow: initial !important;
  cursor: not-allowed !important;
}

.wm-search-input img[b-nakqdb58n8] {
  height: 16px;
}
/* /Components/Shared/WMIconPicker.razor.rz.scp.css */
.wm-icon-picker[b-5o67l8ovkn] {
  position: relative !important;
}

.wm-ip-btn[b-5o67l8ovkn] {
  height: 40px !important;
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 0px 12px !important;
  background-color: #ffffff !important;
  border: 1px solid #1e293b1f !important;
  border-radius: 10px !important;
  flex-shrink: 0 !important;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05) !important;
  transition: all 0.2s ease-in-out !important;
  outline: none !important;
}

.wm-ip-btn:hover:not(:disabled)[b-5o67l8ovkn] {
  border-color: #eaecff !important;
  background-color: #f8f9fa !important;
}

.wm-ip-btn:focus[b-5o67l8ovkn],
.wm-ip-btn:focus-within[b-5o67l8ovkn] {
  box-shadow: 0 0 0 0.2rem #dce0ff !important;
}

.wm-ip-btn:disabled[b-5o67l8ovkn] {
  background: transparent !important;
  box-shadow: initial !important;
  cursor: not-allowed !important;
}

.wm-ip-preview[b-5o67l8ovkn] {
  width: 24px !important;
  height: 24px !important;
  border-radius: 50% !important;
  border: 2px solid #fff !important;
  box-shadow: 0 0 0 1px #1e293b1f !important;
  flex-shrink: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: #fff !important;
  font-size: 12px !important;
  line-height: 1 !important;
}

.wm-ip-popover[b-5o67l8ovkn] {
  padding: 16px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
}

.wm-ip-none[b-5o67l8ovkn] {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 4px 6px !important;
  border: 1px solid transparent !important;
  border-radius: 8px !important;
  background: none !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  color: var(--gray-txt-2, #5F6E85) !important;
  cursor: pointer !important;
}

.wm-ip-none:hover[b-5o67l8ovkn],
.wm-ip-none.selected[b-5o67l8ovkn] {
  border-color: #dce0ff !important;
  background: #f8f9fa !important;
}

.wm-ip-none-dot[b-5o67l8ovkn] {
  width: 18px !important;
  height: 18px !important;
  border-radius: 50% !important;
  border: 2px solid #fff !important;
  box-shadow: 0 0 0 1px #1e293b1f !important;
}

.wm-ip-grid[b-5o67l8ovkn] {
  display: grid !important;
  grid-template-columns: repeat(6, 28px) !important;
  gap: 8px !important;
}

.wm-ip-swatch[b-5o67l8ovkn] {
  width: 28px !important;
  height: 28px !important;
  border-radius: 50% !important;
  border: 2px solid #fff !important;
  box-shadow: 0 0 0 1px #1e293b1f !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: #fff !important;
  font-size: 13px !important;
  line-height: 1 !important;
  cursor: pointer !important;
  transition: transform 0.1s !important;
  padding: 0 !important;
}

.wm-ip-swatch:hover[b-5o67l8ovkn],
.wm-ip-swatch.selected[b-5o67l8ovkn] {
  transform: scale(1.2) !important;
  box-shadow: 0 0 0 2px #5263FF !important;
}
/* /Components/Shared/WMImageViewerPopup.razor.rz.scp.css */
/* /Components/Shared/WMLocationActivityTag.razor.rz.scp.css */
/* Same chip scale and colours as .loc-state-chip on the locations grid: a state a user has
   learned to read in one place should not look like a different thing in another. */
.wm-activity-tag[b-08lovivnne] {
    border-radius: 8px;
    display: inline-flex;
    font-size: 11px;
    font-weight: 700;
    line-height: 16px;
    margin-left: 6px;
    padding: 1px 7px;
    vertical-align: middle;
    white-space: nowrap;
}

.wm-activity-tag--inactive[b-08lovivnne] {
    background: #fee2e2;
    color: #b91c1c;
}

.wm-activity-tag--scheduled[b-08lovivnne] {
    background: #fef3c7;
    color: #92400e;
}
/* /Components/Shared/WMLocationGroupFilter.razor.rz.scp.css */
/* The control sits beside WMDateRangePicker, so it borrows that field's proportions
   rather than WMMultiSelectDropdown's taller default: same 12px text and same 32px
   body, so the two read as one row of controls instead of two sizes. ::deep, because
   the button belongs to the nested dropdown. */
.wm-lgf[b-l0f0wxs8n8] {
  display: inline-flex;
}

.wm-lgf[b-l0f0wxs8n8]  .custom-select-button {
  min-height: 32px !important;
  height: auto !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  padding: 0 10px !important;
  box-shadow: none !important;
}

/* The label is a summary line, never a stack of chips, so the control keeps the same
   height whether one group is picked or ten. Anything too long to fit is clipped
   rather than wrapped. */
.wm-lgf[b-l0f0wxs8n8]  .custom-select-button-label {
  min-width: 0 !important;
  overflow: hidden !important;
}

.wm-lgf[b-l0f0wxs8n8]  .custom-select-button-text {
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}
/* /Components/Shared/WMMap.razor.rz.scp.css */
.wm-map-wrapper[b-8r17lgwpm7] {
	display: flex;
	flex-direction: column;
}

[b-8r17lgwpm7] .mapboxgl-popup{
	max-width:100% !important;
}
/* ── Map canvas ──────────────────────────────────────────────────────────── */
.wm-map-container[b-8r17lgwpm7] {
	width: 100%;
	border-radius: 8px;
	overflow: hidden;
}

/* ── Navigation control group (top-right) ────────────────────────────────── */
/* position:absolute + top/right applied inline in Razor to avoid             */
/* scoped-CSS vs Mapbox GL specificity conflicts.                              */

.wm-map-nav-controls[b-8r17lgwpm7] {
	display: flex;
	flex-direction: column;
	border-radius: 12px;
	overflow: visible;
	padding: 6px;
	gap: 6px;
	background-color: #FFFFFF;
	border: 1px solid #1E293B17;
	box-shadow: 0px 56px 56px -28px #1E293B08;
	box-shadow: 0px 32px 32px -16px #1E293B08;
	box-shadow: 0px 20px 20px -12px #1E293B08;
	box-shadow: 0px 3px 3px -1.5px #1E293B08;
	box-shadow: 0px 1px 1px -0.5px #1E293B08;
	box-shadow: 0px 72px 72px -36px #1E293B08;
}

/* ── Individual control button ───────────────────────────────────────────── */

.wm-map-ctrl-btn[b-8r17lgwpm7] {
	background-color: #F1F5F9CC;
	border: 1px solid #1E293B0F;
	box-sizing: border-box;
	cursor: pointer;
	height: 32px;
	width: 32px;
	outline: none;
	overflow: hidden;
	padding: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 18px;
	line-height: 1;
	color: #1E293B;
	user-select: none;
	border-radius: 8px;
}

	.wm-map-ctrl-btn:hover[b-8r17lgwpm7] {
		background-color: #E2E8F0;
	}

	.wm-map-ctrl-btn.wm-map-ctrl-active[b-8r17lgwpm7] {
		background-color: #EEF0FF;
		border-color: #5263FF33;
	}

/* ── Divider between button groups ──────────────────────────────────────── */

.wm-map-ctrl-divider[b-8r17lgwpm7] {
	height: 1px;
	background: rgba(0, 0, 0, 0.12);
	margin: 2px 4px;
}

/* ── Mapbox GL built-in controls — hide scale, suppress default nav ──────── */

[b-8r17lgwpm7] .mapboxgl-ctrl-bottom-left .mapboxgl-ctrl-scale {
	margin: 0 0 6px 6px;
	font-size: 11px;
	border-color: #94A3B8;
	color: #475569;
}

/* ── Location details popup ──────────────────────────────────────────────── */

[b-8r17lgwpm7] .mapboxgl-popup-content {
	padding: 20px 22px;
	border-radius: 16px;
	box-shadow: 0 12px 32px rgba(15, 23, 42, 0.18);
}

[b-8r17lgwpm7] .mapboxgl-popup-anchor-bottom .mapboxgl-popup-tip {
	border-top-color: white;
}

[b-8r17lgwpm7] .mapboxgl-popup-anchor-top .mapboxgl-popup-tip {
	border-bottom-color: white;
}

[b-8r17lgwpm7] .wm-location-popup {
	font-family: "Plus Jakarta Sans", sans-serif;
	min-width: 260px;
	max-width: 320px;
	width: 100%;
	backdrop-filter: blur(48px);
	display: flex;
	flex-direction: column;
	gap: 12px;
}

/* Route preview pin popup — smaller and tighter than the standard popup */
[b-8r17lgwpm7] .wm-route-preview-popup {
	min-width: 170px;
	max-width: 230px;
	gap: 6px;
	backdrop-filter: none;
}

[b-8r17lgwpm7] .mapboxgl-popup-content:has(.wm-route-preview-popup) {
	position: relative;
	padding: 10px 12px;
	background: #ffffff;
}

[b-8r17lgwpm7] .wm-route-preview-popup-close {
	position: absolute;
	top: 6px;
	right: 6px;
	width: 20px;
	height: 20px;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0;
	border: none;
	border-radius: 50%;
	background: transparent;
	color: #5F6E85;
	font-size: 15px;
	line-height: 1;
	cursor: pointer;
}

[b-8r17lgwpm7] .wm-route-preview-popup-close:hover {
	background: #F1F5F9;
	color: #1E293B;
}

[b-8r17lgwpm7] .wm-dispatch-location-popup{
	max-width:500px !important;
	flex-direction:row;
}

[b-8r17lgwpm7] .wm-dispatch-location-popup-left-menu-header {
	display: flex;
	flex-direction: row;
	gap:8px;
}

[b-8r17lgwpm7] .mapboxgl-popup-content {
	padding: 12px;
	border-width: 1px, 1px, 0px, 1px;
	border-style: solid;
	border-image-source: linear-gradient(180deg, rgba(30, 41, 59, 0.06) 48%, rgba(30, 41, 59, 0.12) 100%);
	background: linear-gradient(180deg, rgba(255, 255, 255, 0.8) 0%, #FFFFFF 100%);
}

[b-8r17lgwpm7] .wm-location-popup-badge {
	padding: 4px;
	border-radius: 6px;
	letter-spacing: -0.2px;
	line-height: 16px;
	font-size: 10px;
	font-weight: 600;
	align-items: center;
	display: flex;
	gap: 3px;
}

[b-8r17lgwpm7] .badge-yellow {
	border: 1px solid #FFC30A33;
	color: #9D6600;
	background-color: #FFC30A1F;
}

[b-8r17lgwpm7] .badge-blue {
	border: 1px solid #5263FF33;
	color: #363AF5;
	background-color: #5263FF1F;
}

[b-8r17lgwpm7] .wm-location-popup-title {
	font-size: 15px;
	font-weight: 800;
	color: #1E293B;
	letter-spacing: -0.2px;
	line-height: 24px;
}

[b-8r17lgwpm7] .wm-location-popup-divider {
	height: 1px;
	background: #E2E8F0;
}

[b-8r17lgwpm7] .wm-location-popup-label {
	font-weight: 600;
	font-size: 13px;
	line-height: 20px;
	letter-spacing: -0.2px;
	color: #475569;
}

[b-8r17lgwpm7] .wm-location-popup-address {
	font-size: 13px;
	font-weight: 600;
	color: #475569;
	word-break: break-word;
	overflow-wrap: break-word;
	letter-spacing: -0.2px;
	line-height: 20px;
}

[b-8r17lgwpm7] .wm-location-popup-address {
	font-size: 13px;
	font-weight: 600;
	color: #475569;
	word-break: break-word;
	overflow-wrap: break-word;
	letter-spacing: -0.2px;
	line-height: 20px;
}

[b-8r17lgwpm7] .wm-location-popup-value {
	font-size: 13px;
	font-weight: 700;
	color: #1E293B;
	word-break: break-word;
	overflow-wrap: break-word;
	letter-spacing: -0.2px;
	line-height: 20px;
}

[b-8r17lgwpm7] .wm-location-popup-routes-label {
	font-size: 13px;
	font-weight: 700;
	color: #1E293B;
	line-height: 20px;
	letter-spacing: -0.2px;
}

[b-8r17lgwpm7] .wm-location-popup-route-row {
	display: flex;
	align-items: center;
	gap: 8px;
}


[b-8r17lgwpm7] .wm-location-popup-route-dot {
	width: 10px;
	height: 10px;
	border-radius: 50%;
	flex-shrink: 0;
	display: inline-block;
}

[b-8r17lgwpm7] .wm-location-popup-route-name {
	font-size: 13px;
	font-weight: 600;
	color: #475569;
	word-break: break-word;
	overflow-wrap: break-word;
	line-height: 20px;
	letter-spacing: -0.2px;
}

[b-8r17lgwpm7] .wm-location-popup-first-stop-btn {
}

[b-8r17lgwpm7] .wm-location-popup-header{
	display:flex;
	flex-direction:column;
	gap:8px;
}

[b-8r17lgwpm7] .wm-location-popup-question {
	font-size: 13px;
	font-weight: 700;
	color: #1E293B;
	line-height: 20px;
	letter-spacing:-0.2px;
}

[b-8r17lgwpm7] .wm-location-popup-warning {
	padding: 10px 12px;
	border-radius: 10px;
	background: #FEF2F2;
	border: 1px solid #FECACA;
	color: #B91C1C;
	font-size: 12px;
	font-weight: 500;
	line-height: 18px;
	display: flex;
	flex-direction: row;
	gap:8px;
	align-items:start;
}

[b-8r17lgwpm7] .wm-location-popup-actions {
	display: flex;
	gap: 8px;
}

	/* Anchors sit here too: a popup link that leaves for another page is a real link so it
	   can open in its own tab, be middle-clicked and be copied, but it has to read as the
	   same control as the buttons beside it. */
	[b-8r17lgwpm7] .wm-location-popup-actions button,
	[b-8r17lgwpm7] .wm-location-popup-actions a {
		flex: 1;
		height: 36px;
		white-space: nowrap;
	}

	[b-8r17lgwpm7] .wm-location-popup-actions a {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		text-decoration: none;
	}
/* /Components/Shared/WMMapSearchBox.razor.rz.scp.css */
/* Floating map control. Defaults to the top-left corner of the map's positioning
   wrapper; hosts move it with PositionClass because every map has a different corner
   free. z-index sits below the 10 the builders' loading overlays use, so a map that is
   still loading covers its own search box. */
.wm-map-search[b-3eoa8e1nfi] {
    position: absolute;
    top: 12px;
    left: 12px;
    z-index: 9;
    width: 300px;
    max-width: calc(100% - 24px);
}

/* ── The pill ── */
/* Same glass pill as the builders' map overlays (WMMap nav cluster, road tools), so a
   search box dropped on any map reads as part of the same control set. */
.wm-map-search-field[b-3eoa8e1nfi] {
    display: flex;
    align-items: center;
    gap: 4px;
    height: 40px;
    padding: 0 6px 0 10px;
    border-radius: 10px;
    border: 1.5px solid #e2e8f0;
    background: rgba(255, 255, 255, 0.96);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    box-shadow: 0 2px 8px rgba(30, 41, 59, 0.12);
    transition: border-color 0.15s, box-shadow 0.15s;
}

.wm-map-search-field:focus-within[b-3eoa8e1nfi] {
    border-color: #5263FF;
    box-shadow: 0 0 0 3px #dce0ff, 0 2px 8px rgba(30, 41, 59, 0.12);
}

.wm-map-search-field.disabled[b-3eoa8e1nfi] {
    opacity: 0.6;
}

.wm-map-search-icon[b-3eoa8e1nfi] {
    display: flex;
    align-items: center;
    flex-shrink: 0;
}

.wm-map-search-icon img[b-3eoa8e1nfi] {
    height: 15px;
    width: 15px;
}

.wm-map-search-input[b-3eoa8e1nfi] {
    flex: 1;
    min-width: 0;
    height: 100%;
    border: none;
    outline: none;
    background: transparent;
    padding: 0 4px;
    font-size: 14px;
    font-weight: 500;
    color: #1E293B;
    letter-spacing: -0.2px;
}

.wm-map-search-input[b-3eoa8e1nfi]::placeholder {
    color: #94A3B8;
    font-weight: 500;
}

.wm-map-search-input:disabled[b-3eoa8e1nfi] {
    cursor: not-allowed;
}

.wm-map-search-action[b-3eoa8e1nfi] {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 24px;
    height: 24px;
    border-radius: 6px;
    color: #5263ff;
}

.wm-map-search-clear[b-3eoa8e1nfi] {
    cursor: pointer;
}

.wm-map-search-clear:hover[b-3eoa8e1nfi] {
    background-color: #F1F5F9;
}

.wm-map-search-clear img[b-3eoa8e1nfi] {
    height: 11px;
    width: 11px;
}

/* ── Suggestion dropdown ── */
/* wmPopover positions this (fixed + transform + z-index 9999) and sizes it to the
   pill's width, so only the card styling belongs here. */
.wm-map-search-menu[b-3eoa8e1nfi] {
    padding: 6px;
    border: 1px solid #E4E5E7;
    border-radius: 12px;
    box-shadow: 0 8px 24px rgba(30, 41, 59, 0.16);
    background-color: #FFFFFF;
}

.wm-map-search-list[b-3eoa8e1nfi] {
    max-height: min(280px, 40vh);
    overflow-y: auto;
    scrollbar-width: thin;
}

.wm-map-search-item[b-3eoa8e1nfi] {
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
    padding: 9px 10px;
    border: none;
    background: transparent;
    border-radius: 8px;
    text-align: left;
    transition: background-color 0.15s ease;
}

.wm-map-search-item:hover[b-3eoa8e1nfi] {
    background-color: #eaecff;
    cursor: pointer;
}

.wm-map-search-item:active[b-3eoa8e1nfi] {
    background-color: #dce0ff;
}

/* The row the arrow keys are on reads like the one under the pointer. */
.wm-map-search-item.active[b-3eoa8e1nfi] {
    background-color: #eaecff;
}

/* A host hit: name over its address and customer, on as many lines as it has. */
.wm-map-search-hit[b-3eoa8e1nfi] {
    align-items: flex-start;
}

.wm-map-search-hit .wm-map-search-item-icon[b-3eoa8e1nfi] {
    margin-top: 2px;
}

.wm-map-search-item-text[b-3eoa8e1nfi] {
    display: flex;
    flex-direction: column;
    gap: 1px;
    flex: 1;
    min-width: 0;
}

.wm-map-search-item-sub[b-3eoa8e1nfi] {
    font-size: 12px;
    color: #5F6E85;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* An address with nowhere to fly to: listed so the search is honest about it, never picked. */
.wm-map-search-item--no-position[b-3eoa8e1nfi],
.wm-map-search-item--no-position:hover[b-3eoa8e1nfi],
.wm-map-search-item--no-position:active[b-3eoa8e1nfi] {
    background: transparent;
    cursor: default;
    opacity: 0.55;
}

.wm-map-search-item-note[b-3eoa8e1nfi] {
    flex-shrink: 0;
    align-self: center;
    padding: 2px 6px;
    border-radius: 99px;
    background: #F1F5F9;
    color: #5F6E85;
    font-size: 11px;
    font-weight: 600;
    white-space: nowrap;
}

.wm-map-search-item-icon[b-3eoa8e1nfi] {
    flex-shrink: 0;
}

.wm-map-search-item-name[b-3eoa8e1nfi] {
    font-size: 13px;
    font-weight: 600;
    color: #2d3748;
    letter-spacing: -0.2px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.wm-map-search-status[b-3eoa8e1nfi] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 18px;
    font-size: 13px;
    color: #5F6E85;
}
/* /Components/Shared/WMMultiSelectDropdown.razor.rz.scp.css */
.custom-select-button[b-icmegq63bt] {
  width: 100% !important;
  height: 40px !important;
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 0 12px !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  color: #212529 !important;
  background-color: #ffffff !important;
  border: 1px solid #1E293B1F !important;
  border-radius: 10px !important;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05) !important;
  transition: all 0.2s ease-in-out !important;
  outline: none !important;
}

.custom-select-button.chips-mode[b-icmegq63bt] {
  height: auto !important;
  min-height: 40px !important;
  align-items: center !important;
  padding-top: 7px !important;
  padding-bottom: 7px !important;
}

.custom-select-button:hover:not(:disabled)[b-icmegq63bt] {
  border-color: #eaecff !important;
  background-color: #f8f9fa !important;
}

.custom-select-button:focus[b-icmegq63bt] {
  box-shadow: 0 0 0 0.2rem #dce0ff !important;
}

.custom-select-button:disabled[b-icmegq63bt] {
  background: transparent !important;
  box-shadow: initial !important;
  cursor: not-allowed !important;
}

.custom-select-button.invalid[b-icmegq63bt] {
  box-shadow: 0 0 0 0.2rem #f0d1d1 !important;
}

.custom-select-button-label[b-icmegq63bt] {
  max-width: 90% !important;
}

.custom-select-button.chips-mode .custom-select-button-label[b-icmegq63bt] {
  width: 100% !important;
  max-width: calc(100% - 18px) !important;
  flex-wrap: wrap !important;
  gap: 6px !important;
  row-gap: 6px !important;
}

.custom-select-button-text[b-icmegq63bt] {
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  text-align: start !important;
}

.custom-select-selected-chip-wrap[b-icmegq63bt] {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 6px !important;
  min-width: 0 !important;
  flex: 1 1 auto !important;
  align-items: center !important;
}

.custom-select-selected-chip[b-icmegq63bt] {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 4px 10px !important;
  border-radius: 8px !important;
  background: #eef0ff !important;
  color: #3640f5 !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  line-height: 1 !important;
  white-space: nowrap !important;
}

.custom-select-selected-chip-text[b-icmegq63bt] {
  max-width: 170px !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

.custom-select-selected-chip-icon[b-icmegq63bt] {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 14px !important;
  height: 14px !important;
  cursor: pointer !important;
  font-size: 10px !important;
  line-height: 1 !important;
  flex: 0 0 auto !important;
}

.search-input-box[b-icmegq63bt] {
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05) !important;
}

.search-input-box:focus-within[b-icmegq63bt] {
  box-shadow: 0 0 0 0.2rem #dce0ff !important;
}

.search-input-box input[b-icmegq63bt]::placeholder {
  color: #5F6E85 !important;
}

.custom-dropdown-list[b-icmegq63bt] {
  max-height: min(250px, 25vh) !important;
  overflow-y: auto !important;
  scrollbar-width: thin !important;
  padding: 4px !important;
}

.dropdown-list-item[b-icmegq63bt] {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  gap: 10px !important;
  width: 100% !important;
  padding: 10px 10px !important;
  border: none !important;
  background: transparent !important;
  border-radius: 10px !important;
  transition: background-color 0.2s ease !important;
  text-align: left !important;
  margin-bottom: 3px !important;
}

.dropdown-list-item:hover[b-icmegq63bt] {
  background-color: #eaecff !important;
  cursor: pointer !important;
}

.dropdown-list-item:active[b-icmegq63bt] {
  background-color: #dce0ff !important;
}

.dropdown-list-item.active-item[b-icmegq63bt] {
  background-color: #eaecff !important;
  /* border-left: 4px solid #6366f1 !important; */
  /* padding-left: 6px !important; */
}

.item-name[b-icmegq63bt] {
  font-weight: 600 !important;
  color: #2d3748 !important;
  font-size: 13px !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

.item-name.active-item[b-icmegq63bt] {
  color: #363af5 !important;
}

.item-metadata[b-icmegq63bt] {
  text-align: right !important;
  color: #718096 !important;
  font-size: 12px !important;
  max-width: 200px !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  margin-left: 1rem !important;
}

.custom-checkbox[b-icmegq63bt] {
  width: 18px !important;
  height: 18px !important;
  border-radius: 6px !important;
  padding: 2px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  transition: all 0.2s !important;
  background: linear-gradient(180deg, #f1f5f9 0%, #ffffff 100%) !important;
  border: 2.5px solid #d9dee3 !important;
  backdrop-filter: blur(24px) !important;
  box-shadow:
    0px 1px 1px -0.5px #1e293b08,
    0px 3px 3px 0px #ffffff1f inset !important;
  flex-shrink: 0 !important;
}

.custom-checkbox.checked[b-icmegq63bt] {
  background: linear-gradient(180deg, #5263ff 0%, #5263ff 100%) !important;
  color: white !important;
  backdrop-filter: blur(24px) !important;
  box-shadow:
    0px 1px 1px -0.5px #1e293b08,
    0px 3px 3px 0px #ffffff1f inset !important;
  border: none !important;
}

.custom-checkbox-icon[b-icmegq63bt] {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
}
/* /Components/Shared/WMPagination.razor.rz.scp.css */
.wm-pagination[b-db3s3l2x1c] {
  padding: 8px 16px;
  border-top: 1px #1e293b17 solid;
  /* min-width: 1000px; */
  height: 64.5px;
}

.wm-pagination .cstm-pagination button[b-db3s3l2x1c] {
  height: 32px;
  width: 32px;
  font-size: 12px;
  font-weight: 600;
  line-height: 16px;
  letter-spacing: -0.2px;
  color: var(--gray-txt);
  background-color: transparent;
  border: 1px transparent solid;
  border-radius: 8px;
}

.wm-pagination .cstm-pagination button.arrow[b-db3s3l2x1c] {
  background-color: var(--white);
  border: 1px #1e293b17 solid;
  backdrop-filter: blur(24px);
  box-shadow:
    0px 2px 1.5px -0.5px #1e293b08,
    0px 2px 3px 0px #ffffff08 inset;
}

.wm-pagination .cstm-pagination button.arrow img[b-db3s3l2x1c] {
  height: 16px;
}

.wm-pagination .cstm-pagination button.active[b-db3s3l2x1c] {
  width: 29px;
  border: 1px #1e293b17 solid;
  background-color: #f1f5f9d2;
}

.wm-pagination .cstm-pagination button:not(:disabled):hover[b-db3s3l2x1c] {
  background-color: #f3f6f8;
}

.wm-pagination .go-page label[b-db3s3l2x1c] {
  font-size: 13px;
  font-weight: 500;
  line-height: 20px;
  letter-spacing: -0.2px;
  color: var(--gray-txt-2);
}

.wm-pagination .go-page div[b-db3s3l2x1c] {
  height: 32px;
  background-color: #f1f5f9;
  border: 1px #1e293b1f solid;
  border-radius: 8px;
  padding: 2px;
  box-shadow:
    0px 3px 3px -1.5px #1e293b08,
    0px 1px 1px -0.5px #1e293b08;
}

.wm-pagination .go-page div input[b-db3s3l2x1c] {
  height: 100%;
  width: 100%;
  font-size: 12px;
  font-weight: 600;
  line-height: 16px;
  letter-spacing: -0.2px;
  color: var(--gray-txt-2);
  border: none;
  outline: none;
  padding-left: 8px;
  border-radius: 8px;
  background-color: transparent;
}

.wm-pagination .go-page div input[b-db3s3l2x1c]::placeholder {
  color: #5F6E85;
}

.wm-pagination .go-page div input[b-db3s3l2x1c]::-webkit-outer-spin-button,
.wm-pagination .go-page div input[b-db3s3l2x1c]::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.wm-pagination .go-page div button[b-db3s3l2x1c] {
  height: 24px;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 1px 10px;
  color: var(--gray-txt);
  font-size: 10px;
  font-weight: 500;
  line-height: 16px;
  letter-spacing: -0.2px;
  border: 1px #1e293b17 solid;
  border-radius: 6px;
  background-color: var(--white);
  backdrop-filter: blur(24px);
  box-shadow:
    0px 2px 1.5px -0.5px #1e293b08,
    0px 2px 3px 0px #ffffff08 inset;
}

.wm-pagination .go-page div button:not(:disabled):hover[b-db3s3l2x1c] {
  background-color: #f3f6f8;
}

.wm-pagination .result label[b-db3s3l2x1c] {
  font-size: 13px;
  font-weight: 500;
  line-height: 20px;
  letter-spacing: -0.2px;
  color: var(--gray-txt-2);
}

.wm-pagination .result select[b-db3s3l2x1c] {
  padding: 8px;
  font-size: 12px;
  font-weight: 600;
  line-height: 16px;
  letter-spacing: -0.2px;
  color: var(--gray-txt);
  border: 1px rgba(30, 41, 59, 0.06) solid;
  outline: none;
  border-radius: 8px;
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  background-image: url("../img/icons/gray-arrow.png");
  background-repeat: no-repeat;
  background-position: right 0px center;
  background-size: 18px;
  cursor: pointer;
  width: 60px;
}

.wm-pagination hr[b-db3s3l2x1c] {
  height: 15px;
  border: 1px #1e293b67 solid;
}
/* /Components/Shared/WMPhoneCodeDropdown.razor.rz.scp.css */
.custom-select-button[b-393u4yc3xi] {
  width: 100% !important;
  height: 40px !important;
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 0 12px !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  color: #212529 !important;
  background-color: #ffffff !important;
  border: 1px solid #1E293B1F !important;
  border-radius: 10px !important;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05) !important;
  transition: all 0.2s ease-in-out !important;
  outline: none !important;
}

.custom-select-button:hover:not(:disabled)[b-393u4yc3xi] {
  border-color: #eaecff !important;
  background-color: #f8f9fa !important;
}

.custom-select-button:focus[b-393u4yc3xi] {
  box-shadow: 0 0 0 0.2rem #dce0ff !important;
}

.custom-select-button:disabled[b-393u4yc3xi] {
  background: transparent !important;
  box-shadow: initial !important;
  cursor: not-allowed !important;
}

.custom-select-button.invalid[b-393u4yc3xi] {
  box-shadow: 0 0 0 0.2rem #F0D1D1 !important;
}

.custom-select-button-label[b-393u4yc3xi] {
  max-width: 90% !important;
}

.custom-select-button-text[b-393u4yc3xi] {
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  text-align: start !important;
}

.search-input-box[b-393u4yc3xi] {
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05) !important;
}

.search-input-box:focus-within[b-393u4yc3xi] {
  box-shadow: 0 0 0 0.2rem #dce0ff !important;
}

.search-input-box input[b-393u4yc3xi]::placeholder {
  color: #5F6E85 !important;
}

.custom-dropdown-list[b-393u4yc3xi] {
  max-height: min(250px, 25vh) !important;
  overflow-y: auto !important;
  scrollbar-width: thin !important;
  padding: 4px !important;
}

.dropdown-list-item[b-393u4yc3xi] {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  gap: 10px !important;
  width: 100% !important;
  padding: 10px 10px !important;
  border: none !important;
  background: transparent !important;
  border-radius: 10px !important;
  transition: background-color 0.2s ease !important;
  text-align: left !important;
  margin-bottom: 3px !important;
}

.dropdown-list-item:hover[b-393u4yc3xi] {
  background-color: #eaecff !important;
  cursor: pointer !important;
}

.dropdown-list-item:active[b-393u4yc3xi] {
  background-color: #dce0ff !important;
}

.dropdown-list-item.active-item[b-393u4yc3xi] {
  background-color: #eaecff !important;
  /* border-left: 4px solid #6366f1 !important; */
  /* padding-left: 6px !important; */
}

.item-name[b-393u4yc3xi] {
  font-weight: 600 !important;
  color: #2d3748 !important;
  font-size: 13px !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

.item-metadata[b-393u4yc3xi] {
  text-align: right !important;
  color: #718096 !important;
  font-size: 12px !important;
  max-width: 200px !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  margin-left: 1rem !important;
}
/* /Components/Shared/WMPlannedOnField.razor.rz.scp.css */
.wm-planned-on-now[b-0de7kjy4al] {
	align-self: stretch;
	padding: 0 12px;
	border: 0;
	border-left: 1px #1E293B1F solid;
	border-radius: 0 10px 10px 0;
	background: transparent;
	font-size: 13px;
	font-weight: 600;
	line-height: 24px;
	letter-spacing: -0.2px;
	color: var(--purple);
	white-space: nowrap;
	cursor: pointer;
}

.wm-planned-on-now:hover[b-0de7kjy4al] {
	background: #F8FAFC;
}

.wm-planned-on-now:focus-visible[b-0de7kjy4al] {
	outline: none;
	box-shadow: 0 0 0 3px rgba(82, 99, 255, 0.12) inset;
}
/* /Components/Shared/WMPopover.razor.rz.scp.css */
.wm-popover-content[b-1tih4tghdz] {
  max-width: 90vw !important;
  background-color: #fff !important;
  border: 1px solid #1e293b17 !important;
  border-radius: 24px !important;
  box-shadow:
    0px 56px 56px -28px #1e293b08,
    0px 32px 32px -16px #1e293b08,
    0px 20px 20px -12px #1e293b08,
    0px 3px 3px -1.5px #1e293b08,
    0px 1px 1px -0.5px #1e293b08,
    0px 72px 72px -36px #1e293b08 !important;
  overflow: hidden !important;
}
/* /Components/Shared/WMPopup.razor.rz.scp.css */
/* Neutral now, and deliberately still defined: seventeen screens add this class to a host
   popup before opening a child one, and they are all saying the same thing — "put the child
   on top".

   It used to do that by dropping the host to 1049, below the backdrop at 1050. That works,
   and it is also why a host popup went grey while its child was open: it was underneath a
   50 % black wash. Stack three and the bottom one sits under three of them.

   openModalById now gives each popup its own layer, so a child is above its parent without
   the parent going anywhere. The declaration is gone rather than the class, because removing
   the class means touching seventeen screens for no behaviour change; leaving the selector
   here is what a grep for it finds. */
.z-index-lower[b-m9sqtjmtiw] {
}

/* SM-327: for a popup whose child popups are rendered inside its own body (the two-factor
   set-up steps), dropping it below the backdrop is not available. A z-index on a modal makes a
   stacking context, so the child goes down with the host and lands under the backdrop with it,
   and no z-index on the child can lift it back out. Dim the host's own content instead and
   leave the stacking order alone. The direct-child chain matters: a descendant selector would
   dim the child popup as well, since it is a WMPopup too. */
.wm-popup-dimmed > .modal-dialog > .modal-content[b-m9sqtjmtiw]::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background-color: rgba(0, 0, 0, 0.5);
  z-index: 1;
}

.wm-popup-modal-content[b-m9sqtjmtiw] {
  border: 1px solid #1e293b08 !important;
  box-shadow:
    0px 32px 32px -16px #1e293b08,
    0px 20px 20px -12px #1e293b08,
    0px 3px 3px -1.5px #1e293b08,
    0px 1px 1px -0.5px #1e293b08 !important;
  overflow: hidden;
}

/* ── Every popup fits the screen ───────────────────────────────────────────
   Caps, not sizes: a popup whose content already fits the window is untouched
   by all three rules below. Once it would grow past the window the dialog stops
   at the window's edge, the header and the footer keep their own height
   (Bootstrap already gives both flex-shrink: 0) and the body is the part that
   gives way and scrolls.

   Before this a tall popup ran off the bottom of the screen and took the
   "accept" buttons in its footer with it, and on a short window the close X at
   the top as well. Nothing could be scrolled to reach either: the dialog had no
   cap, and .wm-popup-modal-content above is overflow: hidden, so the content
   could not scroll inside itself either. A long form, a laptop with a short
   window or a phone held sideways was enough to hit it.

   --bs-modal-margin is Bootstrap's own gutter (0.5rem, and 1.75rem from 576px
   up), and it inherits, so both caps follow the margin the dialog is actually
   drawn with. The content is capped against the window rather than against its
   dialog: a percentage max-height needs a definite height to resolve against,
   and the dialog's is its own content's, so "100%" would quietly compute to
   none and the content would go on growing inside a capped dialog. */
.modal-dialog[b-m9sqtjmtiw] {
  max-height: calc(100vh - var(--bs-modal-margin) * 2);
}

.wm-popup-modal-content[b-m9sqtjmtiw] {
  max-height: calc(100vh - var(--bs-modal-margin) * 2);
}

.modal-body[b-m9sqtjmtiw] {
  /* A flex item will not shrink below its own content without this, and a body
     that refuses to shrink is exactly what pushes the footer off the screen. */
  min-height: 0;
  overflow-y: auto;
}

.wm-popup-modal-footer[b-m9sqtjmtiw] {
  border-top: 1px solid #ebeced !important;
}

/* ── Fullscreen variant — activated via CssClass="wm-popup-fullscreen" ── */

.wm-popup-fullscreen .modal-dialog[b-m9sqtjmtiw] {
  max-width: 100vw !important;
  width: 100vw !important;
  height: 100vh !important;
  /* This variant has no gutter, so it is exempt from the cap above: it is meant
     to be exactly the window, not the window less a margin. */
  max-height: 100vh !important;
  margin: 0 !important;
}

.wm-popup-fullscreen .modal-content[b-m9sqtjmtiw] {
  height: 100vh !important;
  /* Exempt from the content cap above, for the same reason as the dialog. */
  max-height: 100vh !important;
  border-radius: 0 !important;
  padding: 0 !important;
  display: flex !important;
  flex-direction: column !important;
}

.wm-popup-fullscreen .modal-body[b-m9sqtjmtiw] {
  flex: 1 !important;
  overflow: hidden !important;
  min-height: 0 !important;
  position: relative !important;
}

/* The header is space-between, so the leading mark and the title have to sit together on
   the left and let the actions keep the right. Growing the title block is what does it. */
.wm-popup-header-leading[b-m9sqtjmtiw] {
  display: flex;
  align-items: center;
  flex-shrink: 0;
  margin-right: 14px;
}

.wm-popup-header-section[b-m9sqtjmtiw] {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: start;
  gap: 4px;
  flex: 1 1 auto;
  min-width: 0;
}

.wm-popup-header-text[b-m9sqtjmtiw] {
  overflow-wrap: anywhere;
  word-break: normal;
}

.wm-popup-header-actions[b-m9sqtjmtiw] {
  display: flex;
  justify-content: end;
  align-items: center;
  gap: 12px;
  flex-shrink: 0;
}

.wm-popup-header-subtext[b-m9sqtjmtiw] {
  color: #5F6E85;
  font-size: 13px;
  font-weight: 500;
  line-height: 20px;
  letter-spacing: -0.2px;
  overflow-wrap: anywhere;
  word-break: normal;
}

/* A popup opened while a slider (a right-hand modal at 1055) is up. Bootstrap puts every
   backdrop at 1050, so the second one lands behind the slider and the slider stays bright.
   Lift the popup above the slider and let the popup's own full-viewport element be the
   dimmer, as the confirmation popups below do. Layout is left alone. */
.wm-popup-over-slider[b-m9sqtjmtiw] {
  z-index: 1080 !important;
  background: rgba(15, 23, 42, 0.48);
}

/* Shared layout for compact confirmation dialogs. Keep confirmation copy in the
   header so every dialog uses the same left edge and vertical rhythm. */
.wm-confirmation-popup[b-m9sqtjmtiw] {
  z-index: 1080 !important;
  background: rgba(15, 23, 42, 0.48);
  -webkit-backdrop-filter: blur(2px);
  backdrop-filter: blur(2px);
}

.wm-confirmation-popup .modal-dialog[b-m9sqtjmtiw] {
  width: min(480px, calc(100vw - 32px)) !important;
  min-width: 0 !important;
  max-width: 480px !important;
  margin-inline: auto;
}

.wm-confirmation-popup .wm-popup-modal-content[b-m9sqtjmtiw] {
  padding: 0 !important;
  overflow: hidden;
  border: 1px solid rgba(30, 41, 59, 0.08) !important;
  border-radius: 20px !important;
  background: #ffffff !important;
  box-shadow: 0 24px 64px rgba(15, 23, 42, 0.28) !important;
}

.wm-confirmation-popup .modal-header[b-m9sqtjmtiw] {
  position: relative;
  min-height: 88px;
  padding: 16px 60px 16px 20px !important;
  align-items: center !important;
  border: 0 !important;
}

.wm-confirmation-popup .wm-popup-header-section[b-m9sqtjmtiw] {
  width: 100%;
  max-width: 100% !important;
  align-items: flex-start;
  gap: 4px;
  text-align: left;
}

.wm-confirmation-popup .modal-header h5.modal-title[b-m9sqtjmtiw] {
  width: 100%;
  margin: 0 !important;
  color: #1e293b !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  line-height: 24px !important;
  letter-spacing: -0.2px !important;
  text-align: left;
}

.wm-confirmation-popup .wm-popup-header-subtext[b-m9sqtjmtiw] {
  width: 100%;
  margin: 0 !important;
  color: #5F6E85 !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  line-height: 20px !important;
  letter-spacing: -0.2px !important;
  text-align: left;
}

.wm-confirmation-popup .modal-header .btn-close[b-m9sqtjmtiw] {
  position: absolute;
  top: 12px;
  right: 12px;
  width: 32px !important;
  height: 32px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 1px solid rgba(30, 41, 59, 0.06) !important;
  border-radius: 8px !important;
  background-color: #f8fafc !important;
  background-size: 10px !important;
  opacity: 1 !important;
}

.wm-confirmation-popup .modal-body:empty[b-m9sqtjmtiw] {
  display: none !important;
}

.wm-confirmation-popup .wm-popup-modal-footer[b-m9sqtjmtiw] {
  min-height: 72px;
  padding: 16px 20px !important;
  gap: 12px !important;
  border-top: 1px solid rgba(30, 41, 59, 0.09) !important;
  background: #ffffff !important;
}

.wm-confirmation-popup .wm-popup-modal-footer button[b-m9sqtjmtiw] {
  min-height: 40px;
  margin: 0 !important;
  border-radius: 10px;
  font-size: 13px;
  font-weight: 600;
  line-height: 20px;
  letter-spacing: -0.2px;
  text-align: center;
}

.wm-confirmation-popup .wm-popup-modal-footer .btn-wm-secondary[b-m9sqtjmtiw] {
  border: 1px solid rgba(30, 41, 59, 0.06);
  background: rgba(241, 245, 249, 0.8);
  color: #1e293b;
}

.wm-confirmation-popup .wm-popup-modal-footer .btn-wm-danger-translucent[b-m9sqtjmtiw] {
  border: 0;
  background: rgba(237, 64, 48, 0.12);
  color: #B82213;
}

.wm-confirmation-popup .wm-popup-modal-footer .btn-wm-primary[b-m9sqtjmtiw] {
  border: 0;
  background: #5263ff;
  color: #ffffff;
  box-shadow: 0 1px 1px -0.5px rgba(30, 41, 59, 0.03), inset 0 3px 3px rgba(255, 255, 255, 0.12);
}

.wm-confirmation-popup-success .wm-popup-modal-footer .btn-wm-primary[b-m9sqtjmtiw] {
  background: #296C28;
}

@media (max-width: 575px) {
  .wm-confirmation-popup .modal-dialog[b-m9sqtjmtiw] {
    width: calc(100vw - 24px) !important;
    margin: 12px auto !important;
  }
}

/* Match the existing cancel-dispatch confirmation convention. */
.wm-remove-confirmation-popup .modal-dialog[b-m9sqtjmtiw] {
  min-width: min(480px, calc(100vw - 32px)) !important;
}

.wm-remove-confirmation-popup .wm-popup-modal-content[b-m9sqtjmtiw] {
  padding: 0 !important;
  border: 1px solid rgba(30, 41, 59, 0.03) !important;
  border-radius: 20px !important;
  background: #ffffff !important;
  box-shadow:
    0 1px 1px -0.5px rgba(30, 41, 59, 0.03),
    0 3px 3px -1.5px rgba(30, 41, 59, 0.03),
    0 20px 20px -12px rgba(30, 41, 59, 0.03),
    0 32px 32px -16px rgba(30, 41, 59, 0.03) !important;
}

.wm-remove-confirmation-popup .modal-header[b-m9sqtjmtiw] {
  min-height: 80px;
  padding: 16px 20px !important;
  align-items: flex-end !important;
  border-bottom: 0 !important;
}

.wm-remove-confirmation-popup .wm-popup-header-section[b-m9sqtjmtiw] {
  gap: 4px;
}

.wm-remove-confirmation-popup .modal-header h5.modal-title[b-m9sqtjmtiw] {
  margin: 0 !important;
  color: #1e293b !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  line-height: 24px !important;
  letter-spacing: -0.2px !important;
}

.wm-remove-confirmation-popup .wm-popup-header-subtext[b-m9sqtjmtiw] {
  margin: 0 !important;
  color: #5F6E85 !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  line-height: 20px !important;
  letter-spacing: -0.2px !important;
}

.wm-remove-confirmation-popup .modal-header .btn-close[b-m9sqtjmtiw] {
  position: absolute;
  top: 12px;
  right: 12px;
  width: 32px !important;
  height: 32px !important;
  margin: 0 !important;
  border: 1px solid rgba(30, 41, 59, 0.06) !important;
  border-radius: 8px !important;
  background-color: rgba(241, 245, 249, 0.8) !important;
  opacity: 1 !important;
}

.wm-remove-confirmation-popup .modal-body[b-m9sqtjmtiw] {
  display: none !important;
}

.wm-remove-confirmation-popup .wm-popup-modal-footer[b-m9sqtjmtiw] {
  min-height: 72px;
  padding: 16px 20px !important;
  gap: 12px !important;
  border-top: 1px solid rgba(30, 41, 59, 0.09) !important;
  background: #ffffff !important;
}

.wm-remove-confirmation-popup .wm-popup-modal-footer button[b-m9sqtjmtiw] {
  min-height: 40px;
  border-radius: 10px;
  font-size: 13px;
  font-weight: 600;
  line-height: 24px;
  letter-spacing: -0.2px;
}

.wm-remove-confirmation-popup .wm-popup-modal-footer .btn-wm-danger-translucent[b-m9sqtjmtiw] {
  border: none;
  background: rgba(237, 64, 48, 0.12);
  color: #B82213;
}

.wm-remove-confirmation-popup .wm-popup-modal-footer .btn-wm-primary[b-m9sqtjmtiw] {
  border: none;
  background: #5263ff;
  color: #ffffff;
  box-shadow: 0 1px 1px -0.5px rgba(30, 41, 59, 0.03), inset 0 3px 3px rgba(255, 255, 255, 0.12);
}

.new-location.dds-active-locations-popup[b-m9sqtjmtiw] {
  z-index: 1070 !important;
  background: rgba(0, 0, 0, 0.34);
}

.new-location.dds-active-locations-popup .modal-dialog[b-m9sqtjmtiw] {
  position: relative;
  z-index: 1071;
}

/* ── Change-worktype popup (both dispatch details sliders) ──
   The sliders' scoped ::deep rules cannot reach these elements: the popup is a top-level
   sibling in the slider markup, so no scoped ancestor exists above the modal. The chrome
   lives here instead, like the other per-popup blocks above. The content is capped to the
   viewport and the address list inside scrolls on its own (.dds-work-type-table-body). */
.dds-change-work-type-popup .modal-dialog[b-m9sqtjmtiw] {
  min-width: min(560px, calc(100vw - 32px)) !important;
}

.dds-change-work-type-popup .wm-popup-modal-content[b-m9sqtjmtiw] {
  max-height: min(780px, 85vh);
  padding: 0 !important;
  border: 1px solid rgba(30, 41, 59, 0.03) !important;
  border-radius: 20px !important;
  background: #FFFFFF !important;
  box-shadow:
    0 1px 1px -0.5px rgba(30, 41, 59, 0.03),
    0 3px 3px -1.5px rgba(30, 41, 59, 0.03),
    0 20px 20px -12px rgba(30, 41, 59, 0.03),
    0 32px 32px -16px rgba(30, 41, 59, 0.03) !important;
}

.dds-change-work-type-popup .modal-header[b-m9sqtjmtiw] {
  min-height: 56px;
  flex-shrink: 0;
  padding: 16px 20px !important;
  align-items: flex-end !important;
  border-bottom: 1px solid rgba(30, 41, 59, 0.09) !important;
}

.dds-change-work-type-popup .modal-header h5.modal-title[b-m9sqtjmtiw] {
  margin: 0 !important;
  color: #1E293B !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  line-height: 24px !important;
  letter-spacing: -0.2px !important;
}

.dds-change-work-type-popup .modal-header .btn-close[b-m9sqtjmtiw] {
  position: absolute;
  top: 12px;
  right: 12px;
  width: 32px !important;
  height: 32px !important;
  margin: 0 !important;
  border: 1px solid rgba(30, 41, 59, 0.06) !important;
  border-radius: 8px !important;
  background-color: rgba(241, 245, 249, 0.8) !important;
  opacity: 1 !important;
}

.dds-change-work-type-popup .modal-body[b-m9sqtjmtiw] {
  flex: 1;
  min-height: 0;
  /* A column flex container, so the body inside can shrink to the space the capped popup
     leaves it. A percentage height cannot do that here: the popup only has a max-height,
     which leaves nothing definite for the percentage to resolve against, and the stop
     table then ran on unclipped behind the footer. */
  display: flex;
  flex-direction: column;
  padding: 0 !important;
  background: #FFFFFF !important;
  border-top: 0 !important;
  overflow: hidden !important;
}

.dds-change-work-type-popup .wm-popup-modal-footer[b-m9sqtjmtiw] {
  min-height: 72px;
  flex-shrink: 0;
  padding: 16px 20px !important;
  gap: 12px !important;
  border-top: 1px solid rgba(30, 41, 59, 0.09) !important;
  background: #FFFFFF !important;
}

.dds-change-work-type-popup .wm-popup-modal-footer button[b-m9sqtjmtiw] {
  min-height: 40px;
  border-radius: 10px;
  font-size: 13px;
  font-weight: 600;
  line-height: 24px;
  letter-spacing: -0.2px;
}

.dds-change-work-type-popup .wm-popup-modal-footer .btn-wm-secondary[b-m9sqtjmtiw] {
  border: 1px solid rgba(30, 41, 59, 0.06);
  background: rgba(241, 245, 249, 0.8);
  color: #1E293B;
}

.dds-change-work-type-popup .wm-popup-modal-footer .btn-wm-primary[b-m9sqtjmtiw] {
  border: none;
  background: #5263FF;
  color: #FFFFFF;
  box-shadow: 0 1px 1px -0.5px rgba(30, 41, 59, 0.03), inset 0 3px 3px rgba(255, 255, 255, 0.12);
}

/* ── Upgrade popup ──
   The chrome of the Free-plan upgrade dialog, in the same place as the blocks above and for the
   same reason: the dialog, content, header and footer elements belong to this component, so a
   scoped rule in WMUpgradePopup cannot reach them. The dialog's own padding lives here; the body
   inside brings its own.

   Width: the default 400px min-width is wider than a phone, so it is dropped and the dialog caps
   at the viewport less a gutter. */
.upgrade-popup .modal-dialog[b-m9sqtjmtiw] {
  width: min(560px, calc(100vw - 32px)) !important;
  min-width: 0 !important;
  max-width: 560px !important;
  margin-inline: auto;
}

.upgrade-popup .wm-popup-modal-content[b-m9sqtjmtiw] {
  padding: 0 !important;
  overflow: hidden;
  border: 1px solid rgba(30, 41, 59, 0.03) !important;
  border-radius: 20px !important;
  background: #ffffff !important;
  box-shadow:
    0 1px 1px -0.5px rgba(30, 41, 59, 0.03),
    0 3px 3px -1.5px rgba(30, 41, 59, 0.03),
    0 20px 20px -12px rgba(30, 41, 59, 0.03),
    0 32px 32px -16px rgba(30, 41, 59, 0.03) !important;
}

.upgrade-popup .modal-header[b-m9sqtjmtiw] {
  position: relative;
  min-height: 80px;
  padding: 20px 60px 16px 24px !important;
  align-items: flex-start !important;
  border-bottom: 1px solid rgba(30, 41, 59, 0.09) !important;
}

.upgrade-popup .modal-header h5.modal-title[b-m9sqtjmtiw] {
  margin: 0 !important;
  color: #1e293b !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  line-height: 24px !important;
  letter-spacing: -0.2px !important;
}

.upgrade-popup .wm-popup-header-subtext[b-m9sqtjmtiw] {
  margin: 0 !important;
  color: #5F6E85 !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  line-height: 20px !important;
  letter-spacing: -0.2px !important;
}

.upgrade-popup .modal-header .btn-close[b-m9sqtjmtiw] {
  position: absolute;
  top: 12px;
  right: 12px;
  width: 32px !important;
  height: 32px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 1px solid rgba(30, 41, 59, 0.06) !important;
  border-radius: 8px !important;
  background-color: rgba(241, 245, 249, 0.8) !important;
  background-size: 10px !important;
  opacity: 1 !important;
}

/* The add-address popup supplied no body padding of its own, so its label, its search box
   and every row in its list sat flush against the popup's edges. !important because
   WMPopup writes padding: 0 inline on .modal-body and each popup opts back in. */
/* The Unable confirmation's own fields are styled by the shared .wm-popup-form primitives in
   css/wm.popup-form.css, NOT here: a .razor.css file is scoped to its own component, and the
   fields are rendered in the consumer's markup, so a rule written here could never reach them.
   That was the bug - the padding below applied because .modal-body is WMPopup's own element,
   and everything aimed at the fields silently did nothing. */

.add-customer-location-popup .modal-body[b-m9sqtjmtiw] {
  padding: 20px 24px !important;
}

.upgrade-popup .modal-body[b-m9sqtjmtiw] {
  max-height: min(520px, 60vh);
  padding: 20px 24px !important;
  border-top: 0 !important;
  overflow-y: auto !important;
}

.upgrade-popup .wm-popup-modal-footer[b-m9sqtjmtiw] {
  min-height: 72px;
  padding: 16px 24px !important;
  gap: 12px !important;
  justify-content: flex-end !important;
  border-top: 1px solid rgba(30, 41, 59, 0.09) !important;
  background: #ffffff !important;
}

.upgrade-popup .wm-popup-modal-footer button[b-m9sqtjmtiw] {
  min-height: 40px;
  margin: 0 !important;
  padding: 0 16px;
  border-radius: 10px;
  font-size: 13px;
  font-weight: 600;
  line-height: 20px;
  letter-spacing: -0.2px;
}

.upgrade-popup .wm-popup-modal-footer .btn-wm-secondary[b-m9sqtjmtiw] {
  border: 1px solid rgba(30, 41, 59, 0.06);
  background: rgba(241, 245, 249, 0.8);
  color: #1e293b;
}

.upgrade-popup .wm-popup-modal-footer .btn-wm-primary[b-m9sqtjmtiw] {
  border: 0;
  background: #5263ff;
  color: #ffffff;
  box-shadow: 0 1px 1px -0.5px rgba(30, 41, 59, 0.03), inset 0 3px 3px rgba(255, 255, 255, 0.12);
}

@media (max-width: 575px) {
  .upgrade-popup .modal-dialog[b-m9sqtjmtiw] {
    width: calc(100vw - 24px) !important;
    margin: 12px auto !important;
  }

  .upgrade-popup .modal-header[b-m9sqtjmtiw] {
    padding: 16px 52px 12px 16px !important;
  }

  .upgrade-popup .modal-body[b-m9sqtjmtiw] {
    padding: 16px !important;
  }

  .upgrade-popup .wm-popup-modal-footer[b-m9sqtjmtiw] {
    padding: 12px 16px !important;
  }
}
/* /Components/Shared/WMTagBox.razor.rz.scp.css */
.custom-tagbox-container[b-yr08r41bmb] {
  width: 100% !important;
  height: 40px !important;
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 0 12px !important;
  cursor: text !important;
  color: #212529 !important;
  background-color: #ffffff !important;
  border: 1px solid #1E293B1F !important;
  border-radius: 10px !important;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05) !important;
  transition: all 0.2s ease-in-out !important;
  outline: none !important;
}

.custom-tagbox-container:hover:not(.disabled)[b-yr08r41bmb] {
  border-color: #eaecff !important;
  background-color: #f8f9fa !important;
}

.custom-tagbox-container:focus[b-yr08r41bmb],
.custom-tagbox-container:focus-within[b-yr08r41bmb] {
  box-shadow: 0 0 0 0.2rem #dce0ff !important;
}

.custom-tagbox-container.disabled[b-yr08r41bmb] {
  background: transparent !important;
  box-shadow: initial !important;
  cursor: not-allowed !important;
}

.custom-tagbox-container.invalid[b-yr08r41bmb] {
  box-shadow: 0 0 0 0.2rem #f0d1d1 !important;
}

.tag-wrapper[b-yr08r41bmb] {
  display: flex !important;
  overflow-x: scroll !important;
  scrollbar-width: none !important;
  gap: 6px !important;
  /* flex: 1 !important; */
}

.tag-chip[b-yr08r41bmb] {
  min-width: max-content !important;
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 4px !important;
  background: #5263ff1f !important;
  color: #363af5 !important;
  padding: 2px 6px !important;
  border-radius: 8px !important;
  font-size: 12px !important;
  font-weight: 600 !important;
}

.tag-chip-icon[b-yr08r41bmb] {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  cursor: pointer !important;
  color: inherit !important;
  background: none !important;
  border: none !important;
}

.tag-chip-icon:disabled[b-yr08r41bmb] {
  /* opacity: 0.6 !important; */
  cursor: not-allowed !important;
}

.tagbox-input[b-yr08r41bmb] {
  border: none !important;
  outline: none !important;
  width: auto !important;
  min-width: 50px !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  color: #212529 !important;
  /* flex: 1 !important; */
  padding: initial !important;
  background: initial !important;
  box-shadow: initial !important;
  border-radius: initial !important;
}

.tagbox-input:focus[b-yr08r41bmb] {
  box-shadow: initial !important;
}

.tagbox-input[b-yr08r41bmb]::placeholder {
  color: #5F6E85 !important;
}

.tagbox-input:disabled[b-yr08r41bmb] {
  background: transparent !important;
  box-shadow: initial !important;
  cursor: not-allowed !important;
}

.custom-checkbox[b-yr08r41bmb] {
  width: 18px !important;
  height: 18px !important;
  border-radius: 6px !important;
  padding: 2px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  transition: all 0.2s !important;
  background: linear-gradient(180deg, #f1f5f9 0%, #ffffff 100%) !important;
  border: 2.5px solid #d9dee3 !important;
  backdrop-filter: blur(24px) !important;
  box-shadow:
    0px 1px 1px -0.5px #1e293b08,
    0px 3px 3px 0px #ffffff1f inset !important;
  flex-shrink: 0 !important;
}

.custom-checkbox.checked[b-yr08r41bmb] {
  background: linear-gradient(180deg, #5263ff 0%, #5263ff 100%) !important;
  color: white !important;
  backdrop-filter: blur(24px) !important;
  box-shadow:
    0px 1px 1px -0.5px #1e293b08,
    0px 3px 3px 0px #ffffff1f inset !important;
  border: none !important;
}

.custom-checkbox-icon[b-yr08r41bmb] {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
}

.custom-dropdown-list[b-yr08r41bmb] {
  max-height: min(250px, 25vh) !important;
  overflow-y: auto !important;
  scrollbar-width: thin !important;
  padding: 4px !important;
}

.dropdown-list-item[b-yr08r41bmb] {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  gap: 10px !important;
  width: 100% !important;
  padding: 10px 10px !important;
  border: none !important;
  background: transparent !important;
  border-radius: 10px !important;
  transition: background-color 0.2s ease !important;
  text-align: left !important;
  margin-bottom: 3px !important;
}

.dropdown-list-item:hover[b-yr08r41bmb] {
  background-color: #eaecff !important;
  cursor: pointer !important;
}

.dropdown-list-item:active[b-yr08r41bmb] {
  background-color: #dce0ff !important;
}

.dropdown-list-item.active-item[b-yr08r41bmb] {
  background-color: #eaecff !important;
  /* border-left: 4px solid #6366f1 !important; */
  /* padding-left: 6px !important; */
}

.item-name[b-yr08r41bmb] {
  font-weight: 600 !important;
  color: #2d3748 !important;
  font-size: 13px !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

.item-name.active-item[b-yr08r41bmb] {
  color: #363af5 !important;
}

.item-metadata[b-yr08r41bmb] {
  text-align: right !important;
  color: #718096 !important;
  font-size: 12px !important;
  max-width: 200px !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  margin-left: 1rem !important;
}
/* /Components/Shared/WMTimePicker.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   WMTimePicker — Scoped Component Styles
   ═══════════════════════════════════════════════════════ */

.wm-time-container[b-4844gjni8v] {
    display: inline-block !important;
    width: 100% !important;
}

.wm-time-input[b-4844gjni8v] {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    width: 100% !important;
    height: 40px !important;
    padding: 0 12px !important;
    background-color: #ffffff !important;
    border: 1px solid #1E293B1F !important;
    border-radius: 10px !important;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05) !important;
    cursor: pointer !important;
    transition: all 0.2s ease-in-out !important;
    outline: none !important;
    user-select: none !important;
}

    .wm-time-input:hover:not(:disabled)[b-4844gjni8v] {
        border-color: #eaecff !important;
        background-color: #f8f9fa !important;
    }

    .wm-time-input:focus[b-4844gjni8v] {
        box-shadow: 0 0 0 0.2rem #dce0ff !important;
    }

    .wm-time-input:disabled[b-4844gjni8v],
    .wm-time-input.disabled[b-4844gjni8v] {
        background: transparent !important;
        box-shadow: initial !important;
        cursor: not-allowed !important;
    }

    .wm-time-input:focus-within[b-4844gjni8v] {
        box-shadow: 0 0 0 0.2rem #dce0ff !important;
    }

    .wm-time-input img[b-4844gjni8v] {
        cursor: pointer !important;
        flex-shrink: 0 !important;
    }

.wm-time-icon[b-4844gjni8v] {
    font-size: 16px !important;
    color: #94A3B8 !important;
    flex-shrink: 0 !important;
}

.wm-time-display[b-4844gjni8v] {
    font-size: 13px !important;
    font-weight: 600 !important;
    color: var(--dark-txt) !important;
    white-space: nowrap !important;
}

input.wm-time-display[b-4844gjni8v] {
    border: none !important;
    background: transparent !important;
    padding: 0 !important;
    width: 100% !important;
    min-width: 0 !important;
    outline: none !important;
    cursor: text !important;
    font-family: inherit !important;
}

    input.wm-time-display:disabled[b-4844gjni8v] {
        cursor: not-allowed !important;
    }

.wm-time-popup[b-4844gjni8v] {
    z-index: 9999 !important;
    background: var(--white) !important;
    border: 1px solid #1E293B17 !important;
    border-radius: 24px !important;
    padding: 8px !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.15) !important;
    width: 112px !important;
}

    /* Three columns on a 12-hour tenant: hours, minutes, AM/PM. */
    .wm-time-popup.wm-time-popup--twelve[b-4844gjni8v] {
        width: 160px !important;
    }

.wm-time-inner[b-4844gjni8v] {
    display: flex !important;
    justify-content: space-between !important;
    align-items: stretch !important;
    height: 200px !important;
    gap: 0 !important;
}

.wm-time-column[b-4844gjni8v] {
    flex: 1 !important;
    height: 200px !important;
    overflow-y: scroll !important;
    scrollbar-width: none !important;
    text-align: center !important;
}

    .wm-time-column[b-4844gjni8v]::-webkit-scrollbar {
        display: none !important;
    }

    /* The period column has two rows and nothing to scroll; it sits at the top like a switch. */
    .wm-time-column.wm-time-period[b-4844gjni8v] {
        overflow-y: hidden !important;
        padding-top: 2px !important;
    }

.wm-time-divider[b-4844gjni8v] {
    width: 1px !important;
    background: #1E293B17 !important;
    margin: 4px 0 !important;
    flex-shrink: 0 !important;
}

.wm-time-item[b-4844gjni8v] {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 40px !important;
    height: 32px !important;
    border-radius: 8px !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    line-height: 16px !important;
    letter-spacing: -0.2px !important;
    color: #94A3B8 !important;
    cursor: pointer !important;
    transition: background-color 0.12s, color 0.12s !important;
    margin: 1px auto !important;
}

    .wm-time-item:hover:not(.selected)[b-4844gjni8v] {
        background-color: #F1F5F9CC !important;
        color: var(--dark-txt) !important;
    }

    .wm-time-item.selected[b-4844gjni8v] {
        background: #ECEEFF !important;
        color: var(--purple) !important;
        font-weight: 700 !important;
    }

    .wm-time-item.disabled[b-4844gjni8v] {
        color: #CBD5E1 !important;
        cursor: not-allowed !important;
        opacity: 0.55 !important;
        background: transparent !important;
    }
/* /Components/Shared/WMTooltip.razor.rz.scp.css */
.tooltip-container[b-uz1quvdbnr] {
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  vertical-align: middle !important;
  flex-shrink: 0 !important;
}
/* /Components/Shared/WMUpgradePopup.razor.rz.scp.css */
/* The dialog's own padding is in WMPopup.razor.css under .upgrade-popup, where the header,
   body and footer elements live. What is left here is the body's own rhythm. */

.upgrade-body[b-8qho30pb3w] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.upgrade-intro[b-8qho30pb3w] {
    margin: 0;
    color: #334155;
    font-size: 14px;
    font-weight: 500;
    line-height: 22px;
    letter-spacing: -0.2px;
}

.upgrade-features[b-8qho30pb3w] {
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

    .upgrade-features li[b-8qho30pb3w] {
        display: flex;
        align-items: flex-start;
        gap: 10px;
        color: #1E293B;
        font-size: 14px;
        font-weight: 500;
        line-height: 22px;
        letter-spacing: -0.2px;
    }

    .upgrade-features li img[b-8qho30pb3w] {
        width: 18px;
        height: 18px;
        margin-top: 2px;
        flex-shrink: 0;
    }

.upgrade-hint[b-8qho30pb3w] {
    margin: 0;
    padding: 12px 14px;
    border-radius: 12px;
    background: rgba(241, 245, 249, 0.8);
    color: #5F6E85;
    font-size: 13px;
    font-weight: 500;
    line-height: 20px;
    letter-spacing: -0.2px;
    overflow-wrap: anywhere;
}
/* /Components/Sidebar.razor.rz.scp.css */
/* css/style.css styles `.sidebar .submenu a` and its :hover but has no .active
   rule, so the selected sub item was indistinguishable. Scoped here rather than
   in the shared stylesheet.
   Every submenu link carries the same pill geometry; .active toggles ONLY the
   background/colour. If the active item had its own padding/margin/border the
   list would reflow on every selection change (items visibly jumped).
   `::deep` is REQUIRED here: these anchors are rendered by the <NavLink> child
   component, so they never receive this component's scope attribute. Without it
   the rule compiles to `.submenu a[b-xxx]` and silently never matches —
   which is why the global style.css rules affect NavLinks but a plain scoped
   rule here does not. */
/* Vertical padding stops the pill margins collapsing through this box's edges.
   Without it the first pill's top margin pushed the whole box down — a 2px
   band of sidebar background between the open header and the box — while the
   pill itself sat flush with the box top. (Only top/bottom: the 12px
   padding-left from css/style.css must survive.) */
.sidebar .submenu[b-a36nujy8a7] {
    padding-top: 4px;
    padding-bottom: 4px;
}

.sidebar .submenu[b-a36nujy8a7]  a {
    /* style.css gives these `padding: 8px 0`; same 16px vertical rhythm here
       (2+6 top, 6+2 bottom), and the -8px margin cancels the side padding so
       the text keeps its x-position. */
    padding: 6px 8px;
    margin: 2px 4px 2px -8px;
    border-radius: 8px;
}

.sidebar .submenu[b-a36nujy8a7]  a.active {
    color: var(--white);
    font-weight: 600;
    background-color: #FFFFFF29;
}

/* Count badges on nav entries (today: open complaints), in the same dress as the
   notification badge below (css/style.css `.sidebar .bottom-sidebar ul li .badge`).
   min-width instead of width so "99+" widens the pill instead of clipping. */
.sidebar .nav-badge[b-a36nujy8a7] {
    height: 18px;
    min-width: 18px;
    padding: 0 5px;
    border-radius: 50px;
    background-color: var(--badge-orange);
    color: var(--white);
    font-size: 10px;
    font-weight: 600;
    flex-shrink: 0;
}

/* Sub items are plain text links; flex here so a badge can sit at the pill's right
   edge without moving the text. Harmless on badge-less links: a lone text node is
   a single flex item at the same spot. */
.sidebar .submenu[b-a36nujy8a7]  a {
    display: flex;
    align-items: center;
}

.sidebar .submenu[b-a36nujy8a7]  a .nav-badge {
    margin-left: auto;
}

/* Logo and bottom-sidebar stay put; only the nav list scrolls, passing under
   the pinned bottom block. Overrides `overflow-y: scroll` from css/style.css
   on this element (scoped CSS wins on specificity) so the sidebar itself
   no longer scrolls as one piece. */
.sidebar[b-a36nujy8a7] {
    overflow: hidden;
}

.sidebar .logo[b-a36nujy8a7] {
    flex-shrink: 0;
}

.sidebar-scroll[b-a36nujy8a7] {
    flex: 1 1 auto;
    min-height: 0; /* without this a flex item refuses to shrink below content height */
    overflow-y: auto;
    scrollbar-width: none;
}

    .sidebar-scroll[b-a36nujy8a7]::-webkit-scrollbar {
        display: none;
    }

.sidebar .bottom-sidebar[b-a36nujy8a7] {
    flex-shrink: 0;
    background-color: var(--blue); /* opaque, so nav items scroll out of sight behind it */
    /* Marks where the scrollable nav ends and the pinned block begins. */
    border-top: 1px solid #FFFFFF1F;
}

.sidebar .bottom-sidebar .avatar[b-a36nujy8a7] {
    gap: 12px;
    margin-top: 9px;
    cursor: pointer;
    padding: 12px 8px;
    border-radius: 14px;
    background: transparent;
    transition: all .2s ease-in-out;
}

    .sidebar .bottom-sidebar .avatar:hover[b-a36nujy8a7] {
        background: #FFFFFF1F;
    }

    .sidebar .bottom-sidebar .avatar .txt[b-a36nujy8a7] {
        flex: 1;
        overflow-wrap: anywhere;
        word-break: normal;
    }

.sidebar-profile-image[b-a36nujy8a7] {
    width: 36px;
    height: 36px;
    border-radius: 100%;
    object-fit: cover;
}

.sidebar .bottom-sidebar .avatar img[b-a36nujy8a7] {
    height: 36px;
}

.sidebar .bottom-sidebar .avatar .avatar-image[b-a36nujy8a7] {
    position: relative;
}

    .sidebar .bottom-sidebar .avatar .avatar-image .badge[b-a36nujy8a7] {
        background: rgba(241, 245, 249, 0.8);
        color: #1E293B;
        border: 1px solid rgba(30, 41, 59, 0.03);
        font-size: 10px;
        font-weight: 600;
        line-height: 14px;
        border-radius: 999px;
        padding: 0 8px;
        width: 25px;
        height: 16px;
        position: absolute;
        bottom: -20%;
        left: 16%;
    }

.sidebar .bottom-sidebar .avatar .txt h6[b-a36nujy8a7] {
    font-size: 13px;
    font-weight: 600;
    color: var(--white);
}

.sidebar .bottom-sidebar .avatar .txt p[b-a36nujy8a7] {
    font-size: 12px;
    font-weight: 500;
    color: #FFFFFF7A;
}

.profile-popover[b-a36nujy8a7] {
    position: relative;
    display: flex;
    width: 360px;
    max-height: calc(100dvh - 32px);
    flex-direction: column;
    background: #fff;
    border-radius: 28px;
    padding: 32px 16px 16px;
    gap: 16px;
    box-shadow: 0 72px 72px -36px #1e293b08, 0 1px 1px -.5px #1e293b08, 0 3px 3px -1.5px #1e293b08, 0 20px 20px -12px #1e293b08, 0 32px 32px -16px #1e293b08, 0 56px 56px -28px #1e293b08;
}

.profile-header[b-a36nujy8a7] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    text-align: center;
}

.profile-popover-close[b-a36nujy8a7] {
    position: absolute;
    top: 16px;
    right: 16px;
    display: grid;
    width: 24px;
    height: 24px;
    padding: 0;
    place-items: center;
    border: 0;
    background: transparent;
}

.profile-popover-close img[b-a36nujy8a7] { width: 20px; height: 20px; }

    .profile-image[b-a36nujy8a7],
    .profile-header .users-avatar[b-a36nujy8a7] {
        width: 48px;
        height: 48px;
        /* margin: 0 auto 8px; */
    }

    .profile-header h5[b-a36nujy8a7] {
        /* margin: 0 0 2px; */
        font-size: 18px;
        font-weight: 800;
        line-height: 24px;
        color: var(--dark-text);
    }

    .profile-header p[b-a36nujy8a7] {
        /* margin: 0 0 12px; */
        font-size: 12px;
        font-weight: 600;
        line-height: 20px;
        color: #5F6E85;
    }

    .profile-header .btn-wm-secondary[b-a36nujy8a7] {
        box-sizing: border-box;
        height: 32px;
        padding-block: 0;
    }

.manage-account-btn[b-a36nujy8a7] {
    height: 32px;
    padding: 0 12px;
    font-size: 12px;
    border-radius: 8px;
    border: none;
    background: #F3F5F9;
}

.profile-footer[b-a36nujy8a7] {
    margin-top: 0;
    /* padding-top: 16px; */
}

.profile-footer .btn-wm-secondary[b-a36nujy8a7] {
    box-sizing: border-box;
    height: 32px;
    padding-block: 0;
}

.logout-btn[b-a36nujy8a7] {
    width: 100%;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    border: 1px solid #E5E7EB;
    border-radius: 8px;
    background: #F8F9FB;
    font-size: 14px;
    font-weight: 500;
}

    .logout-btn:hover[b-a36nujy8a7] {
        background: #EEF1F6;
    }

    .logout-btn img[b-a36nujy8a7] {
        width: 16px;
        height: 16px;
    }

.profile-avatar-wrapper[b-a36nujy8a7] {
    position: relative;
    width: 48px;
    height: 48px;
    /* margin: 0 auto 8px; */
}

    .profile-avatar-wrapper .profile-image[b-a36nujy8a7],
    .profile-avatar-wrapper .users-avatar[b-a36nujy8a7] {
        width: 48px;
        height: 48px;
    }

.avatar-camera-btn[b-a36nujy8a7] {
    position: absolute;
    right: -4px;
    bottom: -4px;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    border: 1px solid #E5E7EB;
    background: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    cursor: pointer;
}

    .avatar-camera-btn img[b-a36nujy8a7] {
        width: 16px;
        height: 16px;
    }
.profile-context-switcher[b-a36nujy8a7] { display: flex; width: 100%; max-height: 336px; flex-direction: column; overflow-y: auto; gap: 4px; overscroll-behavior: contain; scrollbar-width: none; }
.profile-context-switcher[b-a36nujy8a7]::-webkit-scrollbar { display: none; }
.profile-context-group[b-a36nujy8a7] { display: flex; flex-direction: column; gap: 4px; }
.profile-context-group-header[b-a36nujy8a7],
.profile-context-role[b-a36nujy8a7] { display: flex; width: 100%; align-items: center; justify-content: space-between; border: 0; font-family: inherit; text-align: left; }
.profile-context-group-header[b-a36nujy8a7] { height: 36px; padding: 0 16px; border-radius: 4px; background: #e2e8f0; color: #1e293b; font-size: 13px; font-weight: 700; }
.profile-context-group:first-child .profile-context-group-header[b-a36nujy8a7] { border-radius: 24px 24px 4px 4px; }
.profile-context-group:last-child .profile-context-role:last-child[b-a36nujy8a7] { border-radius: 4px 4px 24px 24px; }
.profile-context-group-header img[b-a36nujy8a7] { width: 16px; height: 16px; transition: transform .16s ease; }
.profile-context-group-header img.collapsed[b-a36nujy8a7] { transform: rotate(180deg); }
.profile-context-role[b-a36nujy8a7] { height: 40px; padding: 0 16px; border-radius: 4px; background: #f1f5f9; color: #1e293b; }
.profile-context-role:not(:disabled):hover[b-a36nujy8a7] { background: #5263ff1f; }
.profile-context-role > span[b-a36nujy8a7],
.profile-context-role > small[b-a36nujy8a7] { display: flex; align-items: center; gap: 10px; }
.profile-context-role > span[b-a36nujy8a7] { flex: 1 1 auto; min-width: 0; font-size: 13px; font-weight: 600; }
.profile-context-role > span b[b-a36nujy8a7] { overflow: hidden; font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }
.profile-context-role > span img[b-a36nujy8a7] { flex: 0 0 auto; width: 20px; height: 20px; }
.profile-context-role > small[b-a36nujy8a7] { flex: 0 0 auto; color: #363af5; font-size: 12px; font-weight: 600; }
.profile-context-role > small img[b-a36nujy8a7] { width: 16px; height: 16px; }
.profile-context-role:disabled > small[b-a36nujy8a7] { color: #5F6E85; }


.profile-popover .det-toggle-item[b-a36nujy8a7] {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 12px;
}

.profile-language[b-a36nujy8a7] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin-top: 12px;
}

.profile-language-label[b-a36nujy8a7] {
    font-size: 13px;
    font-weight: 600;
    color: #1E293B;
}

.profile-language-options[b-a36nujy8a7] {
    display: flex;
    gap: 6px;
}

.profile-language-option[b-a36nujy8a7] {
    flex: 1;
    height: 30px;
    border: 1px solid #E5E7EB;
    border-radius: 8px;
    background: #F8F9FB;
    font-size: 13px;
    font-weight: 500;
    color: #1E293B;
}

    .profile-language-option:hover:not(:disabled)[b-a36nujy8a7] {
        background: #EEF1F6;
    }

.profile-language-option--current[b-a36nujy8a7] {
    background: #5263FF1F;
    border-color: #363AF5;
    color: #363AF5;
    font-weight: 600;
    cursor: default;
}

.profile-popover .det-toggle-switch[b-a36nujy8a7] {
    position: relative;
    display: inline-block;
    width: 46px;
    height: 28px;
    background: linear-gradient( 180deg, rgba(226, 232, 240, 1) 0%, rgba(248, 250, 252, 1) 100% );
    border-radius: 50px;
    padding: 3px;
    flex-shrink: 0;
}

    .profile-popover .det-toggle-switch input[b-a36nujy8a7] {
        opacity: 0;
        width: 0;
        height: 0;
    }

.profile-popover .det-toggle-slider[b-a36nujy8a7] {
    position: absolute;
    cursor: pointer;
    border-radius: 30px;
    background-color: #d3dde8;
    transition: 0.3s;
    height: 22px;
    width: 40px;
}

    .profile-popover .det-toggle-slider[b-a36nujy8a7]:before {
        content: "";
        position: absolute;
        height: 18px;
        width: 18px;
        left: 2px;
        top: 2px;
        border-radius: 1000px;
        background: linear-gradient(180deg, #e2e8f0 0%, #ffffff 100%);
        border: 3.5px solid #f9fbfc;
        box-shadow: 0 2px 4px rgba(0, 0, 0, 0.15);
        transition: 0.3s;
    }

.profile-popover .det-toggle-switch input:checked + .det-toggle-slider[b-a36nujy8a7] {
    background: linear-gradient(135deg, #5b67f6, #4c57e0);
}

    .profile-popover .det-toggle-switch input:checked + .det-toggle-slider[b-a36nujy8a7]:before {
        transform: translateX(18px);
        background: #fff;
    }

    .profile-popover .det-toggle-switch input:checked + .det-toggle-slider[b-a36nujy8a7]:after {
        content: "";
        position: absolute;
        right: 5px;
        top: 7.5px;
        width: 11px;
        height: 11px;
        background-image: url("../img/icons/toggle-check-icon.svg");
        background-size: contain;
        background-repeat: no-repeat;
    }

.profile-popover .det-toggle-label[b-a36nujy8a7] {
    font-size: 13px;
    font-weight: 600;
    color: var(--dark-txt);
}

/* Free plan: the upgrade call sits above the account card, inside the pinned block. */
.sidebar .bottom-sidebar .upgrade-btn[b-a36nujy8a7] {
    width: calc(100% - 16px);
    margin: 12px 8px 0;
    padding: 9px 12px;
    border: 0;
    border-radius: 8px;
    background: #FFFFFF;
    color: var(--blue);
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
}

    .sidebar .bottom-sidebar .upgrade-btn img[b-a36nujy8a7] {
        width: 16px;
        height: 16px;
    }

    .sidebar .bottom-sidebar .upgrade-btn:hover[b-a36nujy8a7] {
        background: #EEF2FF;
    }
/* /Components/Spinner.razor.rz.scp.css */
.spinner-container[b-22id7vstqo] {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
}

.spinner-main[b-22id7vstqo] {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  animation: spin-b-22id7vstqo 1s linear infinite;
  border: 3.5px solid currentColor;
  border-top-color: transparent;
}

@keyframes spin-b-22id7vstqo {
  to {
    transform: rotate(360deg);
  }
}
/* /Components/TenantSwitcher.razor.rz.scp.css */
/* The tenant list in the profile menu. Sized to sit inside the sidebar's profile popover,
   which is the narrower of its two hosts; the account popup gives it more room than it asks
   for, which is the harmless direction. */
.tenant-switcher[b-7cdpxijs7z] {
    padding: 12px 16px;
    border-bottom: 1px solid #E5E7EB;
}

.tenant-switcher-title[b-7cdpxijs7z] {
    margin-bottom: 10px;
    font-size: 13px;
    font-weight: 700;
    color: #1F2937;
}

.tenant-list[b-7cdpxijs7z] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.tenant-item[b-7cdpxijs7z] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    width: 100%;
    padding: 10px 14px;
    text-align: left;
    background: #FFFFFF;
    border: 1px solid #E5E7EB;
    border-radius: 8px;
    cursor: pointer;
}

    .tenant-item:hover:not(:disabled)[b-7cdpxijs7z] {
        border-color: #363AF5;
        background: #F5F6FF;
    }

    /* The current company is disabled because clicking it does nothing, but it is the one row
       that must not look unavailable, so it keeps full contrast and an ordinary cursor. */
    .tenant-item:disabled[b-7cdpxijs7z] {
        cursor: default;
    }

    .tenant-item.current[b-7cdpxijs7z] {
        border-color: #363AF5;
        background: #F5F6FF;
    }

.tenant-item-text[b-7cdpxijs7z] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.tenant-name[b-7cdpxijs7z] {
    font-size: 14px;
    font-weight: 600;
    color: var(--dark-txt);
    overflow-wrap: anywhere;
}

.tenant-roles[b-7cdpxijs7z] {
    font-size: 12px;
    font-weight: 500;
    color: #5F6E85;
}

.tenant-current-badge[b-7cdpxijs7z] {
    flex-shrink: 0;
    font-size: 12px;
    font-weight: 600;
    color: #363AF5;
}

.tenant-switch-hint[b-7cdpxijs7z] {
    flex-shrink: 0;
    font-size: 12px;
    font-weight: 500;
    color: #5F6E85;
}
/* /Components/WMToastContainer.razor.rz.scp.css */
:root[b-q093slg542] {
  --white: #fff;
  --dark-txt: #1e293b;
  --gray-txt: #475569;
  --gray-txt-2: #5F6E85;
  --purple: #5263ff;
  --purple-2: #363af5;
}

.toast-wrapper[b-q093slg542] {
  position: fixed;
  top: 24px;
  right: 24px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  z-index: 999999;
  max-height: 90vh;
  overflow: visible;
}

@media (max-width: 768px) {
  .toast-wrapper[b-q093slg542] {
    right: 4px;
  }
}

@media (max-width: 320px) {
  .toast-wrapper[b-q093slg542] {
    right: 2px;
  }
}

.custom-toast[b-q093slg542] {
  position: relative;
  width: 400px;
  max-width: 95%;
  /* Level tints (e.g. .custom-toast.green in style.css) paint THIS box, while the card inside
     is rounded — without a matching radius the tint showed as square corners sticking out
     behind the toast. */
  border-radius: 16px;
  z-index: 999999;
  opacity: 0;
  visibility: hidden;
  transform: translateX(40px) scale(0.95);
  transition: all 0.3s ease;
}

@media (max-width: 768px) {
  .custom-toast[b-q093slg542] {
    width: 350px;
  }
}

@media (max-width: 320px) {
  .custom-toast[b-q093slg542] {
    width: 300px;
  }
}

.custom-toast.show[b-q093slg542] {
  opacity: 1;
  visibility: visible;
  transform: translateX(0) scale(1);
  /* transform: translateY(0); */
}

.custom-toast:hover[b-q093slg542] {
  cursor: default;
}

.toast-content[b-q093slg542] {
  position: relative;
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 10px 12px;
  border-radius: 16px;
  background: var(--white);
  box-shadow: 0 8px 16px rgba(0, 0, 0, 0.05);
  border: 1px solid #1e293b1f;
}

.toast-icon[b-q093slg542] {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: #5263ff1f;
  display: flex;
  align-items: center;
  justify-content: center;
}

.wrap-long-text[b-q093slg542] {
  overflow-wrap: anywhere;
  word-break: normal;
}

.toast-center h6[b-q093slg542] {
  font-weight: 600;
  color: var(--dark-txt);
}

.toast-center p[b-q093slg542] {
  font-size: 14px;
  color: var(--gray-txt);
  /* The detail arrives as one line per problem. Without this HTML collapses them into a
     paragraph, which is exactly the wall of text the line breaks exist to avoid. */
  white-space: pre-line;
}

.toast-close[b-q093slg542] {
  width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #ffffff80;
  border-radius: 50%;
  border: 1px #1e293b17 solid !important;
  box-shadow: 0 2px 1.5px -0.5px #1e293b08 !important;
  cursor: pointer;
}

.toast-close img[b-q093slg542] {
  height: 11px;
  width: 11px;
  position: relative;
  left: 0.7px;
  top: 0.5px;
}

/* Icon Backgrounds */
.custom-toast.green .toast-icon[b-q093slg542] {
  /* background: #10b981; */
  background: rgba(16, 185, 129, 0.1);
}
.custom-toast.blue .toast-icon[b-q093slg542] {
  /* background: #3b82f6; */
  background: rgba(59, 130, 246, 0.1);
}
.custom-toast.yellow .toast-icon[b-q093slg542] {
  /* background: #f59e0b; */
  background: rgba(245, 158, 11, 0.1);
}
.custom-toast.red .toast-icon[b-q093slg542] {
  /* background: #ef4444; */
  background: rgba(239, 68, 68, 0.1);
}

/* Icon SVG */
.toast-icon img[b-q093slg542] {
  /* filter: brightness(0) invert(1); */
  width: 18px;
  height: 18px;
  position: relative;
  left: 0.35px;
  top: 0.4px;
}
/* /Pages/Authentication/ChangePassword.razor.rz.scp.css */
*[b-d45qd0wgpo] {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    font-family: "Inter", sans-serif;
}

body[b-d45qd0wgpo] {
    height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
    background: #f3f4f6;
}

.changepassword-card[b-d45qd0wgpo] {
    width: 460px;
    background: #ffffff;
    padding: 40px 30px;
    border-radius: 12px;
    box-shadow: 0 8px 20px rgba(0,0,0,0.08);
}

    .changepassword-card h2[b-d45qd0wgpo] {
        text-align: center;
        margin-bottom: 25px;
        font-weight: 600;
        color: #111827;
    }

.input-groups[b-d45qd0wgpo] {
    margin-bottom: 15px;
}

    .input-groups input[b-d45qd0wgpo] {
        height: 40px;
        width: 100%;
        padding: 8px 10px !important;
        background-color: var(--white) !important;
        border: 1px #1E293B1F solid !important;
        border-radius: 10px !important;
        box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05) !important;
        outline: none !important;
        font-size: 13px !important;
        font-weight: 600 !important;
        line-height: 24px !important;
        letter-spacing: -0.2px !important;
        color: var(--dark-txt) !important;
    }

        .input-groups input:focus[b-d45qd0wgpo] {
            box-shadow: 0 0 0 0.2rem #dce0ff !important;
        }

.changepassword-btn[b-d45qd0wgpo] {
    width: 100%;
}

.password-toggle-btn[b-d45qd0wgpo] {
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
}

    .password-toggle-btn:hover[b-d45qd0wgpo] {
        background-color: #f8f9fa !important;
    }

.changepassword-card input.focus-invalid:focus[b-d45qd0wgpo] {
    box-shadow: 0 0 0 0.2rem #ED4030 !important;
}

.changepassword-card input.focus-valid:focus[b-d45qd0wgpo] {
    box-shadow: 0 0 0 0.2rem #337C33 !important;
}

.password-requirment img[b-d45qd0wgpo] {
    height: 18px;
}

.password-requirment span[b-d45qd0wgpo] {
    font-size: 13px;
    font-weight: 600;
    line-height: 20px;
    letter-spacing: -0.2px;
}

    .password-requirment span.black-txt[b-d45qd0wgpo] {
        color: var(--dark-txt);
    }

    .password-requirment span.gray-txt[b-d45qd0wgpo] {
        color: var(--gray-txt);
    }

.password-requirment .w-40[b-d45qd0wgpo] {
    width: 40%;
}

input[type="password"][b-d45qd0wgpo]::-ms-reveal,
input[type="password"][b-d45qd0wgpo]::-ms-clear {
    display: none;
}
/* /Pages/Authentication/Components/LoginPopup.razor.rz.scp.css */
.owner-initial[b-av6syomrvw] {
  background-image: initial;
  height: initial;
  width: initial;
  background-repeat: initial;
  background-position: initial;
  background-size: initial;
  position: initial;
}

.layer-initial[b-av6syomrvw] {
  height: initial;
  width: initial;
  background-color: initial;
  position: initial;
  z-index: initial;
}

.modal-main-initial[b-av6syomrvw] {
  height: initial;
  width: initial;
}

.options[b-av6syomrvw] {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 13px;
  margin-bottom: 20px;
}

.options a[b-av6syomrvw] {
  text-decoration: none;
  cursor: pointer;
  color: #0D6EFD;
}

.options a:hover[b-av6syomrvw] {
  color: darkblue;
}

.options label[b-av6syomrvw] {
  display: flex;
  align-items: center;
  gap: 5px;
  cursor: pointer;
}

.password-toggle-btn[b-av6syomrvw] {
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
}

    .password-toggle-btn:hover[b-av6syomrvw] {
        background-color: #f8f9fa !important;
    }

input[type="password"][b-av6syomrvw]::-ms-reveal,
input[type="password"][b-av6syomrvw]::-ms-clear {
    display: none;
}
/* Signup entry point, inherited from the removed landing page. A text link, so it
   does not compete with Sign in — the app styles bare buttons as filled pills. */
.login-signup-link[b-av6syomrvw],
.login-signup-link:hover[b-av6syomrvw],
.login-signup-link:focus[b-av6syomrvw],
.login-signup-link:active[b-av6syomrvw] {
    margin-top: 14px;
    border: none !important;
    background: none !important;
    box-shadow: none !important;
    border-radius: 0 !important;
    padding: 2px !important;
    height: auto !important;
    width: auto !important;
    font-size: 13px;
    font-weight: 600;
    color: #363AF5 !important;
    letter-spacing: -0.2px;
    cursor: pointer;
}

.login-signup-link:hover[b-av6syomrvw] {
    text-decoration: underline;
}
/* /Pages/Authentication/Components/SignupPopup.razor.rz.scp.css */
.owner-initial[b-b094knuwps] {
  background-image: initial;
  height: initial;
  width: initial;
  background-repeat: initial;
  background-position: initial;
  background-size: initial;
  position: initial;
}

.layer-initial[b-b094knuwps] {
  height: initial;
  width: initial;
  background-color: initial;
  position: initial;
  z-index: initial;
}

.modal-main-initial[b-b094knuwps] {
  height: initial;
  width: initial;
}

.options[b-b094knuwps] {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 13px;
  margin-bottom: 20px;
}

.options a[b-b094knuwps] {
  text-decoration: none;
  /*color: #111827;*/
}

.options label[b-b094knuwps] {
  display: flex;
  align-items: center;
  gap: 5px;
  cursor: pointer;
}

.owner-register label span.red[b-b094knuwps] {
    font-size: 13px;
    font-weight: 600;
    line-height: 20px;
    letter-spacing: -0.2px;
    color: var(--orange);
}

.phone-group[b-b094knuwps] {
    width: 100% !important;
    height: fit-content !important;
    display: flex !important;
    align-items: stretch !important;
    border: 1px solid #1E293B1F !important;
    border-radius: 10px !important;
    background: #fff !important;
    background-color: var(--white) !important;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05) !important;
    overflow: hidden !important;
}

    .phone-group:focus[b-b094knuwps],
    .phone-group:focus-within[b-b094knuwps] {
        box-shadow: 0 0 0 0.2rem #dce0ff !important;
    }

    .phone-group input:focus[b-b094knuwps],
    .phone-group input:focus-within[b-b094knuwps] {
        box-shadow: none !important;
    }

    .phone-group:hover:not(.disabled)[b-b094knuwps] {
        border-color: #eaecff !important;
    }

    .phone-group.disabled[b-b094knuwps] {
        background: transparent !important;
        box-shadow: initial !important;
        cursor: not-allowed !important;
    }

.phone-group-divider[b-b094knuwps] {
    width: 1px !important;
    height: 40px !important;
    background-color: #1E293B1F;
    flex-shrink: 0 !important;
}

.phone-input[b-b094knuwps] {
    flex: 1 !important;
    height: 40px !important;
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
    background: transparent !important;
    padding: 0 12px !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    color: #212529 !important;
    min-width: 0 !important;
    border-radius: 0px !important;
}

    .phone-input[b-b094knuwps]::placeholder {
        color: #5F6E85 !important;
    }

[b-b094knuwps] .dropdown:has(> .user-phone-code) {
    width: fit-content !important;
    height: 40px !important;
    display: flex !important;
    align-items: stretch !important;
}

[b-b094knuwps] .user-phone-code {
    box-shadow: none !important;
    border-radius: 0 !important;
    height: 40px !important;
    width: 100px !important;
    white-space: nowrap;
    border: none !important;
}

    [b-b094knuwps] .user-phone-code:focus {
        box-shadow: none !important;
    }

.close-btn[b-b094knuwps] {
    margin-top: 12px;
    padding: 12px;
    background-color: var(--purple);
    border: 1px #1E293B17 solid;
    border-radius: 50px;
    font-size: 15px;
    font-weight: 600;
    line-height: 24px;
    letter-spacing: -0.2px;
    color: var(--white);
    backdrop-filter: blur(24px);
    box-shadow: 0px 1px 1px -0.5px #1E293B08, 0px 3px 3px 0px #FFFFFF1F inset;
    outline: none;
}

.password-toggle-btn[b-b094knuwps] {
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
}

    .password-toggle-btn:hover[b-b094knuwps] {
        background-color: #f8f9fa !important;
    }

.owner-register input.focus-invalid:focus[b-b094knuwps] {
    box-shadow: 0 0 0 0.2rem #ED4030 !important;
}

.owner-register input.focus-valid:focus[b-b094knuwps] {
    box-shadow: 0 0 0 0.2rem #337C33 !important;
}

input[type="password"][b-b094knuwps]::-ms-reveal,
input[type="password"][b-b094knuwps]::-ms-clear {
    display: none;
}
/* /Pages/Authentication/ConfirmEmail.razor.rz.scp.css */
/* Centered Page Layout for ConfirmEmail */
.confirm-email-page-wrapper[b-s4pl7j9qjg] {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
  background-color: #F1F5F9;
  font-family: 'Outfit', 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

/* Header placement */
.confirm-email-header[b-s4pl7j9qjg] {
  padding: 40px;
}

.confirm-email-header .logo img[b-s4pl7j9qjg] {
  height: 28px;
}

/* Content centering wrapper */
.confirm-email-content[b-s4pl7j9qjg] {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-grow: 1;
  padding: 20px;
  margin-top: -68px;
}

.confirm-email-card[b-s4pl7j9qjg] {
  width: 400px;
  min-height: 296px;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}

/* Spinner styling */
.confirm-email-spinner[b-s4pl7j9qjg] {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 296px;
  color: #5263FF;
}

/* Icon container */
.confirm-email-icon[b-s4pl7j9qjg] {
  width: 65px;
  height: 66px;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-bottom: 32px;
}

.confirm-email-icon.success svg[b-s4pl7j9qjg] {
  display: block;
}

/* Titles */
.confirm-title[b-s4pl7j9qjg] {
    font-size: 42px;
    font-weight: 700;
    line-height: 48px;
    margin: 0 0 8px 0;
    letter-spacing: -1px;
    font-family: "Plus Jakarta Sans", sans-serif;
}

.confirm-title.error[b-s4pl7j9qjg] {
  color: #DC2626;
}

/* Subtitle description */
.confirm-subtitle[b-s4pl7j9qjg] {
    font-size: 18px;
    font-weight: 700;
    line-height: 24px;
    color: #475569;
    margin: 0 0 32px 0;
    letter-spacing: -0.2px;
    font-family: "Plus Jakarta Sans", sans-serif;
}

.confirm-subtitle.error-text[b-s4pl7j9qjg] {
  color: #E11D48;
}

/* Main action button */
.confirm-btn[b-s4pl7j9qjg] {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 48px;
  background-color: #5263FF;
  color: #FFFFFF !important;
  font-size: 15px;
  font-weight: 600;
  text-decoration: none;
  border-radius: 999px;
  border: none;
  transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
}


.confirm-btn:active[b-s4pl7j9qjg] {
  transform: translateY(0);
}

.confirm-btn.btn-fail[b-s4pl7j9qjg] {
  background-color: #DC2626;
}

.confirm-btn.btn-fail:hover[b-s4pl7j9qjg] {
  background-color: #B91C1C;
  box-shadow: 0 4px 12px rgba(220, 38, 38, 0.25);
}
/* /Pages/Authentication/ForgotPassword.razor.rz.scp.css */
*[b-nkcspmn8n1] {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    font-family: "Inter", sans-serif;
}

.forgot-password-page[b-nkcspmn8n1] {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 100vh;
    padding: 24px 16px;
}

.forgot-password-card[b-nkcspmn8n1] {
    display: flex;
    flex-direction: column;
    gap: 20px;
    background: var(--white);
    border-radius: 12px;
    padding: 40px 30px;
    box-shadow: 0 8px 20px rgba(0,0,0,0.08);
    width: 100%;
    max-width: 460px;
}

.forgot-password-card h2[b-nkcspmn8n1] {
    text-align: center;
    color: #111827;
    font-size: 25px;
    font-weight: 600;
    margin: 0;
}

.forgot-password-card p[b-nkcspmn8n1] {
    margin: 0;
}

/* Body copy under a heading: the product's small-text scale, not a browser default. */
.forgot-password-description[b-nkcspmn8n1] {
    text-align: center;
    font-size: 13px;
    font-weight: 500;
    line-height: 20px;
    letter-spacing: -0.2px;
    color: var(--gray-txt-2);
}

/* Success state, laid out like ConfirmEmail's: icon, title, one line of copy,
   then a single primary action. */
.forgot-password-sent[b-nkcspmn8n1] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 12px;
}

.forgot-password-sent-icon[b-nkcspmn8n1] {
    width: 65px;
    height: auto;
}

.forgot-password-card h2.forgot-password-sent-title[b-nkcspmn8n1] {
    font-size: 22px;
    line-height: 28px;
    letter-spacing: -0.4px;
}

.forgot-password-divider[b-nkcspmn8n1] {
    margin: 0;
    border: none;
    border-top: 1px solid #1E293B14;
    opacity: 1;
}

/* Full-width variant of the shared btn-wm-* buttons; anchors carry them too,
   so the underline has to go. */
.forgot-password-action[b-nkcspmn8n1] {
    width: 100%;
    text-decoration: none;
}

.forgot-password-errors[b-nkcspmn8n1] {
    overflow-wrap: anywhere;
    word-break: normal;
    margin-bottom: 15px;
}

.forgot-password-error[b-nkcspmn8n1] {
    font-size: 13px;
    font-weight: 500;
    line-height: 20px;
    letter-spacing: -0.2px;
    color: var(--danger);
    text-align: center;
}

.forgot-password-error-list[b-nkcspmn8n1] {
    list-style-type: disc;
    list-style-position: outside;
    padding-left: 20px;
}

.forgot-password-error-list .forgot-password-error[b-nkcspmn8n1] {
    text-align: left;
}

.input-group[b-nkcspmn8n1] {
    margin-bottom: 15px;
}

    .input-group input[b-nkcspmn8n1] {
        height: 40px;
        width: 100%;
        padding: 8px 10px !important;
        background-color: var(--white) !important;
        border: 1px #1E293B1F solid !important;
        border-radius: 10px !important;
        box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05) !important;
        outline: none !important;
        font-size: 13px !important;
        font-weight: 600 !important;
        line-height: 24px !important;
        letter-spacing: -0.2px !important;
        color: var(--dark-txt) !important;
    }

        .input-group input:focus[b-nkcspmn8n1] {
            box-shadow: 0 0 0 0.2rem #dce0ff !important;
        }

@media (max-width: 480px) {
    .forgot-password-card[b-nkcspmn8n1] {
        padding: 32px 20px;
    }

    .forgot-password-card h2[b-nkcspmn8n1] {
        font-size: 22px;
    }

    .forgot-password-card h2.forgot-password-sent-title[b-nkcspmn8n1] {
        font-size: 20px;
        line-height: 26px;
    }
}
/* /Pages/Authentication/register.razor.rz.scp.css */
.owner-initial[b-vkcdlhu4qk] {
  background-image: initial;
  height: initial;
  width: initial;
  background-repeat: initial;
  background-position: initial;
  background-size: initial;
  position: initial;
}

.layer-initial[b-vkcdlhu4qk] {
  height: initial;
  width: initial;
  background-color: initial;
  position: initial;
  z-index: initial;
}

.modal-main-initial[b-vkcdlhu4qk] {
  height: initial;
  width: initial;
}

.options[b-vkcdlhu4qk] {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 13px;
  margin-bottom: 20px;
}

.options a[b-vkcdlhu4qk] {
  text-decoration: none;
  /*color: #111827;*/
}

.options label[b-vkcdlhu4qk] {
  display: flex;
  align-items: center;
  gap: 5px;
  cursor: pointer;
}

/*Phone group - START*/

.phone-group[b-vkcdlhu4qk] {
    width: 100% !important;
    height: fit-content !important;
    display: flex !important;
    align-items: stretch !important;
    border: 1px solid #1E293B1F !important;
    border-radius: 10px !important;
    background: #fff !important;
    background-color: var(--white) !important;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05) !important;
    overflow: hidden !important;
}

    .phone-group:focus[b-vkcdlhu4qk],
    .phone-group:focus-within[b-vkcdlhu4qk] {
        box-shadow: 0 0 0 0.2rem #dce0ff !important;
    }

    .phone-group input:focus[b-vkcdlhu4qk],
    .phone-group input:focus-within[b-vkcdlhu4qk] {
        box-shadow: none !important;
    }

    .phone-group:hover:not(.disabled)[b-vkcdlhu4qk] {
        border-color: #eaecff !important;
    }

    .phone-group.disabled[b-vkcdlhu4qk] {
        background: transparent !important;
        box-shadow: initial !important;
        cursor: not-allowed !important;
    }

.phone-group-divider[b-vkcdlhu4qk] {
    width: 1px !important;
    height: 40px !important;
    background-color: #1E293B1F;
    flex-shrink: 0 !important;
}

.phone-input[b-vkcdlhu4qk] {
    flex: 1 !important;
    height: 40px !important;
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
    background: transparent !important;
    padding: 0 12px !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    color: #212529 !important;
    min-width: 0 !important;
    border-radius: 0px !important;
}

    .phone-input[b-vkcdlhu4qk]::placeholder {
        color: #5F6E85 !important;
    }

[b-vkcdlhu4qk] .dropdown:has(> .user-phone-code) {
    width: fit-content !important;
    height: 40px !important;
    display: flex !important;
    align-items: stretch !important;
}

/* A selected country is "+45" behind a flag and fits the 100px this used to be fixed at. Nothing
   selected is the localised "Select phone code", which did not: it was clipped to "Select p...",
   which reads as a broken control on a field marked required. The floor keeps the selected state
   lined up with the rest of the form; the cap stops the placeholder from crowding out the number
   input at phone widths. */
[b-vkcdlhu4qk] .user-phone-code {
    box-shadow: none !important;
    border-radius: 0 !important;
    height: 40px !important;
    width: fit-content !important;
    min-width: 100px !important;
    max-width: 190px !important;
    white-space: nowrap;
    border: none !important;
}

    [b-vkcdlhu4qk] .user-phone-code:focus {
        box-shadow: none !important;
    }

/*Phone group - END*/

.owner-register label span.red[b-vkcdlhu4qk] {
    font-size: 13px;
    font-weight: 600;
    line-height: 20px;
    letter-spacing: -0.2px;
    color: var(--orange);
}

.password-toggle-btn[b-vkcdlhu4qk] {
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
}

    .password-toggle-btn:hover[b-vkcdlhu4qk] {
        background-color: #f8f9fa !important;
    }

.owner-register input.focus-invalid:focus[b-vkcdlhu4qk] {
    box-shadow: 0 0 0 0.2rem #ED4030 !important;
}

.owner-register input.focus-valid:focus[b-vkcdlhu4qk] {
    box-shadow: 0 0 0 0.2rem #337C33 !important;
}

input[type="password"][b-vkcdlhu4qk]::-ms-reveal,
input[type="password"][b-vkcdlhu4qk]::-ms-clear {
    display: none;
}
/* Form column and picture, bottoms aligned.

   They are siblings in a flex row that centres its items, so each took its own content height:
   the picture stood at its own 768px cap while the form column ended wherever the Create account
   button fell, and the two bottom edges did not meet. Stretching the row and taking the picture
   out of the height calculation makes it exactly as tall as the form beside it, so the bottoms
   line up whatever the form grows to - an error message above the button, a longer language. */
.owner-initial .cstm-modal[b-vkcdlhu4qk] {
    align-items: stretch !important;
}

.owner-initial .cstm-modal > .right > .owner-image[b-vkcdlhu4qk] {
    position: absolute;
    inset: 0;
    max-height: none;
}
/* /Pages/Authentication/RegisterBusiness.razor.rz.scp.css */
.logout-btn[b-f6ra8l0zw6] {
  padding: 6px;
  border-radius: 6px;
  cursor: pointer;
}

.logout-btn:hover[b-f6ra8l0zw6] {
  background-color: #dadada;
}

/*New changes*/

/*.owner-register label span.red {
    font-size: 13px;
    font-weight: 600;
    line-height: 20px;
    letter-spacing: -0.2px;
    color: var(--orange);
}*/

.phone-group[b-f6ra8l0zw6] {
    width: 100% !important;
    height: fit-content !important;
    display: flex !important;
    align-items: stretch !important;
    border: 1px solid #1E293B1F !important;
    border-radius: 10px !important;
    background: #fff !important;
    background-color: var(--white) !important;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05) !important;
    overflow: hidden !important;
}

    .phone-group:focus[b-f6ra8l0zw6],
    .phone-group:focus-within[b-f6ra8l0zw6] {
        box-shadow: 0 0 0 0.2rem #dce0ff !important;
    }

    .phone-group input:focus[b-f6ra8l0zw6],
    .phone-group input:focus-within[b-f6ra8l0zw6] {
        box-shadow: none !important;
    }

    .phone-group:hover:not(.disabled)[b-f6ra8l0zw6] {
        border-color: #eaecff !important;
    }

    .phone-group.disabled[b-f6ra8l0zw6] {
        background: transparent !important;
        box-shadow: initial !important;
        cursor: not-allowed !important;
    }

.phone-group-divider[b-f6ra8l0zw6] {
    width: 1px !important;
    height: 40px !important;
    background-color: #1E293B1F;
    flex-shrink: 0 !important;
}

.phone-input[b-f6ra8l0zw6] {
    flex: 1 !important;
    height: 40px !important;
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
    background: transparent !important;
    padding: 0 12px !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    color: #212529 !important;
    min-width: 0 !important;
    border-radius: 0px !important;
}

    .phone-input[b-f6ra8l0zw6]::placeholder {
        color: #5F6E85 !important;
    }

[b-f6ra8l0zw6] .dropdown:has(> .user-phone-code) {
    width: fit-content !important;
    height: 40px !important;
    display: flex !important;
    align-items: stretch !important;
}

[b-f6ra8l0zw6] .user-phone-code {
    box-shadow: none !important;
    border-radius: 0 !important;
    height: 40px !important;
    width: 100px !important;
    white-space: nowrap;
    border: none !important;
}

    [b-f6ra8l0zw6] .user-phone-code:focus {
        box-shadow: none !important;
    }

.three-dropdown form input[b-f6ra8l0zw6], .three-dropdown form textarea[b-f6ra8l0zw6] {
    height: 40px;
    padding: 8px 10px !important;
    background-color: var(--white) !important;
    border: 1px #1E293B1F solid !important;
    border-radius: 10px !important;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05) !important;
    outline: none !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    line-height: 24px !important;
    letter-spacing: -0.2px !important;
    color: var(--dark-txt) !important;
}

    .three-dropdown form input:focus[b-f6ra8l0zw6], .three-dropdown form textarea:focus[b-f6ra8l0zw6] {
        box-shadow: 0 0 0 0.2rem #dce0ff !important;
    }

.tax-id-wrapper[b-f6ra8l0zw6] {
    position: relative;
}

    .tax-id-wrapper input[b-f6ra8l0zw6] {
        width: 100%;
        padding-right: 80px; /* button ke liye space */
    }

    .tax-id-wrapper .find-btn[b-f6ra8l0zw6] {
        position: absolute;
        top: 49%;
        right: 4px;
        transform: translateY(-50%);
        min-width: 56px;
        height: 33px;
        padding: 0 12px;
    }

.season-date-group[b-f6ra8l0zw6] {
    width: 100% !important;
    height: fit-content !important;
    display: flex !important;
    align-items: stretch !important;
    border: 1px solid #1E293B1F !important;
    border-radius: 10px !important;
    background: #fff !important;
    background-color: var(--white) !important;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05) !important;
    overflow: hidden !important;
}

    .season-date-group:focus-within[b-f6ra8l0zw6] {
        box-shadow: 0 0 0 0.2rem #dce0ff !important;
    }

    .season-date-group:hover:not(.disabled)[b-f6ra8l0zw6] {
        border-color: #eaecff !important;
    }

.season-date-divider[b-f6ra8l0zw6] {
    width: 1px !important;
    height: 40px !important;
    background-color: #1E293B1F;
    flex-shrink: 0 !important;
}

[b-f6ra8l0zw6] .dropdown:has(> .season-date-day) {
    width: fit-content !important;
    height: 40px !important;
    display: flex !important;
    align-items: stretch !important;
}

[b-f6ra8l0zw6] .season-date-day {
    box-shadow: none !important;
    border-radius: 0 !important;
    height: 40px !important;
    width: 90px !important;
    white-space: nowrap;
    border: none !important;
}

    [b-f6ra8l0zw6] .season-date-day:focus {
        box-shadow: none !important;
    }

[b-f6ra8l0zw6] .dropdown:has(> .season-date-month) {
    width: 100% !important;
    height: 40px !important;
    display: flex !important;
    align-items: stretch !important;
}

[b-f6ra8l0zw6] .season-date-month {
    box-shadow: none !important;
    border-radius: 0 !important;
    height: 40px !important;
    width: 100% !important;
    white-space: nowrap;
    border: none !important;
}

    [b-f6ra8l0zw6] .season-date-month:focus {
        box-shadow: none !important;
    }

.business-onboarding .three-dropdown .cstm-dropdown .cstm-dropdown-data[b-f6ra8l0zw6]  .inner {
    opacity: 1 !important;
    /*transform: translateY(0) !important;*/
    transform: none !important;
    padding-left: 4px !important;
    padding-right: 4px !important;
}

.upload-img-box[b-f6ra8l0zw6] {
    height: 64px;
    background-color: #F1F5F9 !important;
    border: 1px #1E293B1F dashed !important;
    padding: 16px !important;
    border-radius: 16px !important;
    border-width: 2px !important;
    border-style: dashed !important;
}

    .upload-img-box.img-box-loading[b-f6ra8l0zw6] {
        height: 64px;
    }

    .upload-img-box label:hover[b-f6ra8l0zw6] {
        opacity: 0.9 !important;
    }

    .upload-img-box.dragging[b-f6ra8l0zw6] {
/*        border-color: #1E293B1F !important;
        background-color: #F1F5F9 !important;
        transform: scale(1.01) !important;
        transition: all 0.2s ease !important;*/
        border-color: var(--purple) !important;
        background-color: #f5f3ff !important;
        transform: scale(1.01) !important;
        transition: all 0.2s ease !important;
    }

/*Slider*/
.toggle-switch .slider[b-f6ra8l0zw6]:before {
    content: "";
    position: absolute;
    height: 18px;
    width: 18px;
    left: 2px;
    top: 2px;
    border-radius: 1000px;
    background: linear-gradient(180deg, #e2e8f0 0%, #ffffff 100%);
    border: 3.5px solid #f9fbfc;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.15);
    transition: 0.3s;
}

[b-f6ra8l0zw6] .validation-message {
    /*margin-top: 5px !important;*/
    color: red !important;
    font-size: small !important;
    font-weight: 400 !important;
}

.det-img-thumb[b-f6ra8l0zw6] {
    position: relative;
    flex-shrink: 0;
    width: 100px;
    height: 100px;
    border-radius: 8px;
    overflow: hidden;
    border: 2px solid transparent;
    cursor: pointer;
    transition: border-color 0.15s;
    scroll-snap-align: start;
}

    .det-img-thumb img[b-f6ra8l0zw6] {
        width: 100%;
        height: 100%;
        object-fit: cover;
        display: block;
    }

.det-img-thumb-delete[b-f6ra8l0zw6] {
    position: absolute;
    top: 4px;
    right: 4px;
    width: 24px;
    height: 24px;
    background-color: #B82213;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background-color 0.12s;
}

.baggee[b-f6ra8l0zw6] {
    padding: 4px 8px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 600;
    line-height: 16px;
    letter-spacing: -0.2px;
}

    .baggee.green[b-f6ra8l0zw6] {
        background-color: #409B3F1F;
        color: var(--green);
    }

.no-spinner[b-f6ra8l0zw6]::-webkit-inner-spin-button,
.no-spinner[b-f6ra8l0zw6]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.no-spinner[b-f6ra8l0zw6] {
    -moz-appearance: textfield;
}
/* /Pages/Authentication/RegisterSubcontractor.razor.rz.scp.css */
.owner-initial[b-1y1ubygluf] {
  background-image: initial;
  height: initial;
  width: initial;
  background-repeat: initial;
  background-position: initial;
  background-size: initial;
  position: initial;
}

.layer-initial[b-1y1ubygluf] {
  height: initial;
  width: initial;
  background-color: initial;
  position: initial;
  z-index: initial;
}

.modal-main-initial[b-1y1ubygluf] {
  height: initial;
  width: initial;
}

.options[b-1y1ubygluf] {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 13px;
  margin-bottom: 20px;
}

.options a[b-1y1ubygluf] {
  text-decoration: none;
  /*color: #111827;*/
}

.options label[b-1y1ubygluf] {
  display: flex;
  align-items: center;
  gap: 5px;
  cursor: pointer;
}

.logout-btn[b-1y1ubygluf] {
  padding: 6px;
  border-radius: 6px;
  cursor: pointer;
}

.logout-btn:hover[b-1y1ubygluf] {
  background-color: #dadada;
}

.owner-register label span.red[b-1y1ubygluf] {
    font-size: 13px;
    font-weight: 600;
    line-height: 20px;
    letter-spacing: -0.2px;
    color: var(--orange);
}

.phone-group[b-1y1ubygluf] {
    width: 100% !important;
    height: fit-content !important;
    display: flex !important;
    align-items: stretch !important;
    border: 1px solid #1E293B1F !important;
    border-radius: 10px !important;
    background: #fff !important;
    background-color: var(--white) !important;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05) !important;
    overflow: hidden !important;
}

    .phone-group:focus[b-1y1ubygluf],
    .phone-group:focus-within[b-1y1ubygluf] {
        box-shadow: 0 0 0 0.2rem #dce0ff !important;
    }

    .phone-group input:focus[b-1y1ubygluf],
    .phone-group input:focus-within[b-1y1ubygluf] {
        box-shadow: none !important;
    }

    .phone-group:hover:not(.disabled)[b-1y1ubygluf] {
        border-color: #eaecff !important;
    }

    .phone-group.disabled[b-1y1ubygluf] {
        background: transparent !important;
        box-shadow: initial !important;
        cursor: not-allowed !important;
    }

.phone-group-divider[b-1y1ubygluf] {
    width: 1px !important;
    height: 40px !important;
    background-color: #1E293B1F;
    flex-shrink: 0 !important;
}

.phone-input[b-1y1ubygluf] {
    flex: 1 !important;
    height: 40px !important;
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
    background: transparent !important;
    padding: 0 12px !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    color: #212529 !important;
    min-width: 0 !important;
    border-radius: 0px !important;
}

    .phone-input[b-1y1ubygluf]::placeholder {
        color: #5F6E85 !important;
    }

[b-1y1ubygluf] .dropdown:has(> .user-phone-code) {
    width: fit-content !important;
    height: 40px !important;
    display: flex !important;
    align-items: stretch !important;
}

[b-1y1ubygluf] .user-phone-code {
    box-shadow: none !important;
    border-radius: 0 !important;
    height: 40px !important;
    width: 100px !important;
    white-space: nowrap;
    border: none !important;
}

    [b-1y1ubygluf] .user-phone-code:focus {
        box-shadow: none !important;
    }

.three-dropdown form input[b-1y1ubygluf], .three-dropdown form textarea[b-1y1ubygluf] {
    height: 40px;
    padding: 8px 10px !important;
    background-color: var(--white) !important;
    border: 1px #1E293B1F solid !important;
    border-radius: 10px !important;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05) !important;
    outline: none !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    line-height: 24px !important;
    letter-spacing: -0.2px !important;
    color: var(--dark-txt) !important;
}

    .three-dropdown form input:focus[b-1y1ubygluf], .three-dropdown form textarea:focus[b-1y1ubygluf] {
        box-shadow: 0 0 0 0.2rem #dce0ff !important;
    }

.tax-id-wrapper[b-1y1ubygluf] {
    position: relative;
}

    .tax-id-wrapper input[b-1y1ubygluf] {
        width: 100%;
        padding-right: 80px; /* button ke liye space */
    }

    .tax-id-wrapper .find-btn[b-1y1ubygluf] {
        position: absolute;
        top: 49%;
        right: 4px;
        transform: translateY(-50%);
        min-width: 56px;
        height: 33px;
        padding: 0 12px;
    }

.season-date-group[b-1y1ubygluf] {
    width: 100% !important;
    height: fit-content !important;
    display: flex !important;
    align-items: stretch !important;
    border: 1px solid #1E293B1F !important;
    border-radius: 10px !important;
    background: #fff !important;
    background-color: var(--white) !important;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05) !important;
    overflow: hidden !important;
}

    .season-date-group:focus-within[b-1y1ubygluf] {
        box-shadow: 0 0 0 0.2rem #dce0ff !important;
    }

    .season-date-group:hover:not(.disabled)[b-1y1ubygluf] {
        border-color: #eaecff !important;
    }

.season-date-divider[b-1y1ubygluf] {
    width: 1px !important;
    height: 40px !important;
    background-color: #1E293B1F;
    flex-shrink: 0 !important;
}

[b-1y1ubygluf] .dropdown:has(> .season-date-day) {
    width: fit-content !important;
    height: 40px !important;
    display: flex !important;
    align-items: stretch !important;
}

[b-1y1ubygluf] .season-date-day {
    box-shadow: none !important;
    border-radius: 0 !important;
    height: 40px !important;
    width: 90px !important;
    white-space: nowrap;
    border: none !important;
}

    [b-1y1ubygluf] .season-date-day:focus {
        box-shadow: none !important;
    }

[b-1y1ubygluf] .dropdown:has(> .season-date-month) {
    width: 100% !important;
    height: 40px !important;
    display: flex !important;
    align-items: stretch !important;
}

[b-1y1ubygluf] .season-date-month {
    box-shadow: none !important;
    border-radius: 0 !important;
    height: 40px !important;
    width: 100% !important;
    white-space: nowrap;
    border: none !important;
}

    [b-1y1ubygluf] .season-date-month:focus {
        box-shadow: none !important;
    }

.business-onboarding .three-dropdown .cstm-dropdown .cstm-dropdown-data[b-1y1ubygluf]  .inner {
    opacity: 1 !important;
    /*transform: translateY(0) !important;*/
    transform: none !important;
    padding-left: 4px !important;
    padding-right: 4px !important;
}

.upload-img-box[b-1y1ubygluf] {
    height: 64px;
    background-color: #F1F5F9 !important;
    border: 1px #1E293B1F dashed !important;
    padding: 16px !important;
    border-radius: 16px !important;
    border-width: 2px !important;
    border-style: dashed !important;
}

    .upload-img-box.img-box-loading[b-1y1ubygluf]{
        height: 64px;
    }

    .upload-img-box label:hover[b-1y1ubygluf] {
        opacity: 0.9 !important;
    }

    .upload-img-box.dragging[b-1y1ubygluf] {
/*        border-color: #1E293B1F !important;
        background-color: #F1F5F9 !important;
        transform: scale(1.01) !important;
        transition: all 0.2s ease !important;*/
        border-color: var(--purple) !important;
        background-color: #f5f3ff !important;
        transform: scale(1.01) !important;
        transition: all 0.2s ease !important;
    }

/*Slider*/
.toggle-switch .slider[b-1y1ubygluf]:before {
    content: "";
    position: absolute;
    height: 18px;
    width: 18px;
    left: 2px;
    top: 2px;
    border-radius: 1000px;
    background: linear-gradient(180deg, #e2e8f0 0%, #ffffff 100%);
    border: 3.5px solid #f9fbfc;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.15);
    transition: 0.3s;
}

[b-1y1ubygluf] .validation-message {
    /*margin-top: 5px !important;*/
    color: red !important;
    font-size: small !important;
    font-weight: 400 !important;
}

.det-img-thumb[b-1y1ubygluf] {
    position: relative;
    flex-shrink: 0;
    width: 100px;
    height: 100px;
    border-radius: 8px;
    overflow: hidden;
    border: 2px solid transparent;
    cursor: pointer;
    transition: border-color 0.15s;
    scroll-snap-align: start;
}

.det-img-thumb img[b-1y1ubygluf] {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.det-img-thumb-delete[b-1y1ubygluf] {
    position: absolute;
    top: 4px;
    right: 4px;
    width: 24px;
    height: 24px;
    background-color: #B82213;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background-color 0.12s;
}

.baggee[b-1y1ubygluf] {
    padding: 4px 8px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 600;
    line-height: 16px;
    letter-spacing: -0.2px;
}

    .baggee.green[b-1y1ubygluf] {
        background-color: #409B3F1F;
        color: var(--green);
    }

.no-spinner[b-1y1ubygluf]::-webkit-inner-spin-button,
.no-spinner[b-1y1ubygluf]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.no-spinner[b-1y1ubygluf] {
    -moz-appearance: textfield;
}

.password-toggle-btn[b-1y1ubygluf] {
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
}

    .password-toggle-btn:hover[b-1y1ubygluf] {
        background-color: #f8f9fa !important;
    }

.owner-register input.focus-invalid:focus[b-1y1ubygluf] {
    box-shadow: 0 0 0 0.2rem #ED4030 !important;
}

.owner-register input.focus-valid:focus[b-1y1ubygluf] {
    box-shadow: 0 0 0 0.2rem #337C33 !important;
}

input[type="password"][b-1y1ubygluf]::-ms-reveal,
input[type="password"][b-1y1ubygluf]::-ms-clear {
    display: none;
}
/* /Pages/Authentication/ResetPassword.razor.rz.scp.css */
*[b-9jza4bhkca] {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    font-family: "Inter", sans-serif;
}

body[b-9jza4bhkca] {
    height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
    background: #f3f4f6;
}

.reset-password-card[b-9jza4bhkca] {
    width: 460px;
    background: #ffffff;
    padding: 40px 30px;
    border-radius: 12px;
    box-shadow: 0 8px 20px rgba(0,0,0,0.08);
}

    .reset-password-card h2[b-9jza4bhkca] {
        text-align: center;
        margin-bottom: 25px;
        font-weight: 600;
        color: #111827;
    }

.input-groups[b-9jza4bhkca] {
    margin-bottom: 15px;
}

    .input-groups input[b-9jza4bhkca] {
        height: 40px;
        width: 100%;
        padding: 8px 10px !important;
        background-color: var(--white) !important;
        border: 1px #1E293B1F solid !important;
        border-radius: 10px !important;
        box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05) !important;
        outline: none !important;
        font-size: 13px !important;
        font-weight: 600 !important;
        line-height: 24px !important;
        letter-spacing: -0.2px !important;
        color: var(--dark-txt) !important;
    }

        .input-groups input:focus[b-9jza4bhkca] {
            box-shadow: 0 0 0 0.2rem #dce0ff !important;
        }

.reset-password-btn[b-9jza4bhkca] {
    width: 100%;
}

.password-toggle-btn[b-9jza4bhkca] {
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
}

    .password-toggle-btn:hover[b-9jza4bhkca] {
        background-color: #f8f9fa !important;
    }

.reset-password-card input.focus-invalid:focus[b-9jza4bhkca] {
    box-shadow: 0 0 0 0.2rem #ED4030 !important;
}

.reset-password-card input.focus-valid:focus[b-9jza4bhkca] {
    box-shadow: 0 0 0 0.2rem #337C33 !important;
}

.password-requirment img[b-9jza4bhkca] {
    height: 18px;
}

.password-requirment span[b-9jza4bhkca] {
    font-size: 13px;
    font-weight: 600;
    line-height: 20px;
    letter-spacing: -0.2px;
}

    .password-requirment span.black-txt[b-9jza4bhkca] {
        color: var(--dark-txt);
    }

    .password-requirment span.gray-txt[b-9jza4bhkca] {
        color: var(--gray-txt);
    }

.password-requirment .w-40[b-9jza4bhkca] {
    width: 40%;
}

input[type="password"][b-9jza4bhkca]::-ms-reveal,
input[type="password"][b-9jza4bhkca]::-ms-clear {
    display: none;
}
/* /Pages/Authentication/SubcontractorInvite.razor.rz.scp.css */
.onboarding-layout[b-ru84zoa91k] {
  color: #1e293b;
}

.avatar-circle[b-ru84zoa91k] {
  width: 38px;
  height: 38px;
  background-color: #f0f2ff;
  color: #5865f2;
  font-weight: 600;
}

.step-container[b-ru84zoa91k] {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

/* Specific Input Styling from Image 3 */
.custom-input[b-ru84zoa91k] {
  background-color: #fcfcfc;
  border: 1px solid #ececec;
  border-radius: 10px;
  padding: 10px 14px;
  font-size: 0.95rem;
}

.custom-input:focus[b-ru84zoa91k] {
  border-color: #5865f2;
  box-shadow: 0 0 0 4px rgba(88, 101, 242, 0.1);
  background-color: #fff;
}

.btn-find[b-ru84zoa91k] {
  background-color: #5865f2;
  border: none;
  border-radius: 0 10px 10px 0 !important;
  padding: 0 20px;
}

/* Work Type List Items from Image 4 */
.work-type-item[b-ru84zoa91k] {
  background-color: #f1f5f9;
  padding: 14px 20px;
  border-radius: 12px;
  font-weight: 500;
}

.btn-new[b-ru84zoa91k] {
  border: 1px solid #e2e8f0;
  background: white;
  color: #5F6E85;
  border-radius: 20px;
  padding: 5px 15px;
  font-size: 0.85rem;
  font-weight: 600;
}

.btn-primary.rounded-pill[b-ru84zoa91k] {
  background-color: #5865f2;
  border: none;
}

.onboarding-card[b-ru84zoa91k] {
  border: 1px #1e293b17 solid;
  border-radius: 20px;
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.05) !important;
  transition: box-shadow 0.2s ease-in-out;
}

.onboarding-card.active-step[b-ru84zoa91k] {
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.05) !important;
}

.logout-btn[b-ru84zoa91k] {
  padding: 1px 6px;
  border-radius: 6px;
  cursor: pointer;
}

.logout-btn:hover[b-ru84zoa91k] {
  background-color: #dadada;
}
/* /Pages/Business/Components/AddSubBusinessPopup.razor.rz.scp.css */
/* ── Dialog sizing ───────────────────────────────────────────────────────── */
.asbp-dialog[b-70ul891kfy] {
    max-width: 400px;
    width: 100%;
}

/* ── Modal shell ─────────────────────────────────────────────────────────── */
.asbp-modal[b-70ul891kfy] {
    border: none;
    border-radius: 20px;
    overflow: hidden;
    box-shadow: 0 24px 48px -12px rgba(30,41,59,0.18);
}

/* ── Header ──────────────────────────────────────────────────────────────── */
.asbp-header[b-70ul891kfy] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 20px 24px 16px;
    background: #fff;
    border-bottom: 1px solid #F1F5F9;
}

.asbp-title[b-70ul891kfy] {
    font-size: 17px;
    font-weight: 700;
    color: #1E293B;
    margin: 0;
    letter-spacing: -0.2px;
}

.asbp-close[b-70ul891kfy] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 8px;
    border: 1px solid #E2E8F0;
    background: #fff;
    cursor: pointer;
    transition: background 0.15s;
}

.asbp-close:hover[b-70ul891kfy] {
    background: #F1F5F9;
}

/* ── Body ────────────────────────────────────────────────────────────────── */
.asbp-body[b-70ul891kfy] {
    padding: 16px 20px;
    background: #F1F5F9;
}

/* ── Spinner ─────────────────────────────────────────────────────────────── */
.asbp-spinner[b-70ul891kfy] {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 220px;
    color: #5263FF;
}

/* ── Fields ──────────────────────────────────────────────────────────────── */
.asbp-field[b-70ul891kfy] {
    margin-bottom: 14px;
}

.asbp-field-row[b-70ul891kfy] {
    display: flex;
    gap: 12px;
    margin-bottom: 0;
}

.asbp-field-row .asbp-field[b-70ul891kfy] {
    flex: 1;
}

.asbp-label[b-70ul891kfy] {
    /* display: block;
    font-size: 14px;
    font-weight: 400;
    color: #1E293B; */
    margin-bottom: 4px;
}

.asbp-required[b-70ul891kfy] {
    color: #EF4444;
}

.asbp-input[b-70ul891kfy] {
    width: 100%;
    background: #fff;
    border: 1px solid #E2E8F0;
    border-radius: 10px;
    padding: 10px 14px;
    font-size: 14px;
    color: #1E293B;
    outline: none;
    transition: border-color 0.15s, box-shadow 0.15s;
    display: block;
    font-family: inherit;
    resize: none;
}

.asbp-input:focus[b-70ul891kfy] {
    border-color: #5263FF;
    box-shadow: 0 0 0 3px #5263FF1A;
}

.asbp-input.asbp-input-error[b-70ul891kfy] {
    border-color: #EF4444;
    box-shadow: 0 0 0 3px #EF44441A;
}

.input-error[b-70ul891kfy] {
    box-shadow: 0 0 0 0.2rem #f0d1d1 !important;
}

.asbp-input.asbp-input-disabled[b-70ul891kfy] {
    background: #fff;
    color: #5F6E85;
    cursor: not-allowed;
    opacity: 1;
}

.asbp-select[b-70ul891kfy] {
    cursor: pointer;
    appearance: auto;
}

.asbp-field-error[b-70ul891kfy] {
    margin-top: 6px;
    font-size: 13px;
    font-weight: 600;
    color: #ED4030;
    line-height: 20px;
    letter-spacing: -0.2px;
}

/* ── Phone row ───────────────────────────────────────────────────────────── */
.asbp-phone-row[b-70ul891kfy] {
    display: flex;
    align-items: center;
    gap: 0;
}

.asbp-phone-prefix[b-70ul891kfy] {
    background: #F1F5F9;
    border: 1px solid #E2E8F0;
    border-right: none;
    border-radius: 10px 0 0 10px;
    padding: 10px 12px;
    font-size: 14px;
    color: #5F6E85;
    font-weight: 600;
}

.asbp-phone-code[b-70ul891kfy] {
    border-radius: 0;
    border-left: none;
    max-width: 44%;
}

.asbp-phone-number[b-70ul891kfy] {
    border-radius: 0 10px 10px 0;
    border-left: none;
    flex: 1;
}

/* ── Full-width primary button ───────────────────────────────────────────── */
.asbp-btn-full[b-70ul891kfy] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 100%;
    padding: 11px 20px;
    border: none;
    border-radius: 10px;
    background: #5263FF;
    color: #fff;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.15s, opacity 0.15s;
}

.asbp-btn-full:hover:not(:disabled)[b-70ul891kfy] {
    background: #4250E0;
}

.asbp-btn-full-disabled[b-70ul891kfy],
.asbp-btn-full:disabled[b-70ul891kfy] {
    background: #CBD5E1;
    color: #94A3B8;
    cursor: not-allowed;
}

/* ── OR divider ──────────────────────────────────────────────────────────── */
.asbp-or[b-70ul891kfy] {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 24px 0;
}

.asbp-or-line[b-70ul891kfy] {
    flex: 1;
    height: 1px;
    background: #1E293B17;
}

.asbp-or-text[b-70ul891kfy] {
    font-size: 12px;
    font-weight: 600;
    color: #475569;
    letter-spacing: -0.2px;
}

/* ── Info banner ─────────────────────────────────────────────────────────── */
.asbp-info-banner[b-70ul891kfy] {
    display: flex;
    justify-content: start;
    align-items: center;
    gap: 8px;
    padding: 8px;
    border-radius: 10px;
    background: #5263FF1F;
    font-size: 13px;
    font-weight: 500;
    color: #363AF5;
    line-height: 16px;
    letter-spacing: -0.2px;
    margin-bottom: 20px;
    box-shadow: 0px 1px 1px -0.5px #1E293B08;
}

.asbp-warn-banner[b-70ul891kfy] {
    background: #FFFBEB;
    color: #92400E;
}

/* ── Business card ───────────────────────────────────────────────────────── */
.asbp-business-card[b-70ul891kfy] {
    /* background: #fff; */
    /* border: 1px solid #E2E8F0; */
    /* border-radius: 14px; */
    /* padding: 4px 0; */
    /* margin-bottom: 20px; */
    /* overflow: hidden; */
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: start;
    gap: 8px;
}

.asbp-card-row[b-70ul891kfy] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
}

.asbp-card-content[b-70ul891kfy] {
    display: flex;
    flex-direction: column;
    gap: 1px;
}

.asbp-card-label[b-70ul891kfy] {
    font-size: 13px;
    font-weight: 600;
    color: #475569;
    line-height: 20px;
    letter-spacing: -0.2px;
}

.asbp-card-value[b-70ul891kfy] {
    font-size: 13px;
    font-weight: 600;
    color: #1E293B;
    line-height: 24px;
    letter-spacing: -0.2px;
    max-width: 300px;
    overflow-wrap: anywhere;
    word-break: normal;
}

.asbp-country[b-70ul891kfy] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.asbp-flag[b-70ul891kfy] {
    height: 18px;
    width: 18px;
    border-radius: 100%;
}

.asbp-divider[b-70ul891kfy] {
    height: 1px;
    background: #F1F5F9;
    margin: 0 18px;
}

/* ── Business logo (top-right of card) ──────────────────────────────────── */
.asbp-logo-fallback[b-70ul891kfy] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 8px;
    background: #5263FF1F;
    overflow: hidden;
    flex-shrink: 0;
}

.asbp-logo-fallback-img[b-70ul891kfy] {
    width: 22px;
    height: 22px;
    object-fit: contain;
}

.asbp-logo-img[b-70ul891kfy] {
    width: 40px;
    height: 40px;
    object-fit: contain;
    border-radius: 100%;
}

/* ── Step subtitle ───────────────────────────────────────────────────────── */
.asbp-step-subtitle[b-70ul891kfy] {
    font-size: 13px;
    color: #5F6E85;
    margin-bottom: 16px;
    line-height: 1.5;
}

/* ── Footer buttons ──────────────────────────────────────────────────────── */
.asbp-footer[b-70ul891kfy] {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 20px;
}

.asbp-btn[b-70ul891kfy] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    flex: 1;
    padding: 13px 18px;
    border-radius: 12px;
    font-size: 15px;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.15s, border-color 0.15s;
    border: none;
}

.asbp-btn:disabled[b-70ul891kfy] {
    opacity: 0.6;
    cursor: not-allowed;
}

.asbp-btn-cancel[b-70ul891kfy] {
    background: #fff;
    border: 1px solid #E2E8F0;
    color: #475569;
}

.asbp-btn-cancel:hover:not(:disabled)[b-70ul891kfy] {
    background: #F8FAFC;
    border-color: #CBD5E1;
}

.asbp-btn-invite[b-70ul891kfy] {
    background: #5263FF;
    color: #fff;
}

.asbp-btn-invite:hover:not(:disabled)[b-70ul891kfy] {
    background: #4250E0;
}
/* /Pages/Business/Components/ContractorDetailsSlider.razor.rz.scp.css */
/* The panel for a business we work for. Laid out like the subcontractor panel so the two read as
   one kind of thing; only the rules this smaller panel uses are carried over. */
.contractorDetailsSlider.right .modal-dialog[b-x8zf7jbns5] {
	position: fixed;
	margin: 0;
	right: 0;
	top: 0;
	height: 100%;
	max-width: 740px;
	width: 100%;
}

.contractorDetailsSlider.right .modal-content[b-x8zf7jbns5] {
	height: 100vh;
	border-radius: 0;
	display: flex;
	flex-direction: column;
	border: none;
}

.contractorDetailsSlider.right.fade .modal-dialog[b-x8zf7jbns5] {
	transform: translateX(100%);
	transition: transform 0.3s ease-out;
}

.contractorDetailsSlider.right.show .modal-dialog[b-x8zf7jbns5] {
	transform: translateX(0);
}

.sds-shell[b-x8zf7jbns5] {
	display: flex;
	flex-direction: column;
	height: 100vh;
	background: #FFFFFF;
}

.sds-header[b-x8zf7jbns5] {
	background: #FFFFFF;
	flex-shrink: 0;
}

.sds-header-top[b-x8zf7jbns5] {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding: 16px 24px;
}

.sds-header-identity[b-x8zf7jbns5] {
	display: flex;
	align-items: center;
	gap: 10px;
	min-width: 0;
}

.sds-avatar[b-x8zf7jbns5] {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	width: 48px;
	height: 48px;
	border-radius: 10px;
	background-color: #5263FF1F;
	overflow: hidden;
}

.sds-avatar-fallback[b-x8zf7jbns5] {
	width: 25px;
	height: 25px;
	object-fit: contain;
}

.sds-name[b-x8zf7jbns5] {
	font-size: 18px;
	font-weight: 800;
	color: #1E293B;
	margin: 0;
	line-height: 24px;
	letter-spacing: -0.2px;
	overflow-wrap: anywhere;
}

.cds-relation[b-x8zf7jbns5] {
	font-size: 13px;
	color: var(--gray-txt);
}

.sds-tab-bar[b-x8zf7jbns5] {
	padding: 0 24px 16px 24px;
	border-bottom: 1px solid #EBECED;
}

.sds-tabs[b-x8zf7jbns5] {
	gap: 6px;
	background-color: #F1F5F9CC;
	border: 1px #1E293B08 solid;
	border-radius: 16px;
	padding: 6px 8px;
}

.sds-tab[b-x8zf7jbns5] {
	padding: 6px;
	background-color: transparent;
	border: 1px transparent solid;
	border-radius: 10px;
	outline: none;
	font-size: 13px;
	font-weight: 600;
	line-height: 24px;
	letter-spacing: -0.2px;
	color: var(--gray-txt);
	width: 100%;
	transition: background-color 0.35s cubic-bezier(0.22, 1, 0.36, 1), border-color 0.35s cubic-bezier(0.22, 1, 0.36, 1), box-shadow 0.35s cubic-bezier(0.22, 1, 0.36, 1), color 0.25s ease;
}

	.sds-tab:hover[b-x8zf7jbns5] {
		color: var(--dark-txt);
	}

.sds-tab--active[b-x8zf7jbns5] {
	background: linear-gradient(to bottom, rgba(255, 255, 255, 1), rgba(248, 250, 252, 1));
	border: 1px solid rgba(15, 23, 42, 0.06);
	box-shadow: 0 1px 1px rgba(15, 23, 42, 0.03), 0 4px 10px rgba(15, 23, 42, 0.06), inset 0 1px 0 rgba(255, 255, 255, 0.8);
	color: var(--dark-txt);
}

.sds-body[b-x8zf7jbns5] {
	flex: 1;
	overflow-y: auto;
	display: flex;
	flex-direction: column;
	scrollbar-width: thin;
}

.sds-section[b-x8zf7jbns5] {
	padding: 24px;
	display: flex;
	flex-direction: column;
	gap: 16px;
}

.sds-section-title[b-x8zf7jbns5] {
	margin: 0;
	font-size: 18px;
	font-weight: 800;
	line-height: 24px;
	letter-spacing: -0.2px;
	color: var(--dark-txt);
}

.sds-grid[b-x8zf7jbns5] {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 16px;
}

.sds-detail-item[b-x8zf7jbns5] {
	display: flex;
	flex-direction: column;
	padding: 6px 8px;
}

.sds-detail-label[b-x8zf7jbns5] {
	font-size: 13px;
	font-weight: 700;
	line-height: 20px;
	letter-spacing: -0.2px;
	color: var(--dark-txt);
}

.sds-detail-value[b-x8zf7jbns5] {
	margin: 0;
	padding: 0;
	color: var(--gray-txt);
	font-size: 13px;
	font-weight: 500;
	line-height: 20px;
	letter-spacing: -0.2px;
	overflow-wrap: anywhere;
}

@media (max-width: 600px) {
	.sds-grid[b-x8zf7jbns5] {
		grid-template-columns: 1fr;
	}
}
/* /Pages/Business/Components/SubcontractorAddLocationsPopup.razor.rz.scp.css */
/* ── Body ────────────────────────────────────────────────────────────────── */

.sdalp-body[b-t1s2dktetg] {
	display: flex;
	flex-direction: column;
}

.sdalp-section-header[b-t1s2dktetg] {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 12px 16px;
	background: #F1F5F9;
	border-bottom: 1px solid #F1F5F9;
	position: sticky;
	top: 0;
	/* z-index: 1; */
	cursor: default;
	height: 45px;
}

.sdalp-label-group[b-t1s2dktetg] {
	display: flex;
	align-items: center;
	gap: 8px;
}

.sdalp-list-label[b-t1s2dktetg] {
	font-size: 13px;
	font-weight: 700;
	color: #1E293B;
}

.sdalp-selected-count[b-t1s2dktetg] {
	font-size: 13px;
	font-weight: 500;
	color: #5F6E85;
}

.sdalp-section-actions[b-t1s2dktetg] {
	display: flex;
	align-items: center;
	gap: 12px;
}

/* Select all / deselect all: the box that was there, now saying what it does. */
.sdalp-select-all[b-t1s2dktetg] {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 0;
	border: none;
	background: none;
	font-size: 13px;
	font-weight: 600;
	color: #5263FF;
	cursor: pointer;
}

.sdalp-empty[b-t1s2dktetg] {
	padding: 40px 24px;
	font-size: 14px;
	font-weight: 500;
	color: #5F6E85;
	text-align: center;
}

/* ── Scrollable list ─────────────────────────────────────────────────────── */

.sdalp-list-scroll[b-t1s2dktetg] {
	display: flex;
	flex-direction: column;
	max-height: 464px;
	overflow-y: auto;
	scrollbar-width: thin;
	scrollbar-color: #C3C8CF transparent;
}

	.sdalp-list-scroll[b-t1s2dktetg]::-webkit-scrollbar {
		width: 4px;
	}

	.sdalp-list-scroll[b-t1s2dktetg]::-webkit-scrollbar-thumb {
		background: #C3C8CF;
		border-radius: 4px;
	}

/* ── Location row ────────────────────────────────────────────────────────── */

.sdalp-list-item[b-t1s2dktetg] {
	min-height: 65px;
	width: 100%;
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 12px 16px;
	background: #fff;
	border-bottom: 1px solid #F1F5F9;
	cursor: pointer;
	transition: background 0.12s;
	margin: 0;
}

	.sdalp-list-item.alter-row[b-t1s2dktetg] {
		background: #F8FAFC;
	}

	.sdalp-list-item:last-child[b-t1s2dktetg] {
		border-bottom: none;
	}

	.sdalp-list-item:hover[b-t1s2dktetg] {
		background: #F5F6FF;
	}

.sdalp-list-item--checked[b-t1s2dktetg] {
	background: #F5F6FF !important;
}

/* ── Checkbox ────────────────────────────────────────────────────────────── */

.sdalp-checkbox[b-t1s2dktetg] {
	width: 18px !important;
	height: 18px !important;
	border-radius: 6px !important;
	padding: 2px !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	transition: all 0.2s !important;
	background: linear-gradient(180deg, #f1f5f9 0%, #ffffff 100%) !important;
	border: 2.5px solid #d9dee3 !important;
	backdrop-filter: blur(24px) !important;
	box-shadow:
		0px 1px 1px -0.5px #1e293b08,
		0px 3px 3px 0px #ffffff1f inset !important;
	flex-shrink: 0 !important;
}

	.sdalp-checkbox.checked[b-t1s2dktetg] {
		background: linear-gradient(180deg, #5263ff 0%, #5263ff 100%) !important;
		color: white !important;
		backdrop-filter: blur(24px) !important;
		box-shadow:
			0px 1px 1px -0.5px #1e293b08,
			0px 3px 3px 0px #ffffff1f inset !important;
		border: none !important;
	}

.sdalp-checkbox-icon[b-t1s2dktetg] {
	display: flex !important;
	justify-content: center !important;
	align-items: center !important;
}

/* ── Location detail ─────────────────────────────────────────────────────── */

.sdalp-pin-icon[b-t1s2dktetg] {
	width: 16px;
	height: 16px;
	object-fit: contain;
	flex-shrink: 0;
}

.sdalp-loc-detail[b-t1s2dktetg] {
	width: calc(100% - 30px);
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 12px;
}

.sdalp-loc-left[b-t1s2dktetg] {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: start;
	gap: 2px;
	width: 60%;
}

.sdalp-loc-right[b-t1s2dktetg] {
	display: flex;
	justify-content: end;
	align-items: center;
	width: 36%;
}

.sdalp-loc-name[b-t1s2dktetg] {
	font-size: 13px;
	font-weight: 700;
	color: #1E293B;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	max-width: 100%;
}

.sdalp-contractor-badge[b-t1s2dktetg] {
	display: inline-block;
	padding: 4px 6px;
	font-size: 12px;
	font-weight: 600;
	color: #363AF5;
	background: #5263FF1F;
	border-radius: 8px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	max-width: 100%;
}

.sdalp-loc-addr[b-t1s2dktetg] {
	font-size: 12px;
	font-weight: 600;
	color: #475569;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	max-width: 100%;
}

/* ── Conflict warning ────────────────────────────────────────────────────── */

.sdalp-conflict-warning[b-t1s2dktetg] {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	padding: 12px 20px;
	background: #FFC30A1F;
}

.sdalp-conflict-icon[b-t1s2dktetg] {
	flex-shrink: 0;
	width: 18px;
	height: 18px;
	margin-top: 1px;
}

.sdalp-conflict-text[b-t1s2dktetg] {
	display: flex;
	flex-direction: column;
	gap: 1px;
}

	.sdalp-conflict-text p[b-t1s2dktetg] {
		margin: 0;
		font-size: 13px;
		font-weight: 700;
		color: #9D6600;
		line-height: 1.5;
	}
/* /Pages/Business/Components/SubcontractorDetailsSlider.razor.rz.scp.css */
.z-index-lower[b-4b1ln5h250] {
  z-index: 1049 !important;
}

/* ── Subcontractor details slider ────────────────────────────────────────── */
.subcontractorDetailsSlider.right .modal-dialog[b-4b1ln5h250] {
	position: fixed;
	margin: 0;
	right: 0;
	top: 0;
	height: 100%;
	max-width: 740px;
	width: 100%;
}

.subcontractorDetailsSlider.right .modal-content[b-4b1ln5h250] {
	height: 100vh;
	border-radius: 0;
	display: flex;
	flex-direction: column;
	border: none;
}

.subcontractorDetailsSlider.right.fade .modal-dialog[b-4b1ln5h250] {
	transform: translateX(100%);
	transition: transform 0.3s ease-out;
}

.subcontractorDetailsSlider.right.show .modal-dialog[b-4b1ln5h250] {
	transform: translateX(0);
}
/* ── End subcontractor details slider ────────────────────────────────────── */


/* ── Shell ───────────────────────────────────────────────────────────────── */
.sds-shell[b-4b1ln5h250] {
	display: flex;
	flex-direction: column;
	height: 100vh;
	background: #FFFFFF;
}

/* ── Header ──────────────────────────────────────────────────────────────── */
.sds-header[b-4b1ln5h250] {
	background: #fff;
	flex-shrink: 0;
}

.sds-tab-bar[b-4b1ln5h250] {
	padding: 0px 24px 16px 24px;
	border-bottom: 1px solid #EBECED;
	height: 70px;
}

.sds-header-top[b-4b1ln5h250] {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding: 16px 24px;
}

/* Withdraw, on an unanswered invitation only. It sits beside the close button because it is
   the other way out of this panel, and it is outlined rather than filled so it never competes
   with the actions inside. */
.sds-withdraw-btn[b-4b1ln5h250] {
	background: none;
	border: 1px solid rgba(185, 28, 28, 0.35);
	border-radius: 8px;
	padding: 7px 12px;
	font-size: 13px;
	font-weight: 600;
	white-space: nowrap;
	color: #B91C1C;
	transition: background 0.12s;
}

.sds-withdraw-btn:hover[b-4b1ln5h250] {
	background: rgba(185, 28, 28, 0.1);
}

/* Says why the panel is missing half its tabs, and what assigning an address now means. */
.sds-pending-banner[b-4b1ln5h250] {
	display: flex;
	align-items: flex-start;
	gap: 8px;
	margin: 0px 24px 16px 24px;
	padding: 10px 12px;
	border-radius: 8px;
	background: rgba(255, 195, 10, 0.12);
}

.sds-pending-banner img[b-4b1ln5h250] {
	height: 16px;
	width: 16px;
	margin-top: 2px;
	flex-shrink: 0;
}

.sds-pending-banner p[b-4b1ln5h250] {
	margin: 0px;
	font-size: 13px;
	line-height: 18px;
	color: rgba(180, 117, 0, 1);
}

.sds-header-identity[b-4b1ln5h250] {
	display: flex;
	align-items: center;
	gap: 10px;
	min-width: 0;
}

/* Avatar */
.sds-avatar[b-4b1ln5h250] {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	width: 48px;
	height: 48px;
	border-radius: 10px;
	background-color: #5263FF1F;
	overflow: hidden;
}

	.sds-avatar img:not(.sds-avatar-fallback)[b-4b1ln5h250] {
		width: 100%;
		height: 100%;
		object-fit: cover;
	}

.sds-avatar-fallback[b-4b1ln5h250] {
	width: 25px;
	height: 25px;
	object-fit: contain;
}

.sds-name[b-4b1ln5h250] {
	font-size: 18px;
	font-weight: 800;
	color: #1E293B;
	margin: 0;
	line-height: 24px;
	letter-spacing: -0.2px;
}
/* Close button */
.sds-btn-close[b-4b1ln5h250] {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	width: 34px;
	height: 34px;
	border-radius: 8px;
	border: 1px solid #E2E8F0;
	background: #fff;
	cursor: pointer;
	transition: background 0.15s;
}

	.sds-btn-close:hover[b-4b1ln5h250] {
		background: #F1F5F9;
	}


/* ── Body ────────────────────────────────────────────────────────────────── */
.sds-body[b-4b1ln5h250] {
	flex: 1;
	overflow-y: auto;
	/* padding: 16px; */
	display: flex;
	flex-direction: column;
	/* gap: 12px; */
	scrollbar-width: thin;
}

/* ── Section card ────────────────────────────────────────────────────────── */
.sds-section[b-4b1ln5h250] {
	/* background: #fff; */
	padding: 24px;
	display: flex;
	flex-direction: column;
	gap: 16px;
}


/* ── Details grid ────────────────────────────────────────────────────────── */
.sds-grid[b-4b1ln5h250] {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 16px;
}

.sds-detail-item[b-4b1ln5h250] {
	/* background: #FFFFFF; */
	/* padding: 5px 5px; */
	display: flex;
	flex-direction: column;
	/* gap: 4px; */
	/* min-width: 0; */
}


/* ── Statistics header ───────────────────────────────────────────────────── */
.sds-stats-header[b-4b1ln5h250] {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 8px;
	flex-wrap: wrap;
}

.sds-stats-filters[b-4b1ln5h250] {
	display: flex;
	align-items: center;
	gap: 8px;
}

.sds-select[b-4b1ln5h250] {
	padding: 4px 8px;
	font-size: 12px;
	color: #475569;
	border: 1px solid #E2E8F0;
	border-radius: 6px;
	background: #fff;
	cursor: pointer;
	outline: none;
}

.sds-date-range[b-4b1ln5h250] {
	display: flex;
	align-items: center;
	gap: 5px;
	padding: 4px 8px;
	font-size: 12px;
	color: #475569;
	border: 1px solid #E2E8F0;
	border-radius: 6px;
	background: #fff;
	white-space: nowrap;
}

/* ── Stat cards ──────────────────────────────────────────────────────────── */
.sds-stat-cards[b-4b1ln5h250] {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 10px;
}

.sds-stat-card[b-4b1ln5h250] {
	background: #F8FAFC;
	border: 1px solid #F1F5F9;
	border-radius: 10px;
	padding: 14px;
	display: flex;
	flex-direction: column;
	gap: 4px;
}

.sds-stat-card-top[b-4b1ln5h250] {
	display: flex;
	align-items: center;
	gap: 8px;
	margin-bottom: 4px;
}

.sds-stat-icon[b-4b1ln5h250] {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	border-radius: 8px;
	flex-shrink: 0;
}

	.sds-stat-icon img[b-4b1ln5h250] {
		width: 16px;
		height: 16px;
		object-fit: contain;
	}

.sds-stat-icon--yellow[b-4b1ln5h250] {
	background: #FFFBEB;
}

.sds-stat-icon--green[b-4b1ln5h250] {
	background: #F0FDF4;
}

.sds-stat-icon--blue[b-4b1ln5h250] {
	background: #EFF6FF;
}

.sds-stat-label[b-4b1ln5h250] {
	font-size: 12px;
	font-weight: 500;
	color: #5F6E85;
}

.sds-stat-amount[b-4b1ln5h250] {
	font-size: 18px;
	font-weight: 700;
	color: #1E293B;
	margin: 0;
	letter-spacing: -0.5px;
}

.sds-stat-currency[b-4b1ln5h250] {
	font-size: 11px;
	font-weight: 500;
	color: #94A3B8;
}

/* ── Work type table ─────────────────────────────────────────────────────── */
.sds-work-type-table[b-4b1ln5h250] {
	border: 1px solid #F1F5F9;
	border-radius: 8px;
	overflow: hidden;
}

.sds-work-type-row[b-4b1ln5h250] {
	display: flex;
	justify-content: space-between;
	padding: 10px 14px;
	font-size: 13px;
	color: #1E293B;
	border-bottom: 1px solid #F8FAFC;
}

	.sds-work-type-row:last-child[b-4b1ln5h250] {
		border-bottom: none;
	}

.sds-work-type-row--header[b-4b1ln5h250] {
	background: #F8FAFC;
	font-size: 11px;
	font-weight: 600;
	color: #94A3B8;
	text-transform: uppercase;
	letter-spacing: 0.4px;
}

/* ── Chart ───────────────────────────────────────────────────────────────── */
.sds-chart-box[b-4b1ln5h250] {
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.sds-chart-header[b-4b1ln5h250] {
	display: flex;
	align-items: center;
	gap: 8px;
}

.sds-chart-area[b-4b1ln5h250] {
	width: 100%;
	overflow: hidden;
}

.sds-chart-svg[b-4b1ln5h250] {
	width: 100%;
	height: auto;
	display: block;
}

.sds-chart-label[b-4b1ln5h250] {
	font-size: 8px;
	fill: #94A3B8;
	font-family: inherit;
}

/* ── Dispatch history ────────────────────────────────────────────────────── */
.sds-dispatch-header[b-4b1ln5h250] {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 8px;
}

.sds-btn-export[b-4b1ln5h250] {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	padding: 5px 10px;
	font-size: 12px;
	font-weight: 500;
	color: #475569;
	border: 1px solid #E2E8F0;
	border-radius: 6px;
	background: #fff;
	cursor: pointer;
	transition: background 0.15s;
	white-space: nowrap;
}

	.sds-btn-export:hover[b-4b1ln5h250] {
		background: #F8FAFC;
	}

.sds-dispatch-table[b-4b1ln5h250] {
	width: 100%;
	border-collapse: collapse;
	font-size: 13px;
}

	.sds-dispatch-table thead th[b-4b1ln5h250] {
		font-size: 11px;
		font-weight: 600;
		color: #94A3B8;
		text-transform: uppercase;
		letter-spacing: 0.4px;
		padding: 8px 10px;
		text-align: left;
		border-bottom: 1px solid #F1F5F9;
		white-space: nowrap;
	}

	.sds-dispatch-table tbody tr[b-4b1ln5h250] {
		border-bottom: 1px solid #F8FAFC;
	}

		.sds-dispatch-table tbody tr:last-child[b-4b1ln5h250] {
			border-bottom: none;
		}

	.sds-dispatch-table tbody td[b-4b1ln5h250] {
		padding: 10px 10px;
		vertical-align: middle;
	}

.sds-dispatch-id[b-4b1ln5h250] {
	font-size: 13px;
	font-weight: 600;
	color: #1E293B;
	margin: 0 0 2px;
}

.sds-dispatch-sub[b-4b1ln5h250] {
	font-size: 11px;
	font-weight: 400;
	color: #5F6E85;
	margin: 0;
}

.sds-dispatch-date[b-4b1ln5h250] {
	font-size: 12px;
	color: #5F6E85;
	white-space: nowrap;
}

.sds-dispatch-locs[b-4b1ln5h250] {
	display: flex;
	align-items: center;
	gap: 5px;
	font-size: 13px;
	font-weight: 500;
	color: #1E293B;
}

.sds-loc-icon[b-4b1ln5h250] {
	width: 14px;
	height: 14px;
	object-fit: contain;
}

.sds-btn-view-locs[b-4b1ln5h250] {
	padding: 5px 10px;
	font-size: 12px;
	font-weight: 500;
	color: #5263FF;
	background: #EEF0FF;
	border: none;
	border-radius: 6px;
	cursor: pointer;
	white-space: nowrap;
	transition: background 0.15s;
}

.sds-btn-view-locs:hover[b-4b1ln5h250] {
	background: #DDE0FF;
}

/* ── Empty tab placeholder ───────────────────────────────────────────────── */
.sds-empty-tab[b-4b1ln5h250] {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 12px;
	flex: 1;
	min-height: 260px;
	color: #94A3B8;
	font-size: 13px;
}

	.sds-empty-tab p[b-4b1ln5h250] {
		margin: 0;
	}

.sds-flag[b-4b1ln5h250] {
	height: 18px;
	width: 18px;
	border-radius: 100%;
	margin-right: 4px;
}


/* ═══════════════════════════════════════════════════════════════════════════
   Tab navigation — moved from style.css
   ═══════════════════════════════════════════════════════════════════════════ */
.sds-tabs[b-4b1ln5h250] {
	gap: 6px;
	background-color: #F1F5F9CC;
	border: 1px #1E293B08 solid;
	border-radius: 16px;
	padding: 6px 8px;
}

.sds-tab[b-4b1ln5h250] {
	padding: 6px;
	background-color: transparent;
	border: 1px transparent solid;
	border-radius: 10px;
	outline: none;
	font-size: 13px;
	font-weight: 600;
	line-height: 24px;
	letter-spacing: -0.2px;
	color: var(--gray-txt);
	width: 100%;
    transition:
        background-color 0.35s cubic-bezier(0.22, 1, 0.36, 1),
        border-color 0.35s cubic-bezier(0.22, 1, 0.36, 1),
        box-shadow 0.35s cubic-bezier(0.22, 1, 0.36, 1),
        color 0.25s ease,
        transform 0.25s cubic-bezier(0.22, 1, 0.36, 1);
	will-change: transform, box-shadow, background-color, border-color, color;
}

	.sds-tab:hover[b-4b1ln5h250] {
		color: var(--dark-txt);
		transform: translateY(-1px) scale(1.01);
	}

.sds-tab--active[b-4b1ln5h250] {
    background: linear-gradient(
        to bottom,
        rgba(255,255,255,1),
        rgba(248,250,252,1)
    );
	border: 1px solid rgba(15, 23, 42, 0.06);
    box-shadow:
        0 1px 1px rgba(15, 23, 42, 0.03),
        0 4px 10px rgba(15, 23, 42, 0.06),
        inset 0 1px 0 rgba(255,255,255,0.8);
	color: var(--dark-txt);
	transform: scale(1.015);
}

.sds-tab:active[b-4b1ln5h250] {
	transform: scale(0.98);
}

/* ── Detail labels, values, section titles — moved from style.css ─────── */
.sds-detail-label[b-4b1ln5h250] {
	font-size: 13px;
	font-weight: 700;
	line-height: 20px;
	letter-spacing: -0.2px;
	color: var(--dark-txt);
}

.sds-detail-value[b-4b1ln5h250] {
	padding: 0;
	color: var(--gray-txt);
	font-size: 13px;
	font-weight: 500;
	line-height: 20px;
	letter-spacing: -0.2px;
	overflow-wrap: anywhere;
	word-break: normal;
}

.sds-section-title[b-4b1ln5h250] {
	font-size: 18px;
	font-weight: 800;
	line-height: 24px;
	letter-spacing: -0.2px;
	color: var(--dark-txt);
}

/* ── Permission toggle ───────────────────────────────────────────────── */
.sds-permission-hint[b-4b1ln5h250] {
	margin: 0;
	max-width: 420px;
	color: var(--gray-txt);
	font-size: 13px;
	font-weight: 500;
	line-height: 20px;
	letter-spacing: -0.2px;
}

.sds-toggle-switch[b-4b1ln5h250] {
	position: relative;
	display: inline-block;
	width: 46px;
	height: 28px;
	background: linear-gradient(180deg, rgba(226, 232, 240, 1) 0%, rgba(248, 250, 252, 1) 100%);
	border-radius: 50px;
	padding: 3px;
	flex-shrink: 0;
}

	.sds-toggle-switch.disabled[b-4b1ln5h250] {
		opacity: 0.6;
		cursor: not-allowed;
	}

.sds-toggle-switch input[b-4b1ln5h250] {
	opacity: 0;
	width: 0;
	height: 0;
}

.sds-toggle-slider[b-4b1ln5h250] {
	position: absolute;
	cursor: pointer;
	border-radius: 30px;
	background-color: #d3dde8;
	transition: 0.3s;
	height: 22px;
	width: 40px;
}

	.sds-toggle-switch.disabled .sds-toggle-slider[b-4b1ln5h250] {
		cursor: not-allowed;
	}

.sds-toggle-slider[b-4b1ln5h250]:before {
	content: "";
	position: absolute;
	height: 18px;
	width: 18px;
	left: 2px;
	top: 2px;
	border-radius: 1000px;
	background: linear-gradient(180deg, #e2e8f0 0%, #ffffff 100%);
	border: 3.5px solid #f9fbfc;
	box-shadow: 0 2px 4px rgba(0, 0, 0, .15);
	transition: .3s;
}

.sds-toggle-switch input:checked + .sds-toggle-slider[b-4b1ln5h250] {
	background: linear-gradient(135deg, #5b67f6, #4c57e0);
}

.sds-toggle-switch input:checked + .sds-toggle-slider[b-4b1ln5h250]:before {
	transform: translateX(18px);
	background: #fff;
}

.sds-toggle-switch input:checked + .sds-toggle-slider[b-4b1ln5h250]:after {
	content: "";
	position: absolute;
	right: 5px;
	top: 7.5px;
	width: 11px;
	height: 11px;
	background-image: url("../img/icons/toggle-check-icon.svg");
	background-size: contain;
	background-repeat: no-repeat;
}

.sdsl-loc-tab[b-4b1ln5h250] {
	display: flex;
	flex-direction: column;
	padding: 16px;
	flex: 1;
	gap: 16px;
}

.sdsl-loc-tab-header[b-4b1ln5h250] {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.sdsl-loc-list-wrap[b-4b1ln5h250] {
	display: flex;
	flex-direction: column;
	gap: 0;
}

.sdsl-loc-title-row[b-4b1ln5h250] {
	display: flex;
	align-items: center;
	gap: 6px;
}

.sdsl-info-btn[b-4b1ln5h250] {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 22px;
	height: 22px;
	background: none;
	border: none;
	padding: 0;
	cursor: pointer;
	color: #94A3B8;
	flex-shrink: 0;
}

.sdsl-add-btn[b-4b1ln5h250] {
	display: inline-flex;
	align-items: center;
	gap: 2px;
	padding: 4px 8px;
	font-size: 12px;
	font-weight: 600;
	color: #fff;
	background: #5263FF;
	border: none;
	border-radius: 8px;
	cursor: pointer;
	transition: background 0.15s;
	white-space: nowrap;
}

.sdsl-add-btn:hover[b-4b1ln5h250] {
	background: #4150E8;
}

.sdsl-loc-list[b-4b1ln5h250] {
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.sdsl-loc-row[b-4b1ln5h250] {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 12px 0px;
	cursor: pointer;
	transition: background 0.15s;
	border-bottom: 1px solid #F8FAFC;
}

.sdsl-loc-row:hover[b-4b1ln5h250] {
	background: #F5F6FF;
}

.sdsl-loc-icon-cell[b-4b1ln5h250] {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	border-radius: 10px;
	flex-shrink: 0;
}

.sdsl-pin[b-4b1ln5h250] {
	width: 20px;
	height: 20px;
}

.sdsl-loc-text[b-4b1ln5h250] {
	flex: 1;
	min-width: 0;
}

.sdsl-loc-name[b-4b1ln5h250] {
	font-size: 13px;
	font-weight: 600;
	color: #1E293B;
	margin: 0 0 2px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.sdsl-loc-addr[b-4b1ln5h250] {
	font-size: 12px;
	color: #5F6E85;
	margin: 0;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.sdsl-route-badge[b-4b1ln5h250] {
	display: flex;
	align-items: center;
	gap: 5px;
	padding: 4px 8px;
	border-radius: 6px;
	background: #F1F5F9;
	font-size: 12px;
	font-weight: 500;
	color: #5F6E85;
	flex-shrink: 0;
	white-space: nowrap;
}

.sdsl-route-badge--none[b-4b1ln5h250] {
	color: #94A3B8;
	background: #F8FAFC;
	border: 1px solid #E2E8F0;
}

.sdsl-route-badge--has-route[b-4b1ln5h250] {
	color: #5263FF;
	background: #EEF0FF;
	border: 1px solid #C7D2FE;
}

/* ── Drivers tab ─────────────────────────────────────────────────────────── */

.sdsd-tab[b-4b1ln5h250] {
	display: flex;
	flex-direction: column;
	padding: 16px;
	flex: 1;
	gap: 16px;
}

.sdsd-tab-header[b-4b1ln5h250] {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.sdsd-title-row[b-4b1ln5h250] {
	display: flex;
	align-items: center;
	gap: 6px;
}

.sdsd-driver-list[b-4b1ln5h250] {
	display: flex;
	flex-direction: column;
}

.sdsd-driver-row[b-4b1ln5h250] {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 10px 0;
	border-bottom: 1px solid #F8FAFC;
}

.sdsd-driver-row:last-child[b-4b1ln5h250] {
	border-bottom: none;
}

.sdsd-driver-info[b-4b1ln5h250] {
	display: flex;
	flex-direction: column;
	gap: 2px;
	min-width: 0;
}

.sdsd-driver-name[b-4b1ln5h250] {
	margin: 0;
	font-size: 13px;
	font-weight: 600;
	color: #1E293B;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.sdsd-driver-email[b-4b1ln5h250] {
	margin: 0;
	font-size: 12px;
	color: #5F6E85;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.satistics-box .stats-h6[b-4b1ln5h250] {
	font-size: 18px;
    font-weight: 800;
    line-height: 24px;
    letter-spacing: -0.2px;
    color: var(--dark-txt);
}

.satistics-box .select-and-date[b-4b1ln5h250] {
	width: min(520px, 100%);
}

/* A new date range refetches the figures and the history below them, so the area shows
   it is working rather than holding numbers for a range that is no longer selected. Same
   shape as the dashboard's statistics state, sized for the panel. */
.satistics-box .sds-statistics-state[b-4b1ln5h250] {
	margin: 16px 0;
	padding: 40px 16px;
	gap: 12px;
	flex-wrap: wrap;
	background-color: #F8FAFC;
	border: 1px #1E293B0F solid;
	border-radius: 16px;
	color: var(--gray-txt);
	font-weight: 600;
}

.satistics-box .sds-statistics-state p[b-4b1ln5h250] {
	margin: 0;
}

.satistics-box .cards .card[b-4b1ln5h250] {
	padding: 16px;
	background-color: #F8FAFC;
	border: 1px #1E293B08 solid;
	border-radius: 20px;
}

.satistics-box .cards .card .icon[b-4b1ln5h250] {
	height: 40px;
	width: 40px;
	border-radius: 8px;
	background-color: transparent;
}

.satistics-box .cards .card .icon.yellow[b-4b1ln5h250] {
	background-color: #FFC30A33;
}

.satistics-box .cards .card .icon.green[b-4b1ln5h250] {
	background-color: #409B3F33;
}

.satistics-box .cards .card .icon img[b-4b1ln5h250] {
	height: 22px;
}

.satistics-box .cards .card p[b-4b1ln5h250] {
	font-size: 15px;
	font-weight: 600;
	line-height: 24px;
	letter-spacing: -0.2px;
	color: var(--gray-txt);
}

.satistics-box .cards .card h5[b-4b1ln5h250] {
	font-size: 25px;
	font-weight: 700;
	line-height: 36px;
	letter-spacing: -0.2px;
	color: var(--dark-txt);
}

.satistics-box .cards .card span[b-4b1ln5h250] {
	font-size: 13px;
	font-weight: 600;
	line-height: 20px;
	letter-spacing: -0.2px;
	color: var(--gray-txt);
}

.satistics-box table[b-4b1ln5h250] {
	border-collapse: separate;
	border-spacing: 0;
	border: 1px #1E293B0F solid;
	border-radius: 16px;
}

.satistics-box table th[b-4b1ln5h250] {
	padding: 12px 16px;
	background-color: #F1F5F9;
	font-size: 13px;
	font-weight: 700;
	line-height: 20px;
	letter-spacing: -0.2px;
	color: var(--dark-txt);
}

.satistics-box table th:nth-child(1)[b-4b1ln5h250] {
	border-radius: 16px 0 0 0;
}

.satistics-box table th:nth-child(2)[b-4b1ln5h250] {
	border-radius: 0 16px 0 0;
}

.satistics-box table td[b-4b1ln5h250] {
	padding: 8px 16px;
	font-size: 13px;
	font-weight: 600;
	line-height: 20px;
	letter-spacing: -0.2px;
	color: var(--dark-txt);
}

.satistics-box table tr:nth-child(odd)[b-4b1ln5h250] {
	background-color: #F8FAFC;
}

.satistics-box table tr:nth-child(even)[b-4b1ln5h250] {
	background-color: var(--white);
}

.satistics-box table tr:last-child td:nth-child(1)[b-4b1ln5h250] {
	border-radius: 0 0 0 16px;
}

.satistics-box table tr:last-child td:nth-child(2)[b-4b1ln5h250] {
	border-radius: 0 0 16px 0;
}

.satistics-box .graph-box[b-4b1ln5h250] {
	background-color: #F8FAFC;
	border: 1px #1E293B08 solid;
	border-radius: 20px;
	padding: 16px;
}

.satistics-box .graph-box .icon-txt .icon[b-4b1ln5h250] {
	height: 40px;
	width: 40px;
	border-radius: 8px;
	background-color: var(--l-sky);
}

.satistics-box .graph-box .icon-txt .icon img[b-4b1ln5h250] {
	height: 22px;
}

.satistics-box .graph-box .icon-txt p[b-4b1ln5h250] {
	font-size: 15px;
	font-weight: 600;
	line-height: 24px;
	letter-spacing: -0.2px;
	color: var(--gray-txt);
}

.satistics-box .graph-box .chart-card[b-4b1ln5h250] {
	position: relative;
	height: 300px;
}

.satistics-box .graph-box #revenueChart[b-4b1ln5h250] {
	width: 100% !important;
	height: 100% !important;
}

/* .dispatch-history-box {
	padding: 0px 24px 24px 24px;
} */

/* .dispatch-history-box .txt-btn button {
	padding: 8px;
	gap: 2px;
	background-color: #F1F5F9CC;
	border: 1px #1E293B0F solid;
	border-radius: 8px;
	outline: none;
}

.dispatch-history-box .txt-btn button img {
	height: 16px;
}

.dispatch-history-box .txt-btn button p {
	padding: 0 4px;
	font-size: 12px;
	font-weight: 600;
	line-height: 16px;
	letter-spacing: -0.2px;
	color: var(--dark-txt);
} */

.dispatch-history-box table[b-4b1ln5h250] {
	border-collapse: separate;
	border-spacing: 0;
	border: 1px #1E293B0F solid;
	border-radius: 16px;
}

.dispatch-history-box table th[b-4b1ln5h250] {
	padding: 12px 16px;
	background-color: #F1F5F9;
	border-right: 1px #1E293B0F solid;
	font-size: 13px;
	font-weight: 700;
	line-height: 20px;
	letter-spacing: -0.2px;
	color: var(--dark-txt);
}

.dispatch-history-box table th:first-child[b-4b1ln5h250] {
	border-radius: 16px 0 0 0;
}

.dispatch-history-box table th:last-child[b-4b1ln5h250] {
	border-radius: 0 16px 0 0;
}

.dispatch-history-box table td[b-4b1ln5h250] {
	padding: 8px 16px;
	border-right: 1px #1E293B0F solid;
}

/* A history row opens its dispatch, so it reads as clickable. The tint sits on the cells:
   the row's own background is painted over by them. */
.dispatch-history-box table tr.sds-dispatch-row[b-4b1ln5h250] {
	cursor: pointer;
}

.dispatch-history-box table tr.sds-dispatch-row:hover td[b-4b1ln5h250] {
	background-color: #EEF2FF;
}

.dispatch-history-box table td p[b-4b1ln5h250] {
	font-size: 13px;
	font-weight: 600;
	line-height: 20px;
	letter-spacing: -0.2px;
	color: var(--dark-txt);
}

.dispatch-history-box table td span[b-4b1ln5h250] {
	font-size: 13px;
	font-weight: 500;
	line-height: 20px;
	letter-spacing: -0.2px;
	color: var(--gray-txt);
}

.dispatch-history-box table td .location-bagge[b-4b1ln5h250] {
	gap: 2px;
	padding: 4px 6px;
	background-color: var(--l-sky);
	border-radius: 8px;
	width: max-content;
}

.dispatch-history-box table td .location-bagge p[b-4b1ln5h250] {
	color: var(--sky);
	padding: 0 2px;
	font-size: 12px;
	font-weight: 600;
	line-height: 16px;
}

/* .dispatch-history-box table td button {
	padding: 8px 12px;
	background-color: #5263FF1F;
	border-radius: 8px;
	font-size: 12px;
	font-weight: 600;
	line-height: 16px;
	letter-spacing: -0.2px;
	color: var(--purple-2);
	border: none;
	outline: none;
} */

.dispatch-history-box table tr:nth-child(odd)[b-4b1ln5h250] {
	background-color: #F8FAFC;
}

.dispatch-history-box table tr:nth-child(even)[b-4b1ln5h250] {
	background-color: var(--white);
}

.dispatch-history-box table tr th:last-child[b-4b1ln5h250],
.dispatch-history-box table tr td:last-child[b-4b1ln5h250] {
	border: none;
}

.dispatch-history-box table tr:last-child td:first-child[b-4b1ln5h250] {
	border-radius: 0 0 0 16px;
}

.dispatch-history-box table tr:last-child td:last-child[b-4b1ln5h250] {
	border-radius: 0 0 16px 0;
}

.dispatch-history-box-h6[b-4b1ln5h250] {
	font-size: 18px;
    font-weight: 800;
    line-height: 24px;
    letter-spacing: -0.2px;
    color: var(--dark-txt);
}

.mt-12[b-4b1ln5h250] {
	margin-top: 12px;
}

/* 
.locations-tab {
	border-bottom: 1px #1E293B17 solid;
} */

.locations-tab .title[b-4b1ln5h250] {
	padding: 24px 24px 16px 24px;
}

.locations-tab .title h6[b-4b1ln5h250] {
	font-size: 18px;
	font-weight: 800;
	line-height: 24px;
	letter-spacing: -0.2px;
	color: var(--dark-txt);
}

.locations-tab .title img.info[b-4b1ln5h250] {
	height: 16px;
}

/* .locations-tab .title button {
	padding: 8px;
	gap: 2px;
	background-color: var(--purple);
	border: 1px #1E293B17 solid;
	border-radius: 8px;
	outline: none;
	box-shadow: 0 1px 1px -0.5px #1E293B08;
}

.locations-tab .title button img {
	height: 16px;
}

.locations-tab .title button p {
	padding: 0 4px;
	font-size: 12px;
	font-weight: 600;
	line-height: 16px;
	letter-spacing: -0.2px;
	color: var(--white);
} */

.locations-tab .strap[b-4b1ln5h250] {
	padding: 12px 24px;
	background-color: var(--white);
	cursor: pointer;
}

/* An inactive address listed through "Show inactive": the same fade as a route's inactive stop
   (.rds-loc-item--inactive), with the same activity chip beside its name. */
.locations-tab .strap.strap--inactive[b-4b1ln5h250] {
	opacity: 0.55;
}

/* ── How many are listed, and the switch that adds the inactive ones ── */
.sds-loc-filter[b-4b1ln5h250] {
	padding: 0 24px 12px 24px;
	flex-wrap: wrap;
}

.sds-loc-count[b-4b1ln5h250] {
	font-size: 13px;
	font-weight: 500;
	color: var(--gray-txt);
}

.sds-loc-filter-toggle[b-4b1ln5h250] {
	margin: 0;
	cursor: pointer;
	font-size: 13px;
	font-weight: 600;
	color: var(--dark-txt);
	user-select: none;
}

	.sds-loc-filter-toggle.disabled[b-4b1ln5h250] {
		cursor: not-allowed;
		color: var(--gray-txt);
	}

.locations-tab .strap:hover[b-4b1ln5h250] {
	background-color: #5263FF1F;
}

.locations-tab .strap img[b-4b1ln5h250] {
	height: 20px;
}

.locations-tab .strap p[b-4b1ln5h250] {
	font-size: 13px;
	font-weight: 600;
	line-height: 20px;
	letter-spacing: -0.2px;
	color: var(--dark-txt);
}

.locations-tab .strap span[b-4b1ln5h250] {
	font-size: 13px;
	font-weight: 500;
	line-height: 20px;
	letter-spacing: -0.2px;
	color: var(--gray-txt);
}

.locations-tab .strap .bagge[b-4b1ln5h250] {
	padding: 4px;
	border: 1px transparent solid;
	border-radius: 8px;
	background-color: transparent;
	gap: 2px;
}

.locations-tab .strap .bagge img[b-4b1ln5h250] {
	height: 14px;
}

.locations-tab .strap .bagge p[b-4b1ln5h250] {
	padding: 0 2px;
	font-size: 12px;
	font-weight: 600;
	line-height: 16px;
}

.locations-tab .strap .bagge.white[b-4b1ln5h250] {
	background-color: var(--white);
	border-color: #1E293B17;
	box-shadow: 0 2px 1.5px -0.5px #1E293B08;
}

.locations-tab .strap .bagge.white p[b-4b1ln5h250] {
	color: var(--gray-txt);
}

.locations-tab .strap .bagge.sky[b-4b1ln5h250] {
	background-color: #06B1F11F;
	border-color: #06B1F133;
}

.locations-tab .strap .bagge.sky p[b-4b1ln5h250] {
	color: var(--sky);
}

/* .drivers-tab {
	border-bottom: 1px #1E293B17 solid;
} */

.drivers-tab .title[b-4b1ln5h250] {
	padding: 24px 24px 16px 24px;
}

.drivers-tab .title h6[b-4b1ln5h250] {
	font-size: 18px;
	font-weight: 800;
	line-height: 24px;
	letter-spacing: -0.2px;
	color: var(--dark-txt);
}

.drivers-tab .title img[b-4b1ln5h250] {
	height: 16px;
}

.drivers-tab .strap[b-4b1ln5h250] {
	padding: 12px 24px;
}

.drivers-tab .strap .profile[b-4b1ln5h250] {
	height: 36px;
	width: 36px;
	border-radius: 50px;
	background: transparent;
	color: var(--white);
	font-size: 13px;
	font-weight: 600;
	line-height: 20px;
	letter-spacing: -0.2px;
}

.drivers-tab .strap .profile.blue[b-4b1ln5h250] {
	background: linear-gradient(180deg, #5263FF 0%, #5263FF33 100%);
}

.drivers-tab .strap .profile.pink[b-4b1ln5h250] {
	background: linear-gradient(180deg, #F83CE9 0%, #F83CE933 100%);
}

.drivers-tab .strap .profile.orange[b-4b1ln5h250] {
	background: linear-gradient(180deg, #F74E03 0%, #F74E0333 100%);
}

.drivers-tab .strap .txt p[b-4b1ln5h250] {
	font-size: 13px;
	font-weight: 600;
	line-height: 20px;
	letter-spacing: -0.2px;
	color: var(--dark-txt);
}

.drivers-tab .strap .txt span[b-4b1ln5h250] {
	font-size: 12px;
	font-weight: 500;
	line-height: 16px;
	letter-spacing: -0.2px;
	color: var(--gray-txt-2);
}

/* Each tab pane pads its own content — .sds-body carries none. */
.complaints-tab .title[b-4b1ln5h250] {
	padding: 24px 24px 16px 24px;
}

.complaints-tab .title h6[b-4b1ln5h250] {
	font-size: 18px;
	font-weight: 800;
	line-height: 24px;
	letter-spacing: -0.2px;
	color: var(--dark-txt);
}

.complaints-tab-body[b-4b1ln5h250] {
	padding: 0 24px 24px 24px;
}

/* ── Nickname (our own name for this subcontractor) ──────────────────── */
.sds-nickname-edit[b-4b1ln5h250] {
	margin-top: 4px;
}

.sds-nickname-input[b-4b1ln5h250] {
	flex: 1 1 auto;
	min-width: 0;
	background: #fff;
	border: 1px solid #E2E8F0;
	border-radius: 8px;
	padding: 6px 10px;
	font-family: inherit;
	font-size: 13px;
	font-weight: 500;
	line-height: 20px;
	color: var(--dark-txt);
	outline: none;
	transition: border-color 0.15s, box-shadow 0.15s;
}

.sds-nickname-input:focus[b-4b1ln5h250] {
	border-color: #5263FF;
	box-shadow: 0 0 0 3px #5263FF1A;
}

.sds-nickname-input:disabled[b-4b1ln5h250] {
	opacity: 0.6;
}

.sds-nickname-btn[b-4b1ln5h250] {
	height: initial;
	padding: 4.5px 12px;
	flex-shrink: 0;
}

/* The registered name is read-only; only this pencil-free link opens the nickname. */
.sds-nickname-edit-btn[b-4b1ln5h250] {
	border: none;
	background: none;
	padding: 0;
	font-size: 13px;
	font-weight: 700;
	line-height: 20px;
	letter-spacing: -0.2px;
	color: #5263FF;
}

.sds-nickname-edit-btn:hover[b-4b1ln5h250] {
	text-decoration: underline;
}
/* /Pages/Business/Components/SubcontractorFilesPanel.razor.rz.scp.css */
.sfp[b-iuyfokeak5] {
	display: flex;
	flex-direction: column;
	gap: 16px;
	padding: 24px;
	min-width: 0;
}

.sfp-head h6[b-iuyfokeak5] {
	margin: 0 0 4px 0;
	font-size: 18px;
	font-weight: 800;
	line-height: 24px;
	letter-spacing: -0.2px;
	color: var(--dark-txt);
}

.sfp-hint[b-iuyfokeak5] {
	margin: 0;
	font-size: 13px;
	line-height: 18px;
	color: #5F6E85;
}

.sfp-upload[b-iuyfokeak5] {
	display: flex;
	flex-direction: column;
	gap: 12px;
	padding: 16px;
	border: 1px solid #1E293B17;
	border-radius: 12px;
	background: #F8FAFC;
}

.sfp-upload-options[b-iuyfokeak5] {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	gap: 12px 20px;
}

.sfp-field[b-iuyfokeak5] {
	display: flex;
	flex-direction: column;
	gap: 4px;
	min-width: 0;
	flex: 1 1 260px;
}

.sfp-input[b-iuyfokeak5] {
	height: 40px;
	padding: 0 12px;
	border: 1px solid #E2E8F0;
	border-radius: 10px;
	background: #FFFFFF;
	font-size: 14px;
	color: var(--dark-txt);
}

	.sfp-input:focus[b-iuyfokeak5] {
		outline: none;
		border-color: #0D6EFD;
		box-shadow: 0 0 0 3px rgba(13, 110, 253, 0.12);
	}

	.sfp-field label[b-iuyfokeak5] {
		font-size: 12px;
		font-weight: 600;
		color: #5F6E85;
	}

.sfp-switch[b-iuyfokeak5] {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	cursor: pointer;
	position: relative;
	min-height: 40px;
	margin: 0;
}

	.sfp-switch input[b-iuyfokeak5] {
		position: absolute;
		opacity: 0;
		width: 0;
		height: 0;
	}

.sfp-switch-slider[b-iuyfokeak5] {
	position: relative;
	flex: 0 0 auto;
	width: 36px;
	height: 20px;
	border-radius: 10px;
	background: #CBD5E1;
	transition: background 0.15s ease;
}

	.sfp-switch-slider[b-iuyfokeak5]::after {
		content: "";
		position: absolute;
		top: 2px;
		left: 2px;
		width: 16px;
		height: 16px;
		border-radius: 50%;
		background: #FFFFFF;
		transition: transform 0.15s ease;
	}

.sfp-switch input:checked + .sfp-switch-slider[b-iuyfokeak5] {
	background: #0D6EFD;
}

	.sfp-switch input:checked + .sfp-switch-slider[b-iuyfokeak5]::after {
		transform: translateX(16px);
	}

.sfp-switch input:focus-visible + .sfp-switch-slider[b-iuyfokeak5] {
	outline: 2px solid #0D6EFD;
	outline-offset: 2px;
}

.sfp-switch-label[b-iuyfokeak5] {
	font-size: 13px;
	color: var(--dark-txt);
}

.sfp-dropzone[b-iuyfokeak5] {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 4px;
	min-height: 96px;
	padding: 12px;
	border: 1px dashed #93C5FD;
	border-radius: 10px;
	background: #FFFFFF;
	text-align: center;
	font-size: 13px;
	color: #5F6E85;
}

	.sfp-dropzone:hover[b-iuyfokeak5] {
		background: #EFF6FF;
	}

	.sfp-dropzone img[b-iuyfokeak5] {
		width: 20px;
		height: 20px;
	}

.sfp-dropzone--busy[b-iuyfokeak5] {
	flex-direction: row;
	gap: 8px;
}

	.sfp-dropzone--busy[b-iuyfokeak5]  .sfp-dropzone-input {
		pointer-events: none;
	}

.sfp-dropzone-title[b-iuyfokeak5] {
	font-weight: 600;
	color: #0D6EFD;
}

.sfp-dropzone-hint[b-iuyfokeak5] {
	font-size: 12px;
	color: #94A3B8;
}

[b-iuyfokeak5] .sfp-dropzone-input {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	opacity: 0;
	cursor: pointer;
}

.sfp-state[b-iuyfokeak5] {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 12px;
	min-height: 180px;
	color: #94A3B8;
	text-align: center;
}

	.sfp-state img[b-iuyfokeak5] {
		width: 36px;
		height: 36px;
		opacity: 0.4;
	}

	.sfp-state p[b-iuyfokeak5] {
		margin: 0;
	}



.sfp-row-icon[b-iuyfokeak5] {
	width: 28px;
	height: 28px;
	flex: 0 0 auto;
}


.sfp-row-name[b-iuyfokeak5] {
	font-size: 14px;
	font-weight: 600;
	color: var(--dark-txt);
	text-decoration: none;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

	.sfp-row-name:hover[b-iuyfokeak5] {
		color: #0D6EFD;
		text-decoration: underline;
	}

.sfp-row-meta[b-iuyfokeak5] {
	font-size: 12px;
	color: #94A3B8;
	overflow-wrap: anywhere;
}

.sfp-badge[b-iuyfokeak5] {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	padding: 2px 8px;
	border-radius: 999px;
	font-size: 12px;
	font-weight: 600;
	white-space: nowrap;
}

	.sfp-badge img[b-iuyfokeak5] {
		width: 12px;
		height: 12px;
	}

.sfp-badge--shared[b-iuyfokeak5] {
	background: #DCFCE7;
	color: #15803D;
}

.sfp-badge--internal[b-iuyfokeak5] {
	background: #F1F5F9;
	color: #334155;
}

.sfp-row-actions[b-iuyfokeak5] {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 4px;
}

.sfp-action[b-iuyfokeak5] {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 4px;
	height: 36px;
	padding: 0 12px;
	border: 1px solid #1E293B17;
	border-radius: 8px;
	background: #FFFFFF;
	font-size: 13px;
	color: var(--dark-txt);
}

	.sfp-action:hover:not(:disabled)[b-iuyfokeak5] {
		background: #F1F5F9;
	}

	.sfp-action:disabled[b-iuyfokeak5] {
		opacity: 0.5;
	}

.sfp-action--danger img[b-iuyfokeak5] {
	width: 16px;
	height: 16px;
}

.sfp-confirm[b-iuyfokeak5] {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px 12px;
	padding: 10px 12px;
	border-radius: 8px;
	background: #FEF2F2;
}

	.sfp-confirm p[b-iuyfokeak5] {
		flex: 1 1 220px;
		margin: 0;
		font-size: 13px;
		color: #7F1D1D;
		overflow-wrap: anywhere;
	}

.sfp-confirm-actions[b-iuyfokeak5] {
	display: flex;
	gap: 8px;
	margin-left: auto;
}

.sfp-action--delete[b-iuyfokeak5] {
	border-color: #B91C1C;
	background: #B91C1C;
	color: #FFFFFF;
	font-weight: 600;
}

	.sfp-action--delete:hover:not(:disabled)[b-iuyfokeak5] {
		background: #991B1B;
	}

/* Toolbar: search and type filter on the left, adding a file on the right. */
.sfp-toolbar[b-iuyfokeak5] {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px 12px;
}

.sfp-search[b-iuyfokeak5] {
	flex: 1 1 220px;
	min-width: 0;
}

.sfp-kind[b-iuyfokeak5] {
	flex: 0 1 170px;
	min-width: 140px;
}

.sfp-add[b-iuyfokeak5] {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	height: 40px;
	margin-left: auto;
	padding: 0 14px;
	border: none;
	border-radius: 10px;
	background: #5263FF;
	color: #FFFFFF;
	font-size: 13px;
	font-weight: 600;
	white-space: nowrap;
}

	.sfp-add img[b-iuyfokeak5] {
		width: 14px;
		height: 14px;
		transition: transform 0.15s ease;
	}

	.sfp-add:hover:not(:disabled)[b-iuyfokeak5] {
		background: #4150E6;
	}

	.sfp-add:disabled[b-iuyfokeak5] {
		opacity: 0.6;
	}

.sfp-add--open img[b-iuyfokeak5] {
	transform: rotate(45deg);
}

.sfp-state--compact[b-iuyfokeak5] {
	min-height: 96px;
}

.sfp-table-wrap[b-iuyfokeak5] {
	overflow-x: auto;
	border: 1px solid #1E293B17;
	border-radius: 12px;
}

.sfp-table[b-iuyfokeak5] {
	width: 100%;
	min-width: 520px;
	border-collapse: collapse;
	font-size: 13px;
}

	.sfp-table th[b-iuyfokeak5] {
		padding: 10px;
		background: #F8FAFC;
		border-bottom: 1px solid #1E293B17;
		font-size: 11px;
		font-weight: 700;
		letter-spacing: 0.3px;
		color: #5F6E85;
		text-align: left;
		white-space: nowrap;
	}

	.sfp-table td[b-iuyfokeak5] {
		padding: 10px;
		border-bottom: 1px solid #1E293B0D;
		vertical-align: middle;
		color: var(--dark-txt);
	}

	.sfp-table tbody tr:last-child td[b-iuyfokeak5] {
		border-bottom: none;
	}

	.sfp-table tbody tr:hover td[b-iuyfokeak5] {
		background: #F8FAFC;
	}

.sfp-tr--confirming td[b-iuyfokeak5] {
	border-bottom: none;
}

.sfp-tr-confirm td[b-iuyfokeak5] {
	padding-top: 0;
}

.sfp-col-actions[b-iuyfokeak5] {
	width: 1%;
	white-space: nowrap;
	text-align: right;
}

.sfp-name-cell[b-iuyfokeak5] {
	display: flex;
	align-items: center;
	gap: 10px;
	min-width: 0;
}

.sfp-name-text[b-iuyfokeak5] {
	display: flex;
	flex-direction: column;
	min-width: 0;
	max-width: 180px;
}

	.sfp-name-text .sfp-row-meta[b-iuyfokeak5] {
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
	}

.sfp-muted[b-iuyfokeak5] {
	color: #5F6E85 !important;
	white-space: nowrap;
}

	.sfp-table td .sfp-row-meta[b-iuyfokeak5] {
		display: block;
	}

	.sfp-muted .sfp-row-meta[b-iuyfokeak5] {
		white-space: nowrap;
	}

.sfp-from[b-iuyfokeak5] {
	display: block;
	font-weight: 600;
}

.sfp-from--partner[b-iuyfokeak5] {
	color: #0F766E;
}

.sfp-from--own[b-iuyfokeak5] {
	color: #4338CA;
}

.sfp-action--compact[b-iuyfokeak5] {
	height: 32px;
	padding: 0 10px;
	font-size: 12px;
	white-space: nowrap;
}

.sfp-action--danger[b-iuyfokeak5] {
	height: 32px;
	width: 32px;
	padding: 0;
}
/* /Pages/Business/Subcontractors.razor.rz.scp.css */
/* ── Status filter dropdown (WMDropdown wrapper) ────────────────────────── */
.sc-status-dropdown[b-cm55d52828] {
	width: 160px;
	flex-shrink: 0;
}

/* ── Equal-width table columns ───────────────────────────────────────────── */
.sc-table[b-cm55d52828] {
	table-layout: fixed;
	width: 100%;
}

/* ── Name cell ───────────────────────────────────────────────────────────── */
/* A flex child sizes to its content unless it is told it may shrink, which is how a long
   registered name used to run out of the cell and across the tax id. It is told here, and
   the name wraps onto a second line instead of leaving the column. */
.sc-name-cell[b-cm55d52828] {
	flex: 1 1 auto;
	min-width: 0;
}

.sc-name[b-cm55d52828] {
	font-size: 14px;
	font-weight: 500;
	color: #1E293B;
	line-height: 20px;
	white-space: normal;
	overflow-wrap: anywhere;
}

/* ── Muted table cells ───────────────────────────────────────────────────── */
.sc-cell-muted[b-cm55d52828] {
	font-size: 14px;
	font-weight: 400;
	color: #5F6E85;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

/* ── Avatar icons ────────────────────────────────────────────────────────── */
.sc-avatar[b-cm55d52828] {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	width: 32px;
	height: 32px;
	overflow: hidden;
}

	/* Logo images fill the container */
	.sc-avatar img:not(.sc-avatar-fallback-img)[b-cm55d52828] {
		width: 100%;
		height: 100%;
		object-fit: cover;
	}

/* Default/fallback images are padded inside the container */
.sc-avatar-fallback-img[b-cm55d52828] {
	width: 18px;
	height: 18px;
	object-fit: contain;
}

.sc-avatar-square[b-cm55d52828] {
	background-color: #5263FF1F;
	border-radius: 6px;
}

.sc-avatar-circle[b-cm55d52828] {
	background-color: #F1F5F9;
	border-radius: 100%;
}

/* ── Clickable active rows ───────────────────────────────────────────────── */
.sc-row-clickable[b-cm55d52828] {
	cursor: pointer;
	transition: background 0.12s;
}

.sc-row-clickable:hover[b-cm55d52828] {
	background: #F8FAFC;
}

.sc-row-status[b-cm55d52828] {
	display: inline-block;
    height: 26px;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 600;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
    vertical-align: middle;
}

.sc-row-status-success[b-cm55d52828] {
	background: rgba(64, 155, 63, 0.12);
	color: rgba(51, 135, 50, 1);
	/* border-color: rgba(64, 155, 63, 0.2); */
}

.sc-row-status-warning[b-cm55d52828] {
	background: rgba(255, 195, 10, 0.12);
	color: rgba(180, 117, 0, 1);
	/* border-color: rgba(255, 195, 10, 0.2); */
}

/* Withdraw, on a pending row only. Quiet until the row is hovered: it is a destructive
   action sitting on every waiting invitation, and it must not read as the row's purpose. */
.sc-row-withdraw[b-cm55d52828] {
	background: none;
	border: none;
	padding: 4px 8px;
	border-radius: 6px;
	font-size: 12px;
	font-weight: 600;
	white-space: nowrap;
	color: #B91C1C;
	opacity: 0.75;
	transition: background 0.12s, opacity 0.12s;
}

.sc-row-withdraw:hover[b-cm55d52828] {
	background: rgba(185, 28, 28, 0.1);
	opacity: 1;
}

/* ── Loading spinner ─────────────────────────────────────────────────────── */
.sc-loading[b-cm55d52828] {
	display: flex;
	justify-content: center;
	align-items: center;
	height: 300px;
	color: #0D6EFD;
}
/* The registered name, kept under a nickname so the row is still recognisable. */
.sc-name-registered[b-cm55d52828] {
	font-size: 12px;
	font-weight: 400;
	color: #5F6E85;
	line-height: 16px;
	white-space: normal;
	overflow-wrap: anywhere;
}

/* Which way a relationship runs. Two quiet tints so the column reads at a glance without
   competing with the status pill beside it. */
.sc-relation[b-cm55d52828] {
	display: inline-block;
	padding: 2px 10px;
	border-radius: 999px;
	font-size: 12px;
	font-weight: 600;
	white-space: nowrap;
}

.sc-relation-subcontractor[b-cm55d52828] {
	background: #EEF2FF;
	color: #4338CA;
}

.sc-relation-contractor[b-cm55d52828] {
	background: #F0FDFA;
	color: #0F766E;
}
/* /Pages/CustomerDashboard/CustomerDashboard.razor.rz.scp.css */
.dashboard-corridor[b-b74ar0vq8x]{display:grid;grid-template-columns:380px minmax(0,1fr);gap:24px;height:calc(100vh - 112px);min-height:680px;align-items:stretch;overflow:hidden}
.cost-card[b-b74ar0vq8x],.drives-card[b-b74ar0vq8x],.locations-card[b-b74ar0vq8x]{background:#fff;border:1px solid #1e293b08;border-radius:20px;box-shadow:0 1px 1px -.5px #1e293b08,0 3px 3px -1.5px #1e293b08,0 20px 20px -12px #1e293b08}
.cost-card[b-b74ar0vq8x]{display:flex;flex-direction:column;min-width:0;padding:16px;overflow:hidden}
.card-heading[b-b74ar0vq8x],.heading-label[b-b74ar0vq8x],.locations-toolbar[b-b74ar0vq8x],.location-filters[b-b74ar0vq8x]{display:flex;align-items:center}
.card-heading[b-b74ar0vq8x],.locations-toolbar[b-b74ar0vq8x]{justify-content:space-between}
.heading-label[b-b74ar0vq8x]{gap:8px;color:#475569;font-size:15px;font-weight:600;line-height:24px}
.icon-tile[b-b74ar0vq8x]{display:grid;place-items:center;width:40px;height:40px;border-radius:8px}
.icon-tile img[b-b74ar0vq8x]{width:22px;height:22px}
.cost-icon[b-b74ar0vq8x]{background:#409b3f33}.drives-icon[b-b74ar0vq8x]{background:#ed403033}.location-icon[b-b74ar0vq8x]{background:#5263ff33}
.card-heading select[b-b74ar0vq8x],.location-filters select[b-b74ar0vq8x]{height:34px;padding:0 34px 0 12px;border:1px solid #1e293b1f;border-radius:8px;background:#fff url('/img/icons/gray-arrow.png') no-repeat right 8px center/18px;appearance:none;color:#1e293b;font-size:12px;font-weight:600;outline:0}
.cost-total[b-b74ar0vq8x]{display:flex;align-items:baseline;gap:5px;margin:16px 4px 12px;color:#1e293b;font-size:34px;font-weight:700;line-height:40px;letter-spacing:-1.4px}.cost-total small[b-b74ar0vq8x]{font-size:12px;font-weight:600;line-height:16px;letter-spacing:-.2px;color:#475569}
.work-type-strip[b-b74ar0vq8x]{display:flex;gap:12px;overflow-x:auto;padding-bottom:5px;scrollbar-width:thin}
.work-type-strip>div[b-b74ar0vq8x]{display:flex;align-items:center;gap:8px;min-width:max-content;padding:8px 16px;border-radius:12px;background:#f1f5f9}
.work-type-strip span[b-b74ar0vq8x]{color:#475569;font-size:12px;font-weight:600}.work-type-strip strong[b-b74ar0vq8x]{color:#1e293b;font-size:15px;font-weight:800}
.pill-chart[b-b74ar0vq8x]{display:flex;align-items:end;gap:10px;height:310px;padding:30px 4px 0;border-bottom:1px solid #e8edf3}
.pill-chart.all-time[b-b74ar0vq8x]{overflow-x:auto;scrollbar-width:thin}
.pill-chart.all-time .pill-column[b-b74ar0vq8x]{flex:0 0 44px}
.pill-column[b-b74ar0vq8x]{display:grid;grid-template-rows:20px 1fr 24px;justify-items:center;align-items:end;min-width:42px;height:100%;flex:1}
.pill-column>strong[b-b74ar0vq8x]{align-self:start;color:#475569;font-size:12px;font-weight:500}
.pill-track[b-b74ar0vq8x]{position:relative;width:min(44px,82%);height:100%;overflow:hidden;border-radius:18px;background:#e8edf3}
.pill-fill[b-b74ar0vq8x]{position:absolute;right:0;bottom:0;left:0;display:flex;flex-direction:column-reverse;overflow:hidden;border-radius:18px}
.pill-segment[b-b74ar0vq8x]{display:block;min-height:0;flex:none}
.pill-column small[b-b74ar0vq8x]{padding-top:8px;color:#475569;font-size:11px;text-transform:lowercase}
.chart-empty[b-b74ar0vq8x]{height:310px}.chart-legend[b-b74ar0vq8x]{display:flex;gap:8px;overflow-x:auto;padding:12px 0 4px;scrollbar-width:thin}
.chart-legend span[b-b74ar0vq8x]{display:flex;align-items:center;gap:4px;min-width:max-content;padding:4px 6px;border:1px solid #1e293b08;border-radius:8px;background:#f1f5f9cc;color:#1e293b;font-size:11px;font-weight:600}
.chart-legend i[b-b74ar0vq8x]{display:block;width:14px;height:14px;border-radius:50%}
.pill-segment.work-type-0[b-b74ar0vq8x],.legend-item.work-type-0 i[b-b74ar0vq8x]{background:#5263ff}.pill-segment.work-type-1[b-b74ar0vq8x],.legend-item.work-type-1 i[b-b74ar0vq8x]{background:#69d7ff}.pill-segment.work-type-2[b-b74ar0vq8x],.legend-item.work-type-2 i[b-b74ar0vq8x]{background:#9cda9b}.pill-segment.work-type-3[b-b74ar0vq8x],.legend-item.work-type-3 i[b-b74ar0vq8x]{background:#f5b84b}.pill-segment.work-type-4[b-b74ar0vq8x],.legend-item.work-type-4 i[b-b74ar0vq8x]{background:#a78bfa}.pill-segment.work-type-5[b-b74ar0vq8x],.legend-item.work-type-5 i[b-b74ar0vq8x]{background:#fb7185}
.monthly-table-wrap[b-b74ar0vq8x]{display:flex;flex-direction:column;flex:1 1 auto;width:100%;min-height:0;margin-top:16px;padding-top:12px}.monthly-table-scroll[b-b74ar0vq8x]{flex:1 1 auto;min-height:0;overflow-y:auto;scrollbar-width:thin}
.monthly-table[b-b74ar0vq8x]{width:100%;border-collapse:separate;border-spacing:0;color:#475569;font-size:12px;font-weight:600}
.monthly-table th[b-b74ar0vq8x]{padding:5px 16px;background:#f1f5f9;color:#475569;text-align:left;text-transform:none}.monthly-table-scroll.all-time th[b-b74ar0vq8x]{position:sticky;top:0;z-index:1}.monthly-table td[b-b74ar0vq8x]{padding:10px 16px;border:0}.monthly-table th:last-child[b-b74ar0vq8x],.monthly-table td:last-child[b-b74ar0vq8x]{text-align:right}.monthly-table tbody tr:nth-child(even)[b-b74ar0vq8x]{background:#f8fafc}
.dashboard-content[b-b74ar0vq8x]{display:flex;flex-direction:column;min-width:0;min-height:0}.drives-card[b-b74ar0vq8x]{display:flex;flex-direction:column;gap:10px;min-height:0;padding:16px}.dispatch-strap[b-b74ar0vq8x]{display:flex;align-items:center;justify-content:space-between;width:100%;height:40px;padding:8px 8px 8px 16px;border:0;border-radius:12px;text-align:left}
.dispatch-strap span[b-b74ar0vq8x]{display:flex;align-items:center;gap:8px;min-width:0;color:#475569;font-size:12px;font-weight:600}.dispatch-strap span img[b-b74ar0vq8x]{width:18px;height:18px;flex:none}
.dispatch-strap strong[b-b74ar0vq8x]{flex:none;padding:4px 10px;border-radius:6px;font-size:10px;font-weight:600;box-shadow:0 1px 1px -.5px #1e293b08}
.dispatch-strap.planned[b-b74ar0vq8x]{background:#5263ff1f}.dispatch-strap.planned span[b-b74ar0vq8x]{color:#5263ff}.dispatch-strap.planned strong[b-b74ar0vq8x]{background:#5263ff;color:#fff}
.dispatch-strap.history[b-b74ar0vq8x]{background:#f1f5f9}.dispatch-strap.history strong[b-b74ar0vq8x]{border:1px solid #1e293b17;background:#fff;color:#475569}
.locations-card[b-b74ar0vq8x]{display:flex;flex:1;flex-direction:column;min-height:0;margin-top:24px;overflow:hidden}.locations-toolbar[b-b74ar0vq8x]{min-height:70px;gap:16px;padding:14px 16px}.location-filters[b-b74ar0vq8x]{gap:8px;flex:1;justify-content:flex-start;min-width:0}
.search-box[b-b74ar0vq8x]{display:flex;align-items:center;gap:6px;width:240px;height:32px;padding:0 10px;border:1px solid #1e293b1f;border-radius:18px;box-shadow:0 1px 1px -.5px #1e293b08,0 3px 3px -1.5px #1e293b08}.search-box img[b-b74ar0vq8x]{width:18px}.search-box input[b-b74ar0vq8x]{width:100%;border:0;outline:0;color:#1e293b;font-size:12px;background:transparent}.search-box input[b-b74ar0vq8x]::placeholder{color:transparent}
.customer-chip[b-b74ar0vq8x]{max-width:180px;overflow:hidden;padding:7px 10px;border-radius:8px;background:#5263ff1f;color:#5263ff;font-size:11px;font-weight:600;text-overflow:ellipsis;white-space:nowrap}
.responsive-table[b-b74ar0vq8x]{flex:1;min-height:0;overflow:auto}.locations-table[b-b74ar0vq8x]{width:100%;min-width:760px;border-collapse:collapse;color:#475569;font-size:12px}.locations-table th[b-b74ar0vq8x]{position:sticky;top:0;z-index:1;height:40px;padding:10px 16px;background:#f8fafc;border-block:1px solid #eef2f6;color:#5F6E85;font-size:10px;font-weight:600;text-align:left}.locations-table td[b-b74ar0vq8x]{height:82px;padding:11px 16px;border-bottom:1px solid #eef2f6}.locations-table th:first-child[b-b74ar0vq8x],.locations-table td:first-child[b-b74ar0vq8x]{width:42%}.locations-table tbody tr[b-b74ar0vq8x]{cursor:pointer}.locations-table tbody tr:hover[b-b74ar0vq8x]{background:#5263ff12}
.location-cell[b-b74ar0vq8x]{display:flex;align-items:center;gap:9px}.location-cell img[b-b74ar0vq8x]{width:42px;height:42px;border-radius:8px;object-fit:cover}.location-cell span[b-b74ar0vq8x]{display:flex;flex-direction:column;min-width:0}.location-cell strong[b-b74ar0vq8x]{color:#1e293b}.location-cell small[b-b74ar0vq8x]{max-width:300px;overflow:hidden;color:#475569;text-overflow:ellipsis;white-space:nowrap}.dispatch-date-value[b-b74ar0vq8x]{font-weight:600}
.price-pills[b-b74ar0vq8x]{display:flex;flex-direction:column;align-items:flex-start;gap:5px}.price-pills>span[b-b74ar0vq8x]{display:flex;align-items:center;gap:5px}.price-pills em[b-b74ar0vq8x]{color:#1e293b;font-style:normal}.price-pills strong[b-b74ar0vq8x],.price-pills .no-price[b-b74ar0vq8x]{padding:4px 7px;border-radius:7px;background:#409b3f1f;color:#337C33;font-size:10px}.price-pills .no-price[b-b74ar0vq8x]{background:#ffc30a1f;color:#b88600}
.pagination[b-b74ar0vq8x]{display:flex;justify-content:space-between;align-items:center;min-height:56px;padding:10px 16px;color:#5F6E85;font-size:11px}.pagination button[b-b74ar0vq8x],.row-button[b-b74ar0vq8x],.close-button[b-b74ar0vq8x]{border:1px solid #1e293b0f;border-radius:8px;background:#f8fafc}.page-buttons[b-b74ar0vq8x],.page-tools[b-b74ar0vq8x],.page-tools label[b-b74ar0vq8x]{display:flex;align-items:center}.page-buttons[b-b74ar0vq8x]{gap:4px}.page-buttons button[b-b74ar0vq8x]{min-width:30px;height:32px;padding:0 8px;color:#475569}.page-buttons button.active[b-b74ar0vq8x]{background:#f1f5f9;color:#1e293b}.page-buttons button:disabled[b-b74ar0vq8x]{color:#94a3b8}.page-buttons span[b-b74ar0vq8x]{padding:0 8px}.page-tools[b-b74ar0vq8x]{gap:8px}.page-tools label[b-b74ar0vq8x]{gap:8px;white-space:nowrap}.page-tools input[b-b74ar0vq8x]{width:78px;height:32px;padding:0 10px;border:1px solid #1e293b0f;border-radius:8px;background:#f1f5f9;color:#475569}.page-tools input[b-b74ar0vq8x]::placeholder{color:#5F6E85}.page-tools .go-button[b-b74ar0vq8x]{width:36px;height:28px;background:#fff;color:#475569}.page-divider[b-b74ar0vq8x]{width:1px;height:24px;margin:0 6px;background:#e2e8f0}.page-tools select[b-b74ar0vq8x]{width:62px;height:34px;padding:0 26px 0 10px;border:1px solid #1e293b0f;border-radius:8px;background:#fff url('/img/icons/gray-arrow.png') no-repeat right 6px center/14px;appearance:none;color:#475569}
.dashboard-state[b-b74ar0vq8x],.empty-inline[b-b74ar0vq8x]{display:grid;place-items:center;text-align:center;color:#778196}.dashboard-state[b-b74ar0vq8x]{min-height:360px;background:#fff;border:1px solid #e2e7ef;border-radius:20px}.dashboard-state.error[b-b74ar0vq8x]{color:#b94b54}.empty-inline[b-b74ar0vq8x]{min-height:120px}.primary-button[b-b74ar0vq8x],.secondary-button[b-b74ar0vq8x]{border-radius:8px;padding:9px 13px;font-size:12px;font-weight:600}.primary-button[b-b74ar0vq8x]{border:0;background:#5263ff;color:#fff}.secondary-button[b-b74ar0vq8x]{border:1px solid #dce1eb;background:#fff;color:#4e5c76}
.drawer-backdrop[b-b74ar0vq8x],.modal-backdrop[b-b74ar0vq8x]{position:fixed;inset:0;background:#26304873;z-index:80}.portal-drawer[b-b74ar0vq8x]{position:fixed;right:0;top:0;height:100vh;width:min(620px,92vw);background:#fff;z-index:90;box-shadow:-15px 0 45px #1f294438;overflow:auto}.portal-drawer>header[b-b74ar0vq8x],.overview-modal>header[b-b74ar0vq8x],.address-modal>header[b-b74ar0vq8x]{position:sticky;top:0;background:#fff;z-index:2;display:flex;justify-content:space-between;align-items:start;border-bottom:1px solid #e8ebf1;padding:18px 20px}.portal-drawer h2[b-b74ar0vq8x],.overview-modal h2[b-b74ar0vq8x],.address-modal h2[b-b74ar0vq8x]{font-size:19px;margin:4px 0}.close-button[b-b74ar0vq8x]{width:34px;height:34px;font-size:22px;color:#697386}.eyebrow[b-b74ar0vq8x]{font-size:9px;text-transform:uppercase;letter-spacing:.09em;color:#6370e6;font-weight:700}.drawer-hero[b-b74ar0vq8x]{display:flex;gap:14px;padding:18px 20px}.drawer-hero>img[b-b74ar0vq8x]{width:115px;height:85px;border-radius:10px;object-fit:cover}.drawer-hero h3[b-b74ar0vq8x]{margin:5px 0}.drawer-hero p[b-b74ar0vq8x]{color:#778196;font-size:12px}.drawer-tabs[b-b74ar0vq8x]{display:flex;border-bottom:1px solid #e8ebf1;padding:0 20px}.drawer-tabs button[b-b74ar0vq8x]{border:0;background:none;padding:12px 16px;color:#7b8495;font-size:12px}.drawer-tabs button.active[b-b74ar0vq8x]{color:#5664e4;border-bottom:2px solid #5664e4}.drawer-content[b-b74ar0vq8x]{padding:18px 20px}.detail-grid[b-b74ar0vq8x]{display:grid;grid-template-columns:1fr 1fr;gap:10px}.detail-grid label[b-b74ar0vq8x]{display:flex;flex-direction:column;gap:5px;background:#f7f8fb;border-radius:9px;padding:11px;color:#7b8495;font-size:10px}.detail-grid label strong[b-b74ar0vq8x]{color:#344056;font-size:12px}.detail-grid .wide[b-b74ar0vq8x]{grid-column:1/-1}.drawer-content h4[b-b74ar0vq8x]{font-size:12px;margin:20px 0 9px}.image-grid[b-b74ar0vq8x]{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.image-grid button[b-b74ar0vq8x]{padding:0;border:0;border-radius:8px;overflow:hidden;background:#eef0f5}.image-grid img[b-b74ar0vq8x]{width:100%;height:105px;object-fit:cover;display:block}.price-list>div[b-b74ar0vq8x]{display:flex;justify-content:space-between;border-bottom:1px solid #edf0f4;padding:10px;font-size:11px}.rule-list>div[b-b74ar0vq8x]{border:1px solid #e4e8f0;border-radius:9px;padding:11px;margin-bottom:7px}.rule-list p[b-b74ar0vq8x]{font-size:11px;color:#778196;margin:5px 0}.file-list[b-b74ar0vq8x]{display:flex;flex-direction:column;gap:5px}.file-list a[b-b74ar0vq8x]{color:#5664df;text-decoration:none;background:#f5f6fa;padding:10px;border-radius:8px;font-size:11px}
.map-preview[b-b74ar0vq8x]{display:block;width:100%;border:0;padding:0;border-radius:10px;overflow:hidden;background:#eef1f5}.map-preview img[b-b74ar0vq8x]{display:block;width:100%;max-height:240px;object-fit:cover}.address-map[b-b74ar0vq8x]{margin:15px;width:calc(100% - 30px)}.operation-summary[b-b74ar0vq8x]{display:grid;grid-template-columns:1fr 1fr;gap:10px}.operation-summary>div[b-b74ar0vq8x]{display:flex;flex-direction:column;background:#f5f7fb;border-radius:9px;padding:13px}.operation-summary small[b-b74ar0vq8x]{color:#7b8495}.operation-summary strong[b-b74ar0vq8x]{font-size:18px}.dispatch-list.compact[b-b74ar0vq8x]{padding:0}.dispatch-cost-chart[b-b74ar0vq8x]{height:150px;display:flex;align-items:end;gap:8px;margin:0 15px 18px;padding:12px;border:1px solid #edf0f5;border-radius:10px}.dispatch-cost-chart>div[b-b74ar0vq8x]{height:100%;flex:1;display:flex;flex-direction:column;justify-content:end;align-items:center}.dispatch-cost-chart span[b-b74ar0vq8x]{display:block;width:100%;max-width:38px;min-height:4px;background:#5868e8;border-radius:5px 5px 0 0}.dispatch-cost-chart small[b-b74ar0vq8x]{font-size:8px;color:#7b8495;margin-top:5px}.modal-section-title[b-b74ar0vq8x]{font-size:13px;margin:0 15px 8px}.dispatch-toolbar[b-b74ar0vq8x]{display:flex;gap:7px;flex-wrap:wrap;padding:14px 18px;border-bottom:1px solid #e8ebf1}.dispatch-toolbar select[b-b74ar0vq8x],.dispatch-toolbar input[b-b74ar0vq8x]{height:40px;border:1px solid #dfe4ed;border-radius:8px;padding:0 10px;background:#fff;color:#4f596b}.dispatch-list[b-b74ar0vq8x]{padding:10px}.dispatch-list>button[b-b74ar0vq8x]{display:flex;align-items:center;width:100%;border:0;background:#fff;text-align:left;border-bottom:1px solid #edf0f4;padding:11px;border-radius:8px}.dispatch-list>button:hover[b-b74ar0vq8x]{background:#f8f9fd}.dispatch-date[b-b74ar0vq8x]{display:flex;flex-direction:column;align-items:center;width:46px;border-right:1px solid #e6e9ef}.dispatch-date strong[b-b74ar0vq8x]{font-size:18px}.dispatch-date small[b-b74ar0vq8x]{font-size:9px;text-transform:uppercase}.dispatch-info[b-b74ar0vq8x]{display:flex;flex-direction:column;gap:4px;flex:1;padding-left:12px}.dispatch-info small[b-b74ar0vq8x]{font-size:10px;color:#7b8495}.status-pill[b-b74ar0vq8x]{display:inline-block;padding:4px 7px;border-radius:10px;font-size:9px;font-weight:700}.status-pill.active[b-b74ar0vq8x]{background:#e7f8ee;color:#2f9d62}.status-pill.inactive[b-b74ar0vq8x]{background:#f0f1f5;color:#777f8f}.status-pill.planned[b-b74ar0vq8x]{background:#eceeff;color:#5967e4}
.overview-modal[b-b74ar0vq8x],.address-modal[b-b74ar0vq8x]{position:fixed;z-index:100;left:50%;top:50%;transform:translate(-50%,-50%);width:min(720px,92vw);max-height:88vh;overflow:auto;background:#fff;border-radius:15px;box-shadow:0 25px 70px #17213852}.modal-backdrop[b-b74ar0vq8x]{z-index:95}.modal-backdrop.top[b-b74ar0vq8x]{z-index:105}.address-modal[b-b74ar0vq8x]{z-index:110;width:min(560px,92vw)}.overview-modal header p[b-b74ar0vq8x],.address-modal header p[b-b74ar0vq8x]{margin:0;color:#7b8495;font-size:11px}.overview-metrics[b-b74ar0vq8x]{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:15px}.overview-metrics div[b-b74ar0vq8x]{display:flex;flex-direction:column;background:#f5f7fb;padding:14px;border-radius:9px}.overview-metrics small[b-b74ar0vq8x]{color:#7b8495}.overview-metrics strong[b-b74ar0vq8x]{font-size:18px;margin-top:4px}.dispatch-locations[b-b74ar0vq8x]{padding:0 15px 16px}.dispatch-locations button[b-b74ar0vq8x]{display:flex;justify-content:space-between;align-items:center;width:100%;padding:12px;border:0;border-bottom:1px solid #edf0f4;background:#fff;text-align:left}.dispatch-locations button>span[b-b74ar0vq8x]{display:flex;flex-direction:column}.dispatch-locations small[b-b74ar0vq8x]{color:#7d8697;font-size:10px}.address-modal>.detail-grid[b-b74ar0vq8x],.address-modal>h3[b-b74ar0vq8x],.address-modal>.image-grid[b-b74ar0vq8x]{margin:15px}.image-viewer[b-b74ar0vq8x]{position:fixed;inset:0;z-index:150;background:#111827e8;display:grid;place-items:center;padding:30px}.image-viewer img[b-b74ar0vq8x]{max-width:92vw;max-height:88vh;object-fit:contain}.image-viewer button[b-b74ar0vq8x]{position:absolute;right:22px;top:18px;background:#fff;border:0;border-radius:50%;width:38px;height:38px;font-size:22px}
@media(max-width:1440px){.dashboard-corridor[b-b74ar0vq8x]{grid-template-columns:340px minmax(0,1fr)}.pagination[b-b74ar0vq8x]{align-items:flex-start;gap:12px}.page-tools[b-b74ar0vq8x]{flex-wrap:wrap;justify-content:flex-end}}
@media(max-width:1100px){.dashboard-corridor[b-b74ar0vq8x]{grid-template-columns:1fr;height:auto;min-height:0;overflow:visible}.cost-card[b-b74ar0vq8x]{display:grid;grid-template-columns:minmax(240px,.65fr) minmax(420px,1.35fr);column-gap:24px}.cost-card .card-heading[b-b74ar0vq8x],.cost-card .cost-total[b-b74ar0vq8x],.cost-card .work-type-strip[b-b74ar0vq8x],.cost-card .chart-legend[b-b74ar0vq8x],.cost-card .monthly-table-wrap[b-b74ar0vq8x]{grid-column:1}.cost-card .pill-chart[b-b74ar0vq8x],.cost-card .chart-empty[b-b74ar0vq8x]{grid-column:2;grid-row:1/6}.monthly-table-wrap[b-b74ar0vq8x]{margin-top:16px}.pagination[b-b74ar0vq8x]{flex-direction:column}.page-tools[b-b74ar0vq8x]{justify-content:flex-start}}
@media(max-width:900px){.cost-card[b-b74ar0vq8x]{display:block}.location-filters[b-b74ar0vq8x]{flex-wrap:wrap}.search-box[b-b74ar0vq8x]{width:100%}.pill-chart[b-b74ar0vq8x]{height:250px}.page-tools[b-b74ar0vq8x]{display:none}}
@media(max-width:650px){.dashboard-corridor[b-b74ar0vq8x]{gap:14px}.cost-card[b-b74ar0vq8x],.drives-card[b-b74ar0vq8x],.locations-card[b-b74ar0vq8x]{border-radius:14px}.locations-toolbar[b-b74ar0vq8x]{align-items:flex-start;flex-direction:column}.location-filters[b-b74ar0vq8x]{justify-content:flex-start;width:100%}.portal-drawer[b-b74ar0vq8x]{width:100vw}.detail-grid[b-b74ar0vq8x]{grid-template-columns:1fr}.detail-grid .wide[b-b74ar0vq8x]{grid-column:auto}.drawer-hero>img[b-b74ar0vq8x]{width:85px;height:75px}.image-grid[b-b74ar0vq8x]{grid-template-columns:repeat(2,1fr)}.pill-chart[b-b74ar0vq8x]{overflow-x:auto}.pill-column[b-b74ar0vq8x]{min-width:44px}.page-buttons button:nth-of-type(n+5):not(:last-child)[b-b74ar0vq8x]{display:none}}

/* Customer dashboard dispatch history drawer */
.dispatch-history-drawer[b-b74ar0vq8x] {
    position: fixed;
    top: 0;
    right: calc(100% - 100vw);
    z-index: 90;
    display: flex;
    width: min(740px, 100vw);
    height: 100vh;
    height: 100dvh;
    flex-direction: column;
    overflow: hidden;
    background: #fff;
    box-shadow: -15px 0 45px #1f294438;
    color: #1e293b;
}

.dispatch-history-header[b-b74ar0vq8x] {
    display: flex;
    min-height: 80px;
    flex: 0 0 80px;
    align-items: center;
    justify-content: space-between;
    padding: 16px 24px;
    gap: 16px;
    border-bottom: 1px solid #1e293b17;
    background: #fff;
}

.dispatch-history-title[b-b74ar0vq8x],
.dispatch-history-actions[b-b74ar0vq8x] {
    display: flex;
    align-items: center;
}

.dispatch-history-title[b-b74ar0vq8x] { min-width: 0; gap: 16px; }
.dispatch-history-actions[b-b74ar0vq8x] { flex: 0 0 auto; gap: 16px; }

.dispatch-history-icon[b-b74ar0vq8x] {
    display: grid;
    width: 48px;
    height: 48px;
    flex: 0 0 48px;
    place-items: center;
    border-radius: 10px;
    background: #5263ff1f;
}

.dispatch-history-icon img[b-b74ar0vq8x] { width: 28px; height: 28px; }

.dispatch-history-title h2[b-b74ar0vq8x] {
    margin: 0;
    overflow: hidden;
    color: #1e293b;
    font-size: 22px;
    font-weight: 800;
    line-height: 28px;
    letter-spacing: -1px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.dispatch-export-button[b-b74ar0vq8x],
.dispatch-history-close[b-b74ar0vq8x] {
    display: inline-flex;
    height: 40px;
    align-items: center;
    justify-content: center;
    padding: 0;
    border: 1px solid #1e293b0f;
    border-radius: 10px;
    background: #f1f5f9cc;
    color: #1e293b;
    font-family: inherit;
    cursor: pointer;
}

.dispatch-export-button[b-b74ar0vq8x] {
    width: 118px;
    padding: 4px 10px;
    gap: 6px;
    font-size: 13px;
    font-weight: 600;
    line-height: 24px;
    letter-spacing: -.2px;
}

.dispatch-export-button img[b-b74ar0vq8x] { width: 18px; height: 18px; }
.dispatch-history-close[b-b74ar0vq8x] { width: 40px; flex: 0 0 40px; }
.dispatch-history-close img[b-b74ar0vq8x] { width: 20px; height: 20px; }
.dispatch-export-button:disabled[b-b74ar0vq8x] { cursor: not-allowed; opacity: .5; }

.dispatch-history-scroll[b-b74ar0vq8x] {
    min-height: 0;
    flex: 1;
    overflow: auto;
    background: #f8fafc;
    scrollbar-gutter: stable;
}

.dispatch-history-table[b-b74ar0vq8x] { width: 100%; min-width: 740px; }

.dispatch-history-row[b-b74ar0vq8x] {
    display: grid;
    width: 100%;
    min-height: 88px;
    grid-template-columns: 230px 230px 180px 100px;
    align-items: stretch;
    padding: 0;
    border: 0;
    border-bottom: 1px solid #1e293b0f;
    background: #fff;
    color: #1e293b;
    font-family: inherit;
    font-size: 13px;
    line-height: 20px;
    letter-spacing: -.2px;
    text-align: left;
}

button.dispatch-history-row[b-b74ar0vq8x] { cursor: pointer; }
button.dispatch-history-row:nth-child(odd)[b-b74ar0vq8x] { background: #f8fafc; }
button.dispatch-history-row:hover[b-b74ar0vq8x] { background: #5263ff12; }

.dispatch-history-row > span[b-b74ar0vq8x] {
    display: flex;
    min-width: 0;
    padding: 8px 16px;
    border-right: 1px solid #1e293b0f;
}

.dispatch-history-row > span:last-child[b-b74ar0vq8x] { border-right: 0; }

.dispatch-history-table-header[b-b74ar0vq8x] {
    position: sticky;
    top: 0;
    z-index: 2;
    min-height: 44px;
    background: #f1f5f9;
    font-weight: 700;
}

.dispatch-history-table-header > span[b-b74ar0vq8x] {
    align-items: center;
    padding: 12px 16px;
}

.dispatch-history-location[b-b74ar0vq8x],
.dispatch-history-date[b-b74ar0vq8x] {
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
}

.dispatch-history-location strong[b-b74ar0vq8x] {
    overflow: hidden;
    max-width: 100%;
    font-weight: 600;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.dispatch-history-location small[b-b74ar0vq8x],
.dispatch-history-date small[b-b74ar0vq8x] {
    color: #475569;
    font-size: 13px;
    font-weight: 500;
    line-height: 20px;
}

.dispatch-history-location small[b-b74ar0vq8x] {
    display: -webkit-box;
    overflow: hidden;
    max-width: 198px;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.dispatch-history-date[b-b74ar0vq8x] { gap: 0; }

.dispatch-history-badge[b-b74ar0vq8x] {
    display: inline-flex;
    min-height: 24px;
    align-items: center;
    justify-content: center;
    margin-bottom: 2px;
    padding: 4px 6px;
    border-radius: 8px;
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: 16px;
    white-space: nowrap;
}

.dispatch-history-badge.completed[b-b74ar0vq8x] { color: #296C28; background: #409b3f1f; }
.dispatch-history-badge.attention[b-b74ar0vq8x] { color: #B82213; background: #ed40301f; }
.dispatch-history-badge.planned[b-b74ar0vq8x] { color: #363af5; background: #5263ff1f; }
.dispatch-history-badge.cancelled[b-b74ar0vq8x] {
    color: #475569;
    background: #fff;
    box-shadow: 0 1px 1px -.5px #1e293b08, 0 3px 3px -1.5px #1e293b08, inset 0 0 0 1px #1e293b17;
}

.dispatch-history-work-type[b-b74ar0vq8x] {
    align-items: flex-start;
    padding-top: 8px !important;
    font-weight: 600;
}

.dispatch-history-info[b-b74ar0vq8x] {
    align-content: flex-start;
    align-items: flex-start;
    flex-wrap: wrap;
    gap: 4px;
}

.dispatch-history-info img[b-b74ar0vq8x] { width: 20px; height: 20px; flex: 0 0 20px; }
.dispatch-history-info > span[b-b74ar0vq8x] { color: #94a3b8; }

.dispatch-history-state[b-b74ar0vq8x] {
    display: flex;
    min-height: 180px;
    align-items: center;
    justify-content: center;
    gap: 10px;
    color: #5F6E85;
    font-size: 13px;
    font-weight: 600;
}

.dispatch-history-pagination[b-b74ar0vq8x] {
    display: flex;
    min-width: 740px;
    min-height: 56px;
    align-items: center;
    justify-content: space-between;
    padding: 10px 16px;
    background: #fff;
    color: #5F6E85;
    font-size: 12px;
}

.dispatch-history-pagination > div[b-b74ar0vq8x] { display: flex; align-items: center; gap: 8px; }
.dispatch-history-pagination button[b-b74ar0vq8x] {
    display: grid;
    width: 32px;
    height: 32px;
    padding: 0;
    place-items: center;
    border: 1px solid #1e293b0f;
    border-radius: 8px;
    background: #f8fafc;
    color: #475569;
    font-family: inherit;
}

.dispatch-history-pagination button:disabled[b-b74ar0vq8x] { color: #94a3b8; }
.dispatch-history-drawer button:focus-visible[b-b74ar0vq8x] { outline: 3px solid #5263ff4d; outline-offset: -3px; }

@media(max-width:560px) {
    .dispatch-history-header[b-b74ar0vq8x] { padding: 16px; }
    .dispatch-history-title[b-b74ar0vq8x] { gap: 10px; }
    .dispatch-history-title h2[b-b74ar0vq8x] { font-size: 18px; letter-spacing: -.5px; }
    .dispatch-export-button[b-b74ar0vq8x] { width: 40px; }
    .dispatch-export-button span[b-b74ar0vq8x] { display: none; }
    .dispatch-history-actions[b-b74ar0vq8x] { gap: 8px; }
}

/* Customer dashboard location drawer */
.location-side-drawer[b-b74ar0vq8x] {
    position: fixed;
    top: 0;
    right: 0;
    z-index: 90;
    display: flex;
    flex-direction: column;
    width: min(740px, 100vw);
    height: 100vh;
    height: 100dvh;
    overflow: hidden;
    background: #fff;
    box-shadow: -15px 0 45px #1f294438;
    color: #1e293b;
}

.location-drawer-header[b-b74ar0vq8x] {
    flex: 0 0 152px;
    padding: 24px 24px 16px;
    border-bottom: 1px solid #1e293b17;
    background: #fff;
}

.location-drawer-title-row[b-b74ar0vq8x],
.location-drawer-identity[b-b74ar0vq8x],
.location-drawer-tabs[b-b74ar0vq8x],
.location-section-heading[b-b74ar0vq8x],
.location-inactive-notice[b-b74ar0vq8x],
.location-drawing-stat[b-b74ar0vq8x],
.location-operation-cost-card[b-b74ar0vq8x],
.location-dispatch-grid > span[b-b74ar0vq8x] {
    display: flex;
    align-items: center;
}

.location-drawer-title-row[b-b74ar0vq8x] {
    justify-content: space-between;
    gap: 16px;
    height: 48px;
}

.location-drawer-identity[b-b74ar0vq8x] { min-width: 0; gap: 16px; }
.location-drawer-icon[b-b74ar0vq8x] {
    display: grid;
    flex: 0 0 48px;
    width: 48px;
    height: 48px;
    place-items: center;
    border-radius: 10px;
    background: #5263ff1f;
}
.location-drawer-icon img[b-b74ar0vq8x] { width: 28px; height: 28px; }
.location-drawer-title-copy[b-b74ar0vq8x] { display: flex; min-width: 0; flex-direction: column; }
.location-drawer-title-copy strong[b-b74ar0vq8x] {
    overflow: hidden;
    font-size: 18px;
    font-weight: 800;
    line-height: 24px;
    letter-spacing: -.2px;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.location-drawer-title-copy small[b-b74ar0vq8x] {
    overflow: hidden;
    color: #475569;
    font-size: 15px;
    font-weight: 700;
    line-height: 24px;
    letter-spacing: -.2px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.location-drawer-close[b-b74ar0vq8x] {
    display: grid;
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    padding: 0;
    place-items: center;
    border: 1px solid #1e293b0f;
    border-radius: 10px;
    background: #f1f5f9cc;
}
.location-drawer-close img[b-b74ar0vq8x] { width: 20px; height: 20px; }

.location-drawer-tabs[b-b74ar0vq8x] {
    height: 48px;
    margin-top: 16px;
    padding: 6px;
    gap: 6px;
    border: 1px solid #1e293b08;
    border-radius: 16px;
    background: #f1f5f9cc;
}
.location-drawer-tabs button[b-b74ar0vq8x] {
    flex: 1;
    height: 36px;
    padding: 4px 10px;
    border: 0;
    border-radius: 10px;
    background: transparent;
    color: #475569;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: -.2px;
}
.location-drawer-tabs button.active[b-b74ar0vq8x] {
    color: #1e293b;
    background: #fff;
    box-shadow: 0 1px 1px -.5px #1e293b08, 0 3px 3px -1.5px #1e293b08, 0 20px 20px -12px #1e293b08;
}

.location-drawer-scroll[b-b74ar0vq8x] {
    flex: 1;
    min-height: 0;
    overflow-x: hidden;
    overflow-y: auto;
    scrollbar-gutter: stable;
}
.location-details-tab[b-b74ar0vq8x],
.location-prices-tab[b-b74ar0vq8x],
.location-operations-tab[b-b74ar0vq8x] {
    display: flex;
    flex-direction: column;
    padding: 24px;
    gap: 32px;
}
.location-drawer-loading[b-b74ar0vq8x] {
    display: flex;
    flex: 1;
    align-items: center;
    justify-content: center;
    gap: 10px;
    color: #5F6E85;
}

.location-inactive-notice[b-b74ar0vq8x] {
    width: 100%;
    min-height: 32px;
    padding: 8px;
    gap: 8px;
    border: 0;
    border-radius: 10px;
    background: #ed40301f;
    color: #B82213;
    text-align: left;
    box-shadow: 0 1px 1px -.5px #1e293b08;
}
.location-inactive-notice img[b-b74ar0vq8x] { flex: 0 0 16px; width: 16px; height: 16px; }
.location-inactive-notice span[b-b74ar0vq8x] { flex: 1; font-size: 12px; font-weight: 700; line-height: 16px; }
.location-inactive-notice .notice-chevron[b-b74ar0vq8x] { transition: transform .18s ease; }
.location-inactive-notice .notice-chevron.expanded[b-b74ar0vq8x] { transform: rotate(180deg); }
.location-inactive-note[b-b74ar0vq8x] {
    margin-top: -24px;
    padding: 0 12px 12px;
    border-radius: 0 0 10px 10px;
    background: #ed403012;
    color: #9f2418;
    font-size: 12px;
    line-height: 18px;
}

.location-carousel[b-b74ar0vq8x] {
    position: relative;
    width: 100%;
    overflow: hidden;
    aspect-ratio: 1.5;
    border-radius: 16px;
    background: #e2e8f0;
}
.location-carousel-image[b-b74ar0vq8x] { display: block; width: 100%; height: 100%; object-fit: cover; }
.location-carousel-image.map-slide[b-b74ar0vq8x],
.address-map-carousel > img.map-slide[b-b74ar0vq8x] { object-fit: contain; background: #fff; }
.location-carousel-tags[b-b74ar0vq8x] {
    position: absolute;
    top: 11px;
    left: 8px;
    display: flex;
    max-width: calc(100% - 16px);
    gap: 8px;
    overflow-x: auto;
    scrollbar-width: none;
}
.location-carousel-tags[b-b74ar0vq8x]::-webkit-scrollbar { display: none; }
.location-carousel-tags span[b-b74ar0vq8x] {
    flex: 0 0 auto;
    padding: 4px 6px;
    border: 1px solid #1e293b17;
    border-radius: 8px;
    background: #fff;
    color: #475569;
    font-size: 12px;
    font-weight: 600;
    line-height: 16px;
    box-shadow: 0 2px 2px -.5px #1e293b0d;
}
.location-carousel-arrow[b-b74ar0vq8x],
.location-carousel-expand[b-b74ar0vq8x] {
    position: absolute;
    display: grid;
    width: 32px;
    height: 32px;
    padding: 0;
    place-items: center;
    border: 1px solid #1e293b0f;
    border-radius: 8px;
    background: #f1f5f9e6;
}
.location-carousel-arrow[b-b74ar0vq8x] { top: 50%; transform: translateY(-50%); }
/* Sits over the static map so the pin is a way in to the real thing, which is what people
   try to click. Bottom-left is the only free corner: tags take the top-left, the expand
   button the bottom-right, and the slide dots the bottom centre. */
.carousel-maps-link[b-b74ar0vq8x] {
    position: absolute;
    bottom: 8px;
    left: 8px;
    z-index: 3;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 5px 9px;
    border: 1px solid #1e293b17;
    border-radius: 8px;
    background: #ffffffe6;
    color: #1e293b;
    font-size: 12px;
    font-weight: 600;
    text-decoration: none;
}
.carousel-maps-link img[b-b74ar0vq8x] { width: 14px; height: 14px; }
.carousel-maps-link:hover[b-b74ar0vq8x] { background: #fff; }
.location-carousel-arrow.previous[b-b74ar0vq8x] { left: 8px; }
.location-carousel-arrow.next[b-b74ar0vq8x] { right: 8px; }
.location-carousel-arrow img[b-b74ar0vq8x] { width: 18px; height: 18px; }
/* Top-right: Google prints its attribution along the bottom edge of a static map, and the
   button sat on top of the word "Google". The corner has to stay clear. */
.location-carousel-expand[b-b74ar0vq8x] { right: 8px; top: 8px; }
.location-carousel-expand img[b-b74ar0vq8x] { width: 18px; height: 18px; }
.location-carousel-dots[b-b74ar0vq8x] {
    position: absolute;
    bottom: 12px;
    left: 50%;
    display: flex;
    gap: 4px;
    transform: translateX(-50%);
}
.location-carousel-dots button[b-b74ar0vq8x] {
    width: 8px;
    height: 8px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: #ffffff80;
}
.location-carousel-dots button.active[b-b74ar0vq8x] { background: #fff; }

.location-drawing-stats[b-b74ar0vq8x] {
    display: flex;
    margin-top: -20px;
    padding: 0 0 4px;
    gap: 8px;
    overflow-x: auto;
    scrollbar-width: thin;
}
.location-drawing-stat[b-b74ar0vq8x] {
    flex: 0 0 auto;
    min-height: 24px;
    padding: 3px 6px;
    gap: 4px;
    border: 1px solid #1e293b0f;
    border-radius: 8px;
    background: #f8fafc;
    color: #475569;
    font-size: 12px;
}
.location-drawing-stat i[b-b74ar0vq8x] { width: 14px; height: 14px; border-radius: 50%; }
.location-drawing-stat strong[b-b74ar0vq8x] { font-weight: 600; }
.location-drawing-stat small[b-b74ar0vq8x] { color: #5F6E85; font-size: 12px; }

.location-detail-section[b-b74ar0vq8x],
.location-files-section[b-b74ar0vq8x],
.location-table-section[b-b74ar0vq8x],
.location-statistics-card[b-b74ar0vq8x],
.location-dispatch-history[b-b74ar0vq8x] { width: 100%; }
.location-section-heading[b-b74ar0vq8x] { justify-content: space-between; gap: 12px; }
.location-section-heading h3[b-b74ar0vq8x],
.location-files-section h3[b-b74ar0vq8x] {
    display: flex;
    align-items: center;
    margin: 0;
    gap: 6px;
    color: #1e293b;
    font-size: 18px;
    font-weight: 800;
    line-height: 24px;
    letter-spacing: -.2px;
}
.location-section-heading h3 img[b-b74ar0vq8x] { width: 16px; height: 16px; }
.location-section-heading > span[b-b74ar0vq8x] { color: #475569; font-size: 13px; font-weight: 700; }
.location-status[b-b74ar0vq8x] {
    padding: 4px 8px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 600;
    line-height: 16px;
}
.location-status.active[b-b74ar0vq8x] { color: #2f8b3b; background: #409b3f1f; }
.location-status.inactive[b-b74ar0vq8x] { color: #5F6E85; background: #f1f5f9; }
.location-detail-grid[b-b74ar0vq8x] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin-top: 16px;
    gap: 16px 48px;
}
.location-detail-grid > div[b-b74ar0vq8x] { display: flex; min-width: 0; flex-direction: column; gap: 2px; }
.location-detail-grid strong[b-b74ar0vq8x] { font-size: 13px; font-weight: 700; line-height: 20px; }
.location-detail-grid span[b-b74ar0vq8x] { overflow-wrap: anywhere; color: #475569; font-size: 13px; font-weight: 500; line-height: 20px; }
.location-files-section[b-b74ar0vq8x] { display: flex; flex-direction: column; gap: 16px; }
.location-file-links[b-b74ar0vq8x] { display: flex; flex-wrap: wrap; gap: 12px 20px; }
.location-file-links a[b-b74ar0vq8x] { color: #363af5; font-size: 13px; font-weight: 600; text-underline-offset: 4px; }
.location-collection-empty[b-b74ar0vq8x] { margin: 0; padding: 18px; color: #5F6E85; background: #f8fafc; border-radius: 12px; font-size: 13px; text-align: center; }

.location-table-section[b-b74ar0vq8x] { display: flex; flex-direction: column; gap: 16px; }
.location-table-wrap[b-b74ar0vq8x] {
    width: 100%;
    overflow-x: auto;
    border: 1px solid #1e293b0f;
    border-radius: 16px;
    box-shadow: 0 20px 20px -12px #1e293b08, 0 3px 3px -1.5px #1e293b08;
}
.location-data-table[b-b74ar0vq8x] { width: 100%; min-width: 520px; border-collapse: collapse; color: #1e293b; font-size: 13px; }
.location-data-table th[b-b74ar0vq8x],
.location-data-table td[b-b74ar0vq8x] { padding: 10px 16px; text-align: left; vertical-align: middle; }
.location-data-table th[b-b74ar0vq8x] { height: 42px; background: #f1f5f9; font-weight: 700; }
.location-data-table td[b-b74ar0vq8x] { height: 36px; font-weight: 500; }
.location-data-table tbody tr:nth-child(even)[b-b74ar0vq8x] { background: #f8fafc; }
.location-data-table th span[b-b74ar0vq8x] { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.location-data-table th img[b-b74ar0vq8x] { width: 16px; height: 16px; }
.location-data-table.two-columns th[b-b74ar0vq8x],
.location-data-table.two-columns td[b-b74ar0vq8x] { width: 50%; }
.location-data-table.three-columns th[b-b74ar0vq8x],
.location-data-table.three-columns td[b-b74ar0vq8x] { width: 33.333%; }
.location-data-table.rules-columns th:first-child[b-b74ar0vq8x],
.location-data-table.rules-columns td:first-child[b-b74ar0vq8x] { width: 33%; }
.location-data-table.rules-columns th:nth-child(2)[b-b74ar0vq8x],
.location-data-table.rules-columns td:nth-child(2)[b-b74ar0vq8x] { width: 34%; }
.location-data-table.rules-columns td:nth-child(2)[b-b74ar0vq8x] { display: table-cell; }
.location-data-table.rules-columns td:nth-child(2) span[b-b74ar0vq8x],
.location-data-table.rules-columns td:nth-child(2) small[b-b74ar0vq8x] { display: block; }
.location-data-table.rules-columns td:nth-child(2) small[b-b74ar0vq8x] { margin-top: 2px; color: #5F6E85; font-size: 12px; }
.location-rule-name[b-b74ar0vq8x] { color: #363af5; font-weight: 600; }
.location-table-empty[b-b74ar0vq8x] { height: 74px !important; color: #5F6E85; text-align: center !important; }

.location-operations-tab[b-b74ar0vq8x] { gap: 24px; }
.location-operation-filters[b-b74ar0vq8x] { display: flex; align-items: center; }
.location-operation-filters select[b-b74ar0vq8x] {
    height: 40px;
    border: 1px solid #1e293b1f;
    background: #fff;
    box-shadow: 0 1px 1px -.5px #1e293b08, 0 3px 3px -1.5px #1e293b08;
}
.location-operation-filters select[b-b74ar0vq8x] {
    width: 104px;
    padding: 8px 30px 8px 12px;
    border-radius: 10px 0 0 10px;
    color: #1e293b;
    font-family: inherit;
    font-size: 13px;
    font-weight: 600;
    line-height: 24px;
}
.location-operation-date-picker[b-b74ar0vq8x] {
    width: 288px;
    height: 40px;
    margin-left: -1px;
}
.location-operation-date-picker[b-b74ar0vq8x]  .wm-drp-trigger,
.location-operation-date-picker[b-b74ar0vq8x]  .wm-drp-trigger.no-presets,
.location-operation-date-picker[b-b74ar0vq8x]  .wm-drp-trigger-range.no-presets {
    border-radius: 0 10px 10px 0;
}

.location-operation-cost-card[b-b74ar0vq8x] {
    justify-content: space-between;
    min-height: 72px;
    padding: 16px;
    gap: 16px;
    border: 1px solid #1e293b08;
    border-radius: 20px;
    background: #f8fafc;
}
.location-operation-cost-card > span[b-b74ar0vq8x] { display: flex; align-items: center; gap: 8px; font-size: 15px; font-weight: 600; }
.location-operation-cost-card > strong[b-b74ar0vq8x] { font-size: 25px; line-height: 36px; letter-spacing: -1px; }
.location-operation-cost-card > strong small[b-b74ar0vq8x] { margin-left: 4px; color: #475569; font-size: 13px; font-weight: 600; letter-spacing: -.2px; }
.operation-icon[b-b74ar0vq8x] {
    display: grid;
    width: 40px;
    height: 40px;
    grid-row: 1 / 3;
    place-items: center;
    border-radius: 8px;
}
.operation-icon img[b-b74ar0vq8x] { width: 22px; height: 22px; }
.operation-icon.cost[b-b74ar0vq8x] { background: #409b3f1f; }
.operation-icon.statistics[b-b74ar0vq8x] { display: inline-grid; grid-row: auto; background: #00a8e61f; }
.location-statistics-card[b-b74ar0vq8x] { min-height: 424px; padding: 16px; border: 1px solid #1e293b08; border-radius: 20px; background: #f8fafc; }
.location-statistics-card .location-section-heading h3[b-b74ar0vq8x] { gap: 8px; color: #475569; font-size: 15px; font-weight: 600; }
.location-operation-chart[b-b74ar0vq8x] {
    position: relative;
    width: 100%;
    margin-top: 24px;
}
.location-operation-chart svg[b-b74ar0vq8x] { display: block; width: 100%; height: 260px; overflow: visible; }
.operation-chart-y-axis[b-b74ar0vq8x] {
    position: absolute;
    top: 21px;
    bottom: 17px;
    left: 0;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    color: #5F6E85;
    font-size: 12px;
    font-weight: 500;
    pointer-events: none;
}
.operation-chart-gridline[b-b74ar0vq8x] { stroke: #dfe6ef; stroke-width: 1; stroke-dasharray: 4 4; vector-effect: non-scaling-stroke; }
.operation-chart-area[b-b74ar0vq8x] { fill: #5263ff14; }
.operation-chart-line[b-b74ar0vq8x] { fill: none; stroke: #5263ff; stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; vector-effect: non-scaling-stroke; }
.operation-chart-point[b-b74ar0vq8x] { fill: #fff; stroke: #5263ff; stroke-width: 3; vector-effect: non-scaling-stroke; }
.operation-chart-labels[b-b74ar0vq8x] {
    display: grid;
    grid-template-columns: repeat(var(--chart-columns), minmax(0, 1fr));
    padding: 0 2px 0 30px;
    gap: 8px;
}
.operation-chart-labels small[b-b74ar0vq8x] { color: #5F6E85; font-size: 12px; font-weight: 500; line-height: 16px; text-align: center; }

.location-dispatch-history[b-b74ar0vq8x] { display: flex; flex-direction: column; gap: 12px; }
.location-export-button[b-b74ar0vq8x] {
    display: inline-flex;
    height: 32px;
    align-items: center;
    padding: 4px 8px;
    gap: 6px;
    border: 1px solid #1e293b0f;
    border-radius: 8px;
    background: #f1f5f9cc;
    color: #1e293b;
    font-size: 12px;
    font-weight: 600;
}
.location-export-button img[b-b74ar0vq8x] { width: 16px; height: 16px; }
.location-export-button:disabled[b-b74ar0vq8x] { cursor: not-allowed; opacity: .5; }
.location-dispatch-table[b-b74ar0vq8x] { overflow: hidden; border: 1px solid #1e293b0f; border-radius: 16px; }
.location-dispatch-grid[b-b74ar0vq8x] {
    display: grid;
    width: 100%;
    min-height: 88px;
    grid-template-columns: 1.35fr 1.35fr 84px;
    align-items: stretch;
    padding: 0;
    gap: 0;
    border: 0;
    border-bottom: 1px solid #1e293b0f;
    background: #fff;
    color: #1e293b;
    font-size: 12px;
    text-align: left;
}
.location-dispatch-grid:last-child[b-b74ar0vq8x] { border-bottom: 0; }
.location-dispatch-grid.header[b-b74ar0vq8x] { min-height: 44px; background: #f1f5f9; font-weight: 700; }
.location-dispatch-grid.header > span[b-b74ar0vq8x] { padding: 10px 16px; }
.location-dispatch-grid > span[b-b74ar0vq8x] { min-width: 0; padding: 10px 16px; gap: 5px; border-right: 1px solid #1e293b0f; }
.location-dispatch-grid > span:last-child[b-b74ar0vq8x] { border-right: 0; }
button.location-dispatch-grid:nth-child(odd)[b-b74ar0vq8x] { background: #f8fafc; }
button.location-dispatch-grid:hover[b-b74ar0vq8x] { background: #5263ff12; }
.location-dispatch-date[b-b74ar0vq8x] { flex-direction: column; align-items: flex-start !important; justify-content: center; }
.location-dispatch-date small[b-b74ar0vq8x] { color: #475569; font-size: 12px; line-height: 18px; }
.location-dispatch-badge[b-b74ar0vq8x] { padding: 3px 7px; border-radius: 7px; font-size: 12px; font-style: normal; font-weight: 600; line-height: 18px; }
.location-dispatch-badge.completed[b-b74ar0vq8x] { color: #2f8b3b; background: #409b3f1f; }
.location-dispatch-badge.attention[b-b74ar0vq8x] { color: #B82213; background: #ed40301f; }
.location-dispatch-badge.planned[b-b74ar0vq8x] { color: #363af5; background: #5263ff1f; }
.location-dispatch-badge.cancelled[b-b74ar0vq8x] { color: #475569; background: #f1f5f9; box-shadow: inset 0 0 0 1px #1e293b17; }
.location-dispatch-work-type[b-b74ar0vq8x] { align-items: flex-start !important; padding-top: 16px !important; font-weight: 600; }
.location-dispatch-info[b-b74ar0vq8x] { justify-content: center; align-content: center; flex-wrap: wrap; gap: 6px !important; }
.location-dispatch-info img[b-b74ar0vq8x] { width: 18px; height: 18px; }
.location-dispatch-info > span[b-b74ar0vq8x] { color: #94a3b8; }

/* Location dispatch address overview */
.address-overview-modal[b-b74ar0vq8x] {
    position: fixed;
    top: 50%;
    left: 50%;
    z-index: 110;
    display: flex;
    width: min(560px, calc(100vw - 32px));
    max-height: min(1136px, calc(100dvh - 32px));
    flex-direction: column;
    overflow: hidden;
    transform: translate(-50%, -50%);
    border: 1px solid #1e293b08;
    border-radius: 20px;
    background: #fff;
    box-shadow: 0 1px 1px -.5px #1e293b08, 0 3px 3px -1.5px #1e293b08, 0 20px 20px -12px #1e293b0d, 0 32px 32px -16px #1e293b0d;
    color: #1e293b;
}
.address-overview-modal > header[b-b74ar0vq8x] {
    display: flex;
    flex: 0 0 56px;
    align-items: center;
    justify-content: space-between;
    padding: 12px 12px 12px 20px;
    border-bottom: 1px solid #1e293b17;
    background: #fff;
}
.address-overview-modal > header h2[b-b74ar0vq8x] { margin: 0; font-size: 18px; font-weight: 700; line-height: 24px; letter-spacing: -.2px; }
.address-overview-modal > header button[b-b74ar0vq8x] {
    display: grid;
    width: 32px;
    height: 32px;
    padding: 0;
    place-items: center;
    border: 1px solid #1e293b0f;
    border-radius: 8px;
    background: #f1f5f9cc;
}
.address-overview-modal > header img[b-b74ar0vq8x] { width: 18px; height: 18px; }
.address-overview-body[b-b74ar0vq8x] {
    display: flex;
    min-height: 0;
    flex-direction: column;
    overflow-y: auto;
    padding: 20px;
    gap: 16px;
    background: #f1f5f9;
    scrollbar-gutter: stable;
}
.address-overview-summary[b-b74ar0vq8x],
.address-overview-work-type[b-b74ar0vq8x],
.address-overview-card[b-b74ar0vq8x] {
    flex: 0 0 auto;
    border-radius: 16px;
    background: #fff;
}
.address-overview-summary[b-b74ar0vq8x] {
    display: flex;
    min-height: 88px;
    align-items: flex-start;
    justify-content: space-between;
    padding: 20px;
    gap: 12px;
}
.address-overview-summary > div[b-b74ar0vq8x] { min-width: 0; }
.address-overview-summary strong[b-b74ar0vq8x] { display: block; overflow-wrap: anywhere; font-size: 15px; line-height: 24px; }
.address-overview-summary p[b-b74ar0vq8x] { margin: 0; overflow-wrap: anywhere; color: #475569; font-size: 13px; line-height: 24px; }
.address-overview-summary p b[b-b74ar0vq8x] { color: #1e293b; }
.address-status-badge[b-b74ar0vq8x] {
    flex: 0 0 auto;
    padding: 4px 6px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 600;
    line-height: 16px;
    white-space: nowrap;
}
.address-status-badge.completed[b-b74ar0vq8x] { color: #2f8b3b; background: #409b3f1f; }
.address-status-badge.attention[b-b74ar0vq8x] { color: #B82213; background: #ed40301f; }
.address-status-badge.planned[b-b74ar0vq8x] { color: #363af5; background: #5263ff1f; }
.address-status-badge.cancelled[b-b74ar0vq8x] { color: #475569; background: #f1f5f9; box-shadow: inset 0 0 0 1px #1e293b17; }
.address-overview-work-type[b-b74ar0vq8x] { display: flex; min-height: 64px; align-items: center; justify-content: space-between; padding: 20px; gap: 16px; }
.address-overview-work-type h3[b-b74ar0vq8x],
.address-overview-card h3[b-b74ar0vq8x] { margin: 0; font-size: 18px; font-weight: 700; line-height: 24px; }
.address-overview-work-type span[b-b74ar0vq8x] { color: #475569; font-size: 15px; font-weight: 600; }
.address-overview-card[b-b74ar0vq8x] { padding: 20px; }
.address-timings-card[b-b74ar0vq8x] { display: flex; min-height: 164px; flex-direction: column; gap: 20px; }
.address-timing-grid[b-b74ar0vq8x] { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.address-timing-grid article[b-b74ar0vq8x] { min-width: 0; min-height: 80px; padding: 16px; border-radius: 16px; background: #f1f5f9; }
.address-timing-grid small[b-b74ar0vq8x] { display: block; margin-bottom: 8px; color: #475569; font-size: 12px; font-weight: 600; }
.address-timing-grid article > div[b-b74ar0vq8x] { display: flex; align-items: center; gap: 8px; }
.address-timing-grid article span[b-b74ar0vq8x] { display: flex; min-width: 0; align-items: center; gap: 8px; color: #475569; font-size: 15px; font-weight: 600; white-space: nowrap; }
.address-timing-grid article img[b-b74ar0vq8x] { width: 18px; height: 18px; }
.address-details-card[b-b74ar0vq8x] { display: flex; flex-direction: column; gap: 20px; }
.address-dispatch-note[b-b74ar0vq8x] { display: flex; flex-direction: column; gap: 4px; }
.address-dispatch-note small[b-b74ar0vq8x] { color: #475569; font-size: 12px; font-weight: 600; }
.address-dispatch-note p[b-b74ar0vq8x],
.address-evidence-carousel[b-b74ar0vq8x] { position: relative; width: 100%; }
.address-evidence-carousel > div[b-b74ar0vq8x] { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.address-evidence-carousel > div button[b-b74ar0vq8x] { height: 100px; padding: 0; overflow: hidden; border: 0; border-radius: 8px; background: #e2e8f0; }
.address-evidence-carousel > div img[b-b74ar0vq8x] { display: block; width: 100%; height: 100%; object-fit: cover; }
.address-carousel-arrow[b-b74ar0vq8x] {
    position: absolute;
    top: 50%;
    z-index: 2;
    display: grid;
    width: 28px;
    height: 28px;
    padding: 0;
    place-items: center;
    transform: translateY(-50%);
    border: 1px solid #1e293b0f;
    border-radius: 8px;
    background: #f1f5f9e6;
    color: #475569;
    font-size: 22px;
    line-height: 1;
}
.address-carousel-arrow.previous[b-b74ar0vq8x] { left: 8px; }
.address-carousel-arrow.next[b-b74ar0vq8x] { right: 8px; }
.address-map-card[b-b74ar0vq8x] { min-height: 360px; }
.address-map-carousel[b-b74ar0vq8x] { position: relative; width: 100%; overflow: hidden; aspect-ratio: 1.5; border-radius: 16px; background: #e2e8f0; }
.address-map-carousel > img[b-b74ar0vq8x] { display: block; width: 100%; height: 100%; object-fit: cover; }
.address-map-tags[b-b74ar0vq8x] { position: absolute; top: 10px; left: 8px; display: flex; max-width: calc(100% - 16px); gap: 8px; overflow-x: auto; scrollbar-width: none; }
.address-map-tags[b-b74ar0vq8x]::-webkit-scrollbar { display: none; }
.address-map-tags span[b-b74ar0vq8x] { flex: 0 0 auto; padding: 4px 6px; border: 1px solid #1e293b17; border-radius: 8px; background: #fff; color: #475569; font-size: 12px; font-weight: 600; }
.address-map-dots[b-b74ar0vq8x] { position: absolute; bottom: 10px; left: 50%; display: flex; gap: 4px; transform: translateX(-50%); }
.address-map-dots button[b-b74ar0vq8x] { width: 8px; height: 8px; padding: 0; border: 1px solid #475569; border-radius: 50%; background: #fff; }
.address-map-dots button.active[b-b74ar0vq8x] { background: #1e293b; }
.address-map-expand[b-b74ar0vq8x] { position: absolute; right: 8px; top: 8px; display: grid; width: 32px; height: 32px; padding: 0; place-items: center; border: 1px solid #1e293b0f; border-radius: 8px; background: #f1f5f9e6; }
.address-map-expand img[b-b74ar0vq8x] { width: 18px; height: 18px; }
.address-overview-modal button[b-b74ar0vq8x] { font-family: inherit; cursor: pointer; }
.address-overview-modal button:focus-visible[b-b74ar0vq8x] { outline: 3px solid #5263ff4d; outline-offset: 2px; }

.location-side-drawer button[b-b74ar0vq8x] { font-family: inherit; cursor: pointer; }
.location-side-drawer button:focus-visible[b-b74ar0vq8x],
.location-side-drawer a:focus-visible[b-b74ar0vq8x] { outline: 3px solid #5263ff4d; outline-offset: 2px; }

@media(max-width:740px) {
    .location-side-drawer[b-b74ar0vq8x] { width: 100vw; }
}

@media(max-width:560px) {
    .location-drawer-header[b-b74ar0vq8x] { flex-basis: 144px; padding: 16px; }
    .location-drawer-title-copy strong[b-b74ar0vq8x] { font-size: 16px; }
    .location-drawer-title-copy small[b-b74ar0vq8x] { max-width: calc(100vw - 136px); font-size: 12px; }
    .location-details-tab[b-b74ar0vq8x],
    .location-prices-tab[b-b74ar0vq8x],
    .location-operations-tab[b-b74ar0vq8x] { padding: 16px; gap: 24px; }
    .location-carousel[b-b74ar0vq8x] { aspect-ratio: 1.25; }
    .location-detail-grid[b-b74ar0vq8x] { grid-template-columns: 1fr; gap: 14px; }
    .location-data-table[b-b74ar0vq8x] { min-width: 480px; }
    .location-operation-filters[b-b74ar0vq8x] { align-items: stretch; flex-direction: column; gap: 8px; }
    .location-operation-filters select[b-b74ar0vq8x] { width: 100%; border-radius: 10px; }
    .location-operation-date-picker[b-b74ar0vq8x] { width: 100%; margin-left: 0; }
    .location-operation-date-picker[b-b74ar0vq8x]  .wm-drp-trigger,
    .location-operation-date-picker[b-b74ar0vq8x]  .wm-drp-trigger.no-presets,
    .location-operation-date-picker[b-b74ar0vq8x]  .wm-drp-trigger-range.no-presets { border-radius: 10px; }
    .location-operation-cost-card > strong[b-b74ar0vq8x] { font-size: 21px; }
    .location-operations-tab .location-data-table.two-columns[b-b74ar0vq8x] { min-width: 0; }
    .location-statistics-card[b-b74ar0vq8x] { min-height: 360px; }
    .location-operation-chart svg[b-b74ar0vq8x] { height: 220px; }
    .operation-chart-labels small[b-b74ar0vq8x] { font-size: 10px; }
    .location-dispatch-grid[b-b74ar0vq8x] { min-height: 104px; grid-template-columns: 1.5fr 1fr 48px; }
    .location-dispatch-grid.header[b-b74ar0vq8x] { min-height: 42px; }
    .location-dispatch-grid.header > span[b-b74ar0vq8x],
    .location-dispatch-grid > span[b-b74ar0vq8x] { padding: 10px; }
    .address-overview-modal[b-b74ar0vq8x] { width: calc(100vw - 16px); max-height: calc(100dvh - 16px); border-radius: 16px; }
    .address-overview-body[b-b74ar0vq8x] { padding: 12px; gap: 12px; }
    .address-overview-summary[b-b74ar0vq8x] { flex-direction: column; padding: 16px; }
    .address-status-badge[b-b74ar0vq8x] { align-self: flex-start; }
    .address-overview-work-type[b-b74ar0vq8x],
    .address-overview-card[b-b74ar0vq8x] { padding: 16px; }
    .address-timing-grid[b-b74ar0vq8x] { grid-template-columns: 1fr; }
    .address-timing-grid article > div[b-b74ar0vq8x] { justify-content: space-between; }
    .address-evidence-carousel > div[b-b74ar0vq8x] { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .address-map-card[b-b74ar0vq8x] { min-height: 280px; }
    .address-map-carousel[b-b74ar0vq8x] { aspect-ratio: 1.2; }
}

/* Statistics card controls: month/season toggle plus, in month mode, the season being shown.
   Only offered when the address has dispatches in more than one season. */
.statistics-controls[b-b74ar0vq8x] { display: flex; align-items: center; gap: 8px; }
.statistics-grouping[b-b74ar0vq8x] { display: inline-flex; padding: 2px; border: 1px solid #1e293b17; border-radius: 10px; background: #f1f5f9; }
.statistics-grouping button[b-b74ar0vq8x] {
    padding: 4px 10px;
    border: 0;
    border-radius: 8px;
    background: transparent;
    color: #475569;
    font-size: 12px;
    font-weight: 600;
}
.statistics-grouping button.active[b-b74ar0vq8x] { background: #fff; color: #1e293b; box-shadow: 0 1px 2px #1e293b14; }
.statistics-controls select[b-b74ar0vq8x] {
    height: 28px;
    padding: 0 8px;
    border: 1px solid #1e293b17;
    border-radius: 8px;
    background: #fff;
    color: #1e293b;
    font-size: 12px;
    font-weight: 600;
}

/* Upcoming work is not history, so the two are labelled apart inside the one list. */
.location-dispatch-subheading[b-b74ar0vq8x] {
    padding: 12px 4px 4px;
    color: #475569;
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .04em;
}
/* /Pages/Customers/Components/AddCustomerLocationPopup.razor.rz.scp.css */
.add-location-body[b-sk3cxpr2bn] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.add-location-field[b-sk3cxpr2bn] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.add-location-label-row[b-sk3cxpr2bn] {
    align-items: baseline;
    display: flex;
    gap: 12px;
    justify-content: space-between;
}

/* Reads as a link, not a second submit: the popup already has one primary action in its
   footer, and this one leaves rather than completes. */
.add-location-create[b-sk3cxpr2bn] {
    background: none;
    border: none;
    color: #5263ff;
    font-size: 13px;
    font-weight: 600;
    padding: 0;
}

.add-location-create:hover[b-sk3cxpr2bn] {
    text-decoration: underline;
}

.add-location-state-empty[b-sk3cxpr2bn] {
    flex-direction: column;
    gap: 10px;
}

.add-location-field label[b-sk3cxpr2bn] {
    color: #1e293b;
    font-size: 13px;
    font-weight: 600;
}

.add-location-field input[b-sk3cxpr2bn] {
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    font-size: 13px;
    height: 40px;
    padding: 0 12px;
}

.add-location-field input:focus[b-sk3cxpr2bn] {
    border-color: #5263ff;
    outline: none;
}

.add-location-list[b-sk3cxpr2bn] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    max-height: 320px;
    overflow-y: auto;
}

.add-location-state[b-sk3cxpr2bn] {
    align-items: center;
    color: #5F6E85;
    display: flex;
    font-size: 13px;
    justify-content: center;
    padding: 40px 0;
}

.add-location-candidate[b-sk3cxpr2bn] {
    align-items: center;
    background: #f8fafc;
    border: 1px solid transparent;
    border-radius: 10px;
    display: flex;
    gap: 12px;
    justify-content: space-between;
    padding: 10px 12px;
    text-align: left;
}

.add-location-candidate:hover[b-sk3cxpr2bn] {
    background: #eef0ff;
}

.add-location-candidate.selected[b-sk3cxpr2bn] {
    background: #eef0ff;
    border-color: #5263ff;
}

.add-location-copy[b-sk3cxpr2bn] {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.add-location-copy strong[b-sk3cxpr2bn] {
    color: #1e293b;
    font-size: 13px;
    font-weight: 600;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.add-location-copy span[b-sk3cxpr2bn] {
    color: #5F6E85;
    font-size: 12px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.add-location-owner[b-sk3cxpr2bn] {
    background: #f1f5f9;
    border-radius: 999px;
    color: #475569;
    flex: 0 0 auto;
    font-size: 11px;
    font-weight: 600;
    max-width: 160px;
    overflow: hidden;
    padding: 3px 10px;
    text-overflow: ellipsis;
    white-space: nowrap;
}
/* /Pages/Customers/Components/AddManagedLocationPopup.razor.rz.scp.css */
.add-managed-body[b-2645x0c5wm] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.add-managed-field[b-2645x0c5wm] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.add-managed-field label[b-2645x0c5wm] {
    color: #1e293b;
    font-size: 13px;
    font-weight: 600;
}

.add-managed-input[b-2645x0c5wm] {
    align-items: center;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    min-height: 40px;
    padding: 6px 10px;
}

.add-managed-input:focus-within[b-2645x0c5wm] {
    border-color: #5263ff;
}

.add-managed-input input[b-2645x0c5wm] {
    border: none;
    flex: 1 1 120px;
    font-size: 13px;
    min-width: 120px;
    outline: none;
    padding: 2px 0;
}

.add-managed-chip[b-2645x0c5wm] {
    align-items: center;
    background: #eef0ff;
    border: 1px solid #c7ccff;
    border-radius: 999px;
    color: #3b46b8;
    display: flex;
    font-size: 12px;
    font-weight: 600;
    gap: 6px;
    max-width: 220px;
    padding: 3px 10px;
}

.add-managed-chip span:first-child[b-2645x0c5wm] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.add-managed-chip-remove[b-2645x0c5wm] {
    color: #5263ff;
    font-size: 14px;
    line-height: 1;
}

.add-managed-list[b-2645x0c5wm] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    max-height: 320px;
    overflow-y: auto;
}

.add-managed-state[b-2645x0c5wm] {
    align-items: center;
    color: #5F6E85;
    display: flex;
    font-size: 13px;
    justify-content: center;
    padding: 40px 0;
}

.add-managed-candidate[b-2645x0c5wm] {
    align-items: center;
    background: #f8fafc;
    border: 1px solid transparent;
    border-radius: 10px;
    display: flex;
    gap: 12px;
    justify-content: space-between;
    padding: 10px 12px;
    text-align: left;
}

.add-managed-candidate:hover[b-2645x0c5wm] {
    background: #eef0ff;
}

.add-managed-candidate.selected[b-2645x0c5wm] {
    background: #eef0ff;
    border-color: #5263ff;
}

.add-managed-copy[b-2645x0c5wm] {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.add-managed-copy strong[b-2645x0c5wm] {
    color: #1e293b;
    font-size: 13px;
    font-weight: 600;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.add-managed-copy span[b-2645x0c5wm] {
    color: #5F6E85;
    font-size: 12px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.add-managed-owner[b-2645x0c5wm] {
    background: #f1f5f9;
    border-radius: 999px;
    color: #475569;
    flex: 0 0 auto;
    font-size: 11px;
    font-weight: 600;
    max-width: 160px;
    overflow: hidden;
    padding: 3px 10px;
    text-overflow: ellipsis;
    white-space: nowrap;
}
/* /Pages/Customers/Components/CustomerAccessSettingsFields.razor.rz.scp.css */
.customer-access-settings[b-tejob3p3wr] {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 12px;
    border: 1px solid #E2E8F0;
    border-radius: 12px;
    background: #F8FAFC;
}

.customer-access-settings-heading[b-tejob3p3wr] {
    margin: 0;
    font-size: 13px;
    font-weight: 600;
    color: #1E293B;
}

.customer-access-settings-row[b-tejob3p3wr] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.customer-access-settings-row .toggle-title[b-tejob3p3wr] {
    font-size: 13px;
    color: #1E293B;
}

.customer-access-settings-row .section-subtitle[b-tejob3p3wr] {
    font-size: 12px;
    color: #64748B;
}

/* The app's standard toggle, copied from the settings tabs: scoped CSS does not cross
   components, so the classes have to live here too for the switch to render as one. */
.det-toggle-switch[b-tejob3p3wr] {
    position: relative;
    display: inline-block;
    width: 46px;
    height: 28px;
    background: linear-gradient( 180deg, rgba(226, 232, 240, 1) 0%, rgba(248, 250, 252, 1) 100% );
    border-radius: 50px;
    padding: 3px;
    flex-shrink: 0;
}

.det-toggle-switch input[b-tejob3p3wr] {
    opacity: 0;
    width: 0;
    height: 0;
}

.det-toggle-slider[b-tejob3p3wr] {
    position: absolute;
    cursor: pointer;
    border-radius: 30px;
    background-color: #d3dde8;
    transition: 0.3s;
    height: 22px;
    width: 40px;
}

.det-toggle-slider[b-tejob3p3wr]:before {
    content: "";
    position: absolute;
    height: 18px;
    width: 18px;
    left: 2px;
    top: 2px;
    border-radius: 1000px;
    background: linear-gradient(180deg, #e2e8f0 0%, #ffffff 100%);
    border: 3.5px solid #f9fbfc;
    box-shadow: 0 2px 4px rgba(0,0,0,.15);
    transition: .3s;
}

.det-toggle-switch input:checked + .det-toggle-slider[b-tejob3p3wr] {
    background: linear-gradient(135deg, #5b67f6, #4c57e0);
}

.det-toggle-switch input:checked + .det-toggle-slider[b-tejob3p3wr]:before {
    transform: translateX(18px);
    background: #fff;
}

.det-toggle-switch input:checked + .det-toggle-slider[b-tejob3p3wr]:after {
    content: "";
    position: absolute;
    right: 5px;
    top: 7.5px;
    width: 11px;
    height: 11px;
    background-image: url("../img/icons/toggle-check-icon.svg");
    background-size: contain;
    background-repeat: no-repeat;
}

.customer-access-settings-scope[b-tejob3p3wr] {
    margin: 0 0 12px;
}
/* /Pages/Customers/Components/CustomerDetailsSlider.razor.rz.scp.css */
.z-index-lower[b-ai5bufvblh] {
  z-index: 1040 !important;
}

.customer-tab-search[b-ai5bufvblh] {
  padding: 8px;
  background-color: var(--white);
  border: 1px #1e293b1f solid;
  border-radius: 50px;
  box-shadow: 0 3px 3px -1.5px #1e293b08;
  width: 100%;
  max-width: 300px;
  min-width: 300px;
}

.customer-tab-search img[b-ai5bufvblh] {
  height: 16px;
}

.customer-tab-search input[b-ai5bufvblh] {
  border: none;
  outline: none;
  font-size: 13px;
  font-weight: 600;
  line-height: 18px;
  letter-spacing: -0.2px;
  color: var(--gray-txt);
}

.customer-name-popup.right .modal-dialog[b-ai5bufvblh] {
  position: fixed;
  margin: 0;
  right: 0;
  top: 0;
  height: 100%;
  max-width: 740px;
  width: 100%;
}

.customer-name-popup.right .modal-content[b-ai5bufvblh] {
  height: 100vh;
  border-radius: 0 !important;
  padding: 0 !important;
  display: flex;
  flex-direction: column;
  border: none;
}

.customer-name-popup.right.fade .modal-dialog[b-ai5bufvblh] {
  transform: translateX(100%);
  transition: transform 0.3s ease-out;
}

.customer-name-popup.right.show .modal-dialog[b-ai5bufvblh] {
  transform: translateX(0);
}

.customer-name-popup .modal-dialog[b-ai5bufvblh] {
  float: right;
  min-width: 740px;
  margin: 0;
}

.customer-name-popup .modal-content[b-ai5bufvblh] {
  border-radius: 0 !important;
  height: 100vh;
  padding: 0 !important;
}

.customer-name-popup .modal-header[b-ai5bufvblh] {
  padding: 16px 24px;
  gap: 16px;
  border-bottom: 1px solid rgba(30, 41, 59, 0.09) !important;
}

.customer-name-popup .modal-header .icon-txt .icon[b-ai5bufvblh] {
  min-height: 48px;
  min-width: 48px;
  background-color: #5263ff1f;
  border-radius: 10px;
}

.customer-name-popup .modal-header .icon-txt .icon img[b-ai5bufvblh] {
  height: 28px;
}

.customer-name-popup .modal-header .icon-txt h5[b-ai5bufvblh] {
  font-size: 18px;
  font-weight: 800;
  line-height: 24px;
  letter-spacing: -0.2px;
  color: var(--dark-txt);
}

.customer-name-popup .modal-header button.btn-close[b-ai5bufvblh] {
  min-width: 40px;
  min-height: 40px;
  margin: 0 !important;
  padding: 0;
  opacity: 1;
  border: 1px solid rgba(30, 41, 59, 0.06);
  border-radius: 10px;
  background-color: rgba(241, 245, 249, 0.8);
}

.customer-name-popup .modal-header .customerName-tab[b-ai5bufvblh] {
  background-color: #f1f5f9cc;
  border: 1px #1e293b08 solid;
  border-radius: 16px;
  height: 48px;
  padding: 6px;
  gap: 6px;
}

.customer-name-popup .modal-header .customerName-tab button[b-ai5bufvblh] {
  min-height: 36px;
  padding: 4px 10px;
  background-color: transparent;
  border: 1px transparent solid;
  border-radius: 10px;
  outline: none;
  font-size: 13px;
  font-weight: 600;
  line-height: 24px;
  letter-spacing: -0.2px;
  color: var(--gray-txt);
  width: 100%;
  transition: background-color 0.2s ease, box-shadow 0.2s ease, color 0.2s ease;
}

.customer-name-popup .modal-header .customerName-tab button:hover[b-ai5bufvblh] {
  color: var(--dark-txt);
}

.customer-name-popup .modal-header .customerName-tab button.active[b-ai5bufvblh] {
  background: #fff;
  border: 0;
  box-shadow:
    0 1px 1px -0.5px rgba(30, 41, 59, 0.03),
    0 3px 3px -1.5px rgba(30, 41, 59, 0.03),
    0 20px 20px -12px rgba(30, 41, 59, 0.03);
  color: var(--dark-txt);
}

.customer-name-popup .modal-body[b-ai5bufvblh] {
  padding: 0;
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  overflow-x: hidden;
  scrollbar-width: none;
}

.customer-name-popup .modal-body[b-ai5bufvblh]::-webkit-scrollbar {
  display: none;
}

.customer-name-popup .modal-body .details-locations-tab .box[b-ai5bufvblh] {
  padding: 24px;
  border-bottom: 1px solid rgba(30, 41, 59, 0.09);
}

.customer-name-popup .modal-body .details-locations-tab .box h5[b-ai5bufvblh] {
  font-size: 18px;
  font-weight: 800;
  line-height: 24px;
  letter-spacing: -0.2px;
  color: var(--dark-txt);
}

.customer-name-popup .modal-body .details-locations-tab .box button.edit[b-ai5bufvblh] {
  gap: 2px;
  background-color: var(--purple);
  padding: 8px;
  border-radius: 8px;
  border: none;
  outline: none;
}

.customer-name-popup .modal-body .details-locations-tab .box button.edit img[b-ai5bufvblh] {
  height: 16px;
}

.customer-name-popup .modal-body .details-locations-tab .box button.edit p[b-ai5bufvblh] {
  padding: 0 4px;
  font-size: 12px;
  font-weight: 600;
  line-height: 16px;
  letter-spacing: -0.2px;
  color: var(--white);
}

.customer-name-popup .modal-body .details-locations-tab .box .box-txt p[b-ai5bufvblh] {
  font-size: 13px;
  font-weight: 700;
  line-height: 20px;
  letter-spacing: -0.2px;
  color: var(--dark-txt);
}

.customer-name-popup .modal-body .details-locations-tab .box .box-txt span[b-ai5bufvblh] {
  font-size: 13px;
  font-weight: 500;
  line-height: 20px;
  letter-spacing: -0.2px;
  color: var(--gray-txt);
}

.customer-name-popup .modal-body .details-locations-tab .box-2[b-ai5bufvblh] {
  padding: 0;
  border: none;
}

.customer-name-popup .customer-details-action[b-ai5bufvblh] {
  height: 32px;
  padding: 4px 8px;
  border-radius: 8px;
}

.customer-name-popup .customer-details-action img[b-ai5bufvblh] {
  height: 16px;
}

.customer-name-popup .customer-details-action p[b-ai5bufvblh] {
  padding: 0 4px;
  font-size: 12px;
  line-height: 16px;
}

.customer-name-popup .modal-body .details-locations-tab .box-2 .tab[b-ai5bufvblh] {
  padding: 12px 24px;
  min-height: 64px;
  cursor: pointer;
}

.customer-name-popup .modal-body .details-locations-tab .box-2 .tab:nth-of-type(even)[b-ai5bufvblh] {
  background-color: #f8fafc;
}

.customer-name-popup .modal-body .details-locations-tab .box-2 .tab:hover[b-ai5bufvblh] {
  background-color: rgba(82, 99, 255, 0.10);
}

.customer-name-popup
  .modal-body
  .details-locations-tab
  .box-2
  .tab
  .txt-area
  img[b-ai5bufvblh] {
  height: 20px;
}

.customer-name-popup
  .modal-body
  .details-locations-tab
  .box-2
  .tab
  .txt-area
  .txt
  p[b-ai5bufvblh] {
  font-size: 13px;
  font-weight: 600;
  line-height: 20px;
  letter-spacing: -0.2px;
  color: var(--dark-txt);
}

.customer-name-popup
  .modal-body
  .details-locations-tab
  .box-2
  .tab
  .txt-area
  .txt
  span[b-ai5bufvblh] {
  font-size: 13px;
  font-weight: 500;
  line-height: 20px;
  letter-spacing: -0.2px;
  color: var(--gray-txt);
}

.customer-name-popup .modal-body .details-locations-tab .box-2 .tab button[b-ai5bufvblh] {
  padding: 4px 6px;
  background-color: var(--white);
  border: 1px #1e293b17 solid;
  border-radius: 8px;
  box-shadow: 0 2px 1.5px -0.5px #1e293b08;
  gap: 2px;
}

.customer-name-popup .modal-body .details-locations-tab .box-2 .tab button img[b-ai5bufvblh] {
  height: 14px;
}

.customer-name-popup .modal-body .details-locations-tab .box-2 .tab button p[b-ai5bufvblh] {
  padding: 0 2px;
  font-size: 12px;
  font-weight: 600;
  line-height: 16px;
  letter-spacing: -0.2px;
  color: var(--gray-txt);
}

.customer-name-popup .modal-body .customer-account-access-tab[b-ai5bufvblh] {
  padding: 24px;
}

.customer-name-popup
  .modal-body
  .customer-account-access-tab
  .top-title
  .title
  h5[b-ai5bufvblh] {
  font-size: 18px;
  font-weight: 800;
  line-height: 24px;
  letter-spacing: -0.2px;
  color: var(--dark-txt);
}

.customer-name-popup
  .modal-body
  .customer-account-access-tab
  .top-title
  .title
  img[b-ai5bufvblh] {
  height: 16px;
}

.customer-name-popup
  .modal-body
  .customer-account-access-tab
  .top-title
  button[b-ai5bufvblh] {
  padding: 8px;
  background-color: var(--purple);
  border-radius: 8px;
  gap: 2px;
  border: none;
  outline: none;
}

.customer-name-popup
  .modal-body
  .customer-account-access-tab
  .top-title
  button
  img[b-ai5bufvblh] {
  height: 16px;
}

.customer-name-popup
  .modal-body
  .customer-account-access-tab
  .top-title
  button
  p[b-ai5bufvblh] {
  font-size: 12px;
  font-weight: 600;
  line-height: 16px;
  letter-spacing: -0.2px;
  color: var(--white);
  padding: 0 4px;
}

.customer-name-popup
  .modal-body
  .customer-account-access-tab
  .all-strap
  .strap[b-ai5bufvblh] {
  padding: 12px 0;
}

.customer-name-popup
  .modal-body
  .customer-account-access-tab
  .all-strap
  .strap
  .left
  .profile[b-ai5bufvblh] {
  height: 36px;
  width: 36px;
  border-radius: 50px;
  font-size: 13px;
  font-weight: 600;
  line-height: 20px;
  letter-spacing: -0.2px;
  color: var(--white);
}

.customer-name-popup
  .modal-body
  .customer-account-access-tab
  .all-strap
  .strap
  .left
  .profile.blue[b-ai5bufvblh] {
  background: linear-gradient(to bottom, #5263ff, #5263ff33);
}

.customer-name-popup
  .modal-body
  .customer-account-access-tab
  .all-strap
  .strap
  .left
  .profile.pink[b-ai5bufvblh] {
  background: linear-gradient(to bottom, #f83ce9, #f83ce933);
}

.customer-name-popup
  .modal-body
  .customer-account-access-tab
  .all-strap
  .strap
  .left
  .profile.orange[b-ai5bufvblh] {
  background: linear-gradient(to bottom, #f74e03, #f74e0333);
}

.customer-name-popup
  .modal-body
  .customer-account-access-tab
  .all-strap
  .strap
  .left
  .txt
  p[b-ai5bufvblh] {
  font-size: 13px;
  font-weight: 600;
  line-height: 20px;
  letter-spacing: -0.2px;
  color: var(--dark-txt);
}

.customer-name-popup
  .modal-body
  .customer-account-access-tab
  .all-strap
  .strap
  .left
  .txt
  span[b-ai5bufvblh] {
  font-size: 12px;
  font-weight: 50;
  line-height: 16px;
  letter-spacing: -0.2px;
  color: var(--gray-txt-2);
}

.customer-name-popup
  .modal-body
  .customer-account-access-tab
  .all-strap
  .strap
  .right
  .bagge[b-ai5bufvblh] {
  padding: 4px 8px;
  border-radius: 8px;
  font-size: 12px;
  font-weight: 600;
  line-height: 16px;
  letter-spacing: -0.2px;
}

.customer-name-popup
  .modal-body
  .customer-account-access-tab
  .all-strap
  .strap
  .right
  .bagge.yellow[b-ai5bufvblh] {
  background-color: #ffc30a1f;
  color: var(--yellow);
}

.customer-name-popup
  .modal-body
  .customer-account-access-tab
  .all-strap
  .strap
  .right
  .bagge.green[b-ai5bufvblh] {
  background-color: #409b3f1f;
  color: var(--green);
}

.customer-name-popup
  .modal-body
  .customer-account-access-tab
  .all-strap
  .strap
  .right
  button[b-ai5bufvblh] {
  padding: 8px;
  gap: 2px;
  background-color: transparent;
  border: none;
  outline: none;
}

.customer-name-popup
  .modal-body
  .customer-account-access-tab
  .all-strap
  .strap
  .right
  button
  img[b-ai5bufvblh] {
  height: 16px;
}

.customer-name-popup
  .modal-body
  .customer-account-access-tab
  .all-strap
  .strap
  .right
  button
  p[b-ai5bufvblh] {
  padding: 0 4px;
  font-size: 12px;
  font-weight: 600;
  line-height: 16px;
  letter-spacing: -0.2px;
  color: var(--orange);
}

.customer-name-popup .box-2 > div:first-child[b-ai5bufvblh] { min-height: 72px; }
.customer-location-routes[b-ai5bufvblh] { display: flex; justify-content: flex-end; flex-wrap: wrap; gap: 5px; max-width: 44%; }
.customer-route-badge[b-ai5bufvblh], .customer-route-empty[b-ai5bufvblh] { display: inline-flex; align-items: center; gap: 4px; min-height: 24px; padding: 3px 7px; border-radius: 8px; font-size: 12px; font-weight: 600; line-height: 16px; white-space: nowrap; }
.customer-route-badge[b-ai5bufvblh] { border: 1px solid; background: #e0f2fe; }
.customer-route-empty[b-ai5bufvblh] { color: #475569; border: 1px solid rgba(30, 41, 59, 0.09); background: #fff; box-shadow: 0 2px 1.5px -0.5px rgba(30, 41, 59, 0.03); }
.customer-route-badge img[b-ai5bufvblh], .customer-route-empty img[b-ai5bufvblh] { width: 14px; height: 14px; }
.customer-access-empty-state[b-ai5bufvblh] { display: flex; align-items: center; justify-content: center; min-height: 220px; color: #5F6E85; font-size: 13px; }
.customer-account-access-tab .min-w-0[b-ai5bufvblh] { min-width: 0; }
.customer-account-access-tab .txt p[b-ai5bufvblh], .customer-account-access-tab .txt span[b-ai5bufvblh] { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.customer-access-remove-copy[b-ai5bufvblh] { padding: 0 20px 18px; color: #475569; overflow-wrap: anywhere; }
@media (max-width: 760px) {
  .customer-name-popup.right .modal-dialog[b-ai5bufvblh], .customer-name-popup .modal-dialog[b-ai5bufvblh] { min-width: 0; max-width: 100%; width: 100%; }
  .customer-location-routes[b-ai5bufvblh] { max-width: 50%; }
  .customer-name-popup .modal-content[b-ai5bufvblh] { padding: 0 !important; }
}
@media (max-width: 480px) { [b-ai5bufvblh] .customer-access-remove-popup .modal-dialog { min-width: 0 !important; width: calc(100vw - 24px) !important; max-width: calc(100vw - 24px) !important; margin-inline: auto !important; } }

/* ─────────────────── Address status tabs ─────────────────────────────────────────────────── */
.customer-location-status-tabs[b-ai5bufvblh] { flex-wrap: wrap; }
.customer-location-status-pill[b-ai5bufvblh] {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 32px;
  padding: 6px 10px;
  border: 1px #1e293b17 solid;
  border-radius: 8px;
  background-color: #f1f5f9cc;
  color: var(--dark-txt);
  font-size: 12px;
  font-weight: 600;
  line-height: 16px;
  letter-spacing: -0.2px;
  cursor: pointer;
  transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}
.customer-location-status-pill:hover[b-ai5bufvblh] { background-color: #e2e8f0; }
.customer-location-status-pill.selected[b-ai5bufvblh] {
  background-color: #5263ff1f;
  border-color: #5263ff33;
  color: var(--purple-2);
}
.customer-location-status-count[b-ai5bufvblh] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 20px;
  padding: 0 5px;
  border-radius: 6px;
  background-color: #ffffffcc;
  color: #475569;
  font-size: 11px;
  font-weight: 600;
  line-height: 18px;
}
.customer-location-status-pill.selected .customer-location-status-count[b-ai5bufvblh] { color: var(--purple-2); }

/* Inactive banner: the same red box the address panel shows for an inactive address. */
.customer-name-popup .customer-inactive-banner[b-ai5bufvblh] {
  margin-bottom: 16px;
  border-radius: 10px;
  background: #ED40301F;
  box-shadow: 0px 1px 1px -0.5px #1E293B08;
  padding: 10px 12px;
}

.customer-name-popup .customer-inactive-banner-title[b-ai5bufvblh] {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 13px;
  color: #b91c1c;
}

.customer-name-popup .customer-inactive-banner-note[b-ai5bufvblh] {
  margin: 8px 0 0 26px;
  font-size: 13px;
  font-weight: 500;
  color: #b91c1c;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}

.customer-name-popup .customer-inactive-banner-hint[b-ai5bufvblh] {
  margin: 8px 0 0 26px;
  font-size: 12px;
  line-height: 16px;
  color: #7f1d1d;
}

/* Make inactive / Make active, styled like the address panel's pair. */
.customer-name-popup .customer-make-inactive-btn[b-ai5bufvblh],
.customer-name-popup .customer-make-active-btn[b-ai5bufvblh] {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  border: none;
  font-size: 12px;
  font-weight: 700;
  line-height: 16px;
  letter-spacing: -0.2px;
  cursor: pointer;
  transition: all 0.2s ease;
}

.customer-name-popup .customer-make-inactive-btn[b-ai5bufvblh] {
  background-color: #ed40301f;
  color: #b91c1c;
}

.customer-name-popup .customer-make-inactive-btn:hover:not(:disabled)[b-ai5bufvblh] {
  background-color: #ed403033;
}

.customer-name-popup .customer-make-active-btn[b-ai5bufvblh] {
  background-color: #296C28;
  color: var(--white);
}

.customer-name-popup .customer-make-active-btn:hover:not(:disabled)[b-ai5bufvblh] {
  opacity: 0.88;
}

.customer-name-popup .customer-make-inactive-btn:disabled[b-ai5bufvblh],
.customer-name-popup .customer-make-active-btn:disabled[b-ai5bufvblh] {
  opacity: 0.6;
  cursor: not-allowed;
}

.customer-name-popup .customer-make-inactive-btn p[b-ai5bufvblh],
.customer-name-popup .customer-make-active-btn p[b-ai5bufvblh] {
  margin: 0;
  color: inherit;
}

/* The note popup's body. */
.customer-deactivate-body[b-ai5bufvblh] {
  /* Inset the note to the same edge as the popup's title and buttons; the popup body
     itself has no horizontal padding, so without this the field runs wider than both. */
  padding: 4px 20px 8px;
}

.customer-deactivate-label[b-ai5bufvblh] {
  font-size: 12px;
  font-weight: 600;
  line-height: 16px;
  color: var(--gray-txt);
  margin-bottom: 6px;
}

.customer-deactivate-counter[b-ai5bufvblh] {
  font-size: 11px;
  color: #94a3b8;
}

.customer-deactivate-note[b-ai5bufvblh] {
  width: 100%;
  resize: vertical;
  padding: 10px 12px;
  border: 1px solid #1E293B1F;
  border-radius: 10px;
  font-size: 13px;
  line-height: 18px;
  color: var(--dark-txt);
  outline: none;
}

.customer-deactivate-note:focus[b-ai5bufvblh] {
  border-color: #5263ff66;
}

/* Managed addresses: the same row as an owned address, minus the click, plus who owns it. */
.customer-name-popup .modal-body .details-locations-tab .box-2 .tab.customer-managed-row[b-ai5bufvblh] {
  cursor: default;
}

.customer-name-popup .modal-body .details-locations-tab .box-2 .tab.customer-managed-row:hover[b-ai5bufvblh] {
  background-color: transparent;
}

.customer-name-popup .modal-body .details-locations-tab .box-2 .tab.customer-managed-row:nth-of-type(even):hover[b-ai5bufvblh] {
  background-color: #f8fafc;
}

.customer-name-popup .modal-body .details-locations-tab .box-2 .customer-managed-meta[b-ai5bufvblh] {
  flex: 0 0 auto;
}

.customer-name-popup .modal-body .details-locations-tab .box-2 .customer-managed-owner[b-ai5bufvblh] {
  max-width: 180px;
  padding: 4px 8px;
  border-radius: 8px;
  background-color: #f1f5f9;
  color: var(--gray-txt);
  font-size: 12px;
  font-weight: 600;
  line-height: 16px;
  letter-spacing: -0.2px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.customer-name-popup .modal-body .details-locations-tab .box-2 .customer-managed-pill[b-ai5bufvblh] {
  padding: 4px 8px;
  border-radius: 8px;
  font-size: 12px;
  font-weight: 600;
  line-height: 16px;
  letter-spacing: -0.2px;
}

.customer-name-popup .modal-body .details-locations-tab .box-2 .customer-managed-pill.green[b-ai5bufvblh] {
  background-color: #409b3f1f;
  color: var(--green);
}

.customer-name-popup .modal-body .details-locations-tab .box-2 .customer-managed-pill.gray[b-ai5bufvblh] {
  background-color: #1e293b0f;
  color: var(--gray-txt);
}
/* /Pages/Customers/Components/CustomerList.razor.rz.scp.css */
.dispatch-group-btn-tab .table-title h4[b-qswjromf83] {
    font-size: 18px;
    font-weight: 600;
    line-height: 24px;
    letter-spacing: -0.2px;
    color: var(--gray-txt);
}

.dispatch-group-btn-tab table tr[b-qswjromf83] {
    cursor: pointer;
    font-size: 12px;
    font-weight: 600;
    line-height: 16px;
    letter-spacing: -0.2px;
    color: var(--dark-txt);
}

    .dispatch-group-btn-tab table tr td p[b-qswjromf83] {
        font-size: 13px;
        font-weight: 800;
        line-height: 20px;
        letter-spacing: -0.2px;
        color: var(--dark-txt);
    }


.customer-tab-search[b-qswjromf83] {
    padding: 8px;
    background-color: var(--white);
    border: 1px solid #1E293B1F;
    border-radius: 50px;
    box-shadow: 0 3px 3px -1.5px #1E293B08;
    width: 100%;
    max-width: 300px;
    min-width: 300px;
}

    .customer-tab-search img[b-qswjromf83] {
        height: 16px;
    }

    .customer-tab-search input[b-qswjromf83] {
        border: none;
        outline: none;
        width: 100%;
        font-size: 13px;
        font-weight: 600;
        line-height: 18px;
        letter-spacing: -0.2px;
        color: var(--gray-txt);
        background: transparent;
    }

.dispatch-group-btn-tab table td .round-bagge[b-qswjromf83] {
    height: 20px;
    width: 20px;
    border-radius: 20px;
    font-size: 10px;
    font-weight: 600;
    line-height: 16px;
    letter-spacing: -0.2px;
    color: var(--white);
}

.dispatch-group-btn-tab table td .location-bagge[b-qswjromf83] {
    padding: 4px 6px;
    background-color: #5263FF1F;
    border-radius: 8px;
    width: max-content;
    gap: 2px;
}

    .dispatch-group-btn-tab table td .location-bagge img[b-qswjromf83] {
        height: 14px;
    }

    .dispatch-group-btn-tab table td .location-bagge p[b-qswjromf83] {
        font-size: 12px;
        font-weight: 600;
        line-height: 16px;
        letter-spacing: -0.2px;
        color: var(--purple-2);
        padding: 0 2px;
    }

.dispatch-group-btn-tab .selected-data[b-qswjromf83] {
    border-top: 1px solid #1E293B0F;
    border-bottom: 1px solid #1E293B0F;
    padding: 8px 16px;
}

.cu-contractors-checkbox[b-qswjromf83] {
    width: 20px !important;
    height: 20px !important;
    border-radius: 6px !important;
    padding: 2px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    transition: all 0.2s !important;
    background: linear-gradient(180deg, #f1f5f9 0%, #ffffff 100%) !important;
    border: 2.5px solid #d9dee3 !important;
    backdrop-filter: blur(24px) !important;
    box-shadow:
        0px 1px 1px -0.5px #1e293b08,
        0px 3px 3px 0px #ffffff1f inset !important;
    flex-shrink: 0 !important;
}

    .cu-contractors-checkbox.checked[b-qswjromf83],
    .cu-contractors-checkbox.mixed[b-qswjromf83] {
        background: linear-gradient(180deg, #5263ff 0%, #5263ff 100%) !important;
        color: white !important;
        backdrop-filter: blur(24px) !important;
        box-shadow:
            0px 1px 1px -0.5px #1e293b08,
            0px 3px 3px 0px #ffffff1f inset !important;
        border: none !important;
    }

    .cu-contractors-checkbox.mixed[b-qswjromf83] {
        background: #D1D8FA !important;
        color: #5263FF !important;
    }

.cu-contractors-checkbox-icon[b-qswjromf83] {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
}

.cu-contractors-checkbox:disabled[b-qswjromf83],
.cu-contractors-checkbox.disabled[b-qswjromf83] {
    opacity: 0.6;
    cursor: not-allowed;
}

.baggee.rounded-squircle[b-qswjromf83] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: var(--Surface-primary_base_em_alpha, #5263FF1F);
    color: #363AF5;
    padding: 4px 8px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 600;
    line-height: 16px;
    letter-spacing: -0.2px;
    height: 24px;
    width: fit-content;
    white-space: nowrap;
}

    .baggee.rounded-squircle img[b-qswjromf83] {
        width: 14px;
        height: 14px;
        flex-shrink: 0;
    }

.selected-data span[b-qswjromf83] { font-size: 13px; font-weight: 700; color: #475569; }
.selected-data .btn-wm-primary[b-qswjromf83] { min-height: 34px; display: inline-flex; align-items: center; gap: 6px; }
.selected-data .btn-wm-primary img[b-qswjromf83] { width: 14px; height: 14px; }
.customer-account-preview[b-qswjromf83] { display: flex; align-items: center; min-width: 80px; }
.customer-account-avatar[b-qswjromf83] { width: 26px !important; height: 26px !important; margin-left: -7px; border: 2px solid #fff; }
.customer-account-avatar:first-child[b-qswjromf83] { margin-left: 0; }
.customer-account-avatar .users-avatar-initials[b-qswjromf83] { font-size: 9px; line-height: 9px; }
.customer-account-count[b-qswjromf83] { margin-left: 5px; font-size: 11px; font-weight: 700; color: #5263ff; }

/* Status filter: the same three pills the customer panel's address tabs and the
   Locations filter popover use, so a reader recognises them. */
.customer-status-filter[b-qswjromf83] {
    margin-left: auto;
}

.customer-status-pill[b-qswjromf83] {
    display: inline-flex;
    align-items: center;
    min-height: 32px;
    padding: 6px 12px;
    border: 1px #1e293b17 solid;
    border-radius: 8px;
    background-color: #f1f5f9cc;
    color: var(--dark-txt);
    font-size: 12px;
    font-weight: 600;
    line-height: 16px;
    letter-spacing: -0.2px;
    cursor: pointer;
    transition: all 0.2s ease;
}

.customer-status-pill:hover:not(:disabled)[b-qswjromf83] {
    background-color: #e2e8f0;
}

.customer-status-pill.selected[b-qswjromf83] {
    background-color: #5263ff1f;
    border-color: #5263ff33;
    color: var(--purple-2);
}

.customer-status-pill:disabled[b-qswjromf83] {
    opacity: 0.6;
    cursor: not-allowed;
}

/* Same chip language as .loc-state-chip on the address list. */
.customer-state-chip[b-qswjromf83] {
    border-radius: 8px;
    display: inline-flex;
    font-size: 11px;
    font-weight: 700;
    line-height: 16px;
    padding: 1px 7px;
    vertical-align: middle;
}

.customer-state-chip.inactive[b-qswjromf83] {
    background: #fee2e2;
    color: #b91c1c;
}
/* /Pages/Customers/Components/ManageCustomerPopup.razor.rz.scp.css */
.new-customer-popup .modal-dialog[b-tavb2ounjq] {
    min-width: 600px;
}

.new-customer-popup .modal-content[b-tavb2ounjq] {
    padding: 0 !important;
    border-radius: 20px !important;
}

.new-customer-popup .modal-header[b-tavb2ounjq] {
    padding: 16px 20px;
}

.new-customer-popup .modal-header h5[b-tavb2ounjq] {
    font-size: 18px;
    font-weight: 700;
    line-height: 24px;
    letter-spacing: -0.2px;
    color: var(--dark-txt);
}

.new-customer-popup .modal-header button.btn-close[b-tavb2ounjq] {
    background-size: 13px;
}

.new-customer-popup .modal-body[b-tavb2ounjq] {
    padding: 20px;
    background-color: #f1f5f9;
    border-top: 1px solid #EBECED
}

.new-customer-popup .modal-body label[b-tavb2ounjq] {
    font-size: 13px;
    font-weight: 600;
    line-height: 20px;
    letter-spacing: -0.2px;
    color: var(--gray-txt);
}

.new-customer-popup .modal-body label span[b-tavb2ounjq] {
    font-size: 12px;
    font-weight: 500;
    line-height: 16px;
    letter-spacing: -0.2px;
    color: var(--gray-txt-2);
}

.new-customer-popup .modal-body label span.red[b-tavb2ounjq] {
    font-size: 13px;
    font-weight: 600;
    line-height: 20px;
    letter-spacing: -0.2px;
    color: var(--orange);
}

.new-customer-popup .modal-body input[b-tavb2ounjq] {
    padding: 8px 10px;
    background-color: var(--white);
    border: 1px #1E293B1F solid;
    border-radius: 10px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
    outline: none;
    font-size: 13px;
    font-weight: 600;
    line-height: 24px;
    letter-spacing: -0.2px;
    color: var(--dark-txt);
}

.new-customer-popup .modal-body .main-cstn-input-w-btn .cstn-input-w-btn[b-tavb2ounjq] {
    background-color: var(--white);
    padding: 4px;
    border: 1px #1E293B1F solid;
    border-radius: 10px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
}

.new-customer-popup .modal-body .main-cstn-input-w-btn .cstn-input-w-btn input[b-tavb2ounjq] {
    padding: 0 4px;
    background-color: transparent;
    border: none;
    outline: none;
    font-size: 13px;
    font-weight: 600;
    line-height: 24px;
    letter-spacing: -0.2px;
    color: var(--dark-txt);
    box-shadow: none;
}

.new-customer-popup .modal-footer[b-tavb2ounjq] {
    padding: 16px 20px;
    border-top: 1px solid #EBECED !important;
}

.new-customer-popup .modal-footer button.cancel-btn[b-tavb2ounjq] {
    padding: 8px;
    background-color: #F1F5F9CC;
    border: 1px #1E293B0F solid;
    border-radius: 10px;
    font-size: 13px;
    font-weight: 600;
    line-height: 24px;
    color: var(--dark-txt);
}

.new-customer-popup .modal-footer button.create-btn[b-tavb2ounjq] {
    padding: 8px;
    background-color: var(--purple);
    border: 1px var(--purple) solid;
    border-radius: 10px;
    font-size: 13px;
    font-weight: 600;
    line-height: 24px;
    color: var(--white);
    box-shadow: 0 1px 1px -0.5px #1E293B08;
}

@media (max-width:768px) {
    .new-customer-popup .modal-dialog[b-tavb2ounjq] {
        min-width: 95%;
    }
}

.new-customer-popup .modal-body input[b-tavb2ounjq]::placeholder,
.new-customer-popup .modal-body textarea[b-tavb2ounjq]::placeholder {
    color: #5F6E85;
}

.new-customer-popup .modal-body input:focus[b-tavb2ounjq],
.new-customer-popup .modal-body textarea:focus[b-tavb2ounjq] {
    box-shadow: 0 0 0 0.2rem #dce0ff;
}

.new-customer-popup .modal-body input:disabled[b-tavb2ounjq],
.new-customer-popup .modal-body textarea:disabled[b-tavb2ounjq] {
    background: transparent;
    box-shadow: initial;
    cursor: not-allowed;
}

.new-customer-popup .modal-body select[b-tavb2ounjq] {
    padding: 8px 10px;
    background-color: var(--white);
    border: 1px #1E293B1F solid;
    border-radius: 10px;
    box-shadow: 0 3px 3px -1.5px #1E293B08;
    font-size: 13px;
    font-weight: 600;
    line-height: 24px;
    letter-spacing: -0.2px;
    color: var(--dark-txt);
    outline: none;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
}

.tax-id-wrapper[b-tavb2ounjq] {
    position: relative;
}

.tax-id-wrapper input[b-tavb2ounjq] {
    width: 100%;
    padding-right: 80px;
}

.tax-id-wrapper .find-btn[b-tavb2ounjq] {
    position: absolute;
    top: 52%;
    right: 4px;
    transform: translateY(-50%);
    min-width: 56px;
    height: 33px;
    padding: 0 12px;
}

/* Phone input group styles from user profile and subcontractor forms */
.phone-group[b-tavb2ounjq] {
    width: 100% !important;
    height: 42px !important;
    box-sizing: border-box !important;
    display: flex !important;
    align-items: stretch !important;
    border: 1px solid #1E293B1F !important;
    border-radius: 10px !important;
    background: #fff !important;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05) !important;
    overflow: hidden !important;
}

.phone-group:focus[b-tavb2ounjq],
.phone-group:focus-within[b-tavb2ounjq] {
    box-shadow: 0 0 0 0.2rem #dce0ff !important;
}

.phone-group input:focus[b-tavb2ounjq],
.phone-group input:focus-within[b-tavb2ounjq] {
    box-shadow: none !important;
}

.phone-group:hover:not(.disabled)[b-tavb2ounjq] {
    border-color: #eaecff !important;
}

.phone-group.disabled[b-tavb2ounjq] {
    background: transparent !important;
    box-shadow: initial !important;
    cursor: not-allowed !important;
}

.phone-group-divider[b-tavb2ounjq] {
    width: 1px !important;
    height: 40px !important;
    background-color: #1E293B1F;
    flex-shrink: 0 !important;
}

.phone-input[b-tavb2ounjq] {
    flex: 1 !important;
    height: 40px !important;
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
    background: transparent !important;
    padding: 0 12px !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    color: #212529 !important;
    min-width: 0 !important;
    border-radius: 0px !important;
}

.phone-input[b-tavb2ounjq]::placeholder {
    color: #5F6E85;
}

[b-tavb2ounjq] .dropdown:has(> .user-phone-code) {
    width: fit-content !important;
    height: 40px !important;
    display: flex !important;
    align-items: stretch !important;
}

[b-tavb2ounjq] .user-phone-code {
    box-shadow: none !important;
    border-radius: 0 !important;
    height: 40px !important;
    width: 100px !important;
    white-space: nowrap;
    border: none !important;
}

[b-tavb2ounjq] .user-phone-code:focus {
    box-shadow: none !important;
}
/* /Pages/Customers/Components/NewCustomerAccessPopup.razor.rz.scp.css */
[b-9xzn0itr2o] .new-customer-access-popup .modal-dialog,
[b-9xzn0itr2o] .new-customer-account-popup .modal-dialog {
    width: 400px !important;
    max-width: calc(100vw - 24px) !important;
}

[b-9xzn0itr2o] .new-customer-access-popup .wm-popup-modal-content,
[b-9xzn0itr2o] .new-customer-account-popup .wm-popup-modal-content {
    padding: 0 !important;
    border-radius: 20px !important;
}

[b-9xzn0itr2o] .new-customer-access-popup .modal-header,
[b-9xzn0itr2o] .new-customer-account-popup .modal-header {
    min-height: 66px;
    padding: 16px 24px;
}

[b-9xzn0itr2o] .new-customer-access-popup .modal-title,
[b-9xzn0itr2o] .new-customer-account-popup .modal-title {
    color: #1e293b;
    font-size: 18px;
    font-weight: 700;
    line-height: 24px;
}

[b-9xzn0itr2o] .new-customer-access-popup .btn-close,
[b-9xzn0itr2o] .new-customer-account-popup .btn-close {
    width: 38px;
    height: 38px;
    padding: 0;
    border: 1px solid rgba(30, 41, 59, .08);
    border-radius: 10px;
    background-color: rgba(241, 245, 249, .8);
    background-size: 13px;
}

[b-9xzn0itr2o] .new-customer-access-popup .modal-body,
[b-9xzn0itr2o] .new-customer-account-popup .modal-body {
    background: #f1f5f9 !important;
}

[b-9xzn0itr2o] .new-customer-access-popup .modal-footer,
[b-9xzn0itr2o] .new-customer-account-popup .modal-footer {
    min-height: 80px;
    padding: 16px 20px;
}

[b-9xzn0itr2o] .new-customer-access-popup .modal-footer button,
[b-9xzn0itr2o] .new-customer-account-popup .modal-footer button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    height: 40px;
    border-radius: 10px;
}

[b-9xzn0itr2o] .new-customer-account-popup .modal-footer button img {
    width: 18px;
    height: 18px;
}

.new-customer-access-body[b-9xzn0itr2o] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    min-height: 116px;
    padding: 20px;
}

.new-customer-account-body[b-9xzn0itr2o] {
    display: flex;
    flex-direction: column;
    gap: 16px;
    min-height: 290px;
    padding: 16px 20px 20px;
}

.new-customer-account-body.existing-user[b-9xzn0itr2o] {
    min-height: 0;
}

.new-customer-access-body label[b-9xzn0itr2o],
.customer-account-field label[b-9xzn0itr2o] {
    color: #475569;
    font-size: 13px;
    font-weight: 600;
    line-height: 20px;
}

.customer-account-field label span[b-9xzn0itr2o] {
    color: #ef4444;
}

.new-customer-access-body input[b-9xzn0itr2o],
.customer-account-field input[b-9xzn0itr2o] {
    width: 100%;
    height: 48px;
    padding: 10px 14px;
    border: 1px solid rgba(30, 41, 59, .12);
    border-radius: 10px;
    outline: none;
    background: #fff;
    box-shadow: 0 3px 3px -1.5px rgba(30, 41, 59, .03), 0 1px 1px -.5px rgba(30, 41, 59, .03);
    color: #1e293b;
    font-size: 13px;
    font-weight: 600;
    line-height: 24px;
}

.new-customer-access-body input:focus[b-9xzn0itr2o],
.customer-account-field input:focus[b-9xzn0itr2o] {
    border-color: #5263ff;
    box-shadow: 0 0 0 3px rgba(82, 99, 255, .14);
}

.customer-account-field input:disabled[b-9xzn0itr2o] {
    cursor: not-allowed;
    background: #f8fafc;
    color: #5F6E85;
    opacity: 1;
}

.new-customer-access-body input.input-invalid[b-9xzn0itr2o],
.customer-account-field input.input-invalid[b-9xzn0itr2o] {
    border-color: rgba(239, 68, 68, .38);
    box-shadow: 0 0 0 3px rgba(239, 68, 68, .13);
}

.customer-account-message[b-9xzn0itr2o] {
    display: flex;
    align-items: center;
    gap: 8px;
    min-height: 40px;
    padding: 8px 10px;
    border-radius: 10px;
    background: rgba(82, 99, 255, .12);
    color: #363af5;
    font-size: 12px;
    font-weight: 500;
    line-height: 16px;
}

.customer-account-message img[b-9xzn0itr2o] {
    width: 16px;
    height: 16px;
    flex-shrink: 0;
}

.customer-account-field[b-9xzn0itr2o] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
}

.customer-account-name-grid[b-9xzn0itr2o] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 14px;
}

.locked-email-field[b-9xzn0itr2o] {
    position: relative;
}

.locked-email-field input[b-9xzn0itr2o] {
    padding-right: 42px;
    background: #f8fafc;
    opacity: 1;
}

.locked-email-field img[b-9xzn0itr2o] {
    position: absolute;
    top: 50%;
    right: 14px;
    width: 18px;
    height: 18px;
    transform: translateY(-50%);
    pointer-events: none;
}

.access-validation[b-9xzn0itr2o] {
    color: #ef4444;
    font-size: 12px;
    font-weight: 500;
    line-height: 16px;
}

@media (max-width: 480px) {
    [b-9xzn0itr2o] .new-customer-access-popup .modal-dialog,
    [b-9xzn0itr2o] .new-customer-account-popup .modal-dialog {
        min-width: 0 !important;
    }

    .customer-account-name-grid[b-9xzn0itr2o] {
        grid-template-columns: 1fr;
    }
}
/* /Pages/Customers/Components/ShareCustomerAccessPopup.razor.rz.scp.css */
[b-0ei498uyry] .customer-access-share-popup .modal-dialog { width: 600px !important; max-width: calc(100vw - 24px) !important; }
[b-0ei498uyry] .customer-access-share-popup .wm-popup-modal-content { overflow: visible !important; padding: 0 !important; border: 1px solid rgba(30,41,59,.03); border-radius: 20px !important; box-shadow: 0 1px 1px -.5px rgba(30,41,59,.03),0 3px 3px -1.5px rgba(30,41,59,.03),0 20px 20px -12px rgba(30,41,59,.03),0 32px 32px -16px rgba(30,41,59,.03); }
[b-0ei498uyry] .customer-access-share-popup .modal-header { min-height: 56px; padding: 16px 20px; }
[b-0ei498uyry] .customer-access-share-popup .modal-title { color: #1e293b; font-size: 18px; font-weight: 700; line-height: 24px; letter-spacing: -.2px; }
[b-0ei498uyry] .customer-access-share-popup .btn-close { width: 32px; height: 32px; padding: 0; border: 1px solid rgba(30,41,59,.06); border-radius: 8px; background-color: rgba(241,245,249,.8); background-size: 13px; opacity: 1; }
[b-0ei498uyry] .customer-access-share-popup .modal-body { height: 172px; overflow: visible !important; overflow-y: visible !important; background: #f1f5f9 !important; }
[b-0ei498uyry] .customer-access-share-popup .modal-footer { min-height: 72px; padding: 16px 20px; border-top: 1px solid rgba(30,41,59,.09); gap: 12px; }
[b-0ei498uyry] .customer-access-share-popup .modal-footer button { height: 40px; border-radius: 10px; font-size: 13px; font-weight: 600; }

.customer-access-share-body[b-0ei498uyry] { position: relative; display: flex; height: 172px; flex-direction: column; gap: 24px; padding: 16px 20px; }
.customer-access-field[b-0ei498uyry],
.customer-access-scope[b-0ei498uyry] { display: flex; min-width: 0; flex-direction: column; gap: 4px; }
.customer-access-field > label[b-0ei498uyry],
.customer-access-scope > span[b-0ei498uyry] { padding: 0 2px; color: #475569; font-size: 13px; font-weight: 600; line-height: 20px; letter-spacing: -.2px; }

.customer-access-input[b-0ei498uyry] { display: flex; width: 100%; min-width: 0; height: 44px; min-height: 44px; max-height: 44px; align-items: center; flex-wrap: nowrap; gap: 4px; overflow-x: auto; overflow-y: hidden; padding: 8px 10px; border: 1px solid rgba(30,41,59,.12); border-radius: 10px; background: #fff; box-shadow: 0 1px 1px -.5px rgba(30,41,59,.03),0 3px 3px -1.5px rgba(30,41,59,.03); cursor: text; scrollbar-width: none; }
.customer-access-input[b-0ei498uyry]::-webkit-scrollbar { display: none; }
.customer-access-input.is-open[b-0ei498uyry] { border-color: #cbd3ff; box-shadow: 0 0 0 3px rgba(82,99,255,.2); }
.customer-access-input input[b-0ei498uyry] { min-width: 32px; flex: 1 0 32px; height: 24px; padding: 0 4px; border: 0; outline: 0; background: transparent; color: #1e293b; font-size: 13px; }
.customer-access-chevron[b-0ei498uyry] { display: inline-flex; position: sticky; right: 0; width: 24px; height: 24px; flex: 0 0 24px; align-items: center; justify-content: center; padding: 0; border: 0; background: #fff; }
.customer-access-chevron img[b-0ei498uyry] { width: 16px; height: 16px; }

.customer-access-email-chip[b-0ei498uyry] { display: inline-flex; height: 28px; max-width: 180px; flex: 0 0 auto; align-items: center; gap: 4px; padding: 2px 6px 2px 2px; border: 0; border-radius: 1000px; background: rgba(82,99,255,.12); color: #363af5; font-size: 12px; font-weight: 600; line-height: 16px; }
.customer-access-email-chip > span:last-child[b-0ei498uyry] { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.customer-access-avatar[b-0ei498uyry] { display: inline-flex; width: 24px; height: 24px; flex: 0 0 24px; align-items: center; justify-content: center; border: 1px solid rgba(30,41,59,.03); border-radius: 50%; background: linear-gradient(180deg,rgba(255,255,255,.88),rgba(255,255,255,.8)); color: #5263ff; font-size: 10px; font-weight: 600; }

.customer-access-menu[b-0ei498uyry] { position: absolute; z-index: 1080; top: 80px; left: 20px; width: 360px; max-width: calc(100% - 40px); max-height: 280px; overflow-y: auto; padding: 8px; border: 1px solid rgba(30,41,59,.12); border-radius: 20px; background: #fff; box-shadow: 0 20px 20px -12px rgba(30,41,59,.16),0 32px 32px -16px rgba(30,41,59,.12); }
.customer-access-picker-state[b-0ei498uyry] { display: flex; min-height: 96px; align-items: center; justify-content: center; color: #5F6E85; font-size: 13px; }
.customer-access-candidate[b-0ei498uyry] { display: flex; width: 100%; min-height: 60px; align-items: center; gap: 12px; padding: 8px; border: 0; border-radius: 12px; background: #fff; text-align: left; }
.customer-access-candidate:hover[b-0ei498uyry],
.customer-access-candidate.selected[b-0ei498uyry] { background: rgba(82,99,255,.16); }
.customer-access-candidate.already-granted[b-0ei498uyry] { opacity: .5; cursor: default; }
.customer-access-candidate .users-avatar[b-0ei498uyry] { width: 36px; height: 36px; flex: 0 0 36px; }
.customer-access-candidate-copy[b-0ei498uyry] { display: flex; min-width: 0; flex: 1; flex-direction: column; }
.customer-access-candidate-copy strong[b-0ei498uyry] { overflow: hidden; color: #1e293b; font-size: 13px; font-weight: 600; line-height: 20px; text-overflow: ellipsis; white-space: nowrap; }
.customer-access-candidate-copy span[b-0ei498uyry] { overflow: hidden; color: #5F6E85; font-size: 12px; font-weight: 500; line-height: 18px; text-overflow: ellipsis; white-space: nowrap; }

.customer-access-location-chips[b-0ei498uyry] { display: flex; min-height: 24px; flex-wrap: wrap; gap: 8px; }
.customer-access-location-chips span[b-0ei498uyry] { height: 24px; padding: 4px 6px; border: 1px solid rgba(30,41,59,.09); border-radius: 8px; background: #fff; box-shadow: 0 2px 1.5px -.5px rgba(30,41,59,.03),inset 0 2px 3px rgba(255,255,255,.03); color: #475569; font-size: 12px; font-weight: 600; line-height: 16px; }

@media (max-width: 480px) {
    [b-0ei498uyry] .customer-access-share-popup .modal-dialog { min-width: 0 !important; }
    .customer-access-share-body[b-0ei498uyry] { padding-inline: 14px; }
    .customer-access-menu[b-0ei498uyry] { left: 14px; max-width: calc(100% - 28px); }
}
/* /Pages/Customers/Customers.razor.rz.scp.css */
.main-title .normal-btn[b-kphnw9a387] {
    border: 1px solid rgba(82, 99, 255, .08);
    background: rgba(82, 99, 255, .12);
    box-shadow: 0 1px 1px -.5px rgba(30, 41, 59, .03), 0 3px 3px rgba(255, 255, 255, .12) inset;
    color: #363af5;
}
/* /Pages/Dashboard/Components/AddressInvitationPopup.razor.rz.scp.css */
.popup-body-wrap[b-jd3cyoc9tx] {
  padding: 20px;
}

.popup-title[b-jd3cyoc9tx] {
  font-size: 16px;
  font-weight: 700;
  color: var(--dark-txt);
  line-height: 24px;
  letter-spacing: -0.2px;
}

.info-fields-container[b-jd3cyoc9tx] {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.info-field[b-jd3cyoc9tx] {
  display: block;
}

.info-label[b-jd3cyoc9tx] {
  font-size: 13px;
  font-weight: 500;
  color: var(--gray-txt-2);
  display: block;
  margin-bottom: 2px;
}

.info-value[b-jd3cyoc9tx] {
  font-size: 14px;
  font-weight: 600;
  color: var(--dark-txt);
  margin: 0;
  line-height: 20px;
}

.map-carousel[b-jd3cyoc9tx] {
  border-radius: 12px;
  overflow: hidden;
  position: relative;
}

.map-badges[b-jd3cyoc9tx] {
  position: absolute;
  top: 12px;
  left: 12px;
  z-index: 5;
  display: flex;
  gap: 8px;
}

.map-badge[b-jd3cyoc9tx] {
  background: var(--white);
  border: 1px solid #E2E8F0;
  border-radius: 6px;
  padding: 4px 8px;
  font-size: 12px;
  font-weight: 600;
  color: var(--dark-txt);
  box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.05);
}

.map-image[b-jd3cyoc9tx] {
  border-radius: 12px;
  object-fit: cover;
}

.map-indicators[b-jd3cyoc9tx] {
  position: absolute;
  bottom: 12px;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  gap: 6px;
  margin: 0;
  z-index: 5;
}

.map-dot[b-jd3cyoc9tx] {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background-color: var(--white);
  border: none;
  margin: 0;
  padding: 0;
}

.map-dot.inactive[b-jd3cyoc9tx] {
  background-color: rgba(255, 255, 255, 0.5);
}

.map-expand-btn[b-jd3cyoc9tx] {
  position: absolute;
  bottom: 8px;
  right: 8px;
  height: 32px;
  width: 32px;
  background-color: #F1F5F9CC;
  border: 1px #1E293B08 solid;
  border-radius: 8px;
  z-index: 5;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
}

.map-expand-icon[b-jd3cyoc9tx] {
  width: 18px;
  height: 18px;
}

.map-arrow-btn[b-jd3cyoc9tx] {
  width: 32px;
  height: 32px;
  background-color: #F1F5F9CC;
  border-radius: 8px;
  top: 50%;
  transform: translateY(-50%);
  opacity: 1;
  border: 1px #1E293B08 solid;
  justify-content: center;
  align-items: center;
  display: flex;
}

.map-arrow-btn.prev[b-jd3cyoc9tx] {
  left: 12px;
}

.map-arrow-btn.next[b-jd3cyoc9tx] {
  right: 12px;
}

/* ── Drawing stats bar ── */
.ldm-drawing-bar[b-jd3cyoc9tx] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    min-height: 40px;
}

.ldm-drawing-stats[b-jd3cyoc9tx] {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    gap: 8px;
    overflow-x: auto;
    -ms-overflow-style: none;
    flex: 1;
    min-width: 0;
}

.ldm-drawing-stats[b-jd3cyoc9tx]::-webkit-scrollbar {
    display: none;
}

.ldm-drawing-stat-chip[b-jd3cyoc9tx] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 4px 6px;
    background: #F1F5F9CC;
    border-radius: 8px;
    box-shadow: 0px 1px 2px 0px #1E293B08;
    white-space: nowrap;
    flex-shrink: 0;
    border: 1px solid #1E293B08;
    height: 24px;
}

.ldm-drawing-stat-dot[b-jd3cyoc9tx] {
    width: 14px;
    height: 14px;
    border-radius: 50%;
    flex-shrink: 0;
}

.ldm-drawing-stat-name[b-jd3cyoc9tx] {
    font-size: 12px;
    font-weight: 600;
    color: #1E293B;
    letter-spacing: -0.2px;
    line-height: 16px;
}

.ldm-drawing-stat-value[b-jd3cyoc9tx] {
    font-size: 12px;
    font-weight: 500;
    color: #5F6E85;
    letter-spacing: -0.2px;
    line-height: 16px;
}
/* /Pages/Dashboard/Components/LocationInvitesSlider.razor.rz.scp.css */
.z-index-lower[b-677tkb3vll] {
  z-index: 1049 !important;
}

/* Invite cards — one per received invite, matching the app's card language
   (white surface, hairline border, soft shadow) rather than the old pill. */
.invite-card-list[b-677tkb3vll] {
  height: 100%;
  overflow-y: auto;
}

.invite-card[b-677tkb3vll] {
  display: flex;
  align-items: center;
  gap: 16px;
  width: 100%;
  padding: 14px 16px;
  text-align: left;
  background: var(--wm-card-bg);
  border: 1px solid var(--wm-card-border-color);
  border-radius: var(--wm-card-radius);
  box-shadow: var(--wm-card-shadow);
  transition: border-color .15s ease, box-shadow .15s ease;
}

.invite-card:hover[b-677tkb3vll] {
  border-color: #c7ccff;
  box-shadow: 0 4px 12px rgba(82, 99, 255, .12);
}

.invite-card-body[b-677tkb3vll] {
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-width: 0;
  flex: 1 1 auto;
}

.invite-card-title[b-677tkb3vll] {
  margin: 0;
  font-size: 15px;
  font-weight: 700;
  line-height: 20px;
  color: var(--dark-txt);
}

.invite-card-line[b-677tkb3vll] {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
  font-size: 13px;
  font-weight: 500;
  line-height: 18px;
  color: var(--gray-txt);
}

.invite-card-line img[b-677tkb3vll] {
  flex: 0 0 16px;
  width: 16px;
  height: 16px;
}

.invite-card-city[b-677tkb3vll] {
  color: var(--gray-txt-2);
}

.invite-card-arrow[b-677tkb3vll] {
  flex: 0 0 auto;
  width: 20px;
  height: 20px;
}
/* /Pages/Dispatch/Components/ActivateRouteStopsPopup.razor.rz.scp.css */
/* The same table the route-dispatch confirmation draws: rounded frame, icon headers, a
   hairline between rows, and a tick column so one, some or all can be brought in. */
.activate-stops-body[b-phjjl5p6me] {
    padding: 4px 28px 8px;
    max-height: min(360px, calc(100vh - 340px));
    overflow-y: auto;
    scrollbar-width: thin;
}

.activate-stops-table[b-phjjl5p6me] {
    border: 1px #1E293B0F solid;
    border-radius: 16px;
    border-collapse: separate;
    border-spacing: 0;
    overflow: hidden;
    table-layout: fixed;
}

    .activate-stops-table th[b-phjjl5p6me],
    .activate-stops-table td[b-phjjl5p6me] {
        padding: 8px 16px;
        text-align: left;
        font-size: 13px;
        line-height: 20px;
        letter-spacing: -0.2px;
        color: #1E293B;
        border-bottom: 1px #1E293B0F solid;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .activate-stops-table th[b-phjjl5p6me] {
        font-weight: 700;
        background: #F8FAFC;
        white-space: nowrap;
    }

        .activate-stops-table th img[b-phjjl5p6me] {
            height: 16px;
            margin-right: 8px;
            vertical-align: -3px;
        }

    .activate-stops-table tbody tr:last-child td[b-phjjl5p6me] {
        border-bottom: 0;
    }

    .activate-stops-table tbody tr[b-phjjl5p6me] {
        cursor: pointer;
    }

        .activate-stops-table tbody tr:hover td[b-phjjl5p6me] {
            background: #F8FAFC;
        }

        .activate-stops-table tbody tr.on td[b-phjjl5p6me] {
            background: #363AF50A;
        }

    .activate-stops-table .activate-stops-check[b-phjjl5p6me] {
        width: 44px;
        padding-right: 0;
    }

        .activate-stops-table .activate-stops-check .custom-check[b-phjjl5p6me] {
            display: block;
            margin: 0;
            min-height: 20px;
        }

.activate-stops-name[b-phjjl5p6me] {
    display: block;
    font-weight: 600;
}

.activate-stops-address[b-phjjl5p6me] {
    display: block;
    font-size: 12px;
    color: #64748B;
}
/* /Pages/Dispatch/Components/CreateAddressDispatchPopup.razor.rz.scp.css */
/* Cascade the fixed height of the right-hand map column into the WMMap wrapper
   chain so the map (Height="100%") fills the panel. The .address-dispatch-right
   sizing itself lives in the global style.css alongside the rest of this popup. */
.address-dispatch-right[b-wd3wvtvzw2] {
    position: relative;
    min-height: 0;
}

.address-dispatch-right[b-wd3wvtvzw2]  .wm-map-wrapper,
.address-dispatch-right[b-wd3wvtvzw2]  .wm-map-wrapper > div {
    height: 100%;
}

/* Add-more: addresses already on the dispatch being extended */
.box.already-dispatched[b-wd3wvtvzw2] {
    opacity: 0.55;
    pointer-events: none;
}

.already-dispatched-badge[b-wd3wvtvzw2] {
    display: inline-block;
    background: #e9ecef;
    color: #495057;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 600;
    padding: 1px 8px;
    white-space: nowrap;
}

/* Why a greyed-out address cannot be dispatched: the business that assigned it said so. */
.dispatch-blocked-reason[b-wd3wvtvzw2] {
    margin: 4px 0 0;
    font-size: 12px;
    font-weight: 600;
    color: #B45309;
    white-space: normal;
}

/* ─── Complaint link rows ─── */
.complaint-pick-row[b-wd3wvtvzw2] {
    padding: 4px 0;
    min-width: 0;
}

.complaint-pick-row .custom-check[b-wd3wvtvzw2] {
    flex-shrink: 0;
}

.complaint-pick-text[b-wd3wvtvzw2] {
    font-size: 13px;
    color: #5F6E85;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Merge/join-choice prompt: consequence notes (same treatment as the route and zone
   creates, whose scoped styles do not reach this component). */
.merge-choice-note[b-wd3wvtvzw2] {
    background: #edf2ff;
    color: #4263eb;
    border-radius: 10px;
    padding: 10px 14px;
    font-size: 13px;
    font-weight: 600;
    line-height: 1.45;
}

.merge-choice-note.warning[b-wd3wvtvzw2] {
    background: #fff4e6;
    color: #d9480f;
}

/* The "who is invoiced" question sits under the invoice toggle and reads like the
   toggle's hint, not like a section heading. */
.cad-scope-label[b-wd3wvtvzw2] {
    font-size: 13px;
    font-weight: 600;
    line-height: 18px;
    color: var(--gray-txt);
    margin: 0;
}

.carried-out-by-hint[b-wd3wvtvzw2] {
    font-size: 12px;
    color: #5F6E85;
    margin-bottom: 0;
}
/* /Pages/Dispatch/Components/CreateAutoDispatchPopup.razor.rz.scp.css */
/* An address the delegating business has closed to us: visible, explained, not selectable. */
.dispatch-blocked-row[b-8q8acebk6o] {
    opacity: 0.55;
    pointer-events: none;
}

.dispatch-blocked-reason[b-8q8acebk6o] {
    margin: 4px 0 0;
    font-size: 12px;
    font-weight: 600;
    color: #B45309;
    white-space: normal;
}
/* /Pages/Dispatch/Components/CreateManualDispatchPopup.razor.rz.scp.css */
/* Why some routes are missing from the picker: their addresses are closed to us. */
.dispatch-blocked-reason[b-r783058nn1] {
    margin: 6px 0 0;
    font-size: 12px;
    font-weight: 600;
    color: #B45309;
    white-space: normal;
}
/* /Pages/Dispatch/Components/CreateRouteDispatchPopup.razor.rz.scp.css */
/* Cascade the fixed height of the right-hand map column into the WMMap wrapper
   chain so the map (Height="100%") fills the panel. The .address-dispatch-right
   sizing itself lives in the global style.css alongside the rest of this popup. */
.address-dispatch-right[b-fxotjfdrra] {
    position: relative;
    min-height: 0;
}

.address-dispatch-right[b-fxotjfdrra]  .wm-map-wrapper,
.address-dispatch-right[b-fxotjfdrra]  .wm-map-wrapper > div {
    height: 100%;
}

/* Merge-choice prompt: consequence notes */
.merge-choice-note[b-fxotjfdrra] {
    background: #edf2ff;
    color: #4263eb;
    border-radius: 10px;
    padding: 10px 14px;
    font-size: 13px;
    font-weight: 600;
    line-height: 1.45;
}
.merge-choice-note.warning[b-fxotjfdrra] {
    background: #fff4e6;
    color: #d9480f;
}

/* Add-more: routes already on the dispatch being extended */
.box.already-dispatched[b-fxotjfdrra] {
    opacity: 0.55;
    pointer-events: none;
}

/* Why a route is greyed out, or which of its stops will be left behind. */
.dispatch-blocked-reason[b-fxotjfdrra] {
    margin: 4px 0 0;
    font-size: 12px;
    font-weight: 600;
    color: #B45309;
    white-space: normal;
}

.dispatch-blocked-warning[b-fxotjfdrra] {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    margin-bottom: 16px;
    padding: 12px;
    border: 1px solid #FDE68A;
    border-radius: 8px;
    background: #FFFBEB;
}

.dispatch-blocked-warning-title[b-fxotjfdrra] {
    margin: 0;
    font-size: 13px;
    font-weight: 700;
    color: #92400E;
}

.dispatch-blocked-warning-body[b-fxotjfdrra] {
    margin: 2px 0 0;
    font-size: 13px;
    font-weight: 500;
    color: #92400E;
}

.already-dispatched-badge[b-fxotjfdrra] {
    display: inline-block;
    background: #e9ecef;
    color: #495057;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 600;
    padding: 1px 8px;
    white-space: nowrap;
}

/* ─── Per-subcontractor message rows (additional settings) ─── */
.recipient-name[b-fxotjfdrra] {
    font-size: 13px;
    font-weight: 600;
    color: #1E293B;
}

.recipient-customize[b-fxotjfdrra] {
    background: none;
    border: none;
    padding: 0;
    font-size: 12px;
    color: #0D6EFD;
    cursor: pointer;
}

.recipient-note[b-fxotjfdrra] {
    min-height: 56px;
}

/* ── Per-route crew picker ────────────────────────────────────────────────
   Inside the route's own panel, above its stops: the crew is a property of
   the route being sent, so it reads before the addresses rather than as a
   dispatch-wide setting somewhere else in the popup. */
.route-crew[b-fxotjfdrra] {
    padding: 12px 0 4px;
}

.route-crew-head[b-fxotjfdrra] {
    margin-bottom: 8px;
}

.route-crew-title[b-fxotjfdrra] {
    font-size: 13px;
    font-weight: 700;
    color: #1E293B;
}

.route-crew-note[b-fxotjfdrra] {
    font-size: 12px;
    color: #5F6E85;
}

.route-crew-warn[b-fxotjfdrra] {
    display: inline-block;
    margin-top: 8px;
    font-size: 12px;
    color: #C0392F;
}

.route-crew-chip[b-fxotjfdrra] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    border: 1px solid #1E293B26;
    background: #FFFFFF;
    border-radius: 99px;
    padding: 4px 8px 4px 12px;
    font-size: 12px;
    font-weight: 600;
    color: #475569;
}

    .route-crew-chip.on[b-fxotjfdrra] {
        border-color: #363AF5;
        background: #363AF51A;
        color: #363AF5;
    }

.route-crew-chip-remove[b-fxotjfdrra] {
    border: 0;
    background: none;
    padding: 0;
    line-height: 1;
    font-size: 15px;
    color: inherit;
    cursor: pointer;
    opacity: 0.7;
}

    .route-crew-chip-remove:hover[b-fxotjfdrra] {
        opacity: 1;
    }

/* The pool is searched, not listed: a business with fifty drivers cannot read a wall of
   chips. A small window that scrolls, with the picked ones held above it. */
.route-crew-search[b-fxotjfdrra] {
    margin-top: 10px;
    padding: 6px 10px;
    border: 1px solid #1E293B1F;
    border-radius: 50px;
    background: #FFFFFF;
}

    .route-crew-search img[b-fxotjfdrra] {
        height: 14px;
    }

    .route-crew-search input[b-fxotjfdrra] {
        border: none;
        outline: none;
        font-size: 12px;
        font-weight: 600;
        color: #1E293B;
        background: transparent;
    }

.route-crew-results[b-fxotjfdrra] {
    margin-top: 6px;
    max-height: 152px;
    overflow-y: auto;
    border: 1px solid #1E293B1F;
    border-radius: 12px;
    background: #FFFFFF;
}

.route-crew-result[b-fxotjfdrra] {
    width: 100%;
    border: 0;
    border-bottom: 1px solid #1E293B0F;
    background: none;
    padding: 7px 12px;
    font-size: 12px;
    color: #1E293B;
    text-align: left;
    cursor: pointer;
}

    .route-crew-result:last-child[b-fxotjfdrra] {
        border-bottom: 0;
    }

    .route-crew-result:hover[b-fxotjfdrra] {
        background: #F1F5F9;
    }

.route-crew-result-add[b-fxotjfdrra] {
    font-weight: 600;
    color: #363AF5;
    white-space: nowrap;
}

.route-crew-result-empty[b-fxotjfdrra] {
    display: block;
    padding: 8px 12px;
}

/* The route-is-not-set-up-for-this hint under the work type tabs. A note, not a warning:
   the dispatch goes out either way, so it reads in the muted body colour rather than red. */
.work-type-hint[b-fxotjfdrra] {
    margin-top: 8px;
}

    .work-type-hint p[b-fxotjfdrra] {
        margin: 0 0 4px 0;
        font-size: 12px;
        color: #5F6E85;
    }

        .work-type-hint p:last-child[b-fxotjfdrra] {
            margin-bottom: 0;
        }

/* The opt-out line is a rule, not a note: those routes are not going out tonight, so it
   carries the same amber the other cannot-dispatch reasons in this popup use. */
.work-type-hint.excluded p[b-fxotjfdrra] {
    color: #B45309;
    font-weight: 500;
}

/* The search and the whose-routes filter share one row above the list. The search box's
   own padding comes from style.css at a deeper selector, so the row supplies the right
   edge and the filter sits flush with the list's cards. */
.route-list-tools[b-fxotjfdrra] {
    background: #FFFFFF;
    padding-right: 16px;
}

.route-source-filter[b-fxotjfdrra] {
    flex: 0 0 auto;
}

/* The "this driver comes from the schedule for the planned date" chip badge. */
.route-crew-scheduled[b-fxotjfdrra] {
	margin-left: 4px;
	padding: 1px 6px;
	border-radius: 99px;
	background: #EEF2FF;
	color: #363AF5;
	font-size: 10px;
	font-weight: 600;
	text-transform: uppercase;
}

/* A route stop whose season has ended is shown, greyed: the route still carries it, and route
   expansion will leave it out of the dispatch, which is easier to accept when it was visible. */
.route-stop-inactive[b-fxotjfdrra] {
    opacity: 0.55;
}
/* /Pages/Dispatch/Components/CreateZoneDispatchPopup.razor.rz.scp.css */
/* Cascade the fixed height of the right-hand map column into the WMMap wrapper
   chain so the map (Height="100%") fills the panel. The .address-dispatch-right
   sizing itself lives in the global style.css alongside the rest of this popup. */
.address-dispatch-right[b-cjy0uz3scl] {
    position: relative;
    min-height: 0;
}

.address-dispatch-right[b-cjy0uz3scl]  .wm-map-wrapper,
.address-dispatch-right[b-cjy0uz3scl]  .wm-map-wrapper > div {
    height: 100%;
}

/* Merge-choice prompt: consequence notes */
.merge-choice-note[b-cjy0uz3scl] {
    background: #edf2ff;
    color: #4263eb;
    border-radius: 10px;
    padding: 10px 14px;
    font-size: 13px;
    font-weight: 600;
    line-height: 1.45;
}
.merge-choice-note.warning[b-cjy0uz3scl] {
    background: #fff4e6;
    color: #d9480f;
}

/* Add-more: items already on the dispatch being extended */
.boxes .already-dispatched[b-cjy0uz3scl] {
    opacity: 0.55;
    pointer-events: none;
}

/* Why a greyed-out address cannot be dispatched: the business that assigned it said so. */
.dispatch-blocked-reason[b-cjy0uz3scl] {
    margin: 4px 0 0;
    font-size: 12px;
    font-weight: 600;
    color: #B45309;
    white-space: normal;
}

.already-dispatched-badge[b-cjy0uz3scl] {
    display: inline-block;
    background: #e9ecef;
    color: #495057;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 600;
    padding: 1px 8px;
    white-space: nowrap;
}

/* ─── Per-subcontractor message rows (additional settings) ─── */
.recipient-name[b-cjy0uz3scl] {
    font-size: 13px;
    font-weight: 600;
    color: #1E293B;
}

.recipient-customize[b-cjy0uz3scl] {
    background: none;
    border: none;
    padding: 0;
    font-size: 12px;
    color: #0D6EFD;
    cursor: pointer;
}

.recipient-note[b-cjy0uz3scl] {
    min-height: 56px;
}

/* ─── Contractor quick-select rows inside an expanded zone ─── */
.contractor-check-name[b-cjy0uz3scl] {
    font-size: 13px;
    font-weight: 600;
    color: #1E293B;
}

.contractor-checks img[b-cjy0uz3scl] {
    width: 16px;
}

/* Road routes the zone's polygon covers - previewed so the dispatcher sees what rides along. */
.covered-road-routes-hint[b-cjy0uz3scl] {
	color: #5F6E85;
	font-size: 12px;
}

.covered-road-route-chip[b-cjy0uz3scl] {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 2px 10px;
	border: 1px solid #E2E8F0;
	border-radius: 999px;
	font-size: 12px;
	color: #1E293B;
	background: #F8FAFC;
}

.covered-road-route-color[b-cjy0uz3scl] {
	width: 10px;
	height: 10px;
	border-radius: 50%;
	display: inline-block;
}

.covered-road-route-chip--off[b-cjy0uz3scl] {
	opacity: 0.55;
	background: #F1F5F9;
	border-style: dashed;
}

.covered-road-route-chip--off .covered-road-route-color[b-cjy0uz3scl] {
	background: #CBD5E1 !important;
}

.covered-road-route-check[b-cjy0uz3scl] {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 14px;
	height: 14px;
	border: 1px solid #94A3B8;
	border-radius: 4px;
	font-size: 10px;
	font-weight: 700;
	color: #4F46E5;
	background: #FFFFFF;
}

/* An address the popup's address/customer search found: highlighted, with its zone and customer. */
.boxes .zone-search-hit[b-cjy0uz3scl] {
    background: #EEF4FF;
    border-radius: 8px;
    padding-left: 6px;
    padding-right: 6px;
}

.zone-search-hit-details[b-cjy0uz3scl] {
    margin: 4px 0 0;
    display: flex;
    flex-wrap: wrap;
    gap: 4px 8px;
    font-size: 12px;
    white-space: normal;
}

.zone-search-hit-zone[b-cjy0uz3scl] {
    display: inline-block;
    background: #DBE7FF;
    color: #1D4ED8;
    border-radius: 999px;
    font-weight: 600;
    padding: 1px 8px;
}

.zone-search-hit-customer[b-cjy0uz3scl] {
    color: #5F6E85;
    font-weight: 600;
}

/* The routes this work type will not call out. A warning, not a note: those routes are not
   coming, and the addresses only they cover leave the run. */
.zone-excluded-routes[b-cjy0uz3scl] {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    padding: 10px 12px;
    margin-bottom: 12px;
    border-radius: 12px;
    background-color: #FEF3C7;
}

.zone-excluded-routes-title[b-cjy0uz3scl] {
    margin: 0;
    font-size: 13px;
    font-weight: 600;
    color: #92400E;
}

.zone-excluded-routes-body[b-cjy0uz3scl] {
    margin: 2px 0 0 0;
    font-size: 12px;
    color: #92400E;
}
/* /Pages/Dispatch/Components/DeclineReasonPopup.razor.rz.scp.css */
/* WMPopup zeroes the modal body's padding so each host sets its own; without this the field
   sits flush against the dialog edge. */
.decline-reason-body[b-cwxdxi5w9f] {
    padding: 20px 24px 4px;
}

.decline-reason-label[b-cwxdxi5w9f] {
    display: block;
    margin-bottom: 8px;
    font-size: 14px;
    font-weight: 500;
    color: #23262F;
}

.decline-reason-input[b-cwxdxi5w9f] {
    width: 100%;
    min-height: 110px;
    padding: 12px 14px;
    resize: vertical;
    border: 1px solid #EBECED;
    border-radius: 8px;
    font-size: 14px;
    line-height: 20px;
    color: #23262F;
    outline: none;
}

.decline-reason-input[b-cwxdxi5w9f]::placeholder {
    color: #9A9FA5;
}

.decline-reason-input:focus[b-cwxdxi5w9f] {
    border-color: #4A55E1;
}

.decline-reason-input.invalid[b-cwxdxi5w9f] {
    border-color: #E4626F;
}

.decline-reason-meta[b-cwxdxi5w9f] {
    margin-top: 6px;
    min-height: 18px;
}

.decline-reason-error[b-cwxdxi5w9f] {
    font-size: 12px;
    color: #E4626F;
}

.decline-reason-count[b-cwxdxi5w9f] {
    font-size: 12px;
    color: #9A9FA5;
}
/* /Pages/Dispatch/Components/DispatchDetailsSlider.razor.rz.scp.css */
/* Follows FIGMA_HTML_References dispatch.html/style.css: right-side ID-popup details model. */
.dispatchDetailsSlider.right .modal-dialog[b-3w2hw262tn],
.locationDispatchDetailsSlider.ID-popup .modal-dialog[b-3w2hw262tn] {
    position: fixed !important;
    margin: 0 !important;
    right: 0 !important;
    top: 0 !important;
    height: 100% !important;
    min-width: 740px;
    max-width: 912px;
    width: min(912px, calc(100vw - 126px));
}

.dispatchDetailsSlider.z-index-lower[b-3w2hw262tn] {
    z-index: 1049 !important;
}

.dispatchDetailsSlider.z-index-lower .modal-content[b-3w2hw262tn] {
    filter: brightness(0.96);
    box-shadow: -18px 0 46px rgba(15, 23, 42, 0.18);
}

.dds-add-location-list[b-3w2hw262tn] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    max-height: 360px;
    overflow-y: auto;
}

.dds-add-location-row[b-3w2hw262tn] {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 10px 12px;
    border: 1px solid #E2E8F0;
    border-radius: 8px;
    cursor: pointer;
}

.dds-add-location-row span[b-3w2hw262tn] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.dds-add-location-row strong[b-3w2hw262tn],
.dds-add-location-row small[b-3w2hw262tn] {
    overflow-wrap: anywhere;
}

.dds-add-location-row small[b-3w2hw262tn] {
    color: #5F6E85;
}

.dispatchDetailsSlider.right .modal-content[b-3w2hw262tn],
.locationDispatchDetailsSlider.ID-popup .modal-content[b-3w2hw262tn] {
    height: 100vh;
    border-radius: 0;
    border: none;
    display: flex;
    flex-direction: column;
}

.dispatchDetailsSlider.right.fade .modal-dialog[b-3w2hw262tn] {
    transform: translateX(100%) !important;
    transition: transform 0.3s ease-out !important;
}

.dispatchDetailsSlider.right.show .modal-dialog[b-3w2hw262tn] {
    transform: translateX(0) !important;
}

.dispatchDetailsSlider .modal-header[b-3w2hw262tn],
.locationDispatchDetailsSlider.ID-popup .modal-header[b-3w2hw262tn] {
    padding: 16px 24px;
    border: none;
    flex-shrink: 0;
}

.dispatchDetailsSlider .btn-close[b-3w2hw262tn],
.locationDispatchDetailsSlider.ID-popup .btn-close[b-3w2hw262tn] {
    width: 40px;
    height: 40px;
    margin: 0;
    border-radius: 10px;
    background-color: #F1F5F9CC;
    opacity: 1;
}

.locationDispatchDetailsSlider.ID-popup .modal-header .icon-image[b-3w2hw262tn] {
    width: 48px;
    height: 48px;
    border-radius: 10px;
    background-color: #5263FF1F !important;
}

.locationDispatchDetailsSlider.ID-popup .modal-header .icon-image img[b-3w2hw262tn] {
    width: 22px;
    height: 22px;
}

.locationDispatchDetailsSlider.ID-popup .modal-header .modal-title[b-3w2hw262tn] {
    margin: 0;
    color: #1E293B;
    font-size: 24px;
    font-weight: 800;
    line-height: 28px;
    letter-spacing: 0;
}

.locationDispatchDetailsSlider.ID-popup .modal-header .txt p[b-3w2hw262tn] {
    font-size: 18px;
    font-weight: 700;
    line-height: 24px;
    letter-spacing: 0;
    color: #475569;
}

.locationDispatchDetailsSlider.ID-popup .modal-header .txt img[b-3w2hw262tn] {
    height: 16px;
}

.locationDispatchDetailsSlider.ID-popup .modal-header .txt span[b-3w2hw262tn] {
    font-size: 12px;
    font-weight: 600;
    line-height: 16px;
    letter-spacing: 0;
    color: #5F6E85;
}

.dds-header-main[b-3w2hw262tn] {
    min-width: 0;
}

.dds-icon[b-3w2hw262tn] {
    width: 48px;
    height: 48px;
    border-radius: 10px;
    background: #EEF0FF;
    flex-shrink: 0;
}

.dds-icon img[b-3w2hw262tn] {
    width: 22px;
    height: 22px;
}

.dds-title[b-3w2hw262tn] {
    margin: 0;
    color: #1E293B;
    font-size: 18px;
    font-weight: 800;
    line-height: 24px;
    letter-spacing: 0;
}

.dds-header-text[b-3w2hw262tn] {
    min-width: 0;
}

.dds-header-text p[b-3w2hw262tn],
.dds-header-date[b-3w2hw262tn] {
    margin: 2px 0 0;
    color: #5F6E85;
    font-size: 13px;
    font-weight: 600;
    line-height: 20px;
}

.dds-header-date img[b-3w2hw262tn] {
    width: 16px;
    height: 16px;
}

.dds-tabs[b-3w2hw262tn],
.dds-sub-tabs[b-3w2hw262tn] {
    display: flex;
    gap: 6px;
    padding: 6px;
    background: #F1F5F9CC;
    border: 1px solid #1E293B08;
    flex-shrink: 0;
}

.dds-tabs[b-3w2hw262tn] {
    margin: 8px 20px 10px;
    border-radius: 16px;
}

.dds-sub-tabs[b-3w2hw262tn] {
    margin: 0 20px 12px;
    border-radius: 14px;
    overflow-x: auto;
}

.dds-tabs button[b-3w2hw262tn],
.dds-sub-tabs button[b-3w2hw262tn] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-height: 36px;
    border: 1px solid transparent;
    border-radius: 10px;
    background: transparent;
    color: #5F6E85;
    font-size: 13px;
    font-weight: 700;
    white-space: nowrap;
}

.dds-tabs button[b-3w2hw262tn] {
    width: 100%;
}

.dds-sub-tabs button[b-3w2hw262tn] {
    min-width: 104px;
    padding: 7px 10px;
}

.dds-tabs button.active[b-3w2hw262tn],
.dds-sub-tabs button.active[b-3w2hw262tn] {
    background: linear-gradient(180deg, #FFFFFF 0%, #F8FAFC 100%);
    border-color: #1E293B0F;
    color: #1E293B;
    box-shadow: 0 4px 10px #1E293B0F;
}

.dds-tabs img[b-3w2hw262tn],
.dds-sub-tabs img[b-3w2hw262tn] {
    width: 16px;
    height: 16px;
}

.dds-sub-tabs em[b-3w2hw262tn] {
    min-width: 20px;
    min-height: 20px;
    border-radius: 10px;
    background: #E2E8F0;
    color: #475569;
    font-style: normal;
    font-size: 11px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 6px;
}

.dds-sub-tabs button.active em[b-3w2hw262tn] {
    background: #5263FF1F;
    color: #363AF5;
}

.dds-body[b-3w2hw262tn] {
    flex: 1;
    overflow-y: auto;
    padding: 0 !important;
    background: #FFFFFF;
}

.addresses-tab[b-3w2hw262tn] {
    padding: 0 20px 24px;
}

.dds-loading[b-3w2hw262tn] {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 1;
    color: #0D6EFD;
}

.locationDispatchDetailsSlider.ID-popup .modal-body[b-3w2hw262tn] {
    flex: 1;
    padding: 0;
    overflow-y: auto;
    scrollbar-width: none;
    -ms-overflow-style: none;
    background: #FFFFFF;
}

.locationDispatchDetailsSlider.ID-popup .modal-body[b-3w2hw262tn]::-webkit-scrollbar {
    display: none;
}

.locationDispatchDetailsSlider.ID-popup .modal-body .main-tab[b-3w2hw262tn] {
    padding: 0 24px;
}

.locationDispatchDetailsSlider.ID-popup .modal-body .tabs[b-3w2hw262tn] {
    background-color: #F1F5F9CC;
    border: 1px #1E293B08 solid;
    border-radius: 16px;
    padding: 6px;
    gap: 6px;
}

.locationDispatchDetailsSlider.ID-popup .modal-body .tabs button[b-3w2hw262tn] {
    gap: 2px;
    border: 1px transparent solid;
    outline: none;
    border-radius: 10px;
    padding: 6px;
    background-color: transparent;
}

.locationDispatchDetailsSlider.ID-popup .modal-body .tabs button.active[b-3w2hw262tn] {
    background-color: #FFFFFF;
    box-shadow: 0 3px 3px -1.5px #1E293B08;
    border-color: #1E293B1F;
}

.locationDispatchDetailsSlider.ID-popup .modal-body .tabs button img[b-3w2hw262tn] {
    height: 18px;
}

.locationDispatchDetailsSlider.ID-popup .modal-body .tabs button span[b-3w2hw262tn] {
    font-size: 13px;
    font-weight: 600;
    line-height: 24px;
    letter-spacing: 0;
    color: #475569;
}

.locationDispatchDetailsSlider.ID-popup .modal-body .tabs button.active span[b-3w2hw262tn] {
    color: #1E293B;
}

.locationDispatchDetailsSlider.ID-popup .modal-body .addresses-tab[b-3w2hw262tn] {
    padding: 0;
}

.locationDispatchDetailsSlider.ID-popup .modal-body .multi-tabs[b-3w2hw262tn] {
    border-bottom: 1px #1E293B17 solid;
    gap: 0 !important;
    margin-top: 16px !important;
    overflow-x: auto;
}

.locationDispatchDetailsSlider.ID-popup .modal-body .multi-tabs button[b-3w2hw262tn] {
    background-color: transparent;
    border: none;
    outline: none;
    border-radius: 0;
    padding: 4px 5px 12px 5px;
    min-width: 123px;
    width: 123px;
}

.locationDispatchDetailsSlider.ID-popup .modal-body .multi-tabs button.active[b-3w2hw262tn] {
    border-bottom: 2px #5263FF solid;
    background: transparent;
}

.locationDispatchDetailsSlider.ID-popup .modal-body .multi-tabs button p[b-3w2hw262tn],
.locationDispatchDetailsSlider.ID-popup .modal-body .multi-tabs button span[b-3w2hw262tn] {
    font-size: 13px;
    line-height: 24px;
    letter-spacing: 0;
}

.locationDispatchDetailsSlider.ID-popup .modal-body .title-line[b-3w2hw262tn] {
    padding: 8px 24px;
    margin: 0 !important;
    border-bottom: 1px #1E293B17 solid;
}

.locationDispatchDetailsSlider.ID-popup .modal-body .title-line div p[b-3w2hw262tn] {
    font-size: 15px;
    font-weight: 600;
    line-height: 24px;
    letter-spacing: 0;
    color: #475569;
}

.locationDispatchDetailsSlider.ID-popup .modal-body .title-line button.add-more-btn[b-3w2hw262tn] {
    padding: 8px 12px;
    background-color: #5263FF1F;
    border-radius: 8px;
    border: none;
    outline: none;
    font-size: 12px;
    font-weight: 600;
    line-height: 16px;
    letter-spacing: 0;
    color: #363AF5;
}

.locationDispatchDetailsSlider.ID-popup .modal-body .title-line button.expand-btn[b-3w2hw262tn] {
    font-size: 13px;
    font-weight: 600;
    line-height: 20px;
    letter-spacing: 0;
    color: #5263FF;
    background-color: transparent;
    border: none;
    outline: none;
    text-decoration: underline;
    text-decoration-color: #5263ff5b;
    text-decoration-thickness: 2px;
    text-underline-offset: 3px;
}

.locationDispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian .cstm-data.open[b-3w2hw262tn] {
    max-height: none;
    overflow: visible;
}

.locationDispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian .cstm-title .right-title .arrow[b-3w2hw262tn] {
    border: none;
}

.locationDispatchDetailsSlider.ID-popup .modal-body .details-tab .overview-multi-tab .box-4 .file-name a[b-3w2hw262tn] {
    font-size: 13px;
    font-weight: 600;
    line-height: 20px;
    letter-spacing: 0;
    color: #5263FF;
    text-decoration: underline;
    text-decoration-color: #5263ff5b;
    text-decoration-thickness: 2px;
    text-underline-offset: 3px;
}

.own-route-popup .addresses-tab .all-multi-tab-second[b-3w2hw262tn] {
    display: block;
}

.own-route-popup .addresses-tab .error-top-line[b-3w2hw262tn] {
    padding: 8px 24px;
    background-color: #ED40301F;
}

.own-route-popup .addresses-tab .error-top-line div img[b-3w2hw262tn] {
    height: 20px;
}

.own-route-popup .addresses-tab .error-top-line div p[b-3w2hw262tn] {
    margin: 0;
    font-size: 13px;
    font-weight: 600;
    line-height: 20px;
    letter-spacing: 0;
    color: #B82213;
}

.own-route-popup .addresses-tab .error-top-line button.assign-btn[b-3w2hw262tn] {
    background-color: #B82213;
    border: 1px #1E293B17 solid;
    border-radius: 8px;
    outline: none;
    box-shadow: 0 1px 1px -0.5px #1E293B08;
    padding: 8px 12px;
    font-size: 12px;
    font-weight: 600;
    line-height: 16px;
    letter-spacing: 0;
    color: #FFFFFF;
}

/* The route/address view's error box: one compact row per stop the list's error chip counts. */
.own-route-popup .addresses-tab .dds-stop-errors[b-3w2hw262tn] {
    padding: 8px 24px;
    background-color: #ED40300F;
    border-bottom: 1px #1E293B0F solid;
}

.own-route-popup .addresses-tab .dds-stop-error-row[b-3w2hw262tn] {
    padding: 6px 0;
}

.own-route-popup .addresses-tab .dds-stop-error-row + .dds-stop-error-row[b-3w2hw262tn] {
    border-top: 1px #1E293B0F solid;
}

.own-route-popup .addresses-tab .dds-stop-error-row img[b-3w2hw262tn] {
    height: 18px;
}

.own-route-popup .addresses-tab .dds-stop-error-row strong[b-3w2hw262tn],
.own-route-popup .addresses-tab .dds-stop-error-row span[b-3w2hw262tn] {
    display: block;
    font-size: 12px;
    line-height: 16px;
}

.own-route-popup .addresses-tab .dds-stop-error-row strong[b-3w2hw262tn] {
    font-weight: 600;
    color: #1E293B;
}

.own-route-popup .addresses-tab .dds-stop-error-row span[b-3w2hw262tn] {
    color: #B82213;
}

.own-route-popup .addresses-tab .dds-stop-error-row button.dds-stop-error-action[b-3w2hw262tn] {
    flex-shrink: 0;
    background-color: #FFFFFF;
    border: 1px #1E293B17 solid;
    border-radius: 8px;
    padding: 6px 10px;
    font-size: 12px;
    font-weight: 600;
    line-height: 16px;
    color: #B82213;
}

.own-route-popup .addresses-tab .add-location-txt[b-3w2hw262tn] {
    background-color: #F8FAFC;
    border-bottom: 1px #1E293B0F solid;
    padding: 16px 24px;
}

.own-route-popup .addresses-tab .add-location-txt div p[b-3w2hw262tn] {
    margin: 0;
    font-size: 15px;
    font-weight: 700;
    line-height: 24px;
    letter-spacing: 0;
    color: #475569;
}

.own-route-popup .addresses-tab .add-location-txt div span[b-3w2hw262tn] {
    font-size: 13px;
    font-weight: 500;
    line-height: 24px;
    letter-spacing: 0;
    color: #5F6E85;
}

.own-route-popup .addresses-tab .add-location-txt button.add-locations[b-3w2hw262tn] {
    background-color: #5263FF;
    padding: 8px 12px;
    border: 1px #1E293B17 solid;
    border-radius: 8px;
    outline: none;
    font-size: 12px;
    font-weight: 600;
    line-height: 16px;
    letter-spacing: 0;
    color: #FFFFFF;
    white-space: nowrap;
}

.own-route-popup .addresses-tab .pannel[b-3w2hw262tn] {
    padding: 12px 24px;
    border-bottom: 1px #1E293B17 solid;
}

.own-route-popup .addresses-tab .pannel:hover[b-3w2hw262tn] {
    background-color: #5263FF1F;
    cursor: pointer;
}

.own-route-popup .addresses-tab .pannel img.drag-icon[b-3w2hw262tn] {
    height: 20px;
    cursor: grab;
}

.own-route-popup .addresses-tab .pannel.is-dragging[b-3w2hw262tn] {
    opacity: 0.5;
}

.own-route-popup .addresses-tab .pannel.is-drop-target[b-3w2hw262tn] {
    background-color: #5263FF1F;
    box-shadow: inset 0 -2px 0 0 #5263FF;
}

.own-route-popup .addresses-tab .pannel .txt img[b-3w2hw262tn] {
    height: 20px;
}

.own-route-popup .addresses-tab .pannel .txt p[b-3w2hw262tn] {
    margin: 0;
    font-size: 13px;
    font-weight: 600;
    line-height: 20px;
    letter-spacing: 0;
    color: #1E293B;
}

.own-route-popup .addresses-tab .pannel .txt span[b-3w2hw262tn] {
    font-size: 13px;
    font-weight: 500;
    line-height: 20px;
    letter-spacing: 0;
    color: #475569;
}

.own-route-popup .addresses-tab .pannel .images img[b-3w2hw262tn] {
    height: 20px;
}

.own-route-popup .addresses-tab .pannel .all-bagees .bagee[b-3w2hw262tn] {
    display: inline-flex;
    align-items: center;
    flex-shrink: 0;
    white-space: nowrap;
    padding: 4px 6px;
    border-radius: 8px;
    gap: 2px;
}

.own-route-popup .addresses-tab .pannel .all-bagees .bagee img[b-3w2hw262tn] {
    height: 14px;
}

.own-route-popup .addresses-tab .pannel .all-bagees .bagee p[b-3w2hw262tn] {
    margin: 0;
    font-size: 12px;
    font-weight: 600;
    line-height: 16px;
    letter-spacing: 0;
    padding: 0 2px;
}

.own-route-popup .addresses-tab .pannel .all-bagees .bagee.blue[b-3w2hw262tn] {
    background-color: #5263FF1F;
}

.own-route-popup .addresses-tab .pannel .all-bagees .bagee.blue p[b-3w2hw262tn] {
    color: #363AF5;
}

.own-route-popup .addresses-tab .pannel .all-bagees .bagee.green[b-3w2hw262tn] {
    background-color: #409B3F1F;
}

.own-route-popup .addresses-tab .pannel .all-bagees .bagee.green p[b-3w2hw262tn] {
    color: #296C28;
}

.own-route-popup .addresses-tab .pannel .all-bagees .bagee.red[b-3w2hw262tn] {
    background-color: #ED40301F;
}

.own-route-popup .addresses-tab .pannel .all-bagees .bagee.red p[b-3w2hw262tn] {
    color: #B82213;
}

.own-route-popup .addresses-tab .pannel .all-bagees .bagee.gray[b-3w2hw262tn] {
    background-color: #F1F5F9CC;
    border: 1px #1E293B08 solid;
}

.own-route-popup .addresses-tab .pannel .all-bagees .bagee.gray p[b-3w2hw262tn] {
    color: #1E293B;
}

.own-route-popup .addresses-tab .pannel .all-bagees .bagee.white[b-3w2hw262tn] {
    background-color: #FFFFFF;
    border: 1px #1E293B17 solid;
    box-shadow: 0 2px 1.5px -0.5px #1E293B08;
}

.own-route-popup .addresses-tab .pannel .all-bagees .bagee.white p[b-3w2hw262tn] {
    color: #475569;
}

/* A stop the assigned business turned down: same palette as the declined chips of the
   zone view, so the refusal reads the same wherever it appears. */
.own-route-popup .addresses-tab .pannel .all-bagees .bagee.declined[b-3w2hw262tn] {
    background-color: #FCE9EB;
    border: 1px #1E293B08 solid;
}

.own-route-popup .addresses-tab .pannel .all-bagees .bagee.declined p[b-3w2hw262tn] {
    color: #C0392F;
}

.dds-section[b-3w2hw262tn] {
    padding: 16px 24px;
    border-top: 1px solid #F1F5F9;
}

.dds-section h6[b-3w2hw262tn] {
    margin: 0 0 12px;
    color: #1E293B;
    font-size: 15px;
    font-weight: 800;
    line-height: 20px;
}

.dds-section h6 span[b-3w2hw262tn] {
    color: #5F6E85;
}

.dds-section-title-row[b-3w2hw262tn] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 12px;
}

.dds-section-title-row p[b-3w2hw262tn] {
    margin: 0 0 2px;
    color: #5F6E85;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0;
}

.multi-tabs[b-3w2hw262tn] {
    gap: 8px !important;
    margin-top: 4px !important;
    overflow-x: auto;
    padding-bottom: 2px;
}

.multi-tabs button[b-3w2hw262tn] {
    min-height: 34px;
    border: 1px solid #E2E8F0;
    border-radius: 9px;
    background: #FFFFFF;
    color: #5F6E85;
    padding: 7px 10px;
    font-size: 12px;
    font-weight: 700;
    white-space: nowrap;
}

.multi-tabs button p[b-3w2hw262tn] {
    margin: 0;
}

.multi-tabs button span[b-3w2hw262tn] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 20px;
    height: 20px;
    border-radius: 10px;
    background: #F1F5F9;
    color: #475569;
    padding: 0 6px;
    font-size: 11px;
    font-weight: 800;
}

.multi-tabs button.active[b-3w2hw262tn] {
    border-color: #5263FF33;
    background: #5263FF1F;
    color: #363AF5;
}

.multi-tabs button.active span[b-3w2hw262tn] {
    background: #FFFFFF;
    color: #363AF5;
}

.title-line[b-3w2hw262tn] {
    margin-top: 18px !important;
    margin-bottom: 10px;
}

.title-line p[b-3w2hw262tn] {
    margin: 0;
    color: #5F6E85;
    font-size: 11px;
    font-weight: 800;
    line-height: 16px;
    text-transform: uppercase;
}

.add-more-btn[b-3w2hw262tn],
.expand-btn[b-3w2hw262tn] {
    color: #363AF5 !important;
    font-size: 13px;
    font-weight: 700;
    line-height: 18px;
    text-decoration: none;
}

.id-cstn-accordian[b-3w2hw262tn] {
    margin-bottom: 10px !important;
}

.id-cstn-accordian .accordion-item[b-3w2hw262tn] {
    overflow: visible;
    border: 1px solid #E2E8F0;
    border-radius: 12px;
    background: #FFFFFF;
}

.id-cstn-accordian .accordion-header[b-3w2hw262tn] {
    margin: 0;
}

.id-cstn-accordian .accordion-button[b-3w2hw262tn] {
    min-height: 60px;
    border-radius: 12px !important;
    background: #FFFFFF;
    color: #1E293B;
    padding: 12px 16px;
    box-shadow: none;
}

.id-cstn-accordian .accordion-button:not(.collapsed)[b-3w2hw262tn] {
    color: #1E293B;
    background: #FFFFFF;
    box-shadow: inset 0 -1px 0 #F1F5F9;
}

.id-cstn-accordian .accordion-button[b-3w2hw262tn]::after {
    width: 14px;
    height: 14px;
    background-size: 14px;
}

.id-cstn-accordian .accordion-body[b-3w2hw262tn] {
    padding: 12px !important;
    background: #FFFFFF;
    border-radius: 0 0 12px 12px;
}

.id-cstn-accordian .progress[b-3w2hw262tn] {
    overflow: hidden;
    border-radius: 999px;
    background: #E2E8F0;
}

.dds-actions[b-3w2hw262tn] {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

.dds-action[b-3w2hw262tn] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 36px;
    border: none;
    border-radius: 8px;
    padding: 8px 12px;
    font-size: 13px;
    font-weight: 700;
}

.dds-action:disabled[b-3w2hw262tn] {
    opacity: 0.55;
    cursor: not-allowed;
}

.dds-action img[b-3w2hw262tn] {
    width: 16px;
    height: 16px;
}

.dds-action.complete[b-3w2hw262tn] {
    color: #296C28;
    background: #409B3F1F;
}

.dds-action.neutral[b-3w2hw262tn] {
    color: #1E293B;
    background: #F1F5F9;
}

.dds-action.danger[b-3w2hw262tn] {
    color: #DC2626;
    background: #FEE2E2;
}

.dds-action-message[b-3w2hw262tn] {
    margin: 8px 0 12px;
    padding: 10px 12px;
    border: 1px solid #BFDBFE;
    border-radius: 8px;
    background: #EFF6FF;
    color: #1D4ED8;
    font-size: 13px;
    font-weight: 700;
    line-height: 20px;
}

.dds-detail-grid[b-3w2hw262tn] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

.dds-detail-item[b-3w2hw262tn] {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    min-width: 0;
}

.dds-detail-item img[b-3w2hw262tn] {
    width: 20px;
    height: 20px;
    flex-shrink: 0;
}

.dds-detail-item p[b-3w2hw262tn] {
    margin: 0 0 2px;
    color: #5F6E85;
    font-size: 12px;
    font-weight: 700;
    line-height: 16px;
}

.dds-detail-item span[b-3w2hw262tn] {
    color: #1E293B;
    font-size: 13px;
    font-weight: 700;
    line-height: 20px;
    overflow-wrap: anywhere;
}

.dds-chip-list[b-3w2hw262tn],
.dds-address-list[b-3w2hw262tn],
.dds-settings-list[b-3w2hw262tn],
.dds-file-list[b-3w2hw262tn] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.dds-chip-list[b-3w2hw262tn],
.dds-file-list[b-3w2hw262tn] {
    flex-direction: row;
    flex-wrap: wrap;
}

.dds-chip[b-3w2hw262tn],
.dds-file-pill[b-3w2hw262tn] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    min-height: 24px;
    padding: 4px 8px;
    border-radius: 8px;
    background: #5263FF1F;
    color: #363AF5;
    font-size: 12px;
    font-weight: 700;
    line-height: 16px;
    text-decoration: none;
}

.dds-chip.warning[b-3w2hw262tn] {
    background: #FEE2E2;
    color: #DC2626;
}

.dds-chip img[b-3w2hw262tn],
.dds-file-pill img[b-3w2hw262tn] {
    width: 14px;
    height: 14px;
}

.dds-address-row[b-3w2hw262tn] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    padding: 16px;
    border: 1px solid #E2E8F0;
    border-radius: 10px;
    background: #FFFFFF;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.03);
}

.dds-address-main[b-3w2hw262tn] {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    min-width: 0;
}

.dds-address-index[b-3w2hw262tn] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 8px;
    background: #F1F5F9;
    color: #475569;
    font-size: 13px;
    font-weight: 800;
    flex-shrink: 0;
}

.dds-address-title[b-3w2hw262tn] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.dds-address-title strong[b-3w2hw262tn] {
    color: #1E293B;
    font-size: 14px;
    font-weight: 700;
    line-height: 20px;
    overflow-wrap: anywhere;
}

.dds-address-line[b-3w2hw262tn] {
    color: #5F6E85;
    font-size: 12px;
    font-weight: 600;
    margin-top: 2px;
}

.dds-address-meta[b-3w2hw262tn] {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
    margin-top: 8px;
}

.dds-meta-pill[b-3w2hw262tn] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    min-height: 26px;
    padding: 4px 9px;
    border: 1px solid #E2E8F0;
    border-radius: 7px;
    background: #FFFFFF;
    color: #1E293B;
    font-size: 12px;
    font-weight: 700;
    line-height: 16px;
}

.dds-meta-pill.danger[b-3w2hw262tn] {
    border-color: #FCA5A5;
    background: #FFF1F2;
    color: #EF4444;
}

.dds-driver-pill[b-3w2hw262tn] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    min-height: 24px;
    padding: 3px 8px;
    border: 1px solid #E2E8F0;
    border-radius: 7px;
    background: #FFFFFF;
    color: #1E293B;
    font-size: 12px;
    font-weight: 700;
}

.dds-driver-pill img[b-3w2hw262tn] {
    width: 18px;
    height: 18px;
    border-radius: 50%;
    object-fit: cover;
}

.dds-driver-action[b-3w2hw262tn] {
    cursor: pointer;
}

.dds-driver-action:hover[b-3w2hw262tn],
.dds-driver-action:focus-visible[b-3w2hw262tn] {
    filter: brightness(0.98);
    box-shadow: 0 0 0 2px #FCA5A533;
}

.dds-driver-location-list[b-3w2hw262tn],
.dds-invite-driver-list[b-3w2hw262tn],
.dds-driver-list[b-3w2hw262tn] {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.dds-driver-location-card[b-3w2hw262tn] {
    border: 1px solid #E2E8F0;
    border-radius: 10px;
    background: #FFFFFF;
    padding: 12px;
}

.dds-driver-location-head[b-3w2hw262tn] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 10px;
}

.dds-driver-location-head > div[b-3w2hw262tn] {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.dds-driver-location-head strong[b-3w2hw262tn] {
    color: #1E293B;
    font-size: 13px;
    font-weight: 800;
    line-height: 20px;
    overflow-wrap: anywhere;
}

.dds-driver-location-head span[b-3w2hw262tn],
.dds-driver-empty[b-3w2hw262tn],
.dds-invite-driver-contact span[b-3w2hw262tn] {
    color: #5F6E85;
    font-size: 12px;
    font-weight: 600;
    line-height: 18px;
}

.dds-driver-empty[b-3w2hw262tn] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 28px;
    color: #EF4444;
    font-weight: 700;
}

.dds-driver-empty img[b-3w2hw262tn] {
    width: 16px;
    height: 16px;
}

.dds-driver-row[b-3w2hw262tn],
/* Segmented accept/deny answer control: equal halves joined in the middle, green
   accept with rounded left, red deny with rounded right; once answered, the
   unselected half fades so the recorded answer stands out. */
.dds-driver-answer[b-3w2hw262tn] {
    display: inline-flex;
    align-items: stretch;
}

.dds-driver-answer button[b-3w2hw262tn] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 78px;
    min-height: 30px;
    padding: 6px 10px;
    border: none;
    border-radius: 0;
    font-size: 12px;
    font-weight: 600;
    color: #FFFFFF;
    white-space: nowrap;
}

.dds-driver-answer button.accept[b-3w2hw262tn] {
    background: #337C33;
    border-radius: 8px 0 0 8px;
}

.dds-driver-answer button.deny[b-3w2hw262tn] {
    background: #B82213;
    border-radius: 0 8px 8px 0;
}

.dds-driver-answer.answered button:not(.selected)[b-3w2hw262tn] {
    opacity: 0.5;
}

.dds-driver-toggle.gray[b-3w2hw262tn] {
    background: #F1F5F9;
    color: #475569;
}

.dds-invite-driver-row[b-3w2hw262tn] {
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr) auto auto;
    align-items: center;
    gap: 10px;
    min-height: 54px;
    padding: 8px 10px;
    border: 1px solid #E2E8F0;
    border-radius: 9px;
    background: #F8FAFC;
}

.dds-driver-row > img[b-3w2hw262tn],
.dds-invite-driver-row > img[b-3w2hw262tn] {
    width: 34px;
    height: 34px;
    border-radius: 50%;
    object-fit: cover;
    background: #E2E8F0;
}

.dds-driver-row div[b-3w2hw262tn],
.dds-invite-driver-name[b-3w2hw262tn] {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 1px;
}

.dds-driver-row strong[b-3w2hw262tn],
.dds-invite-driver-name strong[b-3w2hw262tn] {
    color: #1E293B;
    font-size: 13px;
    font-weight: 800;
    line-height: 18px;
    overflow-wrap: anywhere;
}

.dds-driver-row .dds-driver-name-line[b-3w2hw262tn] {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
}

.dds-driver-row .dds-driver-business[b-3w2hw262tn] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    width: fit-content;
    padding: 2px 7px;
    border-radius: 999px;
    background: #EEF2FF;
    color: #363AF5;
    font-size: 11px;
    font-weight: 700;
    line-height: 16px;
}

.dds-driver-business img[b-3w2hw262tn] {
    width: 12px;
    height: 12px;
}

.dds-driver-row span[b-3w2hw262tn],
.dds-invite-driver-name span[b-3w2hw262tn] {
    color: #5F6E85;
    font-size: 12px;
    font-weight: 600;
    line-height: 16px;
    overflow-wrap: anywhere;
}

.dds-driver-remove[b-3w2hw262tn],
.dds-driver-toggle[b-3w2hw262tn] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 30px;
    border: none;
    border-radius: 8px;
    padding: 6px 10px;
    background: #5263FF1F;
    color: #363AF5;
    font-size: 12px;
    font-weight: 800;
}

.dds-driver-toggle.remove[b-3w2hw262tn] {
    background: #FEE2E2;
    color: #DC2626;
}

.dds-driver-remove[b-3w2hw262tn] {
    width: 30px;
    padding: 0;
    background: #FEE2E2;
}

.dds-driver-remove img[b-3w2hw262tn] {
    width: 14px;
    height: 14px;
}

.dds-driver-popup-search span[b-3w2hw262tn] {
    color: #5F6E85;
    font-size: 12px;
    font-weight: 800;
    white-space: nowrap;
}

.dds-location-notes[b-3w2hw262tn] {
    display: flex;
    flex-direction: column;
    gap: 3px;
    margin-top: 8px;
    color: #475569;
    font-size: 12px;
    line-height: 18px;
}

.dds-location-notes p[b-3w2hw262tn] {
    margin: 0;
}

.dds-row-actions[b-3w2hw262tn] {
    position: relative;
    flex-shrink: 0;
    z-index: 2;
}

.dds-kebab[b-3w2hw262tn] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border: 0;
    border-radius: 8px;
    background: transparent;
}

.dds-kebab:hover[b-3w2hw262tn],
.dds-kebab:focus-visible[b-3w2hw262tn] {
    background: #F1F5F9;
}

.dds-kebab img[b-3w2hw262tn] {
    width: 16px;
    height: 16px;
}

.dds-location-menu[b-3w2hw262tn] {
    position: absolute;
    top: calc(100% + 6px);
    right: 0;
    z-index: 50;
    min-width: 190px;
    padding: 6px;
    border: 1px solid #E2E8F0;
    border-radius: 10px;
    background: #FFFFFF;
    box-shadow: 0 12px 32px rgba(30, 41, 59, 0.14);
}

.dds-location-menu button[b-3w2hw262tn] {
    width: 100%;
    border: none;
    border-radius: 8px;
    background: transparent;
    padding: 8px;
    text-align: left;
    color: #1E293B;
    font-size: 12px;
    font-weight: 700;
}

.dds-location-menu button:hover[b-3w2hw262tn] {
    background: #F1F5F9;
}

.dds-location-menu button.danger[b-3w2hw262tn] {
    color: #DC2626;
}

.dds-settings-list div[b-3w2hw262tn] {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 12px;
    border-radius: 8px;
    background: #F8FAFC;
    color: #475569;
    font-size: 13px;
}

.dds-table-wrap[b-3w2hw262tn] {
    overflow-x: auto;
}

.dds-table-wrap table[b-3w2hw262tn] {
    width: 100%;
    border-collapse: collapse;
    color: #1E293B;
    font-size: 13px;
}

.dds-table-wrap th[b-3w2hw262tn],
.dds-table-wrap td[b-3w2hw262tn] {
    padding: 10px 12px;
    border-bottom: 1px solid #E2E8F0;
    text-align: left;
}

.dds-table-wrap th[b-3w2hw262tn] {
    color: #5F6E85;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0;
}

.dds-empty[b-3w2hw262tn] {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 120px;
    border: 1px dashed #CBD5E1;
    border-radius: 8px;
    background: #F8FAFC;
    color: #5F6E85;
    font-size: 13px;
    font-weight: 700;
    text-align: center;
    padding: 16px;
}

.dds-empty.compact[b-3w2hw262tn] {
    min-height: 56px;
}

/* ---- Worked-time box: "00:01 - 04:00" on the left, "3H 59M" on the right ---- */
.worked-time-box[b-3w2hw262tn] {
    padding: 6px 10px;
    border: 1px solid #E2E8F0;
    border-radius: 8px;
    background: #F8FAFC;
    white-space: nowrap;
}

.worked-time-box .worked-time-range[b-3w2hw262tn] {
    font-size: 12px;
    font-weight: 600;
    line-height: 16px;
    letter-spacing: -0.2px;
    color: #5F6E85;
}

.worked-time-box .worked-time-total[b-3w2hw262tn] {
    font-size: 12px;
    font-weight: 700;
    line-height: 16px;
    letter-spacing: -0.2px;
    color: #0F172A;
}

.dds-worked-time-list[b-3w2hw262tn] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin-top: 12px;
}

.dds-worked-time-row strong[b-3w2hw262tn] {
    font-size: 13px;
    font-weight: 600;
    color: #0F172A;
}

.dds-empty.tall[b-3w2hw262tn] {
    min-height: 280px;
    flex-direction: column;
    gap: 6px;
}

.dds-empty.tall h6[b-3w2hw262tn],
.dds-empty.tall p[b-3w2hw262tn] {
    margin: 0;
}

.dds-empty.tall p[b-3w2hw262tn] {
    max-width: 420px;
    font-weight: 600;
    line-height: 20px;
}

.dds-confirm-body[b-3w2hw262tn] {
    padding: 0 20px 16px;
}

.dds-confirm-body p[b-3w2hw262tn] {
    margin: 0 0 12px;
    color: #5F6E85;
    font-size: 14px;
    font-weight: 600;
}

.dds-confirm-context[b-3w2hw262tn] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 12px;
    border-radius: 8px;
    background: #F8FAFC;
    color: #1E293B;
    font-size: 13px;
}

[b-3w2hw262tn] .dds-complete-dispatch-popup .modal-dialog {
    min-width: min(480px, calc(100vw - 32px)) !important;
}

[b-3w2hw262tn] .dds-complete-dispatch-popup .wm-popup-modal-content {
    padding: 0 !important;
    border: 1px solid rgba(30, 41, 59, 0.03) !important;
    border-radius: 20px !important;
    background: #FFFFFF !important;
    box-shadow:
        0 1px 1px -0.5px rgba(30, 41, 59, 0.03),
        0 3px 3px -1.5px rgba(30, 41, 59, 0.03),
        0 20px 20px -12px rgba(30, 41, 59, 0.03),
        0 32px 32px -16px rgba(30, 41, 59, 0.03) !important;
}

[b-3w2hw262tn] .dds-complete-dispatch-popup .modal-header {
    min-height: 80px;
    padding: 16px 20px !important;
    align-items: flex-end !important;
    border-bottom: 0 !important;
}

[b-3w2hw262tn] .dds-complete-dispatch-popup .wm-popup-header-section {
    gap: 4px;
}

[b-3w2hw262tn] .dds-complete-dispatch-popup .modal-header h5.modal-title {
    margin: 0 !important;
    color: #1E293B !important;
    font-size: 18px !important;
    font-weight: 700 !important;
    line-height: 24px !important;
    letter-spacing: -0.2px !important;
}

[b-3w2hw262tn] .dds-complete-dispatch-popup .wm-popup-header-subtext {
    margin: 0 !important;
    color: #5F6E85 !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    line-height: 20px !important;
    letter-spacing: -0.2px !important;
}

[b-3w2hw262tn] .dds-complete-dispatch-popup .modal-header .btn-close {
    position: absolute;
    top: 12px;
    right: 12px;
    width: 32px !important;
    height: 32px !important;
    margin: 0 !important;
    border: 1px solid rgba(30, 41, 59, 0.06) !important;
    border-radius: 8px !important;
    background-color: rgba(241, 245, 249, 0.8) !important;
    opacity: 1 !important;
}

[b-3w2hw262tn] .dds-complete-dispatch-popup .modal-body {
    display: none !important;
}

[b-3w2hw262tn] .dds-complete-dispatch-popup .wm-popup-modal-footer {
    min-height: 72px;
    padding: 16px 20px !important;
    gap: 12px !important;
    border-top: 1px solid rgba(30, 41, 59, 0.09) !important;
    background: #FFFFFF !important;
}

[b-3w2hw262tn] .dds-complete-dispatch-popup .wm-popup-modal-footer button {
    min-height: 40px;
    border-radius: 10px;
    font-size: 13px;
    font-weight: 600;
    line-height: 24px;
    letter-spacing: -0.2px;
}

[b-3w2hw262tn] .dds-complete-dispatch-popup .wm-popup-modal-footer .btn-wm-secondary {
    border: 1px solid rgba(30, 41, 59, 0.06);
    background: rgba(241, 245, 249, 0.8);
    color: #1E293B;
}

[b-3w2hw262tn] .dds-complete-dispatch-popup .wm-popup-modal-footer .btn-wm-primary {
    border: none;
    background: #296C28;
    color: #FFFFFF;
    box-shadow: 0 1px 1px -0.5px rgba(30, 41, 59, 0.03), inset 0 3px 3px rgba(255, 255, 255, 0.12);
}

[b-3w2hw262tn] .dds-cancel-dispatch-popup .modal-dialog {
    min-width: min(480px, calc(100vw - 32px)) !important;
}

[b-3w2hw262tn] .dds-cancel-dispatch-popup .wm-popup-modal-content {
    padding: 0 !important;
    border: 1px solid rgba(30, 41, 59, 0.03) !important;
    border-radius: 20px !important;
    background: #FFFFFF !important;
    box-shadow:
        0 1px 1px -0.5px rgba(30, 41, 59, 0.03),
        0 3px 3px -1.5px rgba(30, 41, 59, 0.03),
        0 20px 20px -12px rgba(30, 41, 59, 0.03),
        0 32px 32px -16px rgba(30, 41, 59, 0.03) !important;
}

[b-3w2hw262tn] .dds-cancel-dispatch-popup .modal-header {
    min-height: 80px;
    padding: 16px 20px !important;
    align-items: flex-end !important;
    border-bottom: 0 !important;
}

[b-3w2hw262tn] .dds-cancel-dispatch-popup .wm-popup-header-section {
    gap: 4px;
}

[b-3w2hw262tn] .dds-cancel-dispatch-popup .modal-header h5.modal-title {
    margin: 0 !important;
    color: #1E293B !important;
    font-size: 18px !important;
    font-weight: 700 !important;
    line-height: 24px !important;
    letter-spacing: -0.2px !important;
}

[b-3w2hw262tn] .dds-cancel-dispatch-popup .wm-popup-header-subtext {
    margin: 0 !important;
    color: #5F6E85 !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    line-height: 20px !important;
    letter-spacing: -0.2px !important;
}

[b-3w2hw262tn] .dds-cancel-dispatch-popup .modal-header .btn-close {
    position: absolute;
    top: 12px;
    right: 12px;
    width: 32px !important;
    height: 32px !important;
    margin: 0 !important;
    border: 1px solid rgba(30, 41, 59, 0.06) !important;
    border-radius: 8px !important;
    background-color: rgba(241, 245, 249, 0.8) !important;
    opacity: 1 !important;
}

[b-3w2hw262tn] .dds-cancel-dispatch-popup .modal-body {
    display: none !important;
}

[b-3w2hw262tn] .dds-cancel-dispatch-popup .wm-popup-modal-footer {
    min-height: 72px;
    padding: 16px 20px !important;
    gap: 12px !important;
    border-top: 1px solid rgba(30, 41, 59, 0.09) !important;
    background: #FFFFFF !important;
}

[b-3w2hw262tn] .dds-cancel-dispatch-popup .wm-popup-modal-footer button {
    min-height: 40px;
    border-radius: 10px;
    font-size: 13px;
    font-weight: 600;
    line-height: 24px;
    letter-spacing: -0.2px;
}

[b-3w2hw262tn] .dds-cancel-dispatch-popup .wm-popup-modal-footer .btn-wm-danger-translucent {
    border: none;
    background: rgba(237, 64, 48, 0.12);
    color: #B82213;
}

[b-3w2hw262tn] .dds-cancel-dispatch-popup .wm-popup-modal-footer .btn-wm-primary {
    border: none;
    background: #5263FF;
    color: #FFFFFF;
    box-shadow: 0 1px 1px -0.5px rgba(30, 41, 59, 0.03), inset 0 3px 3px rgba(255, 255, 255, 0.12);
}

/* The change-worktype popup chrome (dialog, content, header, footer) lives in
   WMPopup.razor.css: those elements belong to WMPopup, so this file's ::deep rules
   never reached them (the popup is a top-level sibling with no scoped ancestor). */

.dds-work-type-body[b-3w2hw262tn] {
    display: flex;
    flex-direction: column;
    gap: 16px;
    flex: 1 1 auto;
    min-height: 0;
    padding: 20px;
    overflow: hidden;
}

.dds-work-type-warning[b-3w2hw262tn] {
    margin: 0;
    color: #475569;
    font-size: 15px;
    font-weight: 600;
    line-height: 24px;
    letter-spacing: -0.2px;
}

.dds-work-type-field[b-3w2hw262tn] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin: 0;
}

.dds-work-type-field span[b-3w2hw262tn] {
    color: #1E293B;
    font-size: 13px;
    font-weight: 700;
    line-height: 20px;
    letter-spacing: -0.2px;
}

.dds-work-type-field select[b-3w2hw262tn] {
    min-height: 40px;
    border: 1px solid rgba(30, 41, 59, 0.09);
    border-radius: 10px;
    color: #1E293B;
    font-size: 13px;
    font-weight: 600;
}

.dds-work-type-table[b-3w2hw262tn] {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    min-height: 0;
    border: 1px solid rgba(30, 41, 59, 0.06);
    border-radius: 16px;
    background: #F8FAFC;
    overflow: hidden;
}

.dds-work-type-table-head[b-3w2hw262tn],
.dds-work-type-row[b-3w2hw262tn] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 200px;
}

.dds-work-type-table-head[b-3w2hw262tn] {
    min-height: 44px;
    background: #F1F5F9;
}

.dds-work-type-table-body[b-3w2hw262tn] {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
}

.dds-work-type-row[b-3w2hw262tn] {
    min-height: 56px;
    background: #FFFFFF;
}

.dds-work-type-row:nth-child(even)[b-3w2hw262tn] {
    background: #F8FAFC;
}

.dds-work-type-address-cell[b-3w2hw262tn],
.dds-work-type-subcontractor-cell[b-3w2hw262tn] {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    min-width: 0;
    padding: 8px 16px;
}

.dds-work-type-table-head .dds-work-type-address-cell[b-3w2hw262tn],
.dds-work-type-table-head .dds-work-type-subcontractor-cell[b-3w2hw262tn] {
    align-items: center;
    padding: 12px 16px;
}

.dds-work-type-address-cell[b-3w2hw262tn] {
    border-right: 1px solid rgba(30, 41, 59, 0.06);
}

.dds-work-type-table-head .dds-work-type-address-cell[b-3w2hw262tn] {
    border-bottom: 1px solid rgba(30, 41, 59, 0.06);
}

.dds-work-type-table-head .dds-work-type-subcontractor-cell[b-3w2hw262tn] {
    border-bottom: 1px solid rgba(30, 41, 59, 0.06);
}

.dds-work-type-address-cell input[b-3w2hw262tn] {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.dds-work-type-checkbox[b-3w2hw262tn] {
    position: relative;
    width: 18px;
    height: 18px;
    margin-top: 1px;
    flex: 0 0 18px;
    border: 2px solid rgba(30, 41, 59, 0.12);
    border-radius: 6px;
    background: linear-gradient(180deg, #F1F5F9 0%, #FFFFFF 100%);
    box-shadow: 0 1px 1px -0.5px rgba(30, 41, 59, 0.03), inset 0 3px 3px rgba(255, 255, 255, 0.12);
}

.dds-work-type-checkbox.checked[b-3w2hw262tn] {
    border-color: #5263FF;
    background: #5263FF;
}

.dds-work-type-checkbox.checked[b-3w2hw262tn]::after {
    content: "";
    position: absolute;
    left: 4px;
    top: 2px;
    width: 6px;
    height: 9px;
    border: solid #FFFFFF;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}

.dds-work-type-checkbox.partial[b-3w2hw262tn] {
    border-color: rgba(82, 99, 255, 0.2);
    background: rgba(82, 99, 255, 0.2);
}

.dds-work-type-checkbox.partial[b-3w2hw262tn]::after {
    left: 4px;
    top: 6px;
    width: 8px;
    height: 2px;
    border: 0;
    background: #5263FF;
    transform: none;
}

.dds-work-type-location-text[b-3w2hw262tn] {
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-width: 0;
}

.dds-work-type-location-text strong[b-3w2hw262tn],
.dds-work-type-select-all strong[b-3w2hw262tn],
.dds-work-type-subcontractor-cell strong[b-3w2hw262tn] {
    color: #1E293B;
    font-size: 13px;
    font-weight: 700;
    line-height: 20px;
    letter-spacing: -0.2px;
}

.dds-work-type-location-text small[b-3w2hw262tn] {
    color: #475569;
    font-size: 13px;
    font-weight: 500;
    line-height: 20px;
    letter-spacing: -0.2px;
}

.dds-work-type-location-text strong[b-3w2hw262tn],
.dds-work-type-location-text small[b-3w2hw262tn],
.dds-work-type-subcontractor-cell span[b-3w2hw262tn] {
    overflow-wrap: anywhere;
}

.dds-work-type-subcontractor-cell img[b-3w2hw262tn] {
    width: 16px;
    height: 16px;
}

.dds-work-type-subcontractor-cell span[b-3w2hw262tn] {
    color: #1E293B;
    font-size: 13px;
    font-weight: 600;
    line-height: 20px;
    letter-spacing: -0.2px;
}

@media (max-width: 640px) {
    [b-3w2hw262tn] .dds-change-work-type-popup .wm-popup-modal-content {
        height: calc(100vh - 24px);
    }

    .dds-work-type-table-head[b-3w2hw262tn],
    .dds-work-type-row[b-3w2hw262tn] {
        grid-template-columns: minmax(0, 1fr);
    }

    .dds-work-type-address-cell[b-3w2hw262tn] {
        border-right: 0;
    }

    .dds-work-type-subcontractor-cell[b-3w2hw262tn] {
        padding-top: 0;
    }
}

[b-3w2hw262tn] .dds-active-locations-popup .wm-popup-modal-content {
    padding: 0 !important;
    border-radius: 24px !important;
    background: #FFFFFF;
    overflow: hidden;
    box-shadow: 0 24px 60px rgba(15, 23, 42, 0.18);
}

[b-3w2hw262tn] .dds-active-locations-popup .modal-header {
    padding: 24px 28px 16px !important;
    background: #FFFFFF !important;
    border-bottom: none !important;
}

[b-3w2hw262tn] .dds-active-locations-popup .modal-header h5.modal-title {
    margin: 0 !important;
    color: #111827 !important;
    font-size: 20px !important;
    font-weight: 800 !important;
    line-height: 26px !important;
    letter-spacing: 0 !important;
}

[b-3w2hw262tn] .dds-active-locations-popup .wm-popup-header-subtext {
    max-width: 620px;
    margin: 0 !important;
    color: #5F6E85 !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    line-height: 22px !important;
    letter-spacing: 0 !important;
}

[b-3w2hw262tn] .dds-active-locations-popup .modal-header .btn-close {
    width: 42px !important;
    height: 42px !important;
    margin: 0 !important;
    border-radius: 12px !important;
    background-color: #F8FAFC !important;
    border: 1px solid #E2E8F0 !important;
    opacity: 1 !important;
}

[b-3w2hw262tn] .dds-active-locations-popup .modal-body {
    padding: 0 !important;
    background: #FFFFFF !important;
    border-top: 0 !important;
    /* Neutralize the global ".new-location .modal-body" 900px/scroll container so the
       body hugs its content and the inner location list is the only scroller (otherwise
       a tall empty gap appears between the list and the footer). */
    max-height: none !important;
    overflow: visible !important;
}

[b-3w2hw262tn] .dds-active-locations-popup .wm-popup-modal-footer {
    gap: 16px !important;
    padding: 20px 28px !important;
    border-top: 1px solid #EEF2F7 !important;
    background: #FFFFFF !important;
}

[b-3w2hw262tn] .dds-active-locations-popup .wm-popup-modal-footer button {
    min-height: 48px;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 700;
}

.dds-confirm-body.dds-active-locations-body[b-3w2hw262tn] {
    padding: 0;
}

.dds-add-more-search[b-3w2hw262tn] {
    padding: 0 28px 16px;
    background: #FFFFFF;
}

.dds-add-more-search .search[b-3w2hw262tn] {
    height: 40px;
    margin: 0;
    padding: 0 12px;
    border: 1px solid #D7DEE8;
    border-radius: 10px;
    background: #FFFFFF;
}

.dds-add-more-search .form-control[b-3w2hw262tn] {
    height: 38px;
    padding: 0 6px;
    border: 0;
    box-shadow: none;
    color: #1E293B;
    font-size: 15px;
}

.dds-active-route-list[b-3w2hw262tn] {
    display: flex;
    flex-direction: column;
    max-height: min(488px, calc(100vh - 310px));
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: #CBD5E1 transparent;
    border-top: 1px solid #E7EDF4;
}

.dds-active-route-item[b-3w2hw262tn] {
    background: #FFFFFF;
    border-bottom: 1px solid #EEF2F7;
    transition: background 0.15s ease;
}

.dds-active-route-item:nth-child(even)[b-3w2hw262tn] {
    background: #F8FAFC;
}

.dds-active-route-item:hover[b-3w2hw262tn],
.dds-active-route-item.selected[b-3w2hw262tn] {
    background: #F5F7FF;
}

.dds-active-route-row[b-3w2hw262tn] {
    display: flex;
    align-items: center;
    width: 100%;
    min-height: 64px;
    background: transparent;
}

.dds-active-route-select[b-3w2hw262tn] {
    display: flex;
    align-items: center;
    gap: 12px;
    flex: 1;
    min-width: 0;
    min-height: 64px;
    margin: 0;
    padding: 12px 8px 12px 28px;
    border: 0;
    background: transparent;
    color: inherit;
    font: inherit;
    text-align: left;
}

.dds-active-route-select strong[b-3w2hw262tn] {
    color: #1E293B;
    font-size: 15px;
    font-weight: 800;
    line-height: 21px;
    overflow-wrap: anywhere;
}

.dds-active-route-select small[b-3w2hw262tn] {
    color: #475569;
    font-size: 14px;
    font-weight: 600;
    line-height: 20px;
    overflow-wrap: anywhere;
}

.dds-active-route-toggle[b-3w2hw262tn] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 36px;
    height: 36px;
    margin-right: 24px;
    padding: 0;
    border: 1px solid #E2E8F0;
    border-radius: 9px;
    background: #F8FAFC;
    color: #5F6E85;
}

.dds-active-route-toggle svg[b-3w2hw262tn] {
    transition: transform 0.15s ease;
}

.dds-active-route-toggle.expanded svg[b-3w2hw262tn] {
    transform: rotate(180deg);
}

.dds-active-route-addresses[b-3w2hw262tn] {
    max-height: 220px;
    margin: 0 24px 12px 62px;
    overflow-y: auto;
    border: 1px solid #E2E8F0;
    border-radius: 10px;
    background: #FFFFFF;
    scrollbar-width: thin;
    scrollbar-color: #CBD5E1 transparent;
}

.dds-active-route-address[b-3w2hw262tn] {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    min-width: 0;
    padding: 10px 12px;
    border-bottom: 1px solid #EEF2F7;
}

.dds-active-route-address:last-child[b-3w2hw262tn] {
    border-bottom: 0;
}

.dds-active-route-address img[b-3w2hw262tn] {
    flex-shrink: 0;
    width: 18px;
    height: 18px;
    margin-top: 1px;
}

.dds-active-route-address span[b-3w2hw262tn] {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.dds-active-route-address strong[b-3w2hw262tn],
.dds-active-route-address small[b-3w2hw262tn] {
    overflow-wrap: anywhere;
}

.dds-active-route-address strong[b-3w2hw262tn] {
    color: #1E293B;
    font-size: 13px;
    font-weight: 700;
    line-height: 19px;
}

.dds-active-route-address small[b-3w2hw262tn],
.dds-active-route-address-state[b-3w2hw262tn] {
    color: #5F6E85;
    font-size: 12px;
    font-weight: 600;
    line-height: 18px;
}

.dds-active-route-address-state[b-3w2hw262tn] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 48px;
    padding: 10px 12px;
}

.dds-active-location-picker[b-3w2hw262tn] {
    display: flex;
    flex-direction: column;
    background: #FFFFFF;
}

.dds-active-location-head[b-3w2hw262tn] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    min-height: 56px;
    padding: 0 28px;
    background: #F1F5F9;
    border-top: 1px solid #E7EDF4;
    border-bottom: 1px solid #E7EDF4;
}

.dds-active-location-head-title[b-3w2hw262tn] {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
}

.dds-active-location-head-title img[b-3w2hw262tn] {
    width: 22px;
    height: 22px;
}

.dds-active-location-head-title strong[b-3w2hw262tn] {
    color: #1E293B;
    font-size: 15px;
    font-weight: 800;
    line-height: 22px;
}

.dds-active-location-head > span[b-3w2hw262tn] {
    flex-shrink: 0;
    color: #5F6E85;
    font-size: 14px;
    font-weight: 600;
    line-height: 20px;
}

.dds-active-location-list[b-3w2hw262tn] {
    display: flex;
    flex-direction: column;
    max-height: min(488px, calc(100vh - 310px));
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: #CBD5E1 transparent;
}

.dds-active-location-list[b-3w2hw262tn]::-webkit-scrollbar {
    width: 4px;
}

.dds-active-location-list[b-3w2hw262tn]::-webkit-scrollbar-thumb {
    border-radius: 4px;
    background: #CBD5E1;
}

.dds-active-location-row[b-3w2hw262tn] {
    display: flex;
    align-items: center;
    gap: 12px;
    width: 100%;
    min-height: 64px;
    margin: 0;
    padding: 12px 28px;
    border: 0;
    background: #FFFFFF;
    color: inherit;
    font: inherit;
    text-align: left;
    cursor: pointer;
    transition: background 0.15s ease;
}

.dds-active-location-row:nth-child(even)[b-3w2hw262tn] {
    background: #F8FAFC;
}

.dds-active-location-row:hover[b-3w2hw262tn],
.dds-active-location-row.selected[b-3w2hw262tn] {
    background: #F5F7FF;
}

.dds-active-location-copy[b-3w2hw262tn] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.dds-active-location-row strong[b-3w2hw262tn] {
    color: #1E293B;
    font-size: 15px;
    font-weight: 800;
    line-height: 21px;
    overflow-wrap: anywhere;
}

.dds-active-location-row small[b-3w2hw262tn] {
    color: #475569;
    font-size: 14px;
    font-weight: 600;
    line-height: 20px;
    overflow-wrap: anywhere;
}

.dds-active-location-checkbox[b-3w2hw262tn] {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 22px;
    height: 22px;
    border: 2px solid #DCE2EA;
    border-radius: 8px;
    background: linear-gradient(180deg, #F8FAFC 0%, #FFFFFF 100%);
    box-shadow: 0 1px 1px -0.5px #1E293B08;
}

button.dds-active-location-checkbox[b-3w2hw262tn] {
    padding: 0;
    cursor: pointer;
}

.dds-active-location-checkbox.checked[b-3w2hw262tn] {
    border-color: #5263FF;
    background: #5263FF;
}

.dds-active-location-checkbox.checked[b-3w2hw262tn]::after {
    content: "";
    width: 9px;
    height: 6px;
    border-left: 2px solid #FFFFFF;
    border-bottom: 2px solid #FFFFFF;
    transform: rotate(-45deg) translate(1px, -1px);
}

.status-badge[b-3w2hw262tn] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 24px;
    padding: 4px 8px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    line-height: 16px;
    white-space: nowrap;
}

.status-badge.completed[b-3w2hw262tn] {
    color: #296C28;
    background: #409B3F1F;
}

.status-badge.planned[b-3w2hw262tn] {
    color: #363AF5;
    background: #5263FF1F;
}

.status-badge.in-progress[b-3w2hw262tn] {
    color: #A16207;
    background: #FEF3C7;
}

.status-badge.cancelled[b-3w2hw262tn] {
    color: #475569;
    background: #E2E8F0;
    border: 1px solid #CBD5E1;
}












































/* A header pill is as wide as its label: it never shrinks under the text, whatever else
   shares the row. */
.dispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian .cstm-title .right-title .bagee[b-3w2hw262tn] {
    display: inline-flex;
    align-items: center;
    flex-shrink: 0;
    white-space: nowrap;
    padding: 4px 8px;
    border-radius: 8px;
}

.dispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian .cstm-title .right-title .bagee.clickable[b-3w2hw262tn] {
    cursor: pointer;
}

.dispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian .cstm-title .right-title .bagee span[b-3w2hw262tn] {
    font-size: 12px;
    font-weight: 600;
    white-space: nowrap;
}


































.dds-placeholder-box[b-3w2hw262tn] {
    margin-top: 12px;
    padding: 16px;
    border: 1px solid rgba(30, 41, 59, 0.09);
    border-radius: 12px;
    background: #F8FAFC;
    color: #475569;
    font-size: 13px;
    font-weight: 600;
    line-height: 20px;
}














.timeline-creator[b-3w2hw262tn] {
    display: flex;
    min-width: 0;
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
}

.timeline-business-pill[b-3w2hw262tn] {
    max-width: 100%;
    gap: 2px;
    padding: 4px 6px;
    background: rgba(82, 99, 255, 0.12);
    border-radius: 8px;
    color: #363AF5;
}

.timeline-business-pill img[b-3w2hw262tn] {
    width: 14px;
    height: 14px;
    flex: 0 0 14px;
}

.timeline-business-pill span[b-3w2hw262tn] {
    min-width: 0;
    overflow: hidden;
    color: #363AF5;
    font-size: 12px;
    font-weight: 600;
    line-height: 16px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

@media (max-width: 720px) {
    .dispatchDetailsSlider.right .modal-dialog[b-3w2hw262tn] {
        max-width: 100%;
    }



    .dds-header-main[b-3w2hw262tn] {
        align-items: flex-start !important;
    }

    .dds-detail-grid[b-3w2hw262tn] {
        grid-template-columns: 1fr;
    }

    .dds-address-row[b-3w2hw262tn] {
        align-items: flex-start;
    }
}

.dispatchDetailsSlider.ID-popup .modal-body .details-tab[b-3w2hw262tn] {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    min-height: 0;
    margin-top: 0;
    padding-top: 16px;
    overflow: hidden;
}

.dispatchDetailsSlider.ID-popup .modal-body .details-tab .details-multi-tabs[b-3w2hw262tn] {
    flex: 0 0 auto;
    border-bottom: 1px #1E293B17 solid;
}

.locationDispatchDetailsSlider.ID-popup .modal-body[b-3w2hw262tn] {
    display: flex;
    flex-direction: column;
    min-height: 0;
    overflow: hidden;
}

.locationDispatchDetailsSlider.ID-popup .modal-body .main-tab[b-3w2hw262tn] {
    flex: 0 0 auto;
}

.locationDispatchDetailsSlider.ID-popup .modal-body .addresses-tab[b-3w2hw262tn] {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
}

.dispatchDetailsSlider.ID-popup .modal-body .details-tab .overview-multi-tab[b-3w2hw262tn],
.dispatchDetailsSlider.ID-popup .modal-body .details-tab .admin-phonecall-multi-tab[b-3w2hw262tn],
.dispatchDetailsSlider.ID-popup .modal-body .details-tab .timeline-multi-tab[b-3w2hw262tn] {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-color: #CBD5E1 transparent;
    scrollbar-width: thin;
}

.dispatchDetailsSlider.ID-popup .modal-body .details-tab .overview-multi-tab[b-3w2hw262tn]::-webkit-scrollbar,
.dispatchDetailsSlider.ID-popup .modal-body .details-tab .admin-phonecall-multi-tab[b-3w2hw262tn]::-webkit-scrollbar,
.dispatchDetailsSlider.ID-popup .modal-body .details-tab .timeline-multi-tab[b-3w2hw262tn]::-webkit-scrollbar {
    width: 6px;
}

.dispatchDetailsSlider.ID-popup .modal-body .details-tab .overview-multi-tab[b-3w2hw262tn]::-webkit-scrollbar-thumb,
.dispatchDetailsSlider.ID-popup .modal-body .details-tab .admin-phonecall-multi-tab[b-3w2hw262tn]::-webkit-scrollbar-thumb,
.dispatchDetailsSlider.ID-popup .modal-body .details-tab .timeline-multi-tab[b-3w2hw262tn]::-webkit-scrollbar-thumb {
    border-radius: 999px;
    background: #CBD5E1;
}

.dispatchDetailsSlider.ID-popup .modal-body .details-tab .details-multi-tabs .tab[b-3w2hw262tn] {
    gap: 2px;
    background-color: #FFFFFF;
    border: none;
    outline: none;
    border-radius: 0;
    width: 100%;
    padding: 4px 0 12px;
}

.dispatchDetailsSlider.ID-popup .modal-body .details-tab .details-multi-tabs .tab img[b-3w2hw262tn] {
    padding-right: 4px;
    height: 18px;
}

.dispatchDetailsSlider.ID-popup .modal-body .details-tab .details-multi-tabs .tab span[b-3w2hw262tn] {
    font-size: 13px;
    font-weight: 600;
    line-height: 24px;
    letter-spacing: -0.2px;
    color: #475569;
}

.dispatchDetailsSlider.ID-popup .modal-body .details-tab .details-multi-tabs .tab.active[b-3w2hw262tn] {
    border-bottom: 2px #5263FF solid;
}

.dispatchDetailsSlider.ID-popup .modal-body .details-tab .details-multi-tabs .tab.active span[b-3w2hw262tn] {
    color: #5263FF;
}

.dispatchDetailsSlider.ID-popup .modal-body .details-tab .overview-multi-tab .box[b-3w2hw262tn] {
    margin-bottom: 32px;
}

.dispatchDetailsSlider.ID-popup .modal-body .details-tab .overview-multi-tab .box h5[b-3w2hw262tn],
.dispatchDetailsSlider.ID-popup .modal-body .details-tab .admin-phonecall-multi-tab h5[b-3w2hw262tn],
.dispatchDetailsSlider.ID-popup .modal-body .details-tab .timeline-multi-tab h5[b-3w2hw262tn] {
    font-size: 18px;
    font-weight: 800;
    line-height: 24px;
    letter-spacing: -0.2px;
    color: #1E293B;
    margin-bottom: 16px;
}

.dispatchDetailsSlider.ID-popup .modal-body .details-tab .overview-multi-tab .box .three-btn button[b-3w2hw262tn] {
    border-radius: 10px;
    padding: 8px 10px;
}

.dispatchDetailsSlider.ID-popup .modal-body .details-tab .overview-multi-tab .box .three-btn button.cancel-btn[b-3w2hw262tn] {
    background-color: #409B3F1F;
    border: 1px transparent solid;
}

.dispatchDetailsSlider.ID-popup .modal-body .details-tab .overview-multi-tab .box .three-btn button.cancel-btn span[b-3w2hw262tn],
.dispatchDetailsSlider.ID-popup .modal-body .details-tab .overview-multi-tab .box .three-btn button.change-work-btn span[b-3w2hw262tn],
.dispatchDetailsSlider.ID-popup .modal-body .details-tab .overview-multi-tab .box .three-btn button.cancel-dispatch-btn span[b-3w2hw262tn] {
    font-size: 13px;
    font-weight: 600;
    line-height: 24px;
    letter-spacing: -0.2px;
}

.dispatchDetailsSlider.ID-popup .modal-body .details-tab .overview-multi-tab .box .three-btn button.change-work-btn[b-3w2hw262tn],
.dispatchDetailsSlider.ID-popup .modal-body .details-tab .overview-multi-tab .box .three-btn button.cancel-dispatch-btn[b-3w2hw262tn] {
    background-color: #F1F5F9CC;
    border: 1px #1E293B17 solid;
}

.dispatchDetailsSlider.ID-popup .modal-body .details-tab .overview-multi-tab .box .three-btn button.change-work-btn img[b-3w2hw262tn] {
    height: 18px;
}

.dispatchDetailsSlider.ID-popup .modal-body .details-tab .overview-multi-tab .box .three-btn button.change-work-btn span[b-3w2hw262tn] {
    color: #1E293B;
}

.dispatchDetailsSlider.ID-popup .modal-body .details-tab .overview-multi-tab .box .three-btn button.cancel-dispatch-btn[b-3w2hw262tn] {
    background-color: #ED40301F;
    border: 1px transparent solid;
}

.dispatchDetailsSlider.ID-popup .modal-body .details-tab .overview-multi-tab .box .three-btn button.cancel-dispatch-btn span[b-3w2hw262tn] {
    color: #B82213;
}

.dispatchDetailsSlider.ID-popup .modal-body .details-tab .overview-multi-tab .box-2 .row .icon[b-3w2hw262tn] {
    min-height: 40px;
    min-width: 40px;
    background-color: #5263FF1F;
    border-radius: 8px;
}

.dispatchDetailsSlider.ID-popup .modal-body .details-tab .overview-multi-tab .box-2 .row .icon img[b-3w2hw262tn] {
    height: 22px;
}

.dispatchDetailsSlider.ID-popup .modal-body .details-tab .overview-multi-tab .box-2 .row .icon-txt[b-3w2hw262tn] {
    font-size: 13px;
    letter-spacing: -0.2px;
}

.dispatchDetailsSlider.ID-popup .modal-body .details-tab .overview-multi-tab .box-2 .row .icon-txt p[b-3w2hw262tn] {
    margin: 0;
    font-weight: 700;
    color: #1E293B;
}

.dispatchDetailsSlider.ID-popup .modal-body .details-tab .overview-multi-tab .box-2 .row .icon-txt span[b-3w2hw262tn] {
    font-weight: 500;
    color: #475569;
}

.dispatchDetailsSlider.ID-popup .modal-body .details-tab .overview-multi-tab .box-3 .selected .name[b-3w2hw262tn] {
    gap: 2px;
    padding: 6px;
    background-color: #5263FF1F;
    border-radius: 8px;
}

.dispatchDetailsSlider.ID-popup .modal-body .details-tab .overview-multi-tab .box-3 .selected .name img[b-3w2hw262tn] {
    height: 16px;
}

.dispatchDetailsSlider.ID-popup .modal-body .details-tab .overview-multi-tab .box-3 .selected .name span[b-3w2hw262tn] {
    font-size: 12px;
    font-weight: 600;
    line-height: 16px;
    letter-spacing: -0.2px;
    color: #363AF5;
}

.dispatchDetailsSlider.ID-popup .modal-body .details-tab .overview-multi-tab .box-4 .file-name p[b-3w2hw262tn],
.dispatchDetailsSlider.ID-popup .modal-body .details-tab .overview-multi-tab .box-4 .file-name a[b-3w2hw262tn] {
    font-size: 13px;
    font-weight: 600;
    line-height: 20px;
    letter-spacing: -0.2px;
}

.dispatchDetailsSlider.ID-popup .modal-body .details-tab .overview-multi-tab .box-4 .file-name a[b-3w2hw262tn] {
    color: #5263FF;
    text-decoration: underline;
    text-decoration-color: #5263ff5b;
    text-decoration-thickness: 2px;
    text-underline-offset: 3px;
}

.dispatchDetailsSlider.ID-popup .modal-body .details-tab .overview-multi-tab .box-5 table[b-3w2hw262tn],
.dispatchDetailsSlider.ID-popup .modal-body .details-tab .admin-phonecall-multi-tab table[b-3w2hw262tn],
.dispatchDetailsSlider.ID-popup .modal-body .details-tab .timeline-multi-tab table[b-3w2hw262tn] {
    border: 1px #1E293B0F solid;
    border-collapse: separate;
    border-spacing: 0;
    border-radius: 12px;
    overflow: hidden;
    font-size: 13px;
}

.dispatchDetailsSlider.ID-popup .modal-body .details-tab .overview-multi-tab .box-5 table tbody tr th[b-3w2hw262tn],
.dispatchDetailsSlider.ID-popup .modal-body .details-tab .admin-phonecall-multi-tab table tr th[b-3w2hw262tn],
.dispatchDetailsSlider.ID-popup .modal-body .details-tab .timeline-multi-tab table tr th[b-3w2hw262tn] {
    padding: 12px 16px;
    font-size: 13px;
    font-weight: 700;
    line-height: 20px;
    border-bottom: 1px #1E293B0F solid;
    color: #1E293B;
}

.dispatchDetailsSlider.ID-popup .modal-body .details-tab .overview-multi-tab .box-5 table tbody tr.title-tr[b-3w2hw262tn],
.dispatchDetailsSlider.ID-popup .modal-body .details-tab .admin-phonecall-multi-tab table tr.title-tr[b-3w2hw262tn],
.dispatchDetailsSlider.ID-popup .modal-body .details-tab .timeline-multi-tab table tr.title-tr[b-3w2hw262tn] {
    background-color: #F1F5F9 !important;
}

.dispatchDetailsSlider.ID-popup .modal-body .details-tab .overview-multi-tab .box-5 table tbody tr.title-tr th:first-child[b-3w2hw262tn],
.dispatchDetailsSlider.ID-popup .modal-body .details-tab .admin-phonecall-multi-tab table tr.title-tr th:first-child[b-3w2hw262tn],
.dispatchDetailsSlider.ID-popup .modal-body .details-tab .timeline-multi-tab table tr.title-tr th:first-child[b-3w2hw262tn] {
    border-radius: 12px 0 0 0 !important;
}

.dispatchDetailsSlider.ID-popup .modal-body .details-tab .overview-multi-tab .box-5 table tbody tr.title-tr th:last-child[b-3w2hw262tn],
.dispatchDetailsSlider.ID-popup .modal-body .details-tab .admin-phonecall-multi-tab table tr.title-tr th:last-child[b-3w2hw262tn],
.dispatchDetailsSlider.ID-popup .modal-body .details-tab .timeline-multi-tab table tr.title-tr th:last-child[b-3w2hw262tn] {
    border-radius: 0 12px 0 0 !important;
}

.dispatchDetailsSlider.ID-popup .modal-body .details-tab .overview-multi-tab .box-5 table tbody tr th img[b-3w2hw262tn] {
    height: 16px;
    margin-right: 8px;
}

.dispatchDetailsSlider.ID-popup .modal-body .details-tab .overview-multi-tab .box-5 table tbody tr td[b-3w2hw262tn],
.dispatchDetailsSlider.ID-popup .modal-body .details-tab .admin-phonecall-multi-tab table tr td[b-3w2hw262tn],
.dispatchDetailsSlider.ID-popup .modal-body .details-tab .timeline-multi-tab table tr td[b-3w2hw262tn] {
    padding: 8px 16px;
    font-size: 13px;
    font-weight: 600;
    line-height: 20px;
    color: #475569;
}

.dispatchDetailsSlider.ID-popup .modal-body .details-tab .overview-multi-tab .box-5 table tbody tr:nth-child(odd)[b-3w2hw262tn],
.dispatchDetailsSlider.ID-popup .modal-body .details-tab .admin-phonecall-multi-tab table tr:nth-child(odd)[b-3w2hw262tn],
.dispatchDetailsSlider.ID-popup .modal-body .details-tab .timeline-multi-tab table tr:nth-child(odd)[b-3w2hw262tn] {
    background-color: #F8FAFC;
}

.dispatchDetailsSlider.ID-popup .modal-body .details-tab .overview-multi-tab .box-5 table tbody tr td:nth-child(1)[b-3w2hw262tn] {
    border-right: 1px #1E293B0F solid;
}

.dispatchDetailsSlider.ID-popup .modal-body .details-tab .timeline-multi-tab .search[b-3w2hw262tn] {
    padding: 8px;
    background-color: #FFFFFF;
    border: 1px #1E293B1F solid;
    border-radius: 50px;
    box-shadow: 0 1px 1px -0.5px #1E293B08;
}

.dispatchDetailsSlider.ID-popup .modal-body .details-tab .timeline-multi-tab .search img[b-3w2hw262tn] {
    height: 16px;
    cursor: pointer;
}

.dispatchDetailsSlider.ID-popup .modal-body .details-tab .timeline-multi-tab .search input[b-3w2hw262tn] {
    height: 100%;
    border: none;
    outline: none;
    font-size: 13px;
    font-weight: 500;
}

.dispatchDetailsSlider.ID-popup .modal-body .details-tab .timeline-multi-tab div h5[b-3w2hw262tn] {
    margin-bottom: 0;
}

.own-route-popup .addresses-tab .add-location-txt button.white-btn[b-3w2hw262tn],

.own-route-popup .addresses-tab .invite-banner[b-3w2hw262tn],

/* Invoicing box: per-business slice rows (confirmable subs / awaiting roots) */
.dispatchDetailsSlider.ID-popup .modal-body .details-tab .overview-multi-tab .box .invoicing-slice-row[b-3w2hw262tn] {
    font-size: 14px;
    color: #14161f;
}
.dispatchDetailsSlider.ID-popup .modal-body .details-tab .overview-multi-tab .box .invoicing-slice-row .slice-status[b-3w2hw262tn] {
    font-size: 13px;
    font-weight: 600;
    white-space: nowrap;
}
.dispatchDetailsSlider.ID-popup .modal-body .details-tab .overview-multi-tab .box .invoicing-slice-row .slice-status.green[b-3w2hw262tn] {
    color: #2f9e44;
}
.dispatchDetailsSlider.ID-popup .modal-body .details-tab .overview-multi-tab .box .invoicing-slice-row .slice-status.red[b-3w2hw262tn] {
    color: #e03131;
}

/* Addresses view: per-subcontractor confirm-invoicing pill on the group header */
button.confirm-invoicing-btn[b-3w2hw262tn] {
    border: 1px solid #4263eb;
    color: #4263eb;
    background: #fff;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 600;
    padding: 4px 12px;
    white-space: nowrap;
}
button.confirm-invoicing-btn:hover[b-3w2hw262tn] { background: #edf2ff; }
button.confirm-invoicing-btn:disabled[b-3w2hw262tn] { opacity: .6; }

/* Add-more kind dropdown — mirrors the Opret udkald menu */
.extend-kind-backdrop[b-3w2hw262tn] {
    position: fixed;
    inset: 0;
    z-index: 1079;
}

.extend-kind-menu[b-3w2hw262tn] {
    position: absolute;
    top: calc(100% + 8px);
    left: 0;
    z-index: 1080;
    background: #fff;
    border-radius: 12px;
    border: 1px solid #1E293B0F;
    box-shadow: 0 32px 32px -16px #1E293B14;
    padding: 16px;
    width: max-content;
}

.extend-kind-item[b-3w2hw262tn] {
    height: 36px;
    width: 190px;
    gap: 2px;
    border: none;
    outline: none;
    border-radius: 8px;
    background: linear-gradient(var(--purple), var(--purple)) padding-box, linear-gradient(90deg, #1E293B17, #1E293B2E) border-box;
    color: #fff !important;
    font-size: 13px;
    font-weight: 600;
}

.extend-kind-item p[b-3w2hw262tn] {
    color: #fff !important;
    margin: 0;
    padding: 0 4px;
}

.extend-kind-item img[b-3w2hw262tn] {
    width: 16px;
}

.extend-kind-item:hover[b-3w2hw262tn] {
    filter: brightness(1.06);
}

/* ---- Geofence drive: the zone behind a stop's times, and the drive inside it ---- */
.dds-geofence-glyph[b-3w2hw262tn] {
    flex-shrink: 0;
    width: 26px;
    height: 26px;
    padding: 0;
    border: 1px solid #1E293B14;
    border-radius: 8px;
    background: #F8FAFC;
    cursor: pointer;
}

.dds-geofence-glyph img[b-3w2hw262tn] {
    width: 14px;
    height: 14px;
}

.dds-geofence-glyph:hover[b-3w2hw262tn] {
    background: #8B5CF614;
    border-color: #8B5CF64D;
}

/* The dispatch's terminal state, stated where it cannot be missed. */
.dds-header-status[b-3w2hw262tn] {
	flex-shrink: 0;
	font-size: 12px;
	font-weight: 700;
	border-radius: 99px;
	padding: 3px 12px;
	white-space: nowrap;
}

.dds-header-status--cancelled[b-3w2hw262tn] {
	background: #FEE2E2;
	/* !important: the header's own text rule outweighs this class and greyed it out. */
	color: #B91C1C !important;
}

.dds-header-status--completed[b-3w2hw262tn] {
	background: #DCFCE7;
	color: #15803D !important;
}

/* Tri-state subcontractor answer badge on the zone subgroup header: the send's
   state is data, not an alarm — grey awaiting, green accepted, red denied. */
.bagee.send-answer[b-3w2hw262tn] {
    display: inline-flex;
    align-items: center;
    flex-shrink: 0;
    white-space: nowrap;
    padding: 4px 8px;
    border-radius: 8px;
    gap: 6px;
}

.bagee.send-answer .dot[b-3w2hw262tn] {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    flex-shrink: 0;
}

.bagee.send-answer span[b-3w2hw262tn] {
    font-size: 12px;
    font-weight: 600;
    white-space: nowrap;
}

.bagee.send-answer.accepted[b-3w2hw262tn] { background-color: #409B3F1F; }
.bagee.send-answer.accepted span[b-3w2hw262tn] { color: #296C28; }
.bagee.send-answer.accepted .dot[b-3w2hw262tn] { background-color: #337C33; }

.bagee.send-answer.denied[b-3w2hw262tn] { background-color: #ED40301F; }
.bagee.send-answer.denied span[b-3w2hw262tn] { color: #B82213; }
.bagee.send-answer.denied .dot[b-3w2hw262tn] { background-color: #ED4030; }

.bagee.send-answer.pending[b-3w2hw262tn] { background-color: #1E293B14; }
.bagee.send-answer.pending span[b-3w2hw262tn] { color: #5F6E85; }
.bagee.send-answer.pending .dot[b-3w2hw262tn] { background-color: #94A3B8; }

/* Picking which of the handed-over routes an answer covers, and the reason left behind on
   the ones that were turned down. */
.invite-banner-body[b-3w2hw262tn] {
    min-width: 0;
}

.invite-routes[b-3w2hw262tn] {
    list-style: none;
    margin: 0;
    padding: 0;
    max-width: 460px;
}

.invite-route-row[b-3w2hw262tn] {
    display: flex;
    align-items: center;
    /* The reason line takes a whole row of its own (flex-basis 100% below); without wrapping
       it shared the line and squeezed the route's name down to "Sneryd...". */
    flex-wrap: wrap;
    gap: 10px;
    padding: 7px 2px;
    border-bottom: 1px solid #EBECED;
}

.invite-route-row:last-child[b-3w2hw262tn] {
    border-bottom: none;
}

.invite-route-name[b-3w2hw262tn] {
    flex: 1 1 auto;
    min-width: 0;
    font-size: 14px;
    line-height: 20px;
    color: #23262F;
    cursor: pointer;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.invite-route-count[b-3w2hw262tn] {
    flex: 0 0 auto;
    padding: 1px 8px;
    border-radius: 999px;
    background: #F1F2F4;
    font-size: 12px;
    line-height: 18px;
    color: #6F767E;
}

.decline-reason-line[b-3w2hw262tn] {
    font-style: italic;
}

/* A route that was turned down: the header says so where the progress bar would have been,
   and its stops carry the same word instead of "Pending". */
.group-declined-status[b-3w2hw262tn] {
    position: relative;
    display: inline-flex;
    align-items: center;
    padding: 4px 12px;
    border-radius: 999px;
    background: #FCE9EB;
    font-size: 13px;
    font-weight: 500;
    line-height: 18px;
    color: #C0392F;
    white-space: nowrap;
}

/* A run that was called off: same shape as the declined pill beside it - a word, no
   progress bar - because neither has any work left to report. */
.group-cancelled-status[b-3w2hw262tn] {
    position: relative;
    display: inline-flex;
    align-items: center;
    padding: 4px 12px;
    border-radius: 999px;
    background: #FCE9EB;
    font-size: 13px;
    font-weight: 500;
    line-height: 18px;
    color: #C0392F;
    white-space: nowrap;
}

/* Who refused, when and why now hang off the pill through the shared WMTooltip hover,
   so the old attribute-driven CSS bubble is gone; the pill only keeps its cursor. */
.group-declined-status[b-3w2hw262tn] {
    cursor: help;
}

/* The chain out of a refusal: the denying business's own dispatch covering the stop.
   A chip rather than plain text because it opens that dispatch. */
.covered-by-chip[b-3w2hw262tn] {
    border: 1px solid #1E293B17;
    background: #FFFFFF;
    border-radius: 999px;
    padding: 3px 10px;
    font-size: 12px;
    font-weight: 600;
    line-height: 18px;
    color: #5263FF;
    white-space: nowrap;
    cursor: pointer;
}

.covered-by-chip:hover[b-3w2hw262tn] {
    text-decoration: underline;
}

.s-btn.light-btn.declined-stop[b-3w2hw262tn] {
    background: #FCE9EB;
    color: #C0392F;
}

/* Said under the route it applies to: with GPS completion off, the crew has to tap
   every stop, and a dispatcher reading the route list is who needs to know. */
.dds-gps-completion-note[b-3w2hw262tn] {
    margin: 4px 0 0;
    font-size: 12px;
    line-height: 1.4;
    color: #C0392F;
}

/* ── Route crew strip (route dispatches) ──────────────────────────────────
   The stop list of a route dispatch is flat, so its routes have no header to
   carry a crew badge the way a zone group does. This strip is that header,
   lifted out: one row per route, the crew on it, and the way to change it. */
.dds-route-crew[b-3w2hw262tn] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-bottom: 16px;
}

.dds-route-crew-row[b-3w2hw262tn] {
    padding: 10px 12px;
    border: 1px solid #1E293B1F;
    border-radius: 10px;
    background: #FFFFFF;
}

.dds-route-crew-name[b-3w2hw262tn] {
    font-size: 14px;
    font-weight: 600;
    color: #1E293B;
}

.dds-route-crew .bagee[b-3w2hw262tn] {
    display: inline-flex;
    align-items: center;
    flex-shrink: 0;
    gap: 6px;
    padding: 4px 10px;
    border-radius: 99px;
    white-space: nowrap;
}

    .dds-route-crew .bagee.clickable[b-3w2hw262tn] {
        cursor: pointer;
    }

    .dds-route-crew .bagee span[b-3w2hw262tn] {
        font-size: 12px;
        font-weight: 600;
    }

    .dds-route-crew .bagee.red[b-3w2hw262tn] {
        background-color: #C0392F1F;
    }

        .dds-route-crew .bagee.red span[b-3w2hw262tn] {
            color: #C0392F;
        }

    .dds-route-crew .bagee.dark[b-3w2hw262tn] {
        background-color: #1E293B14;
    }

        .dds-route-crew .bagee.dark span[b-3w2hw262tn] {
            color: #1E293B;
        }

/* The dispatch's short code (two letters, four digits) beside the header title. The
   route-titled header had no room for it in the title itself, and it is the handle the
   run is known by everywhere else. */
.dds-header-code[b-3w2hw262tn] {
	flex-shrink: 0;
	font-size: 12px;
	font-weight: 700;
	border-radius: 99px;
	padding: 3px 12px;
	white-space: nowrap;
	background: #EEF2FF;
	color: #3730A3 !important;
}

/* The owner's invoice-scope choice in the Details panel (address dispatches only). */
.dds-invoice-scope[b-3w2hw262tn] {
	width: 100%;
}

.dds-invoice-scope-label[b-3w2hw262tn] {
	color: #1E293B;
	font-size: 13px;
	font-weight: 700;
	line-height: 20px;
	letter-spacing: -0.2px;
}

.dds-invoice-scope-question[b-3w2hw262tn] {
	margin: 0;
	color: #475569;
	font-size: 13px;
	font-weight: 600;
	line-height: 20px;
	letter-spacing: -0.2px;
}

/* The owner's "Awaiting response" pill is a button: the same grey pill, with a ring on hover
   and a focus ring for the keyboard, so it reads as pressable without shouting. */
.bagee.send-answer.clickable[b-3w2hw262tn] {
	cursor: pointer;
}

.bagee.send-answer.clickable:hover[b-3w2hw262tn] {
	box-shadow: inset 0 0 0 1px #94A3B8;
}

.bagee.send-answer.clickable:focus-visible[b-3w2hw262tn] {
	outline: 2px solid #4A55E1;
	outline-offset: 2px;
}

/* "1 of 2 visits" on a stop the dispatcher ordered more than one visit to. Neutral, because it
   is a plan rather than a status: the stop's own chip beside it still says how it is going. */
.own-route-popup .addresses-tab .pannel .all-bagees .bagee.visits-chip[b-3w2hw262tn] {
    background-color: #EEF2FF;
    border: 1px #1E293B08 solid;
}

.own-route-popup .addresses-tab .pannel .all-bagees .bagee.visits-chip p[b-3w2hw262tn] {
    color: #3730A3;
    font-size: 12px;
    font-weight: 700;
}

/* ── "Add more" on a route dispatch: routes and addresses behind two tabs ── */

.dds-add-more-tabs[b-3w2hw262tn] {
    padding: 16px 28px 0;
    background: #FFFFFF;
}

.dds-add-more-tab[b-3w2hw262tn] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 14px;
    border: 1px solid #D7DEE8;
    border-radius: 10px;
    background: #FFFFFF;
    color: #475569;
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
}

.dds-add-more-tab.active[b-3w2hw262tn] {
    border-color: #4F46E5;
    background: #EEF2FF;
    color: #3730A3;
}

.dds-add-more-tab:disabled[b-3w2hw262tn] {
    opacity: 0.6;
    cursor: default;
}

.dds-add-more-tab span[b-3w2hw262tn] {
    min-width: 20px;
    padding: 0 6px;
    border-radius: 999px;
    background: #F1F5F9;
    color: #475569;
    font-size: 12px;
    font-weight: 800;
}

.dds-add-more-tab.active span[b-3w2hw262tn] {
    background: #FFFFFF;
    color: #3730A3;
}

.dds-add-more-hint[b-3w2hw262tn] {
    margin: 8px 0 0;
    padding: 0 28px 12px;
    background: #FFFFFF;
    color: #64748B;
    font-size: 13px;
    line-height: 18px;
}

/* The picker offers what the dispatch already carries rather than hiding it, so every such row
   says so: picking one is a second visit, which the confirmation then spells out. */
.dds-already-on-dispatch[b-3w2hw262tn] {
    margin-left: 6px;
    padding: 2px 6px;
    border-radius: 6px;
    background: #FEF3C7;
    color: #92400E;
    font-size: 11px;
    font-style: normal;
    font-weight: 700;
    white-space: nowrap;
}

/* ── "These addresses are already on this dispatch. Add them again?" ── */

.dds-repeat-visit-body[b-3w2hw262tn] {
    padding: 4px 28px 8px;
    max-height: min(320px, calc(100vh - 360px));
    overflow-y: auto;
    scrollbar-width: thin;
}

/* The same table the route-dispatch confirmation draws: rounded frame, icon headers, a
   hairline between rows, and a tick column so some or all can be sent back to. */
.dds-repeat-visit-table[b-3w2hw262tn] {
    border: 1px #1E293B0F solid;
    border-radius: 16px;
    border-collapse: separate;
    border-spacing: 0;
    overflow: hidden;
    table-layout: fixed;
}

    .dds-repeat-visit-table th[b-3w2hw262tn],
    .dds-repeat-visit-table td[b-3w2hw262tn] {
        padding: 8px 16px;
        text-align: left;
        font-size: 13px;
        line-height: 20px;
        letter-spacing: -0.2px;
        color: #1E293B;
        border-bottom: 1px #1E293B0F solid;
    }

    .dds-repeat-visit-table th[b-3w2hw262tn] {
        font-weight: 700;
        background: #F8FAFC;
    }

        .dds-repeat-visit-table th img[b-3w2hw262tn] {
            height: 16px;
            margin-right: 8px;
            vertical-align: -3px;
        }

    .dds-repeat-visit-table tbody tr:last-child td[b-3w2hw262tn] {
        border-bottom: 0;
    }

    .dds-repeat-visit-table tbody tr[b-3w2hw262tn] {
        cursor: pointer;
    }

        .dds-repeat-visit-table tbody tr:hover td[b-3w2hw262tn] {
            background: #F8FAFC;
        }

        .dds-repeat-visit-table tbody tr.on td[b-3w2hw262tn] {
            background: #363AF50A;
        }

    .dds-repeat-visit-table .dds-repeat-visit-check[b-3w2hw262tn] {
        width: 44px;
        padding-right: 0;
    }

        .dds-repeat-visit-table .dds-repeat-visit-check .custom-check[b-3w2hw262tn] {
            display: block;
            margin: 0;
            min-height: 20px;
        }

.dds-repeat-visit-hint[b-3w2hw262tn] {
    margin: 16px 0 0;
    color: #64748B;
    font-size: 13px;
    line-height: 18px;
}

/* A route stop whose season has ended still belongs to the route, so it is shown here greyed
   rather than hidden: the dispatcher sees the whole route and why one stop will not be worked. */
.dds-active-route-address--inactive[b-3w2hw262tn] {
    opacity: 0.55;
}

/* Each route records its own answer in the same segmented control the driver invitation rows
   use (.dds-driver-answer above): green accept and red deny joined in the middle, with the half
   not chosen fading once a choice is made. One control for one question, whichever party is
   being asked, so the control itself is not restyled here. All the route row adds is that the
   pair keeps its own width while the route name takes the rest. */
.invite-route-row .dds-driver-answer[b-3w2hw262tn] {
    flex: 0 0 auto;
}

/* The name no longer toggles anything, so it stops pretending to be clickable. */
.invite-route-name[b-3w2hw262tn] {
    cursor: default;
}

/* A row whose answer has gone fixed: the crew has been out on that route, so the pair is
   replaced by the answer it stands at and a line saying why it can no longer be moved. Both
   the explanation and a refusal's reason wrap onto their own line under the name rather than
   squeezing the row to nothing. */
.invite-route-row.fixed-answer .invite-route-name[b-3w2hw262tn] {
    color: #6F767E;
}

.invite-route-answer[b-3w2hw262tn] {
    flex: 0 0 auto;
    padding: 2px 10px;
    border-radius: 999px;
    font-size: 12px;
    line-height: 18px;
    font-weight: 600;
}

.invite-route-answer.accepted[b-3w2hw262tn] {
    background: #E7F3E7;
    color: #27632A;
}

.invite-route-answer.declined[b-3w2hw262tn] {
    background: #FCE9EB;
    color: #B82213;
}

.invite-route-answer.pending[b-3w2hw262tn] {
    background: #F1F2F4;
    color: #6F767E;
}

.invite-route-fixed-why[b-3w2hw262tn],
.invite-route-row .decline-reason-line[b-3w2hw262tn] {
    flex: 1 1 100%;
    font-size: 12px;
    line-height: 18px;
    color: #6F767E;
}

/* Confirm belongs to the list it confirms, so it lines up under it rather than running the
   banner's full width. */
.invite-confirm-row[b-3w2hw262tn] {
    max-width: 460px;
}

/* Narrow panels: the pair drops under the name rather than squeezing it to nothing. */
@media (max-width: 575px) {
    .invite-route-row[b-3w2hw262tn] {
        flex-wrap: wrap;
    }

    .invite-route-row .dds-driver-answer[b-3w2hw262tn] {
        width: 100%;
        justify-content: flex-end;
    }
}

/* The answer panel as a section of the Details pane: the heading, the blue instruction tile
   and the full width every other box there has (Fakturering, Detaljer). On Addresses it keeps
   the banner it has always been — same markup, two settings. */
.dispatchDetailsSlider.ID-popup .modal-body .details-tab .overview-multi-tab .invite-answer-box .invite-banner[b-3w2hw262tn] {
    border: none;
    border-radius: 0;
    margin: 0;
    padding: 0;
    background: transparent;
}

.dispatchDetailsSlider.ID-popup .modal-body .details-tab .overview-multi-tab .invite-answer-box .invite-banner-body > p[b-3w2hw262tn] {
    margin: 0 0 8px;
    font-size: 18px;
    font-weight: 800;
    line-height: 24px;
    letter-spacing: -0.2px;
    color: #1E293B;
}

.dispatchDetailsSlider.ID-popup .modal-body .details-tab .overview-multi-tab .invite-answer-box .invite-banner-body > span[b-3w2hw262tn] {
    display: block;
    margin: 8px 0 12px;
    padding: 10px 12px;
    border: 1px solid #BFDBFE;
    border-radius: 8px;
    background: #EFF6FF;
    color: #1D4ED8;
    font-size: 13px;
    font-weight: 700;
    line-height: 20px;
}

/* The routes are a table of the pane, not a column of the banner. */
.dispatchDetailsSlider.ID-popup .modal-body .details-tab .overview-multi-tab .invite-answer-box .invite-routes[b-3w2hw262tn],
.dispatchDetailsSlider.ID-popup .modal-body .details-tab .overview-multi-tab .invite-answer-box .invite-confirm-row[b-3w2hw262tn] {
    max-width: none;
}


/* A settled stop says which way it settled. The row's chip could only say "done",
   "refused" or "not yet", so a called-off address read "Pending".

   Written out to the same depth as the plain chip it is overriding: a two-class
   selector loses to that one on specificity and the chip stays white, which is
   what had already happened to .declined-stop below. */
.dispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian.sub-accordian .cstm-data .right-sub-data button.s-btn.light-btn.cancelled-stop[b-3w2hw262tn],
.dispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian.sub-accordian .cstm-data .right-sub-data button.s-btn.light-btn.declined-stop[b-3w2hw262tn] {
    background: #FCE9EB;
    border-color: rgba(192, 57, 47, 0.16);
    color: #C0392F;
}

.dispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian.sub-accordian .cstm-data .right-sub-data button.s-btn.light-btn.removed-stop[b-3w2hw262tn] {
    background: #F1F5F9;
    color: #475569;
}

/* A settled group's word carries its colour; "not started" and "started" are the
   ordinary course of a run and stay as plain as they were. */
.dispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian .cstm-title .center-title .progress-card span.status.status-cancelled[b-3w2hw262tn] {
    color: #C0392F;
}

.dispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian .cstm-title .center-title .progress-card span.status.status-completed[b-3w2hw262tn] {
    color: #337C33;
}

/* A long company name has to give way to the progress card, not run underneath it.
   The name already truncates; its flex parents did not allow it to, because a flex
   item will not shrink past its content without min-width: 0. */
.dispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian .cstm-title .left-title > .flex-column[b-3w2hw262tn],
.dispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian .cstm-title .left-title .img-txt[b-3w2hw262tn],
.dispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian .cstm-title .left-title > .flex-column > .d-flex[b-3w2hw262tn] {
    min-width: 0;
}

.dispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian .cstm-title .left-title p[b-3w2hw262tn] {
    min-width: 0;
    flex: 0 1 auto;
}


/* Settled with nothing billable: neither a success nor a hold-up, so neither green nor red. */
.dispatchDetailsSlider.ID-popup .modal-body .details-tab .overview-multi-tab .box .invoicing-slice-row .slice-status.muted[b-3w2hw262tn] {
    color: #64748B;
}

/* The route table's status column. */
.dds-route-status[b-3w2hw262tn] {
    font-weight: 600;
}

.dds-route-status.status-cancelled[b-3w2hw262tn] {
    color: #C0392F;
}

.dds-route-status.status-completed[b-3w2hw262tn] {
    color: #337C33;
}
/* /Pages/Dispatch/Components/DispatchDriveMapSection.razor.rz.scp.css */
/* The Map tab's whole content: a card holding the run's facts, the map itself and the
   timeline that scrubs it. */
.ddm-section[b-0sxezbk4sx] {
    padding: 16px;
    background: #FFFFFF;
    border: 1px solid #E2E8F0;
    border-radius: 12px;
}

.ddm-section h6[b-0sxezbk4sx] {
    margin: 0 0 12px;
    color: #1E293B;
    font-size: 15px;
    font-weight: 800;
    line-height: 20px;
}

/* ---- Run facts: started / finished / driven, one compact row ---- */
.ddm-facts[b-0sxezbk4sx] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px 18px;
    margin-bottom: 12px;
}

.ddm-fact[b-0sxezbk4sx] {
    display: inline-flex;
    align-items: baseline;
    gap: 6px;
    font-size: 13px;
    font-weight: 600;
    color: #1E293B;
    font-variant-numeric: tabular-nums;
}

.ddm-fact-label[b-0sxezbk4sx] {
    font-size: 11px;
    font-weight: 700;
    color: #5F6E85;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.ddm-fact--cancelled[b-0sxezbk4sx] {
    color: #B91C1C;
}

.ddm-fact--cancelled .ddm-fact-label[b-0sxezbk4sx] {
    color: #B91C1C;
}

.ddm-map[b-0sxezbk4sx] {
    height: 520px;
    border-radius: 12px;
    overflow: hidden;
    border: 1px solid #1E293B14;
}

/* Cascade the height into WMMap's wrapper chain, the way the live map does. */
.ddm-map[b-0sxezbk4sx]  .wm-map-wrapper,
.ddm-map[b-0sxezbk4sx]  .wm-map-wrapper > div {
    height: 100%;
}

/* ---- Layer switches: what the map is drawing. Sits in WMMap's overlay slot, so it
   positions against the map wrapper and travels into fullscreen with it. Top-left: the
   map's own nav buttons own the top-right. ---- */
.ddm-layers[b-0sxezbk4sx] {
    position: absolute;
    top: 12px;
    left: 12px;
    z-index: 5;
    min-width: 150px;
    max-width: 200px;
    padding: 8px 10px;
    border-radius: 10px;
    background: #FFFFFFF2;
    border: 1px solid #E2E8F0;
    box-shadow: 0 2px 8px #0F172A14;
}

.ddm-layers-header[b-0sxezbk4sx] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    width: 100%;
    padding: 0;
    border: none;
    background: none;
    cursor: pointer;
}

.ddm-layers-title[b-0sxezbk4sx] {
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: #5F6E85;
}

.ddm-layers-chevron[b-0sxezbk4sx] {
    flex-shrink: 0;
    transition: transform .15s;
}

.ddm-layers-chevron--collapsed[b-0sxezbk4sx] {
    transform: rotate(-90deg);
}

.ddm-layers-body[b-0sxezbk4sx] {
    padding-top: 4px;
    /* A municipality run legends 28 routes under 12 contractors; the panel scrolls
       rather than covering the map it is a key to. */
    max-height: 340px;
    overflow-y: auto;
}

.ddm-legend-sep[b-0sxezbk4sx] {
    height: 1px;
    margin: 6px 0;
    background: #E2E8F0;
}

/* ---- The legend's contractor header: checkbox to switch the company off the map,
   name to fold its routes away. ---- */
.ddm-contractor-row[b-0sxezbk4sx] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 3px 0 1px;
}

.ddm-contractor-row.ddm-layer-row--off .ddm-contractor-label[b-0sxezbk4sx],
.ddm-contractor-row.ddm-layer-row--off .ddm-layer-count[b-0sxezbk4sx] {
    opacity: 0.4;
}

.ddm-contractor-name[b-0sxezbk4sx] {
    flex: 1;
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 4px;
    padding: 0;
    border: none;
    background: none;
    cursor: pointer;
    text-align: left;
}

.ddm-contractor-label[b-0sxezbk4sx] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: #334155;
}

/* A route row under its contractor steps in, so the tree reads as one. */
.ddm-layer-row--indent[b-0sxezbk4sx] {
    padding-left: 14px;
}

.ddm-layers-all[b-0sxezbk4sx] {
    display: block;
    margin-bottom: 2px;
    padding: 0;
    border: none;
    background: none;
    font-size: 11px;
    font-weight: 600;
    color: #5263FF;
    cursor: pointer;
}

.ddm-layer-row[b-0sxezbk4sx] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0;
    padding: 2px 0;
    cursor: pointer;
}

.ddm-layer-row--off .ddm-layer-dot[b-0sxezbk4sx],
.ddm-layer-row--off .ddm-layer-name[b-0sxezbk4sx],
.ddm-layer-row--off .ddm-layer-count[b-0sxezbk4sx] {
    opacity: 0.4;
}

.ddm-layer-check[b-0sxezbk4sx] {
    width: 13px;
    height: 13px;
    margin: 0;
    flex-shrink: 0;
    accent-color: #5263FF;
    cursor: pointer;
}

.ddm-layer-dot[b-0sxezbk4sx] {
    flex-shrink: 0;
    width: 8px;
    height: 8px;
    border-radius: 3px;
}

.ddm-layer-name[b-0sxezbk4sx] {
    flex: 1;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 12px;
    font-weight: 600;
    color: #1E293B;
}

.ddm-layer-count[b-0sxezbk4sx] {
    flex-shrink: 0;
    font-size: 11px;
    font-weight: 700;
    color: #5F6E85;
    font-variant-numeric: tabular-nums;
}

.ddm-placeholder[b-0sxezbk4sx] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 44px;
    padding: 12px;
    border: 1px dashed #CBD5E1;
    border-radius: 8px;
    background: #F8FAFC;
    font-size: 13px;
    color: #5F6E85;
}

/* ---- Drive timeline: one line per driver, the scrubber below is the axis ---- */
.ddm-timeline[b-0sxezbk4sx] {
    margin-top: 16px;
}

.ddm-timeline-title[b-0sxezbk4sx] {
    margin: 0 0 10px;
    font-size: 12px;
    font-weight: 700;
    color: #5F6E85;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.ddm-drivers[b-0sxezbk4sx] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.ddm-driver-line[b-0sxezbk4sx] {
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
    font-size: 13px;
    font-weight: 600;
    color: #1E293B;
}

.ddm-swatch[b-0sxezbk4sx] {
    flex-shrink: 0;
    width: 8px;
    height: 8px;
    border-radius: 3px;
}

.ddm-driver-name[b-0sxezbk4sx] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.ddm-live-dot[b-0sxezbk4sx] {
    width: 6px;
    height: 6px;
    margin-right: 6px;
    flex-shrink: 0;
    border-radius: 50%;
    background: #FFFFFF;
    animation: ddm-pulse-b-0sxezbk4sx 2s ease-in-out infinite;
}

@keyframes ddm-pulse-b-0sxezbk4sx {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.35; }
}

.ddm-times[b-0sxezbk4sx] {
    display: flex;
    align-items: center;
    gap: 4px;
    white-space: nowrap;
    font-size: 12px;
    color: #5F6E85;
    font-variant-numeric: tabular-nums;
}

.ddm-open[b-0sxezbk4sx] {
    color: #15803D;
    font-weight: 600;
}

.ddm-axis[b-0sxezbk4sx] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 2px;
    font-size: 11px;
    color: #94A3B8;
    font-variant-numeric: tabular-nums;
}

/* ---- Scrub row ---- */
.ddm-scrub-row[b-0sxezbk4sx] {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    margin-top: 10px;
}

.ddm-scrub-live[b-0sxezbk4sx] {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    border: none;
    background: #F1F5F9;
    color: #475569;
    font-size: 11px;
    font-weight: 700;
    border-radius: 99px;
    padding: 3px 10px;
    cursor: pointer;
}

.ddm-scrub-live--on[b-0sxezbk4sx] {
    background: #22C55E1A;
    color: #15803D;
}

.ddm-scrub-live .ddm-live-dot[b-0sxezbk4sx] {
    margin-right: 0;
    background: #22C55E;
}

.ddm-scrub-live:not(.ddm-scrub-live--on) .ddm-live-dot[b-0sxezbk4sx] {
    background: #94A3B8;
    animation: none;
}

.ddm-scrub-track[b-0sxezbk4sx] {
    flex: 1;
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.ddm-scrub-slider[b-0sxezbk4sx] {
    flex: 1;
    min-width: 0;
    height: 4px;
    margin: 0;
    cursor: pointer;
    accent-color: #5263FF;
}

.ddm-scrub-time[b-0sxezbk4sx] {
    flex-shrink: 0;
    text-align: right;
    font-size: 12px;
    font-weight: 600;
    color: #1E293B;
    font-variant-numeric: tabular-nums;
}

/* ---- Fullscreen: the whole section goes up, so the run facts and the timeline
   scrubber stay usable over the enlarged map. The map flexes to fill. ---- */
.ddm-section:fullscreen[b-0sxezbk4sx] {
    display: flex;
    flex-direction: column;
    border: none;
    border-radius: 0;
    background: #FFFFFF;
    overflow: auto;
}

.ddm-section:fullscreen .ddm-map[b-0sxezbk4sx] {
    flex: 1;
    min-height: 0;
    height: auto;
}

/* Nothing recorded: one line, not an empty map. */
.ddm-empty[b-0sxezbk4sx] {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 56px;
    padding: 12px;
    border: 1px dashed #CBD5E1;
    border-radius: 8px;
    background: #F8FAFC;
    font-size: 13px;
    color: #5F6E85;
}

/* A driver whose fixes ran past the read ceiling: the line stops before their shift did. */
.ddm-trail-short[b-0sxezbk4sx] {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-top: 8px;
    font-size: 12px;
    color: #B45309;
}
/* /Pages/Dispatch/Components/DispatchErrorsPopup.razor.rz.scp.css */
.errors-popup-body[b-634hh0cwww] {
    max-height: min(60vh, 520px);
    overflow-y: auto;
    scrollbar-width: thin;
    padding: 4px 24px 20px;
}

.errors-popup-status[b-634hh0cwww] {
    padding: 24px 0;
    text-align: center;
    color: #5B6B85;
    font-size: 13px;
}

.errors-popup-list[b-634hh0cwww] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
}

.errors-popup-row[b-634hh0cwww] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 14px 0;
    border-bottom: 1px solid #EEF1F6;
}

.errors-popup-row:last-child[b-634hh0cwww] {
    border-bottom: none;
}

.row-main[b-634hh0cwww] {
    display: flex;
    flex-direction: column;
    gap: 1px;
    min-width: 0;
}

.row-name[b-634hh0cwww] {
    font-size: 13.5px;
    font-weight: 600;
    color: #0A1C3D;
    overflow-wrap: anywhere;
}

.row-detail[b-634hh0cwww] {
    font-size: 12px;
    color: #5B6B85;
    overflow-wrap: anywhere;
}

.row-meta[b-634hh0cwww] {
    font-size: 11.5px;
    font-weight: 600;
    color: #94A3B8;
    font-variant-numeric: tabular-nums;
}

.row-fix[b-634hh0cwww] {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    flex: 0 0 auto;
}

.row-fix-picker[b-634hh0cwww] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    width: 200px;
}

.row-suggestion[b-634hh0cwww] {
    font-size: 11px;
    color: #94A3B8;
}

.row-assign[b-634hh0cwww],
.row-show[b-634hh0cwww] {
    margin: 0;
    white-space: nowrap;
    flex: 0 0 auto;
}

.errors-popup-section[b-634hh0cwww] {
    margin-bottom: 8px;
}

.errors-popup-section .section-head[b-634hh0cwww] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 4px 8px;
    border-bottom: 2px solid #E3E8F0;
    cursor: pointer;
    user-select: none;
}

.errors-popup-section .section-head:hover[b-634hh0cwww] {
    background-color: #F8FAFC;
}

.errors-popup-section .section-chevron[b-634hh0cwww] {
    display: inline-block;
    width: 14px;
    color: #94A3B8;
    font-size: 12px;
}

.errors-popup-section .section-actions[b-634hh0cwww] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.errors-popup-section .section-count[b-634hh0cwww] {
    min-width: 22px;
    padding: 1px 8px;
    border-radius: 10px;
    background-color: #EEF2F7;
    font-size: 11.5px;
    font-weight: 700;
    color: #64748B;
    text-align: center;
    font-variant-numeric: tabular-nums;
}

.errors-popup-section .section-name[b-634hh0cwww] {
    font-size: 13px;
    font-weight: 700;
    color: #0A1C3D;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.errors-popup-section .section-own[b-634hh0cwww] {
    color: #94A3B8;
    font-weight: 600;
    text-transform: none;
    letter-spacing: normal;
    margin-left: 4px;
}

.errors-popup-section .section-notify[b-634hh0cwww] {
    margin: 0;
    white-space: nowrap;
}

/* ── Multi-select: gap addresses onto one route ── */

.errors-popup-section .section-name[b-634hh0cwww] {
    display: flex;
    align-items: center;
    gap: 6px;
}

.section-select-all[b-634hh0cwww],
.row-select[b-634hh0cwww] {
    flex: 0 0 auto;
}

.custom-check input:disabled + .checkmark[b-634hh0cwww] {
    opacity: 0.45;
    cursor: not-allowed;
}

.errors-popup-row.row-selectable[b-634hh0cwww] {
    justify-content: flex-start;
    gap: 12px;
}

.section-selection-bar[b-634hh0cwww] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
    padding: 10px 8px;
    border-bottom: 1px solid #EEF1F6;
    background-color: #F8FAFC;
    border-radius: 0 0 8px 8px;
}

.selection-count[b-634hh0cwww] {
    font-size: 12px;
    font-weight: 700;
    color: #0A1C3D;
    white-space: nowrap;
}

.selection-route-picker[b-634hh0cwww] {
    width: 240px;
}

.selection-add[b-634hh0cwww] {
    margin: 0;
    white-space: nowrap;
}

.selection-no-routes[b-634hh0cwww] {
    font-size: 12px;
    color: #94A3B8;
}

.selection-hint[b-634hh0cwww] {
    flex-basis: 100%;
    font-size: 11px;
    color: #94A3B8;
}
/* /Pages/Dispatch/Components/DispatchMergeChoicePrompt.razor.rz.scp.css */
/* Merge-choice prompt: consequence notes. The same treatment the three create dialogs gave
   their own copies of this prompt, moved here with the markup. */
.merge-choice-note[b-vtdfnwwrhq] {
    background: #edf2ff;
    color: #4263eb;
    border-radius: 10px;
    padding: 10px 14px;
    font-size: 13px;
    font-weight: 600;
    line-height: 1.45;
}

.merge-choice-note.warning[b-vtdfnwwrhq] {
    background: #fff4e6;
    color: #d9480f;
}

/* The question above the cards, only asked when there is more than one to pick from. */
.merge-choice-hint[b-vtdfnwwrhq] {
    font-size: 14px;
    font-weight: 600;
    line-height: 1.45;
    color: #23262F;
}

/* Several open dispatches is a real situation on a long storm day, so the list scrolls rather
   than pushing the answers off the bottom of the dialog. */
.merge-choice-list[b-vtdfnwwrhq] {
    max-height: 320px;
    overflow-y: auto;
}

.merge-choice-card.selectable[b-vtdfnwwrhq] {
    cursor: pointer;
    border: 1px solid #EBECED;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.merge-choice-card.selectable:hover[b-vtdfnwwrhq] {
    border-color: #B9C0FF;
}

.merge-choice-card.selectable:focus-visible[b-vtdfnwwrhq] {
    outline: none;
    border-color: #4A55E1;
}

.merge-choice-card.selected[b-vtdfnwwrhq] {
    border-color: #4A55E1;
    box-shadow: 0 0 0 1px #4A55E1 inset;
}
/* /Pages/Dispatch/Components/DispatchReplacementLinks.razor.rz.scp.css */
/* A card in the slider's detail column, quiet by default: it renders only when there is a link
   to show or one that could be made. */
.drl-section[b-9k7ylvsd2w] {
    padding: 16px;
    background: #FFFFFF;
    border: 1px solid #E2E8F0;
    border-radius: 12px;
}

.drl-section h6[b-9k7ylvsd2w] {
    margin: 0 0 12px;
    color: #1E293B;
    font-size: 15px;
    font-weight: 800;
    line-height: 20px;
}

.drl-section h6.drl-second[b-9k7ylvsd2w] {
    margin-top: 16px;
}

.drl-link[b-9k7ylvsd2w] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 8px 0;
    border-top: 1px solid #F1F5F9;
}

.drl-link-text[b-9k7ylvsd2w] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.drl-link-text strong[b-9k7ylvsd2w] {
    color: #1E293B;
    font-size: 13px;
    font-weight: 700;
}

.drl-link-text span[b-9k7ylvsd2w] {
    overflow: hidden;
    color: #64748B;
    font-size: 12px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.drl-unlink[b-9k7ylvsd2w],
.drl-link-btn[b-9k7ylvsd2w] {
    padding: 6px 12px;
    border: 1px solid #E2E8F0;
    border-radius: 8px;
    background: #FFFFFF;
    color: #1E293B;
    font-size: 12px;
    font-weight: 700;
    white-space: nowrap;
}

.drl-link-btn[b-9k7ylvsd2w] {
    border-color: #2563EB;
    background: #2563EB;
    color: #FFFFFF;
}

.drl-picker[b-9k7ylvsd2w] {
    margin-top: 12px;
}

.drl-picker-label[b-9k7ylvsd2w] {
    display: block;
    margin-bottom: 6px;
    color: #64748B;
    font-size: 12px;
}

.drl-picker-row[b-9k7ylvsd2w] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.drl-picker-dropdown[b-9k7ylvsd2w] {
    flex: 1 1 auto;
    min-width: 0;
}
/* /Pages/Dispatch/Components/DispatchStopFilterButton.razor.rz.scp.css */
/* The Filter button sits beside the status tabs and shares their outline-chip look. */
.stop-filter-btn[b-fe46w2doxe] {
    min-height: 34px;
    border: 1px solid #E2E8F0;
    border-radius: 9px;
    background: #FFFFFF;
    color: #5F6E85;
    padding: 7px 10px;
    font-size: 12px;
    font-weight: 700;
    white-space: nowrap;
}

.stop-filter-btn img[b-fe46w2doxe] {
    width: 14px;
    height: 14px;
}

.stop-filter-btn.active[b-fe46w2doxe] {
    border-color: #5263FF;
    color: #363AF5;
    background: #5263FF0F;
}

.stop-filter-count[b-fe46w2doxe] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 18px;
    height: 18px;
    padding: 0 5px;
    border-radius: 9px;
    background: #5263FF;
    color: #FFFFFF;
    font-size: 11px;
    font-weight: 700;
    line-height: 18px;
}

/* Popover: same anchoring as the slider's "add more" kind menu. */
.stop-filter-backdrop[b-fe46w2doxe] {
    position: fixed;
    inset: 0;
    z-index: 1079;
}

.stop-filter-menu[b-fe46w2doxe] {
    position: absolute;
    top: calc(100% + 6px);
    right: 0;
    z-index: 1080;
    min-width: 240px;
    max-width: 320px;
    padding: 10px 12px;
    background: #FFFFFF;
    border-radius: 12px;
    border: 1px solid #1E293B0F;
    box-shadow: 0 8px 24px #1E293B1F;
}

.stop-filter-head[b-fe46w2doxe] {
    padding-bottom: 8px;
    border-bottom: 1px solid #1E293B0F;
}

.stop-filter-head strong[b-fe46w2doxe] {
    color: #1E293B;
    font-size: 13px;
    font-weight: 700;
}

.stop-filter-clear[b-fe46w2doxe] {
    border: none;
    background: transparent;
    padding: 0;
    color: #363AF5;
    font-size: 12px;
    font-weight: 700;
}

.stop-filter-group[b-fe46w2doxe] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding-top: 8px;
}

.stop-filter-group + .stop-filter-group[b-fe46w2doxe] {
    margin-top: 6px;
    border-top: 1px solid #1E293B0F;
}

.stop-filter-label[b-fe46w2doxe] {
    color: #5F6E85;
    font-size: 11px;
    font-weight: 800;
    line-height: 16px;
    text-transform: uppercase;
    margin-bottom: 2px;
}

.stop-filter-option[b-fe46w2doxe] {
    margin: 0;
    padding: 4px 2px;
    border-radius: 6px;
    cursor: pointer;
    user-select: none;
}

.stop-filter-option:hover[b-fe46w2doxe] {
    background: #F8FAFC;
}

.stop-filter-option input[b-fe46w2doxe] {
    width: 15px;
    height: 15px;
    margin: 0;
    accent-color: #5263FF;
    flex-shrink: 0;
}

.stop-filter-option img[b-fe46w2doxe] {
    width: 14px;
    height: 14px;
}

.stop-filter-option-text[b-fe46w2doxe] {
    color: #1E293B;
    font-size: 13px;
    font-weight: 600;
    line-height: 18px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
/* /Pages/Dispatch/Components/DispatchWeatherBox.razor.rz.scp.css */
/* Blazor CSS isolation scopes the slider's stylesheet to the slider's OWN elements, and its
   overview rules carry no ::deep — so none of `.box`, `.box-2`, `h5` or the icon/label/value
   chrome reaches inside this child component. Everything this panel needs is therefore defined
   here, deliberately reusing the slider's scale and palette (18px/800 headings, 13px/12px body
   at 600-800, #1E293B primary, #475569 secondary, #5F6E85 muted, #5263FF brand) so it still
   reads as one panel rather than a second design.
   ────────────────────────────────────────────────────────────────────────────────────────── */

.dispatch-weather[b-vj3z31pp9c] {
	max-width: 100%;
	overflow-x: hidden;
}

.dispatch-weather .box[b-vj3z31pp9c] {
	margin-bottom: 32px;
}

.dispatch-weather .box h5[b-vj3z31pp9c] {
	font-size: 18px;
	font-weight: 800;
	line-height: 24px;
	letter-spacing: -0.2px;
	color: #1E293B;
	margin-bottom: 16px;
}

/* The label/value rows, matching the Details box next door. */
.dispatch-weather .box-2 .row .icon[b-vj3z31pp9c] {
	min-height: 40px;
	min-width: 40px;
	background-color: #5263FF1F;
	border-radius: 8px;
}

.dispatch-weather .box-2 .row .icon img[b-vj3z31pp9c] {
	width: 20px;
	height: 20px;
}

.dispatch-weather .box-2 .row .icon-txt p[b-vj3z31pp9c] {
	margin: 0;
	font-size: 13px;
	font-weight: 700;
	line-height: 20px;
	color: #1E293B;
}

.dispatch-weather .box-2 .row .icon-txt span[b-vj3z31pp9c] {
	font-size: 13px;
	font-weight: 500;
	line-height: 20px;
	color: #475569;
}

.dispatch-weather .dds-empty[b-vj3z31pp9c] {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 56px;
	border: 1px dashed #CBD5E1;
	border-radius: 8px;
	background: #F8FAFC;
	color: #5F6E85;
	font-size: 13px;
	font-weight: 700;
	text-align: center;
	padding: 16px;
}

.dispatch-weather .dw-headline[b-vj3z31pp9c] {
	margin-top: 8px;
}

.dispatch-weather .dw-temp[b-vj3z31pp9c] {
	font-size: 24px;
	font-weight: 800;
	line-height: 1;
	letter-spacing: -0.2px;
	color: #1E293B;
}

.dispatch-weather .dw-status[b-vj3z31pp9c] {
	border-radius: 12px;
	padding: 4px 12px;
	font-size: 12px;
	font-weight: 700;
	line-height: 18px;
	white-space: nowrap;
}

/* The three dispatch bands, in the palette the slider already uses for status. */
.dispatch-weather .dw-status.green[b-vj3z31pp9c] {
	background: #409B3F1F;
	color: #337C33;
}

.dispatch-weather .dw-status.yellow[b-vj3z31pp9c] {
	background: #FEF3C7;
	color: #B45309;
}

.dispatch-weather .dw-status.red[b-vj3z31pp9c] {
	background: #DC26261F;
	color: #DC2626;
}

.dispatch-weather .dw-status.unknown[b-vj3z31pp9c] {
	background: #F1F5F9;
	color: #5F6E85;
}

/* ── The stored forecast curve ─────────────────────────────────────────────── */

/* Y labels sit in a fixed gutter so the plot can stretch without distorting the type. */
.dispatch-weather .dw-plot[b-vj3z31pp9c] {
	display: flex;
	align-items: stretch;
	margin-top: 8px;
}

.dispatch-weather .dw-y-axis[b-vj3z31pp9c] {
	position: relative;
	width: 52px;
	flex: 0 0 52px;
	height: 140px;
}

.dispatch-weather .dw-y-axis .dw-tick[b-vj3z31pp9c] {
	position: absolute;
	right: 8px;
	transform: translateY(-50%);
	font-size: 12px;
	font-weight: 600;
	line-height: 18px;
	color: #5F6E85;
	white-space: nowrap;
}

.dispatch-weather .dw-y-axis .dw-tick.freezing[b-vj3z31pp9c] {
	color: #DC2626;
	font-weight: 700;
}

.dispatch-weather .dw-plot-area[b-vj3z31pp9c] {
	position: relative;
	flex: 1 1 auto;
	min-width: 0;
	height: 140px;
	border-left: 1px solid #E2E8F0;
	border-bottom: 1px solid #E2E8F0;
}

.dispatch-weather .dw-chart[b-vj3z31pp9c] {
	width: 100%;
	height: 100%;
	display: block;
	overflow: visible;
}

.dispatch-weather .dw-curve[b-vj3z31pp9c] {
	fill: none;
	stroke: #5263FF;
	stroke-width: 2;
	vector-effect: non-scaling-stroke;
}

/* Below freezing is the part that justifies a dispatch, so it is the part that is shaded. */
.dispatch-weather .dw-below[b-vj3z31pp9c] {
	fill: rgba(220, 38, 38, 0.12);
	stroke: none;
}

.dispatch-weather .dw-freezing[b-vj3z31pp9c] {
	stroke: #DC2626;
	stroke-width: 1;
	stroke-dasharray: 4 3;
	vector-effect: non-scaling-stroke;
}

.dispatch-weather .dw-planned[b-vj3z31pp9c] {
	stroke: #1E293B;
	stroke-width: 1;
	stroke-dasharray: 2 3;
	vector-effect: non-scaling-stroke;
}

.dispatch-weather .dw-cursor[b-vj3z31pp9c] {
	stroke: #5263FF;
	stroke-width: 1;
	vector-effect: non-scaling-stroke;
}

/* Invisible but hit-testable: fill:none would not receive the pointer. */
.dispatch-weather .dw-hit[b-vj3z31pp9c] {
	fill: transparent;
	cursor: crosshair;
}

/* ── Hover readout ─────────────────────────────────────────────────────────── */

.dispatch-weather .dw-readout[b-vj3z31pp9c] {
	position: absolute;
	bottom: calc(100% + 8px);
	transform: translateX(-50%);
	background: #1E293B;
	color: #FFFFFF;
	border-radius: 8px;
	padding: 10px 12px;
	font-size: 12px;
	font-weight: 600;
	line-height: 18px;
	white-space: nowrap;
	pointer-events: none;
	z-index: 2;
	display: flex;
	flex-direction: column;
	box-shadow: 0 4px 12px rgba(30, 41, 59, 0.25);
}

.dispatch-weather .dw-readout strong[b-vj3z31pp9c] {
	font-size: 13px;
	font-weight: 700;
	line-height: 20px;
	margin-bottom: 2px;
}

/* ── X axis ────────────────────────────────────────────────────────────────── */

.dispatch-weather .dw-x-axis[b-vj3z31pp9c] {
	display: flex;
	align-items: flex-start;
}

.dispatch-weather .dw-x-spacer[b-vj3z31pp9c] {
	width: 52px;
	flex: 0 0 52px;
}

.dispatch-weather .dw-x-ticks[b-vj3z31pp9c] {
	position: relative;
	flex: 1 1 auto;
	min-width: 0;
	height: 22px;
	/* Last line of defence: no tick may widen the tab into a horizontal scroll. */
	overflow: hidden;
}

.dispatch-weather .dw-x-ticks .dw-tick[b-vj3z31pp9c] {
	position: absolute;
	transform: translateX(-50%);
	top: 4px;
	font-size: 12px;
	font-weight: 600;
	line-height: 18px;
	color: #5F6E85;
	white-space: nowrap;
}

.dispatch-weather .dw-x-ticks .dw-tick.at-start[b-vj3z31pp9c] {
	left: 0;
	transform: none;
}

.dispatch-weather .dw-x-ticks .dw-tick.at-end[b-vj3z31pp9c] {
	right: 0;
	transform: none;
}

.dispatch-weather .dw-x-ticks .dw-tick.planned[b-vj3z31pp9c] {
	color: #1E293B;
	font-weight: 700;
}

.dispatch-weather .dw-axis-title[b-vj3z31pp9c] {
	text-align: center;
	font-size: 12px;
	font-weight: 600;
	line-height: 18px;
	color: #94A3B8;
	margin-top: 2px;
}

/* ── Legend and hint ───────────────────────────────────────────────────────── */

.dispatch-weather .dw-legend[b-vj3z31pp9c] {
	margin-top: 12px;
	font-size: 13px;
	font-weight: 600;
	line-height: 20px;
	color: #475569;
}

.dispatch-weather .dw-key[b-vj3z31pp9c]::before {
	content: "";
	display: inline-block;
	width: 14px;
	margin-right: 6px;
	vertical-align: middle;
}

.dispatch-weather .dw-key-curve[b-vj3z31pp9c]::before {
	border-top: 2px solid #5263FF;
}

.dispatch-weather .dw-key-freezing[b-vj3z31pp9c]::before {
	border-top: 1px dashed #DC2626;
}

.dispatch-weather .dw-key-planned[b-vj3z31pp9c]::before {
	border-top: 1px dashed #1E293B;
}

.dispatch-weather .dw-hint[b-vj3z31pp9c] {
	margin: 6px 0 0;
	font-size: 12px;
	font-weight: 600;
	line-height: 18px;
	color: #94A3B8;
}

/* ── Where the reading was taken ───────────────────────────────────────────── */

.dispatch-weather .dw-map[b-vj3z31pp9c] {
	border-radius: 8px;
	overflow: hidden;
	margin-top: 8px;
	/* The iframe brings its own layer buttons and legend, so it needs real height to be
	   usable; below this the Windy controls start covering the map itself. */
	height: 380px;
}

.dispatch-weather .dw-map-frame[b-vj3z31pp9c] {
	width: 100%;
	height: 100%;
	border: 0;
	display: block;
}

/* ── Provenance ────────────────────────────────────────────────────────────── */

/* Deliberately quiet: this is there to be checked, not read every time. */
.dispatch-weather .dw-provenance p[b-vj3z31pp9c] {
	margin: 0 0 4px;
	font-size: 12px;
	font-weight: 600;
	line-height: 18px;
	color: #5F6E85;
	overflow-wrap: anywhere;
}

.dispatch-weather .dw-fingerprint code[b-vj3z31pp9c],
.dispatch-weather .dw-source code[b-vj3z31pp9c] {
	font-size: 12px;
	font-weight: 600;
	color: #94A3B8;
}
/* /Pages/Dispatch/Components/ForceInvitationAnswerPopup.razor.rz.scp.css */
/* WMPopup zeroes the modal body's padding so each host sets its own. */
.force-answer-body[b-edp3jafm4p] {
    padding: 20px 24px 4px;
}

/* Two choices side by side, styled after the tri-state answer pill they were opened from:
   grey until picked, then green for accept and red for decline. */
.force-answer-choices[b-edp3jafm4p] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
}

.force-answer-choice[b-edp3jafm4p] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 10px 12px;
    border: 1px solid #EBECED;
    border-radius: 8px;
    background: #FFFFFF;
    font-size: 14px;
    font-weight: 600;
    color: #5F6E85;
    cursor: pointer;
}

.force-answer-choice:focus-visible[b-edp3jafm4p] {
    outline: 2px solid #4A55E1;
    outline-offset: 2px;
}

.force-answer-choice .dot[b-edp3jafm4p] {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #94A3B8;
    flex-shrink: 0;
}

.force-answer-choice.accept.selected[b-edp3jafm4p] {
    border-color: #337C33;
    background: #409B3F1F;
    color: #296C28;
}

.force-answer-choice.accept.selected .dot[b-edp3jafm4p] {
    background: #337C33;
}

.force-answer-choice.decline.selected[b-edp3jafm4p] {
    border-color: #ED4030;
    background: #ED40301F;
    color: #B82213;
}

.force-answer-choice.decline.selected .dot[b-edp3jafm4p] {
    background: #ED4030;
}

.force-answer-explains[b-edp3jafm4p] {
    margin: 14px 0 0;
    font-size: 13px;
    line-height: 18px;
    color: #5F6E85;
}

.force-answer-label[b-edp3jafm4p] {
    display: block;
    margin: 14px 0 8px;
    font-size: 14px;
    font-weight: 500;
    color: #23262F;
}

.force-answer-input[b-edp3jafm4p] {
    width: 100%;
    min-height: 96px;
    padding: 12px 14px;
    resize: vertical;
    border: 1px solid #EBECED;
    border-radius: 8px;
    font-size: 14px;
    line-height: 20px;
    color: #23262F;
    outline: none;
}

.force-answer-input[b-edp3jafm4p]::placeholder {
    color: #9A9FA5;
}

.force-answer-input:focus[b-edp3jafm4p] {
    border-color: #4A55E1;
}

.force-answer-input.invalid[b-edp3jafm4p] {
    border-color: #E4626F;
}

.force-answer-meta[b-edp3jafm4p] {
    margin-top: 6px;
    min-height: 18px;
}

.force-answer-error[b-edp3jafm4p] {
    font-size: 12px;
    color: #E4626F;
}

.force-answer-count[b-edp3jafm4p] {
    font-size: 12px;
    color: #9A9FA5;
}
/* /Pages/Dispatch/Components/LocationActionModal.razor.rz.scp.css */
.locationActionSlider.right[b-9snoqsd2e7] {
    background: rgba(0, 0, 0, 0.34);
}

.locationActionSlider.z-index-lower[b-9snoqsd2e7] {
    z-index: 1049 !important;
}

.locationActionSlider.z-index-lower .modal-content[b-9snoqsd2e7] {
    filter: brightness(0.96);
    box-shadow: -18px 0 46px rgba(15, 23, 42, 0.18);
}

.locationActionSlider.right .modal-dialog[b-9snoqsd2e7] {
    position: fixed;
    margin: 0;
    right: 0;
    top: 0;
    height: 100%;
    max-width: 550px;
    width: min(550px, calc(100vw - 88px));
    z-index: 1;
}

.locationActionSlider.right .modal-content[b-9snoqsd2e7] {
    height: 100vh;
    border-radius: 0;
    border: none;
    display: flex;
    flex-direction: column;
}

.locationActionSlider.right.fade .modal-dialog[b-9snoqsd2e7] {
    transform: translateX(100%);
    transition: transform 0.3s ease-out;
}

.locationActionSlider.right.show .modal-dialog[b-9snoqsd2e7] {
    transform: translateX(0);
}

.locationActionSlider .modal-header[b-9snoqsd2e7] {
    padding: 10px 20px 14px;
    border-bottom: 0;
    flex-shrink: 0;
}

.locationActionSlider .btn-close[b-9snoqsd2e7] {
    width: 42px;
    height: 42px;
    margin: 0;
    border-radius: 12px;
    background-color: #F1F5F9;
    opacity: 1;
}

.lam-header-main[b-9snoqsd2e7] {
    min-width: 0;
}

.lam-icon[b-9snoqsd2e7] {
    width: 48px;
    height: 48px;
    border-radius: 10px;
    background: #EEF0FF;
    flex-shrink: 0;
}

.lam-icon img[b-9snoqsd2e7] {
    width: 22px;
    height: 22px;
}

.lam-title[b-9snoqsd2e7] {
    margin: 0;
    color: #1E293B;
    font-size: 16px;
    font-weight: 800;
    line-height: 22px;
    letter-spacing: 0;
}

.lam-header-text[b-9snoqsd2e7] {
    min-width: 0;
}

.lam-header-text p[b-9snoqsd2e7] {
    margin: 2px 0 0;
    color: #5F6E85;
    font-size: 13px;
    font-weight: 600;
    line-height: 20px;
}

/* Registered by hand rather than driven: the same colours the invoice line's tag wears. */
.lam-manual-tag[b-9snoqsd2e7] {
    background: #ccfbf1;
    border-radius: 8px;
    color: #115e59;
    display: inline-flex;
    font-size: 11px;
    font-weight: 700;
    line-height: 16px;
    margin-top: 4px;
    padding: 2px 8px;
}

.admin-completed-icon[b-9snoqsd2e7] {
    width: 18px;
    height: 18px;
    filter: brightness(0) saturate(100%) invert(27%) sepia(95%) saturate(5500%) hue-rotate(355deg) brightness(97%) contrast(90%);
}

.lam-loading[b-9snoqsd2e7] {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 1;
    color: #0D6EFD;
}

.lam-body[b-9snoqsd2e7] {
    flex: 1;
    overflow-y: auto;
    padding: 0 !important;
    background: #FFFFFF;
}

.lam-section[b-9snoqsd2e7] {
    padding: 16px 24px;
    border-top: 1px solid #F1F5F9;
}

.lam-section h6[b-9snoqsd2e7] {
    margin: 0 0 12px;
    color: #1E293B;
    font-size: 15px;
    font-weight: 800;
    line-height: 20px;
}

.lam-section h6 span[b-9snoqsd2e7] {
    color: #5F6E85;
}

.lam-checkin-grid[b-9snoqsd2e7] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

.lam-checkin-editor[b-9snoqsd2e7] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 46px;
    row-gap: 12px;
    align-items: start;
}

.lam-time-field[b-9snoqsd2e7] {
    min-width: 0;
}

.lam-time-control[b-9snoqsd2e7] {
    min-width: 0;
}

.lam-time-control label[b-9snoqsd2e7] {
    display: block;
    margin: 0 0 5px;
    color: #5F6E85;
    font-size: 12px;
    font-weight: 700;
    line-height: 16px;
}

.lam-checkin-save[b-9snoqsd2e7] {
    margin-top: 10px;
    min-width: 58px;
}

.lam-detail-item[b-9snoqsd2e7] {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    min-width: 0;
}

.lam-detail-item img[b-9snoqsd2e7] {
    width: 20px;
    height: 20px;
    flex-shrink: 0;
}

.lam-detail-item p[b-9snoqsd2e7] {
    margin: 0 0 2px;
    color: #5F6E85;
    font-size: 12px;
    font-weight: 700;
    line-height: 16px;
}

.lam-detail-item span[b-9snoqsd2e7] {
    color: #1E293B;
    font-size: 13px;
    font-weight: 700;
    line-height: 20px;
    overflow-wrap: anywhere;
}

.lam-actions[b-9snoqsd2e7] {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.lam-action[b-9snoqsd2e7] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 36px;
    border: none;
    border-radius: 8px;
    padding: 8px 12px;
    font-size: 13px;
    font-weight: 700;
}

.lam-action:disabled[b-9snoqsd2e7] {
    opacity: 0.55;
    cursor: not-allowed;
}

.lam-action img[b-9snoqsd2e7] {
    width: 16px;
    height: 16px;
}

.lam-action.complete[b-9snoqsd2e7] {
    color: #296C28;
    background: #409B3F1F;
}

.lam-action.warning[b-9snoqsd2e7] {
    color: #A16207;
    background: #FEF3C7;
}

.lam-action.neutral[b-9snoqsd2e7] {
    color: #363AF5;
    background: #5263FF1F;
}

.lam-note-readonly[b-9snoqsd2e7] {
    color: #5F6E85;
    font-size: 13px;
    font-weight: 600;
    line-height: 20px;
    white-space: pre-wrap;
}

.lam-note-input[b-9snoqsd2e7] {
    font-size: 13px;
    border: 1px solid #E2E8F0;
    border-radius: 8px;
}

.lam-note-input:focus[b-9snoqsd2e7] {
    border-color: #363AF5;
    box-shadow: 0 0 0 2px #5263FF1F;
}

.lam-theme-input[b-9snoqsd2e7] {
    font-size: 13px !important;
    font-weight: 600;
    color: #1E293B;
    border: 1px solid #E2E8F0 !important;
    border-radius: 8px !important;
    background-color: #FFFFFF;
    min-height: 40px;
    padding: 8px 12px;
    transition: border-color 0.15s ease, box-shadow 0.15s ease, background-color 0.15s ease;
}

.lam-theme-input:focus[b-9snoqsd2e7] {
    border-color: #363AF5 !important;
    box-shadow: 0 0 0 2px #5263FF1F !important;
    outline: none;
}

.lam-theme-input:disabled[b-9snoqsd2e7] {
    color: #94A3B8;
    background-color: #F8FAFC;
    cursor: not-allowed;
}

.lam-theme-input.is-invalid[b-9snoqsd2e7] {
    border-color: #DC2626 !important;
    box-shadow: 0 0 0 2px #FEE2E2 !important;
}

.lam-date-input[b-9snoqsd2e7] {
    width: 100%;
    height: 40px;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
}

.lam-date-input[b-9snoqsd2e7]::-webkit-calendar-picker-indicator {
    cursor: pointer;
    opacity: 0.72;
    align-self: center;
}

.lam-date-input.is-invalid[b-9snoqsd2e7] {
    background-image: none !important;
}

.lam-date-time-picker[b-9snoqsd2e7] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 92px;
    gap: 8px;
    min-width: 0;
}

.lam-date-time-picker[b-9snoqsd2e7]  .lam-calendar-input .wm-calendar-input,
.lam-date-time-picker[b-9snoqsd2e7]  .lam-clock-input .wm-time-input {
    height: 40px !important;
    min-height: 40px !important;
}

.lam-status-select[b-9snoqsd2e7] {
    width: 136px;
    max-width: 46vw;
    padding-right: 32px;
    cursor: pointer;
}

.lam-status-select:disabled[b-9snoqsd2e7] {
    cursor: not-allowed;
}

.lam-validation-message[b-9snoqsd2e7] {
    margin-top: 8px;
    color: #DC2626;
    font-size: 12px;
    font-weight: 700;
    line-height: 18px;
}

.lam-image-grid[b-9snoqsd2e7] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
}

.lam-image-card[b-9snoqsd2e7] {
    position: relative;
    border: 1px solid #E2E8F0;
    border-radius: 8px;
    overflow: hidden;
    background: #F8FAFC;
}

.lam-image-thumbnail[b-9snoqsd2e7] {
    width: 100%;
    aspect-ratio: 1 / 1;
    object-fit: cover;
    display: block;
    cursor: pointer;
    transition: opacity 0.15s;
}

.lam-image-thumbnail:hover[b-9snoqsd2e7] {
    opacity: 0.85;
}

.lam-pdf-thumbnail[b-9snoqsd2e7] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    aspect-ratio: 1 / 1;
    background: #F8FAFC;
}

.lam-pdf-thumbnail img[b-9snoqsd2e7] {
    width: 52px;
    height: 64px;
}

.lam-image-delete[b-9snoqsd2e7] {
    position: absolute;
    top: 4px;
    right: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 26px;
    height: 26px;
    border: none;
    border-radius: 6px;
    background: rgba(255, 255, 255, 0.9);
    cursor: pointer;
}

.lam-image-delete:hover[b-9snoqsd2e7] {
    background: #FEE2E2;
}

.lam-empty[b-9snoqsd2e7] {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 56px;
    border: 1px dashed #CBD5E1;
    border-radius: 8px;
    background: #F8FAFC;
    color: #5F6E85;
    font-size: 13px;
    font-weight: 700;
    text-align: center;
    padding: 16px;
}

/* One pass per route: a segmented toggle picks the pass the card under it describes. */
.lam-visit-toggle[b-9snoqsd2e7] {
    display: flex;
    gap: 4px;
    padding: 4px;
    margin-bottom: 12px;
    background: #F1F5F9;
    border-radius: 10px;
}

.lam-visit-tab[b-9snoqsd2e7] {
    flex: 1 1 0;
    min-width: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 32px;
    padding: 6px 10px;
    border: 0;
    border-radius: 8px;
    background: transparent;
    color: #475569;
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
}

.lam-visit-tab.active[b-9snoqsd2e7] {
    background: #FFFFFF;
    color: #0F172A;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.08);
}

.lam-visit-label[b-9snoqsd2e7] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.lam-visit-dot[b-9snoqsd2e7] {
    flex: none;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #CBD5E1;
}

.lam-visit-dot.in-progress[b-9snoqsd2e7] {
    background: #F59E0B;
}

.lam-visit-dot.completed[b-9snoqsd2e7] {
    background: #337C33;
}

.lam-visit-dot.unable[b-9snoqsd2e7] {
    background: #DC2626;
}

.lam-visit-dot.removed[b-9snoqsd2e7],
.lam-visit-dot.cancelled[b-9snoqsd2e7] {
    background: #94A3B8;
}

.lam-visit-pass[b-9snoqsd2e7] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
    margin-bottom: 16px;
}

/* The pass's outcome and whose pass it was, on one line. Two passes over one address are
   two people's work, and a status badge on its own made them read as one entry printed
   twice. Wraps rather than truncates: the name is the point. */
.lam-visit-pass-head[b-9snoqsd2e7] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
}

.lam-visit-crew[b-9snoqsd2e7] {
    color: #475569;
    font-size: 13px;
    font-weight: 500;
}

.status-badge[b-9snoqsd2e7] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 24px;
    padding: 4px 8px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    line-height: 16px;
    white-space: nowrap;
}

.status-badge.completed[b-9snoqsd2e7] {
    color: #296C28;
    background: #409B3F1F;
}

.status-badge.in-progress[b-9snoqsd2e7] {
    color: #A16207;
    background: #FEF3C7;
}

.status-badge.unable[b-9snoqsd2e7] {
    color: #DC2626;
    background: #FEE2E2;
}

.status-badge.removed[b-9snoqsd2e7] {
    color: #5F6E85;
    background: #F1F5F9;
    border: 1px solid #E2E8F0;
}

.status-badge.cancelled[b-9snoqsd2e7] {
    color: #475569;
    background: #E2E8F0;
}

.status-badge.not-started[b-9snoqsd2e7] {
    color: #475569;
    background: #F1F5F9;
    border: 1px solid #E2E8F0;
}

[b-9snoqsd2e7] .lam-action-confirm-popup {
    z-index: 1070 !important;
}

[b-9snoqsd2e7] .lam-action-confirm-popup .modal-dialog {
    min-width: min(480px, calc(100vw - 32px)) !important;
}

[b-9snoqsd2e7] .lam-action-confirm-popup .wm-popup-modal-content {
    padding: 0 !important;
    border: 1px solid rgba(30, 41, 59, 0.03) !important;
    border-radius: 20px !important;
    background: #FFFFFF !important;
    box-shadow:
        0 1px 1px -0.5px rgba(30, 41, 59, 0.03),
        0 3px 3px -1.5px rgba(30, 41, 59, 0.03),
        0 20px 20px -12px rgba(30, 41, 59, 0.03),
        0 32px 32px -16px rgba(30, 41, 59, 0.03) !important;
}

[b-9snoqsd2e7] .lam-action-confirm-popup .modal-header {
    min-height: 56px;
    padding: 16px 20px !important;
    align-items: flex-end !important;
    border-bottom: 1px solid rgba(30, 41, 59, 0.09) !important;
}

[b-9snoqsd2e7] .lam-action-confirm-popup .modal-header h5.modal-title {
    margin: 0 !important;
    color: #1E293B !important;
    font-size: 18px !important;
    font-weight: 700 !important;
    line-height: 24px !important;
    letter-spacing: -0.2px !important;
}

[b-9snoqsd2e7] .lam-action-confirm-popup .modal-header .btn-close {
    position: absolute;
    top: 12px;
    right: 12px;
    width: 32px !important;
    height: 32px !important;
    margin: 0 !important;
    border: 1px solid rgba(30, 41, 59, 0.06) !important;
    border-radius: 8px !important;
    background-color: rgba(241, 245, 249, 0.8) !important;
    opacity: 1 !important;
}

[b-9snoqsd2e7] .lam-action-confirm-popup .modal-body {
    padding: 0 !important;
    background: #FFFFFF !important;
    border-top: 0 !important;
}

[b-9snoqsd2e7] .lam-action-confirm-popup .wm-popup-modal-footer {
    min-height: 72px;
    padding: 16px 20px !important;
    gap: 12px !important;
    border-top: 1px solid rgba(30, 41, 59, 0.09) !important;
    background: #FFFFFF !important;
}

[b-9snoqsd2e7] .lam-action-confirm-popup .wm-popup-modal-footer button {
    min-height: 40px;
    border-radius: 10px;
    font-size: 13px;
    font-weight: 600;
    line-height: 24px;
    letter-spacing: -0.2px;
}

[b-9snoqsd2e7] .lam-action-confirm-popup .wm-popup-modal-footer .btn-wm-secondary {
    border: 1px solid rgba(30, 41, 59, 0.06);
    background: rgba(241, 245, 249, 0.8);
    color: #1E293B;
}

[b-9snoqsd2e7] .lam-action-confirm-popup .wm-popup-modal-footer .btn-wm-primary {
    border: none;
    background: #5263FF;
    color: #FFFFFF;
    box-shadow: 0 1px 1px -0.5px rgba(30, 41, 59, 0.03), inset 0 3px 3px rgba(255, 255, 255, 0.12);
}

.lam-popup-confirm-body[b-9snoqsd2e7] {
    padding: 20px;
}

.lam-popup-confirm-body p[b-9snoqsd2e7] {
    margin: 0;
    color: #475569;
    font-size: 15px;
    font-weight: 600;
    line-height: 24px;
    letter-spacing: -0.2px;
}

@media (max-width: 600px) {
    .locationActionSlider.right .modal-dialog[b-9snoqsd2e7] {
        max-width: 100%;
    }

    .lam-image-grid[b-9snoqsd2e7] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .lam-checkin-grid[b-9snoqsd2e7] {
        grid-template-columns: 1fr;
    }

    .lam-checkin-editor[b-9snoqsd2e7] {
        grid-template-columns: 1fr;
        gap: 12px;
    }
}

/* ─── Linked complaints ─── */
.lam-complaint-card[b-9snoqsd2e7] {
    border: 1px solid #F59E0B33;
    background: #FffBEB;
    border-radius: 8px;
    padding: 10px 12px;
    margin-top: 8px;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.lam-complaint-card img[b-9snoqsd2e7] {
    width: 16px;
}

.lam-complaint-date[b-9snoqsd2e7] {
    margin: 0;
    font-size: 13px;
    font-weight: 600;
    color: #1E293B;
}

.lam-complaint-description[b-9snoqsd2e7] {
    font-size: 13px;
    color: #475569;
    white-space: pre-wrap;
}

.lam-complaint-resolved[b-9snoqsd2e7] {
    font-size: 11px;
    font-weight: 600;
    color: #16A34A;
    background: #DCFCE7;
    border-radius: 999px;
    padding: 1px 8px;
}

.lam-complaint-card .lam-image-thumbnail[b-9snoqsd2e7] {
    width: 100%;
}

/* The work-type picker sits in the check-in/out editor at the calendar inputs' width.
   The width is forced through to the dropdown itself (which carries an inline
   width:100%), because a long work-type name otherwise stretches the button under
   the neighbouring date picker; names wider than the field truncate with an ellipsis. */
.lam-worktype-picker[b-9snoqsd2e7] {
    width: 304px;
    max-width: 100%;
}

.lam-worktype-picker[b-9snoqsd2e7]  .dropdown {
    width: 100% !important;
    max-width: 304px;
}

.lam-worktype-picker[b-9snoqsd2e7]  .custom-select-button {
    max-width: 100% !important;
    overflow: hidden !important;
}

.lam-worktype-picker[b-9snoqsd2e7]  .custom-select-button-label {
    min-width: 0 !important;
    overflow: hidden !important;
}

.lam-worktype-picker[b-9snoqsd2e7]  .custom-select-button-text {
    display: block !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

/* Work-type correction on a settled stop: picker and its save side by side. */
.lam-worktype-row[b-9snoqsd2e7] {
    display: flex;
    align-items: flex-end;
    gap: 12px;
    margin-top: 12px;
}

/* Breathing room between the status badge and the close button. */
.lam-header-main[b-9snoqsd2e7] {
    margin-right: 16px;
    min-width: 0;
}

/* Materials the address consumes — a quiet chip per material, no prices */
.lam-materials[b-9snoqsd2e7] {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
}

.lam-material-chip[b-9snoqsd2e7] {
	display: inline-flex;
	align-items: center;
	padding: 4px 10px;
	border-radius: 999px;
	background: #F1F5F9;
	color: #334155;
	font-size: 12px;
	font-weight: 600;
	letter-spacing: -0.1px;
}

/* ─── Check-in/out decision row: complete (green) / unable (yellow) / remove (grey).
   The editor is a 2-column grid, so the row and its disclaimer span both columns. */
.lam-checkin-actions[b-9snoqsd2e7] {
    grid-column: 1 / -1;
    margin-top: 14px;
}

.lam-checkin-disclaimer[b-9snoqsd2e7] {
    grid-column: 1 / -1;
}

.lam-action.complete-solid[b-9snoqsd2e7] {
    color: #FFFFFF;
    background: #337C33;
}

.lam-action.complete-solid img[b-9snoqsd2e7] {
    filter: none;
}

/* A multi-pass stop registers its times pass by pass further down; this says so where
   the pickers would otherwise be. Information, not an error, hence not red. */
.lam-passes-hint[b-9snoqsd2e7] {
    grid-column: 1 / -1;
    margin-top: 8px;
    color: #5F6E85;
    font-size: 12px;
    font-weight: 600;
    line-height: 18px;
}

.lam-action.muted[b-9snoqsd2e7] {
    color: #475569;
    background: #F1F5F9;
}

/* ─── Removed stop: reason box in place of the time pickers ─── */
.lam-removed-info[b-9snoqsd2e7] {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 12px 14px;
    border: 1px solid #E2E8F0;
    border-radius: 8px;
    background: #F8FAFC;
}

.lam-removed-info img[b-9snoqsd2e7] {
    width: 18px;
    height: 18px;
    margin-top: 1px;
}

.lam-removed-info p[b-9snoqsd2e7] {
    margin: 0;
    color: #1E293B;
    font-size: 13px;
    font-weight: 700;
    line-height: 20px;
}

.lam-removed-info span[b-9snoqsd2e7] {
    color: #5F6E85;
    font-size: 12px;
    font-weight: 600;
    line-height: 18px;
}

/* Link back to the whole dispatch, shown only when the panel was opened from
   somewhere that is not already showing it. */
.lam-open-dispatch[b-9snoqsd2e7] {
    padding: 0;
    border: 0;
    background: none;
    color: #4F5AED;
    font-size: 13px;
    font-weight: 700;
    line-height: 20px;
    text-decoration: underline;
    white-space: nowrap;
}

.lam-open-dispatch:hover[b-9snoqsd2e7] {
    color: #3742C7;
}

/* ─── Photo requirement bar: documents the address's proof-of-work photo demand.
   Amber while no photo has been provided, muted green once one has - and it stays
   up after an admin completes without a photo, because it is a requirement being
   shown, not an error being raised. ─── */
.lam-photo-requirement[b-9snoqsd2e7] {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 10px 14px;
    border-radius: 8px;
    margin-bottom: 14px;
}

.lam-photo-requirement.missing[b-9snoqsd2e7] {
    border: 1px solid #F59E0B33;
    background: #FFFBEB;
}

.lam-photo-requirement.satisfied[b-9snoqsd2e7] {
    border: 1px solid #DCE9DC;
    background: #F4F9F4;
}

.lam-photo-requirement img[b-9snoqsd2e7] {
    width: 18px;
    height: 18px;
    margin-top: 1px;
}

.lam-photo-requirement p[b-9snoqsd2e7] {
    margin: 0;
    font-size: 13px;
    font-weight: 700;
    line-height: 20px;
    color: #92400E;
}

.lam-photo-requirement.satisfied p[b-9snoqsd2e7] {
    color: #337C33;
}

.lam-photo-requirement span[b-9snoqsd2e7] {
    font-size: 12px;
    font-weight: 600;
    line-height: 18px;
    color: #B45309;
}

.lam-photo-requirement.satisfied span[b-9snoqsd2e7] {
    color: #5F6E85;
}
/* /Pages/Dispatch/Components/RoadRoutesDriveOverview.razor.rz.scp.css */
/* One card for the dispatch's whole road-route story: picker left, map right, timeline
   under both (the live-map arrangement in miniature), route list below. */
.rdo-section[b-1e32ia4dra] {
    padding: 16px;
    background: #FFFFFF;
    border: 1px solid #E2E8F0;
    border-radius: 12px;
}

.rdo-section h6[b-1e32ia4dra] {
    margin: 0 0 12px;
    color: #1E293B;
    font-size: 15px;
    font-weight: 800;
    line-height: 20px;
}

.rdo-section h6 span[b-1e32ia4dra] {
    color: #5F6E85;
    font-weight: 600;
}

.rdo-placeholder[b-1e32ia4dra],
.rdo-no-drive[b-1e32ia4dra] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 44px;
    padding: 12px;
    border: 1px dashed #CBD5E1;
    border-radius: 8px;
    background: #F8FAFC;
    font-size: 13px;
    color: #5F6E85;
}

/* ---- Layout: picker | map, timeline spanning both. Fullscreen sends this whole grid
   up, so the picker and the scrubber stay usable over the enlarged map. ---- */
.rdo-layout[b-1e32ia4dra] {
    display: grid;
    grid-template-columns: 240px minmax(0, 1fr);
    grid-template-rows: 340px auto;
    gap: 12px;
    background: #FFFFFF;
}

.rdo-left[b-1e32ia4dra] {
    grid-row: 1;
    grid-column: 1;
    display: flex;
    flex-direction: column;
    gap: 4px;
    overflow-y: auto;
    padding-right: 2px;
}

.rdo-item[b-1e32ia4dra] {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 5px;
    width: 100%;
    padding: 8px 10px;
    border: 1px solid transparent;
    border-radius: 8px;
    background: transparent;
    text-align: left;
    font-size: 13px;
    font-weight: 600;
    color: #1E293B;
    cursor: pointer;
}

.rdo-item:hover[b-1e32ia4dra] {
    background: #F1F5F9;
}

.rdo-item--active[b-1e32ia4dra] {
    background: #EEF2FF;
    border-color: #C7D2FE;
}

.rdo-item-top[b-1e32ia4dra] {
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
}

.rdo-item-sub[b-1e32ia4dra] {
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
}

.rdo-item-name[b-1e32ia4dra] {
    flex: 1;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.rdo-item-metric[b-1e32ia4dra] {
    flex-shrink: 0;
    font-size: 12px;
    font-weight: 700;
    color: #5F6E85;
    font-variant-numeric: tabular-nums;
}

.rdo-swatch[b-1e32ia4dra] {
    flex-shrink: 0;
    width: 10px;
    height: 10px;
    border-radius: 3px;
}

.rdo-swatch--all[b-1e32ia4dra] {
    background: conic-gradient(#5263FF 0 25%, #9333EA 0 50%, #EC4899 0 75%, #F97316 0);
}

.rdo-map[b-1e32ia4dra] {
    grid-row: 1;
    grid-column: 2;
    border-radius: 12px;
    overflow: hidden;
    border: 1px solid #1E293B14;
    min-width: 0;
}

.rdo-map[b-1e32ia4dra]  .wm-map-wrapper,
.rdo-map[b-1e32ia4dra]  .wm-map-wrapper > div {
    height: 100%;
}

/* ---- Bottom strip: run facts + per-driver lines + the scrubber ---- */
.rdo-bottom[b-1e32ia4dra] {
    grid-row: 2;
    grid-column: 1 / -1;
    min-width: 0;
}

.rdo-facts[b-1e32ia4dra] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px 18px;
    margin-bottom: 8px;
}

.rdo-fact[b-1e32ia4dra] {
    display: inline-flex;
    align-items: baseline;
    gap: 6px;
    font-size: 13px;
    font-weight: 600;
    color: #1E293B;
    font-variant-numeric: tabular-nums;
}

.rdo-fact-label[b-1e32ia4dra] {
    font-size: 11px;
    font-weight: 700;
    color: #5F6E85;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.rdo-fact--cancelled[b-1e32ia4dra],
.rdo-fact--cancelled .rdo-fact-label[b-1e32ia4dra] {
    color: #B91C1C;
}

/* The opened route's drive runs, folded out under its picker item and indented
   past the route swatch so they read as its children. */
.rdo-item-drivers[b-1e32ia4dra] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 2px 10px 8px 28px;
}

.rdo-driver-line[b-1e32ia4dra] {
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
    font-size: 13px;
    font-weight: 600;
    color: #1E293B;
}

.rdo-driver-swatch[b-1e32ia4dra] {
    flex-shrink: 0;
    width: 8px;
    height: 8px;
    border-radius: 3px;
}

.rdo-driver-name[b-1e32ia4dra] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.rdo-times[b-1e32ia4dra] {
    display: flex;
    align-items: center;
    gap: 4px;
    white-space: nowrap;
    font-size: 12px;
    color: #5F6E85;
    font-variant-numeric: tabular-nums;
}

.rdo-open[b-1e32ia4dra] {
    color: #15803D;
    font-weight: 600;
}

/* ---- Scrub row ---- */
.rdo-scrub-row[b-1e32ia4dra] {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    margin-top: 10px;
}

.rdo-scrub-live[b-1e32ia4dra] {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    border: none;
    background: #F1F5F9;
    color: #475569;
    font-size: 11px;
    font-weight: 700;
    border-radius: 99px;
    padding: 3px 10px;
    cursor: pointer;
}

.rdo-scrub-live--on[b-1e32ia4dra] {
    background: #22C55E1A;
    color: #15803D;
}

.rdo-live-dot[b-1e32ia4dra] {
    width: 6px;
    height: 6px;
    flex-shrink: 0;
    border-radius: 50%;
    background: #22C55E;
    animation: rdo-pulse-b-1e32ia4dra 2s ease-in-out infinite;
}

.rdo-scrub-live:not(.rdo-scrub-live--on) .rdo-live-dot[b-1e32ia4dra] {
    background: #94A3B8;
    animation: none;
}

@keyframes rdo-pulse-b-1e32ia4dra {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.35; }
}

.rdo-scrub-track[b-1e32ia4dra] {
    flex: 1;
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.rdo-scrub-slider[b-1e32ia4dra] {
    flex: 1;
    min-width: 0;
    height: 4px;
    margin: 0;
    cursor: pointer;
    accent-color: #5263FF;
}

.rdo-axis[b-1e32ia4dra] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 2px;
    font-size: 11px;
    color: #94A3B8;
    font-variant-numeric: tabular-nums;
}

.rdo-scrub-time[b-1e32ia4dra] {
    flex-shrink: 0;
    text-align: right;
    font-size: 12px;
    font-weight: 600;
    color: #1E293B;
    font-variant-numeric: tabular-nums;
}

/* ---- Per-route progress + status, shown inside the picker rows ---- */
.rdo-progress-track[b-1e32ia4dra] {
    flex: 1;
    min-width: 0;
    display: block;
    height: 5px;
    border-radius: 99px;
    background: #E2E8F0;
    overflow: hidden;
}

.rdo-progress-fill[b-1e32ia4dra] {
    display: block;
    height: 100%;
    border-radius: 99px;
    background: #22C55E;
}

.rdo-status[b-1e32ia4dra] {
    flex-shrink: 0;
    font-size: 11px;
    font-weight: 700;
    border-radius: 99px;
    padding: 3px 10px;
    white-space: nowrap;
}

.rdo-status--waiting[b-1e32ia4dra] {
    background: #F1F5F9;
    color: #5F6E85;
}

.rdo-status--running[b-1e32ia4dra] {
    background: #FEF3C7;
    color: #B45309;
}

.rdo-status--completed[b-1e32ia4dra] {
    background: #DCFCE7;
    color: #15803D;
}

.rdo-status--cancelled[b-1e32ia4dra] {
    background: #FEE2E2;
    color: #B91C1C;
}

/* Metric colouring in the left picker mirrors the badges. */
.rdo-item-metric.rdo-status--waiting[b-1e32ia4dra],
.rdo-item-metric.rdo-status--running[b-1e32ia4dra],
.rdo-item-metric.rdo-status--completed[b-1e32ia4dra],
.rdo-item-metric.rdo-status--cancelled[b-1e32ia4dra] {
    background: transparent;
    padding: 0;
}

.rdo-item-metric.rdo-status--completed[b-1e32ia4dra] { color: #15803D; }
.rdo-item-metric.rdo-status--running[b-1e32ia4dra] { color: #B45309; }
.rdo-item-metric.rdo-status--cancelled[b-1e32ia4dra] { color: #B91C1C; }

/* ---- Fullscreen: the grid fills the screen, the map row flexes ---- */
.rdo-layout:fullscreen[b-1e32ia4dra] {
    padding: 16px;
    grid-template-rows: minmax(0, 1fr) auto;
    overflow: auto;
}

.rdo-layout:fullscreen .rdo-map[b-1e32ia4dra] {
    height: auto;
}
/* /Pages/Dispatch/Components/RouteDriveSection.razor.rz.scp.css */
/* A card of its own inside the slider's flat list — a road route has no stop rows, so the
   drive record carries the section chrome itself. */
.rds-section[b-6itjenbm1w] {
    padding: 16px;
    background: #FFFFFF;
    border: 1px solid #E2E8F0;
    border-radius: 12px;
}

.rds-section h6[b-6itjenbm1w] {
    margin: 0 0 12px;
    color: #1E293B;
    font-size: 15px;
    font-weight: 800;
    line-height: 20px;
}

/* ---- Run facts: started / finished / driven, one compact row ---- */
.rds-facts[b-6itjenbm1w] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px 18px;
    margin-bottom: 12px;
}

.rds-fact[b-6itjenbm1w] {
    display: inline-flex;
    align-items: baseline;
    gap: 6px;
    font-size: 13px;
    font-weight: 600;
    color: #1E293B;
    font-variant-numeric: tabular-nums;
}

.rds-fact-label[b-6itjenbm1w] {
    font-size: 11px;
    font-weight: 700;
    color: #5F6E85;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.rds-fact--cancelled[b-6itjenbm1w] {
    color: #B91C1C;
}

.rds-fact--cancelled .rds-fact-label[b-6itjenbm1w] {
    color: #B91C1C;
}

.rds-map[b-6itjenbm1w] {
    height: 300px;
    border-radius: 12px;
    overflow: hidden;
    border: 1px solid #1E293B14;
}

/* Cascade the height into WMMap's wrapper chain, the way the live map does. */
.rds-map[b-6itjenbm1w]  .wm-map-wrapper,
.rds-map[b-6itjenbm1w]  .wm-map-wrapper > div {
    height: 100%;
}

.rds-placeholder[b-6itjenbm1w] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 44px;
    padding: 12px;
    border: 1px dashed #CBD5E1;
    border-radius: 8px;
    background: #F8FAFC;
    font-size: 13px;
    color: #5F6E85;
}

/* ---- Drive timeline: one line per driver, the scrubber below is the axis ---- */
.rds-timeline[b-6itjenbm1w] {
    margin-top: 16px;
}

.rds-timeline-title[b-6itjenbm1w] {
    margin: 0 0 10px;
    font-size: 12px;
    font-weight: 700;
    color: #5F6E85;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.rds-drivers[b-6itjenbm1w] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.rds-driver-line[b-6itjenbm1w] {
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
    font-size: 13px;
    font-weight: 600;
    color: #1E293B;
}

.rds-swatch[b-6itjenbm1w] {
    flex-shrink: 0;
    width: 8px;
    height: 8px;
    border-radius: 3px;
}

.rds-driver-name[b-6itjenbm1w] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.rds-live-dot[b-6itjenbm1w] {
    width: 6px;
    height: 6px;
    margin-right: 6px;
    flex-shrink: 0;
    border-radius: 50%;
    background: #FFFFFF;
    animation: rds-pulse-b-6itjenbm1w 2s ease-in-out infinite;
}

@keyframes rds-pulse-b-6itjenbm1w {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.35; }
}

.rds-times[b-6itjenbm1w] {
    display: flex;
    align-items: center;
    gap: 4px;
    white-space: nowrap;
    font-size: 12px;
    color: #5F6E85;
    font-variant-numeric: tabular-nums;
}

.rds-open[b-6itjenbm1w] {
    color: #15803D;
    font-weight: 600;
}

.rds-axis[b-6itjenbm1w] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 2px;
    font-size: 11px;
    color: #94A3B8;
    font-variant-numeric: tabular-nums;
}

/* ---- Scrub row ---- */
.rds-scrub-row[b-6itjenbm1w] {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    margin-top: 10px;
}

.rds-scrub-live[b-6itjenbm1w] {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    border: none;
    background: #F1F5F9;
    color: #475569;
    font-size: 11px;
    font-weight: 700;
    border-radius: 99px;
    padding: 3px 10px;
    cursor: pointer;
}

.rds-scrub-live--on[b-6itjenbm1w] {
    background: #22C55E1A;
    color: #15803D;
}

.rds-scrub-live .rds-live-dot[b-6itjenbm1w] {
    margin-right: 0;
    background: #22C55E;
}

.rds-scrub-live:not(.rds-scrub-live--on) .rds-live-dot[b-6itjenbm1w] {
    background: #94A3B8;
    animation: none;
}

.rds-scrub-track[b-6itjenbm1w] {
    flex: 1;
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.rds-scrub-slider[b-6itjenbm1w] {
    flex: 1;
    min-width: 0;
    height: 4px;
    margin: 0;
    cursor: pointer;
    accent-color: #5263FF;
}

.rds-scrub-time[b-6itjenbm1w] {
    flex-shrink: 0;
    text-align: right;
    font-size: 12px;
    font-weight: 600;
    color: #1E293B;
    font-variant-numeric: tabular-nums;
}

/* ---- Fullscreen: the whole section goes up, so the run facts and the timeline
   scrubber stay usable over the enlarged map. The map flexes to fill. ---- */
.rds-section:fullscreen[b-6itjenbm1w] {
    display: flex;
    flex-direction: column;
    border: none;
    border-radius: 0;
    background: #FFFFFF;
    overflow: auto;
}

.rds-section:fullscreen .rds-map[b-6itjenbm1w] {
    flex: 1;
    min-height: 0;
    height: auto;
}
/* /Pages/Dispatch/Components/StopAdditionalWorkTypes.razor.rz.scp.css */
.saw-field[b-9ptmnxxisy] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    min-width: 0;
}

.saw-label[b-9ptmnxxisy] {
    display: block;
    margin: 0;
    color: #5F6E85;
    font-size: 12px;
    font-weight: 700;
    line-height: 16px;
}

.saw-row[b-9ptmnxxisy] {
    display: flex;
    align-items: flex-end;
    gap: 8px;
    min-width: 0;
}

.saw-add[b-9ptmnxxisy] {
    flex: 0 0 auto;
    width: 32px;
    height: 32px;
    margin-bottom: 4px;
    border-radius: 50%;
    border: 1px solid #0D6EFD;
    background: #FFFFFF;
    color: #0D6EFD;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    cursor: pointer;
}

.saw-add:hover:not(:disabled)[b-9ptmnxxisy] {
    background: #E7F0FF;
}

.saw-add:disabled[b-9ptmnxxisy] {
    opacity: 0.5;
    cursor: default;
}

.saw-chips[b-9ptmnxxisy] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.saw-chip[b-9ptmnxxisy] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    max-width: 100%;
    padding: 3px 6px 3px 10px;
    border-radius: 14px;
    background: #E7F0FF;
    color: #0B4FB3;
    font-size: 12px;
    font-weight: 600;
    line-height: 18px;
}

.saw-chip-text[b-9ptmnxxisy] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.saw-chip-remove[b-9ptmnxxisy] {
    border: 0;
    background: transparent;
    color: #0B4FB3;
    font-size: 15px;
    line-height: 1;
    padding: 0 4px;
    cursor: pointer;
}

.saw-chip-remove:disabled[b-9ptmnxxisy] {
    opacity: 0.5;
    cursor: default;
}

.saw-options[b-9ptmnxxisy] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 16px 20px 20px;
}

.saw-option[b-9ptmnxxisy] {
    text-align: left;
    padding: 10px 12px;
    border: 1px solid #DDE3EC;
    border-radius: 8px;
    background: #FFFFFF;
    color: #1F2A3D;
    font-size: 14px;
    cursor: pointer;
}

.saw-option:hover[b-9ptmnxxisy] {
    border-color: #0D6EFD;
    background: #F3F8FF;
}

.saw-empty[b-9ptmnxxisy] {
    margin: 0;
    padding: 16px 20px 20px;
    color: #5F6E85;
    font-size: 14px;
    line-height: 20px;
}
/* /Pages/Dispatch/Components/StopGeofenceSection.razor.rz.scp.css */
/* The section chrome the stop panel uses for every other section (.lam-section): CSS
   isolation stops the panel's own rules at this component's boundary, so the same padding,
   divider and heading are restated here rather than inherited. */
.sgs-section[b-uh3msi172e] {
    padding: 16px 24px;
    border-top: 1px solid #F1F5F9;
}

.sgs-section h6[b-uh3msi172e] {
    margin: 0 0 12px;
    color: #1E293B;
    font-size: 15px;
    font-weight: 800;
    line-height: 20px;
}

.sgs-map[b-uh3msi172e] {
    height: 300px;
    border-radius: 12px;
    overflow: hidden;
    border: 1px solid #1E293B14;
}

/* Cascade the height into WMMap's wrapper chain, the way the live map does. */
.sgs-map[b-uh3msi172e]  .wm-map-wrapper,
.sgs-map[b-uh3msi172e]  .wm-map-wrapper > div {
    height: 100%;
}

/* The zone is drawn but nobody has been there: one quiet line under the map. */
.sgs-empty[b-uh3msi172e] {
    margin: 12px 0 0;
    font-size: 13px;
    line-height: 18px;
    color: #5F6E85;
}

/* Nothing to draw, or nothing yet: one line, not an empty map. */
.sgs-placeholder[b-uh3msi172e] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 44px;
    padding: 12px;
    border: 1px dashed #CBD5E1;
    border-radius: 8px;
    background: #F8FAFC;
    font-size: 13px;
    color: #5F6E85;
}

/* ---- What is drawn on the address, tool by tool, under the map that shows it ---- */
.sgs-drawings[b-uh3msi172e] {
    margin-top: 14px;
}

.sgs-drawings-title[b-uh3msi172e] {
    margin: 0 0 8px;
    font-size: 12px;
    font-weight: 700;
    color: #5F6E85;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

/* Wraps rather than scrolls: a handful of tools, and the panel is narrow. */
.sgs-drawing-list[b-uh3msi172e] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px 16px;
}

.sgs-drawing[b-uh3msi172e] {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
    line-height: 18px;
    color: #1E293B;
}

.sgs-drawing-name[b-uh3msi172e] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* The measure is the answer; the tool name is only what it is the measure of. */
.sgs-drawing-measure[b-uh3msi172e] {
    flex-shrink: 0;
    padding: 1px 8px;
    border-radius: 999px;
    background: #EFF6FF;
    color: #1D4ED8;
    font-size: 12px;
    font-weight: 600;
}

/* ---- Visit timeline: every visit laid over one shared time axis ---- */
.sgs-timeline[b-uh3msi172e] {
    margin-top: 16px;
}

.sgs-timeline-title[b-uh3msi172e] {
    margin: 0 0 10px;
    font-size: 12px;
    font-weight: 700;
    color: #5F6E85;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

/* ---- Which visit: a chip per visit, only when there is more than one ----
   The axis below is ONE visit. A stop worked once has nothing to choose and shows
   no chips at all; a stop the crew came back to, or drove past afterwards, shows
   the choice rather than averaging the visits into one unreadable bar. */
.sgs-visit-chips[b-uh3msi172e] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-bottom: 10px;
}

.sgs-visit-chip[b-uh3msi172e] {
    display: inline-flex;
    align-items: baseline;
    gap: 6px;
    border: 1px solid #1E293B1F;
    background: #FFFFFF;
    border-radius: 99px;
    padding: 3px 10px;
    font-size: 12px;
    color: #475569;
    cursor: pointer;
    font-variant-numeric: tabular-nums;
}

    .sgs-visit-chip:hover[b-uh3msi172e] {
        background: #F1F5F9;
    }

.sgs-visit-chip-name[b-uh3msi172e] {
    font-weight: 700;
    color: #1E293B;
}

.sgs-visit-chip--on[b-uh3msi172e] {
    border-color: #5263FF;
    background: #5263FF14;
}

    .sgs-visit-chip--on .sgs-visit-chip-name[b-uh3msi172e] {
        color: #363AF5;
    }

/* Seconds inside the zone: the vehicle passed the address, it did not work it. Still
   listed, because the record is the record, but never mistaken for a second pass. */
.sgs-visit-chip--brief[b-uh3msi172e] {
    opacity: 0.65;
}

    .sgs-visit-chip--brief:hover[b-uh3msi172e],
    .sgs-visit-chip--brief.sgs-visit-chip--on[b-uh3msi172e] {
        opacity: 1;
    }

/* One compact line per visit: swatch, name, times. The scrubber below is the axis. */
.sgs-visits[b-uh3msi172e] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.sgs-visit-line[b-uh3msi172e] {
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
    font-size: 13px;
    font-weight: 600;
    color: #1E293B;
}

.sgs-swatch[b-uh3msi172e] {
    flex-shrink: 0;
    width: 8px;
    height: 8px;
    border-radius: 3px;
}

.sgs-driver-name[b-uh3msi172e] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.sgs-live-dot[b-uh3msi172e] {
    width: 6px;
    height: 6px;
    margin-right: 6px;
    flex-shrink: 0;
    border-radius: 50%;
    background: #FFFFFF;
    animation: sgs-pulse-b-uh3msi172e 2s ease-in-out infinite;
}

@keyframes sgs-pulse-b-uh3msi172e {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.35; }
}

.sgs-times[b-uh3msi172e] {
    display: flex;
    align-items: center;
    gap: 4px;
    white-space: nowrap;
    font-size: 12px;
    color: #5F6E85;
    font-variant-numeric: tabular-nums;
}

.sgs-open[b-uh3msi172e] {
    color: #6D28D9;
    font-weight: 600;
}

/* The two ends of the axis, directly under the slider they describe. */
.sgs-axis[b-uh3msi172e] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 2px;
    font-size: 11px;
    color: #94A3B8;
    font-variant-numeric: tabular-nums;
}

/* ---- Scrub row: [Live chip when someone is still there] · slider+axis · readout ---- */
.sgs-scrub-row[b-uh3msi172e] {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    margin-top: 10px;
}

.sgs-scrub-live[b-uh3msi172e] {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    border: none;
    background: #F1F5F9;
    color: #475569;
    font-size: 11px;
    font-weight: 700;
    border-radius: 99px;
    padding: 3px 10px;
    cursor: pointer;
}

.sgs-scrub-live--on[b-uh3msi172e] {
    background: #22C55E1A;
    color: #15803D;
}

.sgs-scrub-live .sgs-live-dot[b-uh3msi172e] {
    margin-right: 0;
    background: #22C55E;
}

/* Off live, the dot stops pulsing — the map is a frozen moment, not a feed. */
.sgs-scrub-live:not(.sgs-scrub-live--on) .sgs-live-dot[b-uh3msi172e] {
    background: #94A3B8;
    animation: none;
}

.sgs-scrub-track[b-uh3msi172e] {
    flex: 1;
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.sgs-scrub-slider[b-uh3msi172e] {
    flex: 1;
    min-width: 0;
    height: 4px;
    margin: 0;
    cursor: pointer;
    accent-color: #5263FF;
}

.sgs-scrub-time[b-uh3msi172e] {
    flex-shrink: 0;
    text-align: right;
    font-size: 12px;
    font-weight: 600;
    color: #1E293B;
    font-variant-numeric: tabular-nums;
}

/* ── The scrub axis, drawn as occupancy ───────────────────────────────────
   The slider's own track is transparent; what you see under the thumb is
   the record: a coloured span for every stretch somebody was inside the
   zone, grey for the stretches nobody was. The gaps are the information -
   a stop worked in two passes has a hole in the middle, and a solid bar
   across it would say the crew never left. */
.sgs-scrub-lane[b-uh3msi172e] {
    position: relative;
    display: block;
    height: 14px;
}

.sgs-occupancy[b-uh3msi172e] {
    position: absolute;
    left: 0;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    height: 6px;
    border-radius: 99px;
    background: #E2E8F0;
    overflow: hidden;
}

.sgs-occupancy-span[b-uh3msi172e] {
    position: absolute;
    top: 0;
    bottom: 0;
    /* An instant visit still has to be findable on the axis. */
    min-width: 2px;
}

.sgs-occupancy-span--gap[b-uh3msi172e] {
    background: #E2E8F0;
}

.sgs-occupancy-span--inside[b-uh3msi172e] {
    border-radius: 99px;
}

.sgs-scrub-lane .sgs-scrub-slider[b-uh3msi172e] {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    width: 100%;
    height: 14px;
    background: transparent;
    accent-color: auto;
    -webkit-appearance: none;
    appearance: none;
}

    .sgs-scrub-lane .sgs-scrub-slider[b-uh3msi172e]::-webkit-slider-runnable-track {
        background: transparent;
        height: 14px;
    }

    .sgs-scrub-lane .sgs-scrub-slider[b-uh3msi172e]::-moz-range-track {
        background: transparent;
        height: 14px;
    }

    .sgs-scrub-lane .sgs-scrub-slider[b-uh3msi172e]::-moz-range-progress {
        background: transparent;
    }

    .sgs-scrub-lane .sgs-scrub-slider[b-uh3msi172e]::-webkit-slider-thumb {
        -webkit-appearance: none;
        appearance: none;
        width: 14px;
        height: 14px;
        border-radius: 50%;
        background: #1E293B;
        border: 2px solid #FFFFFF;
        box-shadow: 0 1px 3px #1E293B40;
        cursor: pointer;
    }

    .sgs-scrub-lane .sgs-scrub-slider[b-uh3msi172e]::-moz-range-thumb {
        width: 14px;
        height: 14px;
        border-radius: 50%;
        background: #1E293B;
        border: 2px solid #FFFFFF;
        box-shadow: 0 1px 3px #1E293B40;
        cursor: pointer;
    }

/* An open visit nobody has reported from in a while: stated, not dressed up
   as presence. */
.sgs-stale[b-uh3msi172e] {
    color: #94A3B8;
    font-weight: 500;
}

/* ── Closing a visit the phone never closed ───────────────────────────────
   The GPS ends a visit on fixes, so one whose phone went silent on the
   property will never end on its own. This is where somebody says when the
   crew actually left, and it sits on the visit it is about. */
.sgs-close-visit[b-uh3msi172e] {
    margin-left: 8px;
    border: 1px solid #1E293B26;
    background: #FFFFFF;
    border-radius: 8px;
    padding: 2px 8px;
    font-size: 12px;
    font-weight: 600;
    color: #475569;
    cursor: pointer;
}

    .sgs-close-visit:hover[b-uh3msi172e] {
        background: #F1F5F9;
        color: #1E293B;
    }

.sgs-close-editor[b-uh3msi172e] {
    margin: 6px 0 10px 22px;
    padding: 10px 12px;
    border: 1px solid #1E293B1F;
    border-radius: 10px;
    background: #F8FAFC;
}

.sgs-close-hint[b-uh3msi172e] {
    margin: 0 0 8px;
    font-size: 12px;
    color: #5F6E85;
}

.sgs-close-save[b-uh3msi172e],
.sgs-close-cancel[b-uh3msi172e] {
    border-radius: 8px;
    padding: 6px 14px;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
}

.sgs-close-save[b-uh3msi172e] {
    border: none;
    background: #363AF5;
    color: #FFFFFF;
}

    .sgs-close-save:disabled[b-uh3msi172e] {
        opacity: 0.5;
        cursor: not-allowed;
    }

.sgs-close-cancel[b-uh3msi172e] {
    border: 1px solid #1E293B26;
    background: #FFFFFF;
    color: #475569;
}

/* ---- Fullscreen: the whole section goes up, not just the map, so the visit lines and
   the scrubber stay usable over the enlarged ground. The map flexes to fill. Inside the
   stop panel the section is a divided strip, so it drops that chrome for the screen. ---- */
.sgs-section:fullscreen[b-uh3msi172e] {
    display: flex;
    flex-direction: column;
    border-top: none;
    background: #FFFFFF;
    overflow: auto;
}

.sgs-section:fullscreen .sgs-map[b-uh3msi172e] {
    flex: 1;
    min-height: 0;
    height: auto;
}
/* /Pages/Dispatch/Components/StopPassesSection.razor.rz.scp.css */
.sps-section[b-fttw4erww5] {
    padding: 16px 24px;
    border-top: 1px solid #F1F5F9;
}

.sps-head[b-fttw4erww5] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 12px;
}

.sps-section h6[b-fttw4erww5] {
    margin: 0;
    color: #1E293B;
    font-size: 15px;
    font-weight: 800;
    line-height: 20px;
}

.sps-total[b-fttw4erww5] {
    font-size: 12px;
    color: #5F6E85;
    font-variant-numeric: tabular-nums;
}

.sps-total strong[b-fttw4erww5] {
    color: #1E293B;
}

.sps-passes[b-fttw4erww5] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.sps-pass[b-fttw4erww5] {
    padding: 10px 12px;
    border: 1px solid #E2E8F0;
    border-radius: 10px;
    background: #FFFFFF;
}

/* A discarded pass stays visible and stays readable: it happened, it just is not work. */
.sps-pass--discarded[b-fttw4erww5] {
    background: #F8FAFC;
    border-style: dashed;
}

.sps-pass-main[b-fttw4erww5] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
    font-size: 13px;
    font-weight: 600;
    color: #1E293B;
    font-variant-numeric: tabular-nums;
}

.sps-pass-times[b-fttw4erww5] {
    display: flex;
    align-items: baseline;
    gap: 4px;
}

.sps-open[b-fttw4erww5] {
    color: #15803D;
}

.sps-pass--discarded .sps-pass-duration[b-fttw4erww5] {
    color: #94A3B8;
    text-decoration: line-through;
}

.sps-pass-meta[b-fttw4erww5] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
    margin-top: 4px;
    font-size: 12px;
    color: #5F6E85;
}

.sps-chip[b-fttw4erww5] {
    padding: 1px 8px;
    border-radius: 99px;
    background: #F1F5F9;
    font-size: 11px;
    font-weight: 700;
    color: #475569;
}

.sps-chip--extra[b-fttw4erww5] {
    background: #8B5CF61A;
    color: #6D28D9;
}

.sps-chip--discarded[b-fttw4erww5] {
    background: #F59E0B1A;
    color: #B45309;
}

.sps-pass-note[b-fttw4erww5] {
    margin-top: 4px;
    font-size: 12px;
    color: #94A3B8;
}

.sps-judge[b-fttw4erww5] {
    margin-top: 8px;
    border: none;
    border-radius: 8px;
    padding: 4px 10px;
    background: #F1F5F9;
    color: #475569;
    font-size: 11px;
    font-weight: 700;
    cursor: pointer;
}

.sps-judge:hover:not(:disabled)[b-fttw4erww5] {
    background: #E2E8F0;
}

.sps-judge:disabled[b-fttw4erww5] {
    opacity: 0.5;
    cursor: default;
}

/* A planned pass nobody has driven yet: present in the list, but plainly not a
   record of anything. */
.sps-planned[b-fttw4erww5] {
    color: #94A3B8;
    font-weight: 500;
}

/* ─── Per-pass check-in/check-out. The same controls as the stop-level editor in the
   panel above (scoped CSS does not cross components, so the sizes are restated). ─── */
.sps-editor[b-fttw4erww5] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 16px;
    row-gap: 10px;
    align-items: start;
    margin-top: 10px;
    padding-top: 10px;
    border-top: 1px dashed #E2E8F0;
}

.sps-time-control[b-fttw4erww5] {
    min-width: 0;
}

.sps-time-control label[b-fttw4erww5] {
    display: block;
    margin: 0 0 5px;
    color: #5F6E85;
    font-size: 12px;
    font-weight: 700;
}

.sps-date-time-picker[b-fttw4erww5] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 92px;
    gap: 8px;
    min-width: 0;
}

.sps-date-time-picker[b-fttw4erww5]  .sps-calendar-input .wm-calendar-input,
.sps-date-time-picker[b-fttw4erww5]  .sps-clock-input .wm-time-input {
    height: 40px !important;
    min-height: 40px !important;
}

.sps-validation[b-fttw4erww5] {
    grid-column: 1 / -1;
    color: #DC2626;
    font-size: 12px;
    font-weight: 700;
    line-height: 18px;
}

.sps-editor-actions[b-fttw4erww5] {
    grid-column: 1 / -1;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
}

.sps-complete[b-fttw4erww5] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 36px;
    border: none;
    border-radius: 8px;
    padding: 8px 12px;
    font-size: 13px;
    font-weight: 700;
    color: #FFFFFF;
    background: #337C33;
    cursor: pointer;
}

.sps-complete:disabled[b-fttw4erww5] {
    opacity: 0.55;
    cursor: not-allowed;
}

.sps-complete img[b-fttw4erww5] {
    width: 16px;
    height: 16px;
}

.sps-editor-hint[b-fttw4erww5] {
    font-size: 12px;
    color: #5F6E85;
}

@media (max-width: 640px) {
    .sps-editor[b-fttw4erww5] {
        grid-template-columns: 1fr;
    }
}
/* /Pages/Dispatch/Components/ZoneAddressOverviewPopup.razor.rz.scp.css */
.zoneAddressOverviewPopup .modal-dialog[b-jrt7d29mn4] {
	width: min(560px, calc(100vw - 32px));
	min-width: 0;
	max-width: 560px;
	margin-inline: auto;
}

.zoneAddressOverviewPopup .modal-content[b-jrt7d29mn4] {
	height: min(800px, calc(100dvh - 48px));
	max-height: calc(100dvh - 48px);
	padding: 0 !important;
	overflow: hidden;
	border: 1px solid rgba(30, 41, 59, 0.03);
	border-radius: 20px !important;
	box-shadow:
		0 1px 1px -0.5px rgba(30, 41, 59, 0.03),
		0 3px 3px -1.5px rgba(30, 41, 59, 0.03),
		0 20px 20px -12px rgba(30, 41, 59, 0.03),
		0 32px 32px -16px rgba(30, 41, 59, 0.03);
}

.zoneAddressOverviewPopup .modal-header[b-jrt7d29mn4] {
	flex: 0 0 auto;
	min-height: 56px;
	padding: 16px 60px 16px 20px !important;
	background: #FFFFFF;
	border-bottom: 1px solid rgba(30, 41, 59, 0.09) !important;
}

.zoneAddressOverviewPopup .modal-header .modal-title[b-jrt7d29mn4] {
	margin: 0;
	font-size: 18px !important;
	font-weight: 700 !important;
	line-height: 24px !important;
	letter-spacing: 0 !important;
	color: #1E293B !important;
}

.zoneAddressOverviewPopup .modal-header .btn-close[b-jrt7d29mn4] {
	position: absolute;
	top: 12px;
	right: 12px;
	width: 32px;
	height: 32px;
	margin: 0;
	padding: 0;
	border-radius: 8px;
	background-color: #F8FAFC;
	border: 1px solid rgba(30, 41, 59, 0.06);
	opacity: 1;
}

.zoneAddressOverviewPopup .modal-body[b-jrt7d29mn4] {
	flex: 1 1 auto;
	min-height: 0;
	max-height: none !important;
	padding: 20px !important;
	background-color: #F1F5F9 !important;
	overflow-y: auto;
	scrollbar-gutter: stable;
}

.zoneAddressOverviewPopup .modal-body.has-action-footer[b-jrt7d29mn4] {
	padding-bottom: 20px !important;
}

.zoneAddressOverviewPopup .modal-body .box[b-jrt7d29mn4] {
	width: 100%;
	padding: 20px !important;
	border-radius: 16px !important;
	background-color: #FFFFFF;
	box-shadow: none;
}

.zoneAddressOverviewPopup .modal-body .box h6[b-jrt7d29mn4] {
	margin: 0;
	font-size: 18px !important;
	font-weight: 700 !important;
	line-height: 24px !important;
	letter-spacing: 0 !important;
	color: #1E293B !important;
}

.zoneAddressOverviewPopup .box.box1[b-jrt7d29mn4] {
	gap: 12px !important;
}

.zoneAddressOverviewPopup .zao-address-copy[b-jrt7d29mn4] {
	min-width: 0;
	flex: 1 1 250px;
}

.zoneAddressOverviewPopup .box.box1 h5[b-jrt7d29mn4] {
	margin: 0;
	overflow-wrap: anywhere;
	font-size: 15px !important;
	font-weight: 700 !important;
	line-height: 24px !important;
	letter-spacing: 0 !important;
	color: #1E293B !important;
}

.zoneAddressOverviewPopup .box.box1 span[b-jrt7d29mn4] {
	display: inline;
	overflow-wrap: anywhere;
	font-size: 13px !important;
	font-weight: 500 !important;
	line-height: 20px !important;
	letter-spacing: 0 !important;
	color: #475569 !important;
}

.zoneAddressOverviewPopup .box.box1 span b[b-jrt7d29mn4] {
	font-weight: 700;
	color: #1E293B;
}

/* The stop was closed by a company other than the one the work belonged to. Its own line
   under the address, so it is not read as part of the note above it. */
.zoneAddressOverviewPopup .box.box1 span.zao-settled-by-other[b-jrt7d29mn4] {
	display: block;
	margin-top: 4px;
	font-weight: 600 !important;
	color: #B45309 !important;
}

.zoneAddressOverviewPopup .box.box1 .bagee[b-jrt7d29mn4] {
	flex: 0 0 auto;
	min-height: 24px;
	padding: 4px 8px;
	border-radius: 8px;
	gap: 3px;
	background-color: rgba(237, 64, 48, 0.12);
}

.zoneAddressOverviewPopup .box.box1 .bagee.green[b-jrt7d29mn4] {
	background-color: rgba(50, 142, 53, 0.12);
}

.zoneAddressOverviewPopup .box.box1 .bagee.light[b-jrt7d29mn4] {
	background-color: rgba(100, 116, 139, 0.12);
}

.zoneAddressOverviewPopup .box.box1 .bagee img[b-jrt7d29mn4] {
	width: 14px;
	height: 14px;
}

.zoneAddressOverviewPopup .box.box1 .bagee span[b-jrt7d29mn4] {
	display: inline-flex;
	align-items: center;
	white-space: nowrap;
	font-size: 12px !important;
	font-weight: 600 !important;
	line-height: 16px !important;
	color: #B82213 !important;
}

.zoneAddressOverviewPopup .box.box1 .bagee.green span[b-jrt7d29mn4] {
	color: #328E35 !important;
}

.zoneAddressOverviewPopup .box.box1 .bagee.light span[b-jrt7d29mn4] {
	color: #475569 !important;
}

.zao-box1-map[b-jrt7d29mn4] {
	width: 100%;
	aspect-ratio: 16 / 9;
	max-height: 300px;
	object-fit: cover;
	border-radius: 12px;
	margin-top: 0;
	cursor: pointer;
}

.zoneAddressOverviewPopup .box.box2 .work-type-controls[b-jrt7d29mn4] {
	display: flex;
	align-items: center;
	gap: 12px;
	margin-top: 20px !important;
}

.zoneAddressOverviewPopup .box.box2 .work-type-dropdown[b-jrt7d29mn4] {
	flex: 1 1 auto;
	min-width: 0;
}

.zoneAddressOverviewPopup .box.box2 .change-work-type-btn[b-jrt7d29mn4] {
	flex: 0 0 auto;
	min-height: 40px;
	padding: 8px 16px;
	border: 0;
	border-radius: 10px;
	font-size: 13px;
	font-weight: 600;
	line-height: 20px;
}

.zoneAddressOverviewPopup .box.box3 .main-dateTime[b-jrt7d29mn4] {
	align-items: flex-start !important;
	gap: 12px !important;
}

.zoneAddressOverviewPopup .box.box3 .date-time[b-jrt7d29mn4] {
	flex: 1 1 0;
	min-width: 0;
	margin-top: 20px !important;
}

.zoneAddressOverviewPopup .box.box3 .date-time label[b-jrt7d29mn4],
.zoneAddressOverviewPopup .box.box4 .txt-input label[b-jrt7d29mn4] {
	font-size: 12px !important;
	font-weight: 600 !important;
	line-height: 16px !important;
	letter-spacing: 0 !important;
	color: #5F6E85 !important;
}

.zoneAddressOverviewPopup .box.box3 .date-time .date-time-box[b-jrt7d29mn4] {
	width: 100%;
	min-height: 40px;
	border: 1px solid rgba(30, 41, 59, 0.12) !important;
	border-radius: 8px !important;
	background: #FFFFFF;
	box-shadow: 0 3px 3px -1.5px rgba(30, 41, 59, 0.08);
}

.zoneAddressOverviewPopup .box.box3 .date-time .date-picker[b-jrt7d29mn4] {
	flex: 1 1 58%;
	min-width: 0;
	padding: 8px 10px !important;
	border-right: 1px solid rgba(30, 41, 59, 0.12) !important;
}

.zoneAddressOverviewPopup .box.box3 .date-time .time-picker[b-jrt7d29mn4] {
	flex: 0 0 86px;
	min-width: 0;
	padding: 8px 10px !important;
}

.zoneAddressOverviewPopup .box.box3 .date-time .time-picker[b-jrt7d29mn4]  .zao-time-picker .wm-time-input {
	height: 24px !important;
	min-height: 24px !important;
	padding: 0 !important;
	gap: 6px !important;
	border: none !important;
	border-radius: 0 !important;
	background: transparent !important;
	box-shadow: none !important;
}

.zoneAddressOverviewPopup .box.box3 .date-time .time-picker[b-jrt7d29mn4]  .zao-time-picker .wm-time-input img {
	width: 18px !important;
	height: 18px !important;
}

.zoneAddressOverviewPopup .box.box3 .date-time .time-picker[b-jrt7d29mn4]  .zao-time-picker .wm-time-display {
	font-size: 13px !important;
	font-weight: 600 !important;
	line-height: 20px !important;
	color: #1E293B !important;
}

.zao-date-input[b-jrt7d29mn4],
.zao-time-input[b-jrt7d29mn4] {
	border: none;
	outline: none;
	background-color: transparent;
	font-size: 13px;
	font-weight: 600;
	line-height: 20px;
	color: #1E293B;
	width: 100%;
	min-width: 0;
	padding: 0;
}

.zao-date-input[b-jrt7d29mn4]::-webkit-calendar-picker-indicator,
.zao-time-input[b-jrt7d29mn4]::-webkit-calendar-picker-indicator {
	display: none;
}

.zao-date-input:disabled[b-jrt7d29mn4],
.zao-time-input:disabled[b-jrt7d29mn4] {
	color: #475569;
	opacity: 1;
}

.zoneAddressOverviewPopup .box.box3 .date-time .date-picker[b-jrt7d29mn4]  .zao-date-calendar .wm-calendar-input {
	height: 24px !important;
	min-height: 24px !important;
	padding: 0 !important;
	border: none !important;
	border-radius: 0 !important;
	background: transparent !important;
	box-shadow: none !important;
}

.zoneAddressOverviewPopup .box.box3 .date-time .date-picker[b-jrt7d29mn4]  .zao-date-calendar .wm-calendar-input-text {
	font-size: 13px !important;
	font-weight: 600 !important;
	line-height: 20px !important;
	color: #1E293B !important;
}

.zoneAddressOverviewPopup .box.box4 .txt-input[b-jrt7d29mn4] {
	margin-top: 20px !important;
}

.zoneAddressOverviewPopup .box.box4 .txt-input textarea[b-jrt7d29mn4] {
	min-height: 64px;
	resize: vertical;
	padding: 8px 12px !important;
	border: 1px solid rgba(30, 41, 59, 0.12) !important;
	border-radius: 10px !important;
	background: #FFFFFF;
	box-shadow: 0 3px 3px -1.5px rgba(30, 41, 59, 0.08);
	font-size: 13px !important;
	font-weight: 600 !important;
	line-height: 24px !important;
	letter-spacing: 0 !important;
	color: #1E293B !important;
}

.zoneAddressOverviewPopup .box.box4 .txt-input textarea:disabled[b-jrt7d29mn4] {
	color: #475569 !important;
	opacity: 1;
}

.zoneAddressOverviewPopup .box.box4 .save-note-btn[b-jrt7d29mn4] {
	align-self: flex-end;
	min-width: 96px;
	min-height: 36px;
	margin-top: 8px;
}

.zoneAddressOverviewPopup .box.box4 .add-photo-btn[b-jrt7d29mn4] {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	min-height: 40px;
	margin: 20px 0 !important;
	padding: 8px !important;
	border: 1px solid rgba(30, 41, 59, 0.09) !important;
	border-radius: 10px !important;
	background-color: rgba(241, 245, 249, 0.8) !important;
	cursor: pointer;
}

.zoneAddressOverviewPopup .box.box4 .add-photo-btn.disabled[b-jrt7d29mn4] {
	opacity: 0.65;
	cursor: not-allowed;
}

.zoneAddressOverviewPopup .box.box4 .add-photo-btn span[b-jrt7d29mn4] {
	font-size: 13px !important;
	font-weight: 600 !important;
	line-height: 24px !important;
	letter-spacing: 0 !important;
	color: #1E293B !important;
}
.zoneAddressOverviewPopup .box.box4 .img-slider[b-jrt7d29mn4] {
	position: relative;
	overflow: hidden;
	border-radius: 8px;
}

.zoneAddressOverviewPopup .box.box4 .img-slider .slides[b-jrt7d29mn4] {
	overflow-x: auto;
	scrollbar-width: none;
	padding: 0 24px;
}

.zoneAddressOverviewPopup .box.box4 .img-slider .slides[b-jrt7d29mn4]::-webkit-scrollbar {
	display: none;
}

.zoneAddressOverviewPopup .box.box4 .img-slider .slides .slide[b-jrt7d29mn4] {
	position: relative;
	flex: 0 0 100px;
}

.zoneAddressOverviewPopup .box.box4 .img-slider .slides .slide > img[b-jrt7d29mn4] {
	width: 100px !important;
	height: 100px !important;
	object-fit: cover;
	border-radius: 8px;
	cursor: pointer;
}

.zoneAddressOverviewPopup .box.box4 .img-slider .slides .slide .pdf-thumbnail[b-jrt7d29mn4] {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100px;
	height: 100px;
	border-radius: 8px;
	background: #F8FAFC;
	border: 1px solid #E2E8F0;
}

.zoneAddressOverviewPopup .box.box4 .img-slider .slides .slide .pdf-thumbnail img[b-jrt7d29mn4] {
	width: 52px !important;
	height: 64px !important;
	object-fit: contain;
	border-radius: 0;
}

.zoneAddressOverviewPopup .box.box4 .img-slider .slides .slide .delete-btn[b-jrt7d29mn4] {
	position: absolute;
	top: 6px;
	right: 6px;
	z-index: 1;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 24px;
	height: 24px;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: rgba(223, 41, 23, 0.92);
	box-shadow: 0 1px 3px rgba(15, 23, 42, 0.28);
	cursor: pointer;
}

.zoneAddressOverviewPopup .box.box4 .img-slider .slides .slide .delete-btn img[b-jrt7d29mn4] {
	width: 10px !important;
	height: 10px !important;
	object-fit: contain;
}

.zoneAddressOverviewPopup .box.box4 .img-slider .arrow[b-jrt7d29mn4] {
	position: absolute;
	top: 0;
	z-index: 2;
	width: 20px;
	height: 100%;
	background-color: rgba(241, 245, 249, 0.8);
	cursor: pointer;
}

.zoneAddressOverviewPopup .box.box4 .img-slider .arrow.pre[b-jrt7d29mn4] {
	left: 0;
}

.zoneAddressOverviewPopup .box.box4 .img-slider .arrow.next[b-jrt7d29mn4] {
	right: 0;
}

.zoneAddressOverviewPopup .box.box5 .slider-txt[b-jrt7d29mn4] {
	margin: 20px 0 !important;
}

.zoneAddressOverviewPopup .box.box5 .slider-txt span[b-jrt7d29mn4] {
	font-size: 12px !important;
	font-weight: 600 !important;
	line-height: 20px !important;
	letter-spacing: 0 !important;
	color: #5F6E85 !important;
}

.zoneAddressOverviewPopup .box.box5 .slider-txt p[b-jrt7d29mn4] {
	margin: 0;
	white-space: normal !important;
	overflow-wrap: anywhere;
	font-size: 15px !important;
	font-weight: 700 !important;
	line-height: 22px !important;
	letter-spacing: 0 !important;
	color: #1E293B !important;
}

.zoneAddressOverviewPopup #carouselExampleIndicators[b-jrt7d29mn4] {
	margin-bottom: 12px !important;
}

.zoneAddressOverviewPopup #carouselExampleIndicators .carousel-inner[b-jrt7d29mn4] {
	aspect-ratio: 16 / 10;
	max-height: 360px;
	border-radius: 16px !important;
	background: #E2E8F0;
}

.zoneAddressOverviewPopup #carouselExampleIndicators .carousel-item[b-jrt7d29mn4],
.zoneAddressOverviewPopup #carouselExampleIndicators .carousel-item img[b-jrt7d29mn4] {
	height: 100%;
}

.zoneAddressOverviewPopup #carouselExampleIndicators .carousel-item img[b-jrt7d29mn4] {
	object-fit: cover;
}

.zoneAddressOverviewPopup #carouselExampleIndicators .carousel-inner .badgee[b-jrt7d29mn4] {
	max-width: calc(100% - 72px);
	overflow-x: auto;
	scrollbar-width: none;
}

.zoneAddressOverviewPopup #carouselExampleIndicators .carousel-inner .badgee[b-jrt7d29mn4]::-webkit-scrollbar {
	display: none;
}

.zoneAddressOverviewPopup .color-indicate[b-jrt7d29mn4] {
	flex-wrap: nowrap !important;
	overflow-x: auto;
	padding-bottom: 3px;
	scrollbar-width: thin;
}

.zoneAddressOverviewPopup .color-indicate .color-box[b-jrt7d29mn4] {
	flex: 0 0 auto;
}

.zoneAddressOverviewPopup .modal-body button.cstm-btn[b-jrt7d29mn4] {
	flex: 0 0 auto;
	min-height: 40px;
	padding: 8px !important;
	border: 1px solid rgba(30, 41, 59, 0.09) !important;
	border-radius: 10px !important;
	background: #FFFFFF !important;
	box-shadow: 0 2px 1.5px -0.5px rgba(30, 41, 59, 0.03), inset 0 2px 3px rgba(255, 255, 255, 0.03);
	backdrop-filter: blur(12px);
}

.zoneAddressOverviewPopup .modal-body button.cstm-btn span[b-jrt7d29mn4] {
	font-size: 13px !important;
	font-weight: 600 !important;
	line-height: 24px !important;
	letter-spacing: 0 !important;
	color: #475569 !important;
}

.zoneAddressOverviewPopup .modal-footer[b-jrt7d29mn4] {
	flex: 0 0 auto;
	min-height: 72px;
	padding: 16px 20px !important;
	gap: 12px !important;
	background: #FFFFFF;
	border-top: 1px solid rgba(30, 41, 59, 0.09);
}

.zoneAddressOverviewPopup .modal-footer .btn[b-jrt7d29mn4] {
	height: 40px;
	border-radius: 10px !important;
	border: 0;
	box-shadow: 0 1px 1px -0.5px rgba(30, 41, 59, 0.03), inset 0 3px 3px rgba(255, 255, 255, 0.12);
	backdrop-filter: blur(12px);
	font-size: 13px !important;
	font-weight: 600 !important;
	line-height: 24px !important;
	letter-spacing: 0 !important;
}

.zoneAddressOverviewPopup .modal-footer .decline-btn[b-jrt7d29mn4] {
	background-color: #B82213 !important;
	color: #FFFFFF !important;
}

.zoneAddressOverviewPopup .modal-footer .green-btn[b-jrt7d29mn4] {
	background-color: #296C28 !important;
	color: #FFFFFF !important;
}

.zao-loading[b-jrt7d29mn4] {
	min-height: 320px;
}

.zao-validation-message[b-jrt7d29mn4] {
	margin-top: 8px;
	font-size: 12px;
	font-weight: 600;
	color: #ED4030;
}

.zao-completion-validation[b-jrt7d29mn4] {
	width: 100%;
	margin-top: 0;
	text-align: center;
}

.zao-upload-progress[b-jrt7d29mn4] {
	font-size: 13px;
	color: #0D6EFD;
}

.zao-confirm-body p[b-jrt7d29mn4] {
	font-size: 14px;
	color: #5F6E85;
	margin: 0;
}

.zao-delete-attachment-popup[b-jrt7d29mn4] {
	z-index: 1080 !important;
	background: rgba(15, 23, 42, 0.48);
	backdrop-filter: blur(2px);
}

.zao-delete-attachment-popup[b-jrt7d29mn4]  .modal-dialog {
	position: relative;
	z-index: 1081;
	min-width: min(480px, calc(100vw - 32px)) !important;
}

.zao-delete-attachment-popup[b-jrt7d29mn4]  .wm-popup-modal-content {
	padding: 0 !important;
	border: 1px solid rgba(30, 41, 59, 0.08) !important;
	border-radius: 20px !important;
	background: #FFFFFF !important;
	box-shadow: 0 24px 64px rgba(15, 23, 42, 0.28) !important;
}

.zao-delete-attachment-popup[b-jrt7d29mn4]  .modal-header {
	min-height: 64px;
	padding: 16px 20px !important;
	border-bottom: 0 !important;
}

.zao-delete-attachment-popup[b-jrt7d29mn4]  .modal-header h5.modal-title {
	margin: 0 !important;
	color: #1E293B !important;
	font-size: 18px !important;
	font-weight: 700 !important;
	line-height: 24px !important;
}

.zao-delete-attachment-popup[b-jrt7d29mn4]  .modal-header .btn-close {
	width: 32px !important;
	height: 32px !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 1px solid rgba(30, 41, 59, 0.06) !important;
	border-radius: 8px !important;
	background-color: #F8FAFC !important;
	background-size: 10px !important;
	opacity: 1 !important;
}

.zao-delete-attachment-popup[b-jrt7d29mn4]  .modal-body {
	padding: 0 20px 16px !important;
	background: #FFFFFF !important;
	overflow: visible !important;
}

.zao-delete-attachment-popup[b-jrt7d29mn4]  .zao-confirm-body p {
	margin: 0;
	color: #5F6E85;
	font-size: 14px;
	font-weight: 500;
	line-height: 22px;
	overflow-wrap: anywhere;
}

.zao-delete-attachment-popup[b-jrt7d29mn4]  .wm-popup-modal-footer {
	min-height: 72px;
	padding: 16px 20px !important;
	gap: 12px !important;
	border-top: 1px solid rgba(30, 41, 59, 0.09) !important;
	background: #FFFFFF !important;
}

.zao-delete-attachment-popup[b-jrt7d29mn4]  .wm-popup-modal-footer button {
	min-height: 40px;
	border: 0;
	border-radius: 10px;
	font-size: 13px;
	font-weight: 600;
	line-height: 24px;
}

.zao-delete-attachment-popup[b-jrt7d29mn4]  .wm-popup-modal-footer .btn-wm-primary {
	background: #5263FF;
	color: #FFFFFF;
}

.zao-delete-attachment-popup[b-jrt7d29mn4]  .wm-popup-modal-footer .btn-wm-danger-translucent {
	background: rgba(237, 64, 48, 0.12);
	color: #B82213;
}

@media (max-width: 640px) {
	.zoneAddressOverviewPopup .modal-dialog[b-jrt7d29mn4] {
		width: calc(100vw - 20px);
	}

	.zoneAddressOverviewPopup .modal-content[b-jrt7d29mn4] {
		max-height: calc(100dvh - 20px);
	}

	.zoneAddressOverviewPopup .modal-body[b-jrt7d29mn4] {
		padding: 14px !important;
	}

	.zoneAddressOverviewPopup .modal-body .box[b-jrt7d29mn4] {
		padding: 16px !important;
		border-radius: 14px !important;
	}

	.zoneAddressOverviewPopup .box.box3 .main-dateTime[b-jrt7d29mn4] {
		flex-direction: column;
	}

	.zoneAddressOverviewPopup .box.box2 .work-type-controls[b-jrt7d29mn4] {
		flex-direction: column;
		align-items: stretch;
	}

	.zoneAddressOverviewPopup .box.box2 .change-work-type-btn[b-jrt7d29mn4] {
		width: 100%;
	}

	.zoneAddressOverviewPopup .box.box3 .date-time[b-jrt7d29mn4] {
		width: 100%;
	}

	.zoneAddressOverviewPopup .modal-footer[b-jrt7d29mn4] {
		padding: 12px 14px !important;
	}
}
/* /Pages/Dispatch/Components/ZoneDispatchDetailsSlider.razor.rz.scp.css */
/* Follows FIGMA_HTML_References dispatch.html/style.css: right-side ID-popup details model. */
.dispatchDetailsSlider.right .modal-dialog[b-rp2zc8c6j2],
.zoneDispatchDetailsSlider.ID-popup .modal-dialog[b-rp2zc8c6j2] {
    position: fixed !important;
    margin: 0 !important;
    right: 0 !important;
    top: 0 !important;
    height: 100% !important;
    min-width: 740px;
    max-width: 912px;
    width: min(912px, calc(100vw - 126px));
}

.dispatchDetailsSlider.z-index-lower[b-rp2zc8c6j2] {
    z-index: 1049 !important;
}

.dispatchDetailsSlider.z-index-lower .modal-content[b-rp2zc8c6j2] {
    filter: brightness(0.96);
    box-shadow: -18px 0 46px rgba(15, 23, 42, 0.18);
}

.dds-add-location-list[b-rp2zc8c6j2] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    max-height: 360px;
    overflow-y: auto;
}

.dds-add-location-row[b-rp2zc8c6j2] {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 10px 12px;
    border: 1px solid #E2E8F0;
    border-radius: 8px;
    cursor: pointer;
}

.dds-add-location-row span[b-rp2zc8c6j2] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.dds-add-location-row strong[b-rp2zc8c6j2],
.dds-add-location-row small[b-rp2zc8c6j2] {
    overflow-wrap: anywhere;
}

.dds-add-location-row small[b-rp2zc8c6j2] {
    color: #5F6E85;
}

.dispatchDetailsSlider.right .modal-content[b-rp2zc8c6j2],
.zoneDispatchDetailsSlider.ID-popup .modal-content[b-rp2zc8c6j2] {
    height: 100vh;
    border-radius: 0;
    border: none;
    display: flex;
    flex-direction: column;
}

.dispatchDetailsSlider.right.fade .modal-dialog[b-rp2zc8c6j2] {
    transform: translateX(100%) !important;
    transition: transform 0.3s ease-out !important;
}

.dispatchDetailsSlider.right.show .modal-dialog[b-rp2zc8c6j2] {
    transform: translateX(0) !important;
}

.dispatchDetailsSlider .modal-header[b-rp2zc8c6j2],
.zoneDispatchDetailsSlider.ID-popup .modal-header[b-rp2zc8c6j2] {
    padding: 16px 24px;
    border: none;
    flex-shrink: 0;
}

.dispatchDetailsSlider .btn-close[b-rp2zc8c6j2],
.zoneDispatchDetailsSlider.ID-popup .btn-close[b-rp2zc8c6j2] {
    width: 40px;
    height: 40px;
    margin: 0;
    border-radius: 10px;
    background-color: #F1F5F9CC;
    opacity: 1;
}

.zoneDispatchDetailsSlider.ID-popup .modal-header .icon-image[b-rp2zc8c6j2] {
    width: 48px;
    height: 48px;
    border-radius: 10px;
    background-color: #5263FF1F !important;
}

.zoneDispatchDetailsSlider.ID-popup .modal-header .icon-image img[b-rp2zc8c6j2] {
    width: 22px;
    height: 22px;
}

.zoneDispatchDetailsSlider.ID-popup .modal-header .modal-title[b-rp2zc8c6j2] {
    margin: 0;
    color: #1E293B;
    font-size: 24px;
    font-weight: 800;
    line-height: 28px;
    letter-spacing: 0;
}

.zoneDispatchDetailsSlider.ID-popup .modal-header .txt p[b-rp2zc8c6j2] {
    font-size: 18px;
    font-weight: 700;
    line-height: 24px;
    letter-spacing: 0;
    color: #475569;
}

.zoneDispatchDetailsSlider.ID-popup .modal-header .txt img[b-rp2zc8c6j2] {
    height: 16px;
}

.zoneDispatchDetailsSlider.ID-popup .modal-header .txt span[b-rp2zc8c6j2] {
    font-size: 12px;
    font-weight: 600;
    line-height: 16px;
    letter-spacing: 0;
    color: #5F6E85;
}

.dds-header-main[b-rp2zc8c6j2] {
    min-width: 0;
}

.dds-icon[b-rp2zc8c6j2] {
    width: 48px;
    height: 48px;
    border-radius: 10px;
    background: #EEF0FF;
    flex-shrink: 0;
}

.dds-icon img[b-rp2zc8c6j2] {
    width: 22px;
    height: 22px;
}

.dds-title[b-rp2zc8c6j2] {
    margin: 0;
    color: #1E293B;
    font-size: 18px;
    font-weight: 800;
    line-height: 24px;
    letter-spacing: 0;
}

.dds-header-text[b-rp2zc8c6j2] {
    min-width: 0;
}

.dds-header-text p[b-rp2zc8c6j2],
.dds-header-date[b-rp2zc8c6j2] {
    margin: 2px 0 0;
    color: #5F6E85;
    font-size: 13px;
    font-weight: 600;
    line-height: 20px;
}

.dds-header-date img[b-rp2zc8c6j2] {
    width: 16px;
    height: 16px;
}

.dds-tabs[b-rp2zc8c6j2],
.dds-sub-tabs[b-rp2zc8c6j2] {
    display: flex;
    gap: 6px;
    padding: 6px;
    background: #F1F5F9CC;
    border: 1px solid #1E293B08;
    flex-shrink: 0;
}

.dds-tabs[b-rp2zc8c6j2] {
    margin: 8px 20px 10px;
    border-radius: 16px;
}

.dds-sub-tabs[b-rp2zc8c6j2] {
    margin: 0 20px 12px;
    border-radius: 14px;
    overflow-x: auto;
}

.dds-tabs button[b-rp2zc8c6j2],
.dds-sub-tabs button[b-rp2zc8c6j2] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-height: 36px;
    border: 1px solid transparent;
    border-radius: 10px;
    background: transparent;
    color: #5F6E85;
    font-size: 13px;
    font-weight: 700;
    white-space: nowrap;
}

.dds-tabs button[b-rp2zc8c6j2] {
    width: 100%;
}

.dds-sub-tabs button[b-rp2zc8c6j2] {
    min-width: 104px;
    padding: 7px 10px;
}

.dds-tabs button.active[b-rp2zc8c6j2],
.dds-sub-tabs button.active[b-rp2zc8c6j2] {
    background: linear-gradient(180deg, #FFFFFF 0%, #F8FAFC 100%);
    border-color: #1E293B0F;
    color: #1E293B;
    box-shadow: 0 4px 10px #1E293B0F;
}

.dds-tabs img[b-rp2zc8c6j2],
.dds-sub-tabs img[b-rp2zc8c6j2] {
    width: 16px;
    height: 16px;
}

.dds-sub-tabs em[b-rp2zc8c6j2] {
    min-width: 20px;
    min-height: 20px;
    border-radius: 10px;
    background: #E2E8F0;
    color: #475569;
    font-style: normal;
    font-size: 11px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 6px;
}

.dds-sub-tabs button.active em[b-rp2zc8c6j2] {
    background: #5263FF1F;
    color: #363AF5;
}

.dds-body[b-rp2zc8c6j2] {
    flex: 1;
    overflow-y: auto;
    padding: 0 !important;
    background: #FFFFFF;
}

.addresses-tab[b-rp2zc8c6j2] {
    padding: 0 20px 24px;
}

.dds-loading[b-rp2zc8c6j2] {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 1;
    color: #0D6EFD;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body[b-rp2zc8c6j2] {
    flex: 1;
    padding: 0;
    overflow-y: auto;
    scrollbar-width: thin;
    background: #FFFFFF;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .main-tab[b-rp2zc8c6j2] {
    padding: 0 24px;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .tabs[b-rp2zc8c6j2] {
    background-color: #F1F5F9CC;
    border: 1px #1E293B08 solid;
    border-radius: 16px;
    padding: 6px;
    gap: 6px;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .tabs button[b-rp2zc8c6j2] {
    gap: 2px;
    border: 1px transparent solid;
    outline: none;
    border-radius: 10px;
    padding: 6px;
    background-color: transparent;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .tabs button.active[b-rp2zc8c6j2] {
    background-color: #FFFFFF;
    box-shadow: 0 3px 3px -1.5px #1E293B08;
    border-color: #1E293B1F;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .tabs button img[b-rp2zc8c6j2] {
    height: 18px;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .tabs button span[b-rp2zc8c6j2] {
    font-size: 13px;
    font-weight: 600;
    line-height: 24px;
    letter-spacing: 0;
    color: #475569;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .tabs button.active span[b-rp2zc8c6j2] {
    color: #1E293B;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .addresses-tab[b-rp2zc8c6j2] {
    padding: 0;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .multi-tabs[b-rp2zc8c6j2] {
    border-bottom: 1px #1E293B17 solid;
    gap: 0 !important;
    margin-top: 16px !important;
    overflow-x: auto;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .multi-tabs button[b-rp2zc8c6j2] {
    background-color: transparent;
    border: none;
    outline: none;
    border-radius: 0;
    padding: 4px 5px 12px 5px;
    min-width: 123px;
    width: 123px;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .multi-tabs button.active[b-rp2zc8c6j2] {
    border-bottom: 2px #5263FF solid;
    background: transparent;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .multi-tabs button p[b-rp2zc8c6j2],
.zoneDispatchDetailsSlider.ID-popup .modal-body .multi-tabs button span[b-rp2zc8c6j2] {
    font-size: 13px;
    line-height: 24px;
    letter-spacing: 0;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .title-line[b-rp2zc8c6j2] {
    padding: 8px 24px;
    margin: 0 !important;
    border-bottom: 1px #1E293B17 solid;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .title-line div p[b-rp2zc8c6j2] {
    font-size: 15px;
    font-weight: 600;
    line-height: 24px;
    letter-spacing: 0;
    color: #475569;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .title-line button.add-more-btn[b-rp2zc8c6j2] {
    height: 32px;
    padding: 4px 8px;
    background-color: #5263FF1F;
    border-radius: 8px;
    border: none;
    outline: none;
    font-size: 12px;
    font-weight: 600;
    line-height: 16px;
    letter-spacing: -0.2px;
    color: #363AF5;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .title-line button.expand-btn[b-rp2zc8c6j2] {
    font-size: 13px;
    font-weight: 600;
    line-height: 20px;
    letter-spacing: 0;
    color: #5263FF;
    background-color: transparent;
    border: none;
    outline: none;
    text-decoration: underline;
    text-decoration-color: #9CB6FF;
    text-decoration-thickness: 1.5px;
    text-underline-offset: 3px;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian .cstm-data.open[b-rp2zc8c6j2] {
    max-height: none;
    overflow: visible;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian .cstm-title .right-title .arrow[b-rp2zc8c6j2] {
    border: none;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .details-tab .overview-multi-tab .box-4 .file-name a[b-rp2zc8c6j2] {
    font-size: 13px;
    font-weight: 600;
    line-height: 20px;
    letter-spacing: 0;
    color: #5263FF;
    text-decoration: underline;
    text-decoration-color: #5263ff5b;
    text-decoration-thickness: 2px;
    text-underline-offset: 3px;
}

.own-route-popup .addresses-tab .all-multi-tab-second[b-rp2zc8c6j2] {
    display: block;
}

.own-route-popup .addresses-tab .error-top-line[b-rp2zc8c6j2] {
    padding: 8px 24px;
    background-color: #ED40301F;
}

.own-route-popup .addresses-tab .error-top-line div img[b-rp2zc8c6j2] {
    height: 20px;
}

.own-route-popup .addresses-tab .error-top-line div p[b-rp2zc8c6j2] {
    margin: 0;
    font-size: 13px;
    font-weight: 600;
    line-height: 20px;
    letter-spacing: 0;
    color: #B82213;
}

.own-route-popup .addresses-tab .error-top-line button.assign-btn[b-rp2zc8c6j2] {
    background-color: #B82213;
    border: 1px #1E293B17 solid;
    border-radius: 8px;
    outline: none;
    box-shadow: 0 1px 1px -0.5px #1E293B08;
    padding: 8px 12px;
    font-size: 12px;
    font-weight: 600;
    line-height: 16px;
    letter-spacing: 0;
    color: #FFFFFF;
}

.own-route-popup .addresses-tab .add-location-txt[b-rp2zc8c6j2],
.zoneDispatchDetailsSlider .addresses-tab .add-location-txt[b-rp2zc8c6j2] {
    background-color: #F8FAFC;
    border-bottom: 1px #1E293B0F solid;
    padding: 16px 24px;
}

.own-route-popup .addresses-tab .add-location-txt div p[b-rp2zc8c6j2],
.zoneDispatchDetailsSlider .addresses-tab .add-location-txt div p[b-rp2zc8c6j2] {
    margin: 0;
    font-size: 15px;
    font-weight: 700;
    line-height: 24px;
    letter-spacing: 0;
    color: #475569;
}

.own-route-popup .addresses-tab .add-location-txt div span[b-rp2zc8c6j2],
.zoneDispatchDetailsSlider .addresses-tab .add-location-txt div span[b-rp2zc8c6j2] {
    font-size: 13px;
    font-weight: 500;
    line-height: 24px;
    letter-spacing: 0;
    color: #5F6E85;
}

.own-route-popup .addresses-tab .add-location-txt button.add-locations[b-rp2zc8c6j2],
.zoneDispatchDetailsSlider .addresses-tab .add-location-txt button.add-locations[b-rp2zc8c6j2] {
    background-color: #5263FF;
    padding: 8px 12px;
    border: 1px #1E293B17 solid;
    border-radius: 8px;
    outline: none;
    font-size: 12px;
    font-weight: 600;
    line-height: 16px;
    letter-spacing: 0;
    color: #FFFFFF;
    white-space: nowrap;
}

.own-route-popup .addresses-tab .pannel[b-rp2zc8c6j2] {
    padding: 12px 24px;
    border-bottom: 1px #1E293B17 solid;
}

.own-route-popup .addresses-tab .pannel:hover[b-rp2zc8c6j2] {
    background-color: #5263FF1F;
    cursor: pointer;
}

.own-route-popup .addresses-tab .pannel img.drag-icon[b-rp2zc8c6j2] {
    height: 20px;
    cursor: grab;
}

.own-route-popup .addresses-tab .pannel.is-dragging[b-rp2zc8c6j2] {
    opacity: 0.5;
}

.own-route-popup .addresses-tab .pannel.is-drop-target[b-rp2zc8c6j2] {
    background-color: #5263FF1F;
    box-shadow: inset 0 -2px 0 0 #5263FF;
}

.own-route-popup .addresses-tab .pannel .txt img[b-rp2zc8c6j2] {
    height: 20px;
}

.own-route-popup .addresses-tab .pannel .txt p[b-rp2zc8c6j2] {
    margin: 0;
    font-size: 13px;
    font-weight: 600;
    line-height: 20px;
    letter-spacing: 0;
    color: #1E293B;
}

.own-route-popup .addresses-tab .pannel .txt span[b-rp2zc8c6j2] {
    font-size: 13px;
    font-weight: 500;
    line-height: 20px;
    letter-spacing: 0;
    color: #475569;
}

.own-route-popup .addresses-tab .pannel .images img[b-rp2zc8c6j2] {
    height: 20px;
}

.own-route-popup .addresses-tab .pannel .all-bagees .bagee[b-rp2zc8c6j2] {
    padding: 4px 6px;
    border-radius: 8px;
    gap: 2px;
}

.own-route-popup .addresses-tab .pannel .all-bagees .bagee img[b-rp2zc8c6j2] {
    height: 14px;
}

.own-route-popup .addresses-tab .pannel .all-bagees .bagee p[b-rp2zc8c6j2] {
    margin: 0;
    font-size: 12px;
    font-weight: 600;
    line-height: 16px;
    letter-spacing: 0;
    padding: 0 2px;
}

.own-route-popup .addresses-tab .pannel .all-bagees .bagee.blue[b-rp2zc8c6j2] {
    background-color: #5263FF1F;
}

.own-route-popup .addresses-tab .pannel .all-bagees .bagee.blue p[b-rp2zc8c6j2] {
    color: #363AF5;
}

.own-route-popup .addresses-tab .pannel .all-bagees .bagee.green[b-rp2zc8c6j2] {
    background-color: #409B3F1F;
}

.own-route-popup .addresses-tab .pannel .all-bagees .bagee.green p[b-rp2zc8c6j2] {
    color: #296C28;
}

.own-route-popup .addresses-tab .pannel .all-bagees .bagee.red[b-rp2zc8c6j2] {
    background-color: #ED40301F;
}

.own-route-popup .addresses-tab .pannel .all-bagees .bagee.red p[b-rp2zc8c6j2] {
    color: #B82213;
}

.own-route-popup .addresses-tab .pannel .all-bagees .bagee.gray[b-rp2zc8c6j2] {
    background-color: #F1F5F9CC;
    border: 1px #1E293B08 solid;
}

.own-route-popup .addresses-tab .pannel .all-bagees .bagee.gray p[b-rp2zc8c6j2] {
    color: #1E293B;
}

.own-route-popup .addresses-tab .pannel .all-bagees .bagee.white[b-rp2zc8c6j2] {
    background-color: #FFFFFF;
    border: 1px #1E293B17 solid;
    box-shadow: 0 2px 1.5px -0.5px #1E293B08;
}

.own-route-popup .addresses-tab .pannel .all-bagees .bagee.white p[b-rp2zc8c6j2] {
    color: #475569;
}

/* A stop the assigned business turned down: same palette as the declined chips of the
   zone view, so the refusal reads the same wherever it appears. */
.own-route-popup .addresses-tab .pannel .all-bagees .bagee.declined[b-rp2zc8c6j2] {
    background-color: #FCE9EB;
    border: 1px #1E293B08 solid;
}

.own-route-popup .addresses-tab .pannel .all-bagees .bagee.declined p[b-rp2zc8c6j2] {
    color: #C0392F;
}

.dds-section[b-rp2zc8c6j2] {
    padding: 16px 24px;
    border-top: 1px solid #F1F5F9;
}

.dds-section h6[b-rp2zc8c6j2] {
    margin: 0 0 12px;
    color: #1E293B;
    font-size: 15px;
    font-weight: 800;
    line-height: 20px;
}

.dds-section h6 span[b-rp2zc8c6j2] {
    color: #5F6E85;
}

.dds-section-title-row[b-rp2zc8c6j2] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 12px;
}

.dds-section-title-row p[b-rp2zc8c6j2] {
    margin: 0 0 2px;
    color: #5F6E85;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0;
}

/* Figma: status tabs are plain underline tabs; counts are plain colored text (no pill). */
.multi-tabs[b-rp2zc8c6j2] {
    overflow-x: auto;
}

.multi-tabs button[b-rp2zc8c6j2] {
    background: transparent;
    border: none;
    color: #475569;
    white-space: nowrap;
}

.multi-tabs button p[b-rp2zc8c6j2] {
    margin: 0;
}

.multi-tabs button span[b-rp2zc8c6j2] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    color: #5F6E85;
    padding: 0 0 0 4px;
}

.multi-tabs button.active span[b-rp2zc8c6j2] {
    color: #5263FF;
}

.id-cstn-accordian .accordion-item[b-rp2zc8c6j2] {
    overflow: visible;
    border: 1px solid #E2E8F0;
    border-radius: 12px;
    background: #FFFFFF;
}

.id-cstn-accordian .accordion-header[b-rp2zc8c6j2] {
    margin: 0;
}

.id-cstn-accordian .accordion-button[b-rp2zc8c6j2] {
    min-height: 60px;
    border-radius: 12px !important;
    background: #FFFFFF;
    color: #1E293B;
    padding: 12px 16px;
    box-shadow: none;
}

.id-cstn-accordian .accordion-button:not(.collapsed)[b-rp2zc8c6j2] {
    color: #1E293B;
    background: #FFFFFF;
    box-shadow: inset 0 -1px 0 #F1F5F9;
}

.id-cstn-accordian .accordion-button[b-rp2zc8c6j2]::after {
    width: 14px;
    height: 14px;
    background-size: 14px;
}

.id-cstn-accordian .accordion-body[b-rp2zc8c6j2] {
    padding: 12px !important;
    background: #FFFFFF;
    border-radius: 0 0 12px 12px;
}

.id-cstn-accordian .progress[b-rp2zc8c6j2] {
    overflow: hidden;
    border-radius: 999px;
    background: #E2E8F0;
}

.dds-actions[b-rp2zc8c6j2] {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

.dds-action[b-rp2zc8c6j2] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 36px;
    border: none;
    border-radius: 8px;
    padding: 8px 12px;
    font-size: 13px;
    font-weight: 700;
}

.dds-action:disabled[b-rp2zc8c6j2] {
    opacity: 0.55;
    cursor: not-allowed;
}

.dds-action img[b-rp2zc8c6j2] {
    width: 16px;
    height: 16px;
}

.dds-action.complete[b-rp2zc8c6j2] {
    color: #296C28;
    background: #409B3F1F;
}

.dds-action.neutral[b-rp2zc8c6j2] {
    color: #1E293B;
    background: #F1F5F9;
}

.dds-action.danger[b-rp2zc8c6j2] {
    color: #DC2626;
    background: #FEE2E2;
}

.dds-action-message[b-rp2zc8c6j2] {
    margin: 8px 0 12px;
    padding: 10px 12px;
    border: 1px solid #BFDBFE;
    border-radius: 8px;
    background: #EFF6FF;
    color: #1D4ED8;
    font-size: 13px;
    font-weight: 700;
    line-height: 20px;
}

.dds-detail-grid[b-rp2zc8c6j2] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

.dds-detail-item[b-rp2zc8c6j2] {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    min-width: 0;
}

.dds-detail-item img[b-rp2zc8c6j2] {
    width: 20px;
    height: 20px;
    flex-shrink: 0;
}

.dds-detail-item p[b-rp2zc8c6j2] {
    margin: 0 0 2px;
    color: #5F6E85;
    font-size: 12px;
    font-weight: 700;
    line-height: 16px;
}

.dds-detail-item span[b-rp2zc8c6j2] {
    color: #1E293B;
    font-size: 13px;
    font-weight: 700;
    line-height: 20px;
    overflow-wrap: anywhere;
}

.dds-chip-list[b-rp2zc8c6j2],
.dds-address-list[b-rp2zc8c6j2],
.dds-settings-list[b-rp2zc8c6j2],
.dds-file-list[b-rp2zc8c6j2] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.dds-chip-list[b-rp2zc8c6j2],
.dds-file-list[b-rp2zc8c6j2] {
    flex-direction: row;
    flex-wrap: wrap;
}

.dds-chip[b-rp2zc8c6j2],
.dds-file-pill[b-rp2zc8c6j2] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    min-height: 24px;
    padding: 4px 8px;
    border-radius: 8px;
    background: #5263FF1F;
    color: #363AF5;
    font-size: 12px;
    font-weight: 700;
    line-height: 16px;
    text-decoration: none;
}

.dds-chip.warning[b-rp2zc8c6j2] {
    background: #FEE2E2;
    color: #DC2626;
}

.dds-chip img[b-rp2zc8c6j2],
.dds-file-pill img[b-rp2zc8c6j2] {
    width: 14px;
    height: 14px;
}

.dds-address-row[b-rp2zc8c6j2] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    padding: 16px;
    border: 1px solid #E2E8F0;
    border-radius: 10px;
    background: #FFFFFF;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.03);
}

.dds-address-main[b-rp2zc8c6j2] {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    min-width: 0;
}

.dds-address-index[b-rp2zc8c6j2] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 8px;
    background: #F1F5F9;
    color: #475569;
    font-size: 13px;
    font-weight: 800;
    flex-shrink: 0;
}

.dds-address-title[b-rp2zc8c6j2] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.dds-address-title strong[b-rp2zc8c6j2] {
    color: #1E293B;
    font-size: 14px;
    font-weight: 700;
    line-height: 20px;
    overflow-wrap: anywhere;
}

.dds-address-line[b-rp2zc8c6j2] {
    color: #5F6E85;
    font-size: 12px;
    font-weight: 600;
    margin-top: 2px;
}

.dds-address-meta[b-rp2zc8c6j2] {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
    margin-top: 8px;
}

.dds-meta-pill[b-rp2zc8c6j2] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    min-height: 26px;
    padding: 4px 9px;
    border: 1px solid #E2E8F0;
    border-radius: 7px;
    background: #FFFFFF;
    color: #1E293B;
    font-size: 12px;
    font-weight: 700;
    line-height: 16px;
}

.dds-meta-pill.danger[b-rp2zc8c6j2] {
    border-color: #FCA5A5;
    background: #FFF1F2;
    color: #EF4444;
}

.dds-driver-pill[b-rp2zc8c6j2] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    min-height: 24px;
    padding: 3px 8px;
    border: 1px solid #E2E8F0;
    border-radius: 7px;
    background: #FFFFFF;
    color: #1E293B;
    font-size: 12px;
    font-weight: 700;
}

.dds-driver-pill img[b-rp2zc8c6j2] {
    width: 18px;
    height: 18px;
    border-radius: 50%;
    object-fit: cover;
}

.dds-driver-action[b-rp2zc8c6j2] {
    cursor: pointer;
}

.dds-driver-action:hover[b-rp2zc8c6j2],
.dds-driver-action:focus-visible[b-rp2zc8c6j2] {
    filter: brightness(0.98);
    box-shadow: 0 0 0 2px #FCA5A533;
}

.dds-driver-location-list[b-rp2zc8c6j2],
.dds-invite-driver-list[b-rp2zc8c6j2],
.dds-driver-list[b-rp2zc8c6j2] {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.dds-driver-location-card[b-rp2zc8c6j2] {
    border: 1px solid #E2E8F0;
    border-radius: 10px;
    background: #FFFFFF;
    padding: 12px;
}

.dds-driver-location-head[b-rp2zc8c6j2] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 10px;
}

.dds-driver-location-head > div[b-rp2zc8c6j2] {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.dds-driver-location-head strong[b-rp2zc8c6j2] {
    color: #1E293B;
    font-size: 13px;
    font-weight: 800;
    line-height: 20px;
    overflow-wrap: anywhere;
}

.dds-driver-location-head span[b-rp2zc8c6j2],
.dds-driver-empty[b-rp2zc8c6j2],
.dds-invite-driver-contact span[b-rp2zc8c6j2] {
    color: #5F6E85;
    font-size: 12px;
    font-weight: 600;
    line-height: 18px;
}

.dds-driver-empty[b-rp2zc8c6j2] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 28px;
    color: #EF4444;
    font-weight: 700;
}

.dds-driver-empty img[b-rp2zc8c6j2] {
    width: 16px;
    height: 16px;
}

.dds-driver-row[b-rp2zc8c6j2],
/* Segmented accept/deny answer control: equal halves joined in the middle, green
   accept with rounded left, red deny with rounded right; once answered, the
   unselected half fades so the recorded answer stands out. */
.dds-driver-answer[b-rp2zc8c6j2] {
    display: inline-flex;
    align-items: stretch;
}

.dds-driver-answer button[b-rp2zc8c6j2] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 78px;
    min-height: 30px;
    padding: 6px 10px;
    border: none;
    border-radius: 0;
    font-size: 12px;
    font-weight: 600;
    color: #FFFFFF;
    white-space: nowrap;
}

.dds-driver-answer button.accept[b-rp2zc8c6j2] {
    background: #337C33;
    border-radius: 8px 0 0 8px;
}

.dds-driver-answer button.deny[b-rp2zc8c6j2] {
    background: #B82213;
    border-radius: 0 8px 8px 0;
}

.dds-driver-answer.answered button:not(.selected)[b-rp2zc8c6j2] {
    opacity: 0.5;
}

.dds-driver-toggle.gray[b-rp2zc8c6j2] {
    background: #F1F5F9;
    color: #475569;
}

.dds-invite-driver-row[b-rp2zc8c6j2] {
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr) auto auto;
    align-items: center;
    gap: 10px;
    min-height: 54px;
    padding: 8px 10px;
    border: 1px solid #E2E8F0;
    border-radius: 9px;
    background: #F8FAFC;
}

.dds-driver-row > img[b-rp2zc8c6j2],
.dds-invite-driver-row > img[b-rp2zc8c6j2] {
    width: 34px;
    height: 34px;
    border-radius: 50%;
    object-fit: cover;
    background: #E2E8F0;
}

.dds-driver-row div[b-rp2zc8c6j2],
.dds-invite-driver-name[b-rp2zc8c6j2] {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 1px;
}

.dds-driver-row strong[b-rp2zc8c6j2],
.dds-invite-driver-name strong[b-rp2zc8c6j2] {
    color: #1E293B;
    font-size: 13px;
    font-weight: 800;
    line-height: 18px;
    overflow-wrap: anywhere;
}

.dds-driver-row .dds-driver-name-line[b-rp2zc8c6j2] {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
}

.dds-driver-row .dds-driver-business[b-rp2zc8c6j2] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    width: fit-content;
    padding: 2px 7px;
    border-radius: 999px;
    background: #EEF2FF;
    color: #363AF5;
    font-size: 11px;
    font-weight: 700;
    line-height: 16px;
}

.dds-driver-business img[b-rp2zc8c6j2] {
    width: 12px;
    height: 12px;
}

.dds-driver-row span[b-rp2zc8c6j2],
.dds-invite-driver-name span[b-rp2zc8c6j2] {
    color: #5F6E85;
    font-size: 12px;
    font-weight: 600;
    line-height: 16px;
    overflow-wrap: anywhere;
}

.dds-driver-remove[b-rp2zc8c6j2],
.dds-driver-toggle[b-rp2zc8c6j2] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 30px;
    border: none;
    border-radius: 8px;
    padding: 6px 10px;
    background: #5263FF1F;
    color: #363AF5;
    font-size: 12px;
    font-weight: 800;
}

.dds-driver-toggle.remove[b-rp2zc8c6j2] {
    background: #FEE2E2;
    color: #DC2626;
}

.dds-driver-remove[b-rp2zc8c6j2] {
    width: 30px;
    padding: 0;
    background: #FEE2E2;
}

.dds-driver-remove img[b-rp2zc8c6j2] {
    width: 14px;
    height: 14px;
}

.dds-driver-popup-search span[b-rp2zc8c6j2] {
    color: #5F6E85;
    font-size: 12px;
    font-weight: 800;
    white-space: nowrap;
}

.dds-location-notes[b-rp2zc8c6j2] {
    display: flex;
    flex-direction: column;
    gap: 3px;
    margin-top: 8px;
    color: #475569;
    font-size: 12px;
    line-height: 18px;
}

.dds-location-notes p[b-rp2zc8c6j2] {
    margin: 0;
}

.dds-row-actions[b-rp2zc8c6j2] {
    position: relative;
    flex-shrink: 0;
    z-index: 2;
}

.dds-kebab[b-rp2zc8c6j2] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border: 0;
    border-radius: 8px;
    background: transparent;
}

.dds-kebab:hover[b-rp2zc8c6j2],
.dds-kebab:focus-visible[b-rp2zc8c6j2] {
    background: #F1F5F9;
}

.dds-kebab img[b-rp2zc8c6j2] {
    width: 16px;
    height: 16px;
}

.dds-location-menu[b-rp2zc8c6j2] {
    position: absolute;
    top: calc(100% + 6px);
    right: 0;
    z-index: 50;
    min-width: 190px;
    padding: 6px;
    border: 1px solid #E2E8F0;
    border-radius: 10px;
    background: #FFFFFF;
    box-shadow: 0 12px 32px rgba(30, 41, 59, 0.14);
}

.dds-location-menu button[b-rp2zc8c6j2] {
    width: 100%;
    border: none;
    border-radius: 8px;
    background: transparent;
    padding: 8px;
    text-align: left;
    color: #1E293B;
    font-size: 12px;
    font-weight: 700;
}

.dds-location-menu button:hover[b-rp2zc8c6j2] {
    background: #F1F5F9;
}

.dds-location-menu button.danger[b-rp2zc8c6j2] {
    color: #DC2626;
}

.dds-settings-list div[b-rp2zc8c6j2] {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 12px;
    border-radius: 8px;
    background: #F8FAFC;
    color: #475569;
    font-size: 13px;
}

.dds-table-wrap[b-rp2zc8c6j2] {
    overflow-x: auto;
}

.dds-table-wrap table[b-rp2zc8c6j2] {
    width: 100%;
    border-collapse: collapse;
    color: #1E293B;
    font-size: 13px;
}

.dds-table-wrap th[b-rp2zc8c6j2],
.dds-table-wrap td[b-rp2zc8c6j2] {
    padding: 10px 12px;
    border-bottom: 1px solid #E2E8F0;
    text-align: left;
}

.dds-table-wrap th[b-rp2zc8c6j2] {
    color: #5F6E85;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0;
}

.dds-empty[b-rp2zc8c6j2] {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 120px;
    border: 1px dashed #CBD5E1;
    border-radius: 8px;
    background: #F8FAFC;
    color: #5F6E85;
    font-size: 13px;
    font-weight: 700;
    text-align: center;
    padding: 16px;
}

.dds-empty.compact[b-rp2zc8c6j2] {
    min-height: 56px;
}

/* ---- Worked-time box: "00:01 - 04:00" on the left, "3H 59M" on the right ---- */
.worked-time-box[b-rp2zc8c6j2] {
    padding: 6px 10px;
    border: 1px solid #E2E8F0;
    border-radius: 8px;
    background: #F8FAFC;
    white-space: nowrap;
}

.worked-time-box .worked-time-range[b-rp2zc8c6j2] {
    font-size: 12px;
    font-weight: 600;
    line-height: 16px;
    letter-spacing: -0.2px;
    color: #5F6E85;
}

.worked-time-box .worked-time-total[b-rp2zc8c6j2] {
    font-size: 12px;
    font-weight: 700;
    line-height: 16px;
    letter-spacing: -0.2px;
    color: #0F172A;
}

.dds-worked-time-list[b-rp2zc8c6j2] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin-top: 12px;
}

.dds-worked-time-row strong[b-rp2zc8c6j2] {
    font-size: 13px;
    font-weight: 600;
    color: #0F172A;
}

.dds-empty.tall[b-rp2zc8c6j2] {
    min-height: 280px;
    flex-direction: column;
    gap: 6px;
}

.dds-empty.tall h6[b-rp2zc8c6j2],
.dds-empty.tall p[b-rp2zc8c6j2] {
    margin: 0;
}

.dds-empty.tall p[b-rp2zc8c6j2] {
    max-width: 420px;
    font-weight: 600;
    line-height: 20px;
}

.dds-confirm-body[b-rp2zc8c6j2] {
    padding: 0 20px 16px;
}

.dds-confirm-body p[b-rp2zc8c6j2] {
    margin: 0 0 12px;
    color: #5F6E85;
    font-size: 14px;
    font-weight: 600;
}

.dds-confirm-context[b-rp2zc8c6j2] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 12px;
    border-radius: 8px;
    background: #F8FAFC;
    color: #1E293B;
    font-size: 13px;
}

[b-rp2zc8c6j2] .dds-complete-dispatch-popup .modal-dialog {
    min-width: min(480px, calc(100vw - 32px)) !important;
}

[b-rp2zc8c6j2] .dds-complete-dispatch-popup .wm-popup-modal-content {
    padding: 0 !important;
    border: 1px solid rgba(30, 41, 59, 0.03) !important;
    border-radius: 20px !important;
    background: #FFFFFF !important;
    box-shadow:
        0 1px 1px -0.5px rgba(30, 41, 59, 0.03),
        0 3px 3px -1.5px rgba(30, 41, 59, 0.03),
        0 20px 20px -12px rgba(30, 41, 59, 0.03),
        0 32px 32px -16px rgba(30, 41, 59, 0.03) !important;
}

[b-rp2zc8c6j2] .dds-complete-dispatch-popup .modal-header {
    min-height: 80px;
    padding: 16px 20px !important;
    align-items: flex-end !important;
    border-bottom: 0 !important;
}

[b-rp2zc8c6j2] .dds-complete-dispatch-popup .wm-popup-header-section {
    gap: 4px;
}

[b-rp2zc8c6j2] .dds-complete-dispatch-popup .modal-header h5.modal-title {
    margin: 0 !important;
    color: #1E293B !important;
    font-size: 18px !important;
    font-weight: 700 !important;
    line-height: 24px !important;
    letter-spacing: -0.2px !important;
}

[b-rp2zc8c6j2] .dds-complete-dispatch-popup .wm-popup-header-subtext {
    margin: 0 !important;
    color: #5F6E85 !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    line-height: 20px !important;
    letter-spacing: -0.2px !important;
}

[b-rp2zc8c6j2] .dds-complete-dispatch-popup .modal-header .btn-close {
    position: absolute;
    top: 12px;
    right: 12px;
    width: 32px !important;
    height: 32px !important;
    margin: 0 !important;
    border: 1px solid rgba(30, 41, 59, 0.06) !important;
    border-radius: 8px !important;
    background-color: rgba(241, 245, 249, 0.8) !important;
    opacity: 1 !important;
}

[b-rp2zc8c6j2] .dds-complete-dispatch-popup .modal-body {
    display: none !important;
}

[b-rp2zc8c6j2] .dds-complete-dispatch-popup .wm-popup-modal-footer {
    min-height: 72px;
    padding: 16px 20px !important;
    gap: 12px !important;
    border-top: 1px solid rgba(30, 41, 59, 0.09) !important;
    background: #FFFFFF !important;
}

[b-rp2zc8c6j2] .dds-complete-dispatch-popup .wm-popup-modal-footer button {
    min-height: 40px;
    border-radius: 10px;
    font-size: 13px;
    font-weight: 600;
    line-height: 24px;
    letter-spacing: -0.2px;
}

[b-rp2zc8c6j2] .dds-complete-dispatch-popup .wm-popup-modal-footer .btn-wm-secondary {
    border: 1px solid rgba(30, 41, 59, 0.06);
    background: rgba(241, 245, 249, 0.8);
    color: #1E293B;
}

[b-rp2zc8c6j2] .dds-complete-dispatch-popup .wm-popup-modal-footer .btn-wm-primary {
    border: none;
    background: #296C28;
    color: #FFFFFF;
    box-shadow: 0 1px 1px -0.5px rgba(30, 41, 59, 0.03), inset 0 3px 3px rgba(255, 255, 255, 0.12);
}

[b-rp2zc8c6j2] .dds-cancel-dispatch-popup .modal-dialog {
    min-width: min(480px, calc(100vw - 32px)) !important;
}

[b-rp2zc8c6j2] .dds-cancel-dispatch-popup .wm-popup-modal-content {
    padding: 0 !important;
    border: 1px solid rgba(30, 41, 59, 0.03) !important;
    border-radius: 20px !important;
    background: #FFFFFF !important;
    box-shadow:
        0 1px 1px -0.5px rgba(30, 41, 59, 0.03),
        0 3px 3px -1.5px rgba(30, 41, 59, 0.03),
        0 20px 20px -12px rgba(30, 41, 59, 0.03),
        0 32px 32px -16px rgba(30, 41, 59, 0.03) !important;
}

[b-rp2zc8c6j2] .dds-cancel-dispatch-popup .modal-header {
    min-height: 80px;
    padding: 16px 20px !important;
    align-items: flex-end !important;
    border-bottom: 0 !important;
}

[b-rp2zc8c6j2] .dds-cancel-dispatch-popup .wm-popup-header-section {
    gap: 4px;
}

[b-rp2zc8c6j2] .dds-cancel-dispatch-popup .modal-header h5.modal-title {
    margin: 0 !important;
    color: #1E293B !important;
    font-size: 18px !important;
    font-weight: 700 !important;
    line-height: 24px !important;
    letter-spacing: -0.2px !important;
}

[b-rp2zc8c6j2] .dds-cancel-dispatch-popup .wm-popup-header-subtext {
    margin: 0 !important;
    color: #5F6E85 !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    line-height: 20px !important;
    letter-spacing: -0.2px !important;
}

[b-rp2zc8c6j2] .dds-cancel-dispatch-popup .modal-header .btn-close {
    position: absolute;
    top: 12px;
    right: 12px;
    width: 32px !important;
    height: 32px !important;
    margin: 0 !important;
    border: 1px solid rgba(30, 41, 59, 0.06) !important;
    border-radius: 8px !important;
    background-color: rgba(241, 245, 249, 0.8) !important;
    opacity: 1 !important;
}

[b-rp2zc8c6j2] .dds-cancel-dispatch-popup .modal-body {
    display: none !important;
}

[b-rp2zc8c6j2] .dds-cancel-dispatch-popup .wm-popup-modal-footer {
    min-height: 72px;
    padding: 16px 20px !important;
    gap: 12px !important;
    border-top: 1px solid rgba(30, 41, 59, 0.09) !important;
    background: #FFFFFF !important;
}

[b-rp2zc8c6j2] .dds-cancel-dispatch-popup .wm-popup-modal-footer button {
    min-height: 40px;
    border-radius: 10px;
    font-size: 13px;
    font-weight: 600;
    line-height: 24px;
    letter-spacing: -0.2px;
}

[b-rp2zc8c6j2] .dds-cancel-dispatch-popup .wm-popup-modal-footer .btn-wm-danger-translucent {
    border: none;
    background: rgba(237, 64, 48, 0.12);
    color: #B82213;
}

[b-rp2zc8c6j2] .dds-cancel-dispatch-popup .wm-popup-modal-footer .btn-wm-primary {
    border: none;
    background: #5263FF;
    color: #FFFFFF;
    box-shadow: 0 1px 1px -0.5px rgba(30, 41, 59, 0.03), inset 0 3px 3px rgba(255, 255, 255, 0.12);
}

/* The change-worktype popup chrome (dialog, content, header, footer) lives in
   WMPopup.razor.css: those elements belong to WMPopup, so this file's ::deep rules
   never reached them (the popup is a top-level sibling with no scoped ancestor). */

.dds-work-type-body[b-rp2zc8c6j2] {
    display: flex;
    flex-direction: column;
    gap: 16px;
    height: 100%;
    min-height: 0;
    padding: 20px;
    overflow: hidden;
}

.dds-work-type-warning[b-rp2zc8c6j2] {
    margin: 0;
    color: #475569;
    font-size: 15px;
    font-weight: 600;
    line-height: 24px;
    letter-spacing: -0.2px;
}

.dds-work-type-field[b-rp2zc8c6j2] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin: 0;
}

.dds-work-type-field span[b-rp2zc8c6j2] {
    color: #1E293B;
    font-size: 13px;
    font-weight: 700;
    line-height: 20px;
    letter-spacing: -0.2px;
}

.dds-work-type-field select[b-rp2zc8c6j2] {
    min-height: 40px;
    border: 1px solid rgba(30, 41, 59, 0.09);
    border-radius: 10px;
    color: #1E293B;
    font-size: 13px;
    font-weight: 600;
}

.dds-work-type-table[b-rp2zc8c6j2] {
    display: flex;
    flex-direction: column;
    min-height: 0;
    border: 1px solid rgba(30, 41, 59, 0.06);
    border-radius: 16px;
    background: #F8FAFC;
    overflow: hidden;
}

.dds-work-type-table-head[b-rp2zc8c6j2],
.dds-work-type-row[b-rp2zc8c6j2] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 200px;
}

.dds-work-type-table-head[b-rp2zc8c6j2] {
    min-height: 44px;
    background: #F1F5F9;
}

.dds-work-type-table-body[b-rp2zc8c6j2] {
    min-height: 0;
    overflow-y: auto;
}

.dds-work-type-row[b-rp2zc8c6j2] {
    min-height: 56px;
    background: #FFFFFF;
}

.dds-work-type-row:nth-child(even)[b-rp2zc8c6j2] {
    background: #F8FAFC;
}

.dds-work-type-address-cell[b-rp2zc8c6j2],
.dds-work-type-subcontractor-cell[b-rp2zc8c6j2] {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    min-width: 0;
    padding: 8px 16px;
}

.dds-work-type-table-head .dds-work-type-address-cell[b-rp2zc8c6j2],
.dds-work-type-table-head .dds-work-type-subcontractor-cell[b-rp2zc8c6j2] {
    align-items: center;
    padding: 12px 16px;
}

.dds-work-type-address-cell[b-rp2zc8c6j2] {
    border-right: 1px solid rgba(30, 41, 59, 0.06);
}

.dds-work-type-table-head .dds-work-type-address-cell[b-rp2zc8c6j2] {
    border-bottom: 1px solid rgba(30, 41, 59, 0.06);
}

.dds-work-type-table-head .dds-work-type-subcontractor-cell[b-rp2zc8c6j2] {
    border-bottom: 1px solid rgba(30, 41, 59, 0.06);
}

.dds-work-type-address-cell input[b-rp2zc8c6j2] {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.dds-work-type-checkbox[b-rp2zc8c6j2] {
    position: relative;
    width: 18px;
    height: 18px;
    margin-top: 1px;
    flex: 0 0 18px;
    border: 2px solid rgba(30, 41, 59, 0.12);
    border-radius: 6px;
    background: linear-gradient(180deg, #F1F5F9 0%, #FFFFFF 100%);
    box-shadow: 0 1px 1px -0.5px rgba(30, 41, 59, 0.03), inset 0 3px 3px rgba(255, 255, 255, 0.12);
}

.dds-work-type-checkbox.checked[b-rp2zc8c6j2] {
    border-color: #5263FF;
    background: #5263FF;
}

.dds-work-type-checkbox.checked[b-rp2zc8c6j2]::after {
    content: "";
    position: absolute;
    left: 4px;
    top: 2px;
    width: 6px;
    height: 9px;
    border: solid #FFFFFF;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}

.dds-work-type-checkbox.partial[b-rp2zc8c6j2] {
    border-color: rgba(82, 99, 255, 0.2);
    background: rgba(82, 99, 255, 0.2);
}

.dds-work-type-checkbox.partial[b-rp2zc8c6j2]::after {
    left: 4px;
    top: 6px;
    width: 8px;
    height: 2px;
    border: 0;
    background: #5263FF;
    transform: none;
}

.dds-work-type-location-text[b-rp2zc8c6j2] {
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-width: 0;
}

.dds-work-type-location-text strong[b-rp2zc8c6j2],
.dds-work-type-select-all strong[b-rp2zc8c6j2],
.dds-work-type-subcontractor-cell strong[b-rp2zc8c6j2] {
    color: #1E293B;
    font-size: 13px;
    font-weight: 700;
    line-height: 20px;
    letter-spacing: -0.2px;
}

.dds-work-type-location-text small[b-rp2zc8c6j2] {
    color: #475569;
    font-size: 13px;
    font-weight: 500;
    line-height: 20px;
    letter-spacing: -0.2px;
}

.dds-work-type-location-text strong[b-rp2zc8c6j2],
.dds-work-type-location-text small[b-rp2zc8c6j2],
.dds-work-type-subcontractor-cell span[b-rp2zc8c6j2] {
    overflow-wrap: anywhere;
}

.dds-work-type-subcontractor-cell img[b-rp2zc8c6j2] {
    width: 16px;
    height: 16px;
}

.dds-work-type-subcontractor-cell span[b-rp2zc8c6j2] {
    color: #1E293B;
    font-size: 13px;
    font-weight: 600;
    line-height: 20px;
    letter-spacing: -0.2px;
}

@media (max-width: 640px) {
    [b-rp2zc8c6j2] .dds-change-work-type-popup .wm-popup-modal-content {
        height: calc(100vh - 24px);
    }

    .dds-work-type-table-head[b-rp2zc8c6j2],
    .dds-work-type-row[b-rp2zc8c6j2] {
        grid-template-columns: minmax(0, 1fr);
    }

    .dds-work-type-address-cell[b-rp2zc8c6j2] {
        border-right: 0;
    }

    .dds-work-type-subcontractor-cell[b-rp2zc8c6j2] {
        padding-top: 0;
    }
}

[b-rp2zc8c6j2] .dds-active-locations-popup .wm-popup-modal-content {
    padding: 0 !important;
    border-radius: 24px !important;
    background: #FFFFFF;
    overflow: hidden;
    box-shadow: 0 24px 60px rgba(15, 23, 42, 0.18);
}

[b-rp2zc8c6j2] .dds-active-locations-popup .modal-header {
    padding: 24px 28px 16px !important;
    background: #FFFFFF !important;
    border-bottom: none !important;
}

[b-rp2zc8c6j2] .dds-active-locations-popup .modal-header h5.modal-title {
    margin: 0 !important;
    color: #111827 !important;
    font-size: 20px !important;
    font-weight: 800 !important;
    line-height: 26px !important;
    letter-spacing: 0 !important;
}

[b-rp2zc8c6j2] .dds-active-locations-popup .wm-popup-header-subtext {
    max-width: 620px;
    margin: 0 !important;
    color: #5F6E85 !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    line-height: 22px !important;
    letter-spacing: 0 !important;
}

[b-rp2zc8c6j2] .dds-active-locations-popup .modal-header .btn-close {
    width: 42px !important;
    height: 42px !important;
    margin: 0 !important;
    border-radius: 12px !important;
    background-color: #F8FAFC !important;
    border: 1px solid #E2E8F0 !important;
    opacity: 1 !important;
}

[b-rp2zc8c6j2] .dds-active-locations-popup .modal-body {
    padding: 0 !important;
    background: #FFFFFF !important;
    border-top: 0 !important;
    /* Neutralize the global ".new-location .modal-body" 900px/scroll container so the
       body hugs its content and the inner location list is the only scroller (otherwise
       a tall empty gap appears between the list and the footer). */
    max-height: none !important;
    overflow: visible !important;
}

[b-rp2zc8c6j2] .dds-active-locations-popup .wm-popup-modal-footer {
    gap: 16px !important;
    padding: 20px 28px !important;
    border-top: 1px solid #EEF2F7 !important;
    background: #FFFFFF !important;
}

[b-rp2zc8c6j2] .dds-active-locations-popup .wm-popup-modal-footer button {
    min-height: 48px;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 700;
}

.dds-confirm-body.dds-active-locations-body[b-rp2zc8c6j2] {
    padding: 0;
}

.dds-add-more-search[b-rp2zc8c6j2] {
    padding: 0 28px 16px;
    background: #FFFFFF;
}

.dds-add-more-search .search[b-rp2zc8c6j2] {
    height: 40px;
    margin: 0;
    padding: 0 12px;
    border: 1px solid #D7DEE8;
    border-radius: 10px;
    background: #FFFFFF;
}

.dds-add-more-search .form-control[b-rp2zc8c6j2] {
    height: 38px;
    padding: 0 6px;
    border: 0;
    box-shadow: none;
    color: #1E293B;
    font-size: 15px;
}

.dds-active-route-list[b-rp2zc8c6j2] {
    display: flex;
    flex-direction: column;
    max-height: min(488px, calc(100vh - 310px));
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: #CBD5E1 transparent;
    border-top: 1px solid #E7EDF4;
}

.dds-active-route-item[b-rp2zc8c6j2] {
    background: #FFFFFF;
    border-bottom: 1px solid #EEF2F7;
    transition: background 0.15s ease;
}

.dds-active-route-item:nth-child(even)[b-rp2zc8c6j2] {
    background: #F8FAFC;
}

.dds-active-route-item:hover[b-rp2zc8c6j2],
.dds-active-route-item.selected[b-rp2zc8c6j2] {
    background: #F5F7FF;
}

.dds-active-route-row[b-rp2zc8c6j2] {
    display: flex;
    align-items: center;
    width: 100%;
    min-height: 64px;
    background: transparent;
}

.dds-active-route-select[b-rp2zc8c6j2] {
    display: flex;
    align-items: center;
    gap: 12px;
    flex: 1;
    min-width: 0;
    min-height: 64px;
    margin: 0;
    padding: 12px 8px 12px 28px;
    border: 0;
    background: transparent;
    color: inherit;
    font: inherit;
    text-align: left;
}

.dds-active-route-select strong[b-rp2zc8c6j2] {
    color: #1E293B;
    font-size: 15px;
    font-weight: 800;
    line-height: 21px;
    overflow-wrap: anywhere;
}

.dds-active-route-select small[b-rp2zc8c6j2] {
    color: #475569;
    font-size: 14px;
    font-weight: 600;
    line-height: 20px;
    overflow-wrap: anywhere;
}

.dds-active-route-toggle[b-rp2zc8c6j2] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 36px;
    height: 36px;
    margin-right: 24px;
    padding: 0;
    border: 1px solid #E2E8F0;
    border-radius: 9px;
    background: #F8FAFC;
    color: #5F6E85;
}

.dds-active-route-toggle svg[b-rp2zc8c6j2] {
    transition: transform 0.15s ease;
}

.dds-active-route-toggle.expanded svg[b-rp2zc8c6j2] {
    transform: rotate(180deg);
}

.dds-active-route-addresses[b-rp2zc8c6j2] {
    max-height: 220px;
    margin: 0 24px 12px 62px;
    overflow-y: auto;
    border: 1px solid #E2E8F0;
    border-radius: 10px;
    background: #FFFFFF;
    scrollbar-width: thin;
    scrollbar-color: #CBD5E1 transparent;
}

.dds-active-route-address[b-rp2zc8c6j2] {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    min-width: 0;
    padding: 10px 12px;
    border-bottom: 1px solid #EEF2F7;
}

.dds-active-route-address:last-child[b-rp2zc8c6j2] {
    border-bottom: 0;
}

.dds-active-route-address img[b-rp2zc8c6j2] {
    flex-shrink: 0;
    width: 18px;
    height: 18px;
    margin-top: 1px;
}

.dds-active-route-address span[b-rp2zc8c6j2] {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.dds-active-route-address strong[b-rp2zc8c6j2],
.dds-active-route-address small[b-rp2zc8c6j2] {
    overflow-wrap: anywhere;
}

.dds-active-route-address strong[b-rp2zc8c6j2] {
    color: #1E293B;
    font-size: 13px;
    font-weight: 700;
    line-height: 19px;
}

.dds-active-route-address small[b-rp2zc8c6j2],
.dds-active-route-address-state[b-rp2zc8c6j2] {
    color: #5F6E85;
    font-size: 12px;
    font-weight: 600;
    line-height: 18px;
}

.dds-active-route-address-state[b-rp2zc8c6j2] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 48px;
    padding: 10px 12px;
}

.dds-active-location-picker[b-rp2zc8c6j2] {
    display: flex;
    flex-direction: column;
    background: #FFFFFF;
}

.dds-active-location-head[b-rp2zc8c6j2] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    min-height: 56px;
    padding: 0 28px;
    background: #F1F5F9;
    border-top: 1px solid #E7EDF4;
    border-bottom: 1px solid #E7EDF4;
}

.dds-active-location-head-title[b-rp2zc8c6j2] {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
}

.dds-active-location-head-title img[b-rp2zc8c6j2] {
    width: 22px;
    height: 22px;
}

.dds-active-location-head-title strong[b-rp2zc8c6j2] {
    color: #1E293B;
    font-size: 15px;
    font-weight: 800;
    line-height: 22px;
}

.dds-active-location-head > span[b-rp2zc8c6j2] {
    flex-shrink: 0;
    color: #5F6E85;
    font-size: 14px;
    font-weight: 600;
    line-height: 20px;
}

.dds-active-location-list[b-rp2zc8c6j2] {
    display: flex;
    flex-direction: column;
    max-height: min(488px, calc(100vh - 310px));
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: #CBD5E1 transparent;
}

.dds-active-location-list[b-rp2zc8c6j2]::-webkit-scrollbar {
    width: 4px;
}

.dds-active-location-list[b-rp2zc8c6j2]::-webkit-scrollbar-thumb {
    border-radius: 4px;
    background: #CBD5E1;
}

.dds-active-location-row[b-rp2zc8c6j2] {
    display: flex;
    align-items: center;
    gap: 12px;
    width: 100%;
    min-height: 64px;
    margin: 0;
    padding: 12px 28px;
    border: 0;
    background: #FFFFFF;
    color: inherit;
    font: inherit;
    text-align: left;
    cursor: pointer;
    transition: background 0.15s ease;
}

.dds-active-location-row:nth-child(even)[b-rp2zc8c6j2] {
    background: #F8FAFC;
}

.dds-active-location-row:hover[b-rp2zc8c6j2],
.dds-active-location-row.selected[b-rp2zc8c6j2] {
    background: #F5F7FF;
}

.dds-active-location-copy[b-rp2zc8c6j2] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.dds-active-location-row strong[b-rp2zc8c6j2] {
    color: #1E293B;
    font-size: 15px;
    font-weight: 800;
    line-height: 21px;
    overflow-wrap: anywhere;
}

.dds-active-location-row small[b-rp2zc8c6j2] {
    color: #475569;
    font-size: 14px;
    font-weight: 600;
    line-height: 20px;
    overflow-wrap: anywhere;
}

.dds-active-location-checkbox[b-rp2zc8c6j2] {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 22px;
    height: 22px;
    border: 2px solid #DCE2EA;
    border-radius: 8px;
    background: linear-gradient(180deg, #F8FAFC 0%, #FFFFFF 100%);
    box-shadow: 0 1px 1px -0.5px #1E293B08;
}

button.dds-active-location-checkbox[b-rp2zc8c6j2] {
    padding: 0;
    cursor: pointer;
}

.dds-active-location-checkbox.checked[b-rp2zc8c6j2] {
    border-color: #5263FF;
    background: #5263FF;
}

.dds-active-location-checkbox.checked[b-rp2zc8c6j2]::after {
    content: "";
    width: 9px;
    height: 6px;
    border-left: 2px solid #FFFFFF;
    border-bottom: 2px solid #FFFFFF;
    transform: rotate(-45deg) translate(1px, -1px);
}

.status-badge[b-rp2zc8c6j2] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 24px;
    padding: 4px 8px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    line-height: 16px;
    white-space: nowrap;
}

.status-badge.completed[b-rp2zc8c6j2] {
    color: #296C28;
    background: #409B3F1F;
}

.status-badge.planned[b-rp2zc8c6j2] {
    color: #363AF5;
    background: #5263FF1F;
}

.status-badge.in-progress[b-rp2zc8c6j2] {
    color: #A16207;
    background: #FEF3C7;
}

.status-badge.cancelled[b-rp2zc8c6j2] {
    color: #475569;
    background: #E2E8F0;
    border: 1px solid #CBD5E1;
}

/* Zone dispatch right slider: Figma all-tabs-open state. */
.zoneDispatchDetailsSlider.ID-popup .modal-dialog[b-rp2zc8c6j2] {
    width: 740px;
    min-width: 740px;
    max-width: 740px;
}

.zoneDispatchDetailsSlider.ID-popup .modal-header[b-rp2zc8c6j2] {
    min-height: 116px;
    padding: 24px 24px 16px;
    border-bottom: 0;
}

.zoneDispatchDetailsSlider.ID-popup .modal-header > .d-flex:first-child[b-rp2zc8c6j2] {
    width: 100%;
    min-width: 0;
    gap: 16px !important;
}

.zoneDispatchDetailsSlider.ID-popup .modal-header .icon-image[b-rp2zc8c6j2] {
    width: 48px;
    height: 48px;
    flex: 0 0 48px;
    border-radius: 10px;
    background: rgba(82, 99, 255, 0.12) !important;
}

.zoneDispatchDetailsSlider.ID-popup .modal-header .icon-image img[b-rp2zc8c6j2] {
    width: 28px;
    height: 28px;
}

.zoneDispatchDetailsSlider.ID-popup .modal-header .modal-title[b-rp2zc8c6j2] {
    font-size: 22px;
    line-height: 28px;
    font-weight: 800;
    letter-spacing: -1px;
}

.zoneDispatchDetailsSlider.ID-popup .modal-header .txt p[b-rp2zc8c6j2] {
    margin: 0;
    font-size: 18px;
    font-weight: 700;
    line-height: 24px;
    letter-spacing: -0.2px;
    color: #475569;
}

.zoneDispatchDetailsSlider.ID-popup .modal-header .btn-close[b-rp2zc8c6j2] {
    width: 40px;
    height: 40px;
    flex: 0 0 40px;
    border: 1px solid rgba(30, 41, 59, 0.06);
    border-radius: 10px;
    background-color: rgba(241, 245, 249, 0.8);
}

.zoneDispatchDetailsSlider.ID-popup .modal-body[b-rp2zc8c6j2] {
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .main-tab[b-rp2zc8c6j2] {
    flex: 0 0 80px;
    padding: 0 24px 16px;
    border-bottom: 1px solid rgba(30, 41, 59, 0.09);
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .tabs[b-rp2zc8c6j2] {
    width: 100%;
    height: 48px;
    padding: 6px;
    gap: 6px;
    border: 1px solid rgba(30, 41, 59, 0.03);
    border-radius: 16px;
    background: rgba(241, 245, 249, 0.8);
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .tabs button[b-rp2zc8c6j2] {
    height: 36px;
    padding: 4px 10px;
    border-radius: 10px;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .tabs button.active[b-rp2zc8c6j2] {
    border-color: transparent;
    box-shadow:
        0 1px 1px -0.5px rgba(30, 41, 59, 0.03),
        0 3px 3px -1.5px rgba(30, 41, 59, 0.03),
        0 20px 20px -12px rgba(30, 41, 59, 0.03);
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .addresses-tab[b-rp2zc8c6j2] {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    scrollbar-width: none;
    -ms-overflow-style: none;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .addresses-tab[b-rp2zc8c6j2]::-webkit-scrollbar {
    display: none;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .multi-tabs[b-rp2zc8c6j2] {
    height: 40px;
    margin-top: 0 !important;
    border-bottom: 1px solid rgba(30, 41, 59, 0.09);
    overflow-x: hidden;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .multi-tabs button[b-rp2zc8c6j2] {
    flex: 1 1 0;
    width: auto;
    min-width: 0;
    height: 40px;
    padding: 0 0 8px;
    gap: 2px !important;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .multi-tabs button img[b-rp2zc8c6j2] {
    width: 18px;
    height: 18px;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .multi-tabs button p[b-rp2zc8c6j2],
.zoneDispatchDetailsSlider.ID-popup .modal-body .multi-tabs button span[b-rp2zc8c6j2] {
    font-size: 13px;
    font-weight: 600;
    line-height: 24px;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .multi-tabs button.active p[b-rp2zc8c6j2],
.zoneDispatchDetailsSlider.ID-popup .modal-body .multi-tabs button.active span[b-rp2zc8c6j2] {
    color: #363AF5;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .title-line[b-rp2zc8c6j2] {
    min-height: 48px;
    padding: 12px 24px;
    border-bottom: 1px solid rgba(30, 41, 59, 0.09);
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .all-multi-tab[b-rp2zc8c6j2] {
    display: flex;
    flex-direction: column;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian[b-rp2zc8c6j2] {
    margin: 0 !important;
    border-bottom: 1px solid rgba(30, 41, 59, 0.09);
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian .cstm-title[b-rp2zc8c6j2] {
    min-height: 64px;
    padding: 16px 24px;
    gap: 24px !important;
    background: #FFFFFF;
    border-bottom: 0;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian.sub-accordian .cstm-title[b-rp2zc8c6j2] {
    min-height: 84px;
    padding: 16px 24px;
    background: #F8FAFC;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian .cstm-title .left-title[b-rp2zc8c6j2] {
    flex: 1 1 296px;
    min-width: 0;
    gap: 12px !important;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian .cstm-title .left-title .icon[b-rp2zc8c6j2] {
    width: 32px;
    height: 32px;
    flex: 0 0 32px;
    border-radius: 6px;
    background: rgba(82, 99, 255, 0.12);
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian .cstm-title .left-title .icon img[b-rp2zc8c6j2] {
    width: 20px;
    height: 20px;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian .cstm-title .left-title p[b-rp2zc8c6j2] {
    margin: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 18px;
    font-weight: 800;
    line-height: 24px;
    color: #475569;
}

/* Subcontractor rows use the smaller business-name typography from the design. */
.zoneDispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian.sub-accordian .cstm-title .left-title .img-txt p[b-rp2zc8c6j2] {
    margin: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 15px;
    font-weight: 600;
    line-height: 24px;
    letter-spacing: -0.2px;
    color: var(--gray-txt, #475569);
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian.sub-accordian .cstm-title .left-title .img-txt img[b-rp2zc8c6j2] {
    height: 20px;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian.sub-accordian .cstm-title .left-title .img-txt img.alert-icon[b-rp2zc8c6j2] {
    height: 16px;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian.sub-accordian .cstm-title .left-title .v-line[b-rp2zc8c6j2] {
    width: 4px;
    height: 52px;
    flex: 0 0 4px;
    border-radius: 50px;
    background-color: var(--purple, #5263FF);
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian.sub-accordian .cstm-title .left-title .bagee[b-rp2zc8c6j2] {
    width: fit-content;
    padding: 4px 6px;
    border-radius: 8px;
    background-color: #06B1F11F;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian.sub-accordian .cstm-title .left-title .bagee span[b-rp2zc8c6j2] {
    font-size: 12px;
    font-weight: 600;
    line-height: 16px;
    letter-spacing: -0.2px;
    color: #0071A7;
    white-space: nowrap;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian.sub-accordian .cstm-title .left-title .bagee img[b-rp2zc8c6j2] {
    height: 14px;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian .cstm-title .center-title[b-rp2zc8c6j2] {
    flex: 0 1 180px;
    min-width: 140px;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian .cstm-title .center-title .progress-card[b-rp2zc8c6j2] {
    width: 156px;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian .cstm-title .center-title .progress-card .progress-header[b-rp2zc8c6j2] {
    margin-bottom: 6px;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian .cstm-title .center-title .progress-card span[b-rp2zc8c6j2] {
    font-size: 12px;
    font-weight: 600;
    line-height: 16px;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian .cstm-title .center-title .progress-card span.percent.yellow[b-rp2zc8c6j2] {
    color: #9D6600;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian .cstm-title .center-title .progress-card span.percent.green[b-rp2zc8c6j2] {
    color: #337C33;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian .cstm-title .center-title .progress-card .progress-bar[b-rp2zc8c6j2] {
    width: 156px;
    height: 12px;
    border-radius: 999px;
    background: #E2E8F0;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian .cstm-title .center-title .progress-card .progress-bar .progress-fill[b-rp2zc8c6j2] {
    height: 12px;
    border-radius: 999px;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian .cstm-title .center-title .progress-card .progress-bar .progress-fill.yellow[b-rp2zc8c6j2] {
    background: #FFC30A;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian .cstm-title .center-title .progress-card .progress-bar .progress-fill.green[b-rp2zc8c6j2] {
    background: #337C33;
}

/* The right column is as wide as its pills. A fixed width let the pills shrink under
   their own labels ("Ingen chauffører", "Accepteret" running past the background). */
.zoneDispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian .cstm-title .right-title[b-rp2zc8c6j2] {
    flex: 0 0 auto;
    gap: 8px !important;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian .cstm-title .right-title .bagee[b-rp2zc8c6j2] {
    display: inline-flex;
    align-items: center;
    flex-shrink: 0;
    white-space: nowrap;
    min-width: 40px;
    min-height: 24px;
    padding: 4px 8px;
    border-radius: 8px;
    gap: 3px;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian .cstm-title .right-title .bagee.red[b-rp2zc8c6j2] {
    background: rgba(237, 64, 48, 0.12);
    color: #B82213;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian .cstm-title .right-title .bagee.green[b-rp2zc8c6j2] {
    background: rgba(64, 155, 63, 0.12);
    color: #296C28;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian .cstm-title .right-title .bagee.dark[b-rp2zc8c6j2] {
    border: 1px solid rgba(30, 41, 59, 0.03);
    background: rgba(241, 245, 249, 0.8);
    color: #1E293B;
}

.dispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian .cstm-title .right-title .bagee.clickable[b-rp2zc8c6j2] {
    cursor: pointer;
}

.dispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian .cstm-title .right-title .bagee span[b-rp2zc8c6j2] {
    font-size: 12px;
    font-weight: 600;
    white-space: nowrap;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian .cstm-title .right-title .bagee img[b-rp2zc8c6j2] {
    width: 14px;
    height: 14px;
}

/* A route row under a zone carries the same driver pill as a route header. */
.zoneDispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian .cstm-data .zone-route-row[b-rp2zc8c6j2] {
    cursor: default;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian .cstm-data .zone-route-row .bagee[b-rp2zc8c6j2] {
    display: inline-flex;
    align-items: center;
    flex-shrink: 0;
    white-space: nowrap;
    min-width: 40px;
    min-height: 24px;
    padding: 4px 8px;
    border-radius: 8px;
    gap: 3px;
    cursor: pointer;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian .cstm-data .zone-route-row .bagee.red[b-rp2zc8c6j2] {
    background: rgba(237, 64, 48, 0.12);
    color: #B82213;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian .cstm-data .zone-route-row .bagee.dark[b-rp2zc8c6j2] {
    border: 1px solid rgba(30, 41, 59, 0.03);
    background: rgba(241, 245, 249, 0.8);
    color: #1E293B;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian .cstm-data .zone-route-row .bagee span[b-rp2zc8c6j2] {
    max-width: none;
    font-size: 12px;
    font-weight: 600;
    color: inherit;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian .cstm-data .zone-route-row .bagee img[b-rp2zc8c6j2] {
    width: 14px;
    height: 14px;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian .cstm-title .right-title .arrow[b-rp2zc8c6j2] {
    width: 32px;
    height: 32px;
    flex: 0 0 32px;
    border-radius: 8px;
    background: rgba(82, 99, 255, 0.12);
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian.sub-accordian .cstm-title .right-title .arrow[b-rp2zc8c6j2] {
    background: transparent;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian .cstm-title .right-title .arrow img[b-rp2zc8c6j2] {
    width: 16px;
    height: 16px;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian .cstm-title .right-title .arrow img.rotate[b-rp2zc8c6j2] {
    transform: rotate(180deg);
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian .cstm-data[b-rp2zc8c6j2] {
    max-height: 0;
    overflow: hidden;
    background: #F1F5F9;
    transition: max-height 0.3s ease;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian .cstm-data .icon-txt[b-rp2zc8c6j2] {
    min-height: 32px;
    padding: 8px 24px 8px 36px;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian .cstm-data .icon-txt img[b-rp2zc8c6j2] {
    width: 20px;
    height: 20px;
    flex: 0 0 20px;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian .cstm-data .icon-txt span[b-rp2zc8c6j2] {
    color: var(--orange, #B82213);
    font-size: 13px;
    font-weight: 600;
    line-height: 20px;
    letter-spacing: -0.2px;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian .cstm-data .address-name[b-rp2zc8c6j2] {
    min-height: 64px;
    padding: 12px 24px 12px 44px;
    border-top: 1px solid rgba(30, 41, 59, 0.06);
    border-bottom: 0;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian .cstm-data .address-name .v-line[b-rp2zc8c6j2] {
    width: 4px;
    min-height: 40px;
    border-radius: 999px;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian .cstm-data .address-name .v-line.red[b-rp2zc8c6j2] {
    background: #ED4030;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian.sub-accordian .cstm-data .address-name .v-line.p-trans[b-rp2zc8c6j2] {
    background: rgba(82, 99, 255, 0.2);
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian .cstm-data .address-name:hover[b-rp2zc8c6j2] {
    background: linear-gradient(0deg, rgba(82, 99, 255, 0.12), rgba(82, 99, 255, 0.12)), #F8FAFC;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian .cstm-data .address-name div img[b-rp2zc8c6j2] {
    height: 20px;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian .cstm-data .address-name div p[b-rp2zc8c6j2] {
    margin: 0;
    max-width: 290px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 13px;
    font-weight: 600;
    line-height: 20px;
    letter-spacing: -0.2px;
    color: var(--dark-txt, #1E293B);
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian .cstm-data .address-name div span[b-rp2zc8c6j2] {
    max-width: 340px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 13px;
    font-weight: 500;
    line-height: 20px;
    letter-spacing: -0.2px;
    color: var(--gray-txt, #475569);
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian.sub-accordian .cstm-data .right-sub-data[b-rp2zc8c6j2] {
    flex: 0 0 auto;
    min-width: 0;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian .cstm-data .select-btn[b-rp2zc8c6j2] {
    flex: 0 0 auto;
    min-width: 0;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian .cstm-data .select-btn > div:not(.txt)[b-rp2zc8c6j2] {
    width: 164px;
    padding: 8px;
    border: 1px solid rgba(30, 41, 59, 0.12);
    border-radius: 8px;
    background: #FFFFFF;
    box-shadow: 0 3px 3px -1.5px rgba(30, 41, 59, 0.03);
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian .cstm-data .select-btn select[b-rp2zc8c6j2] {
    width: 100%;
    padding: 0 22px 0 2px;
    border: none;
    outline: none;
    appearance: none;
    background-color: transparent;
    background-image: url("../img/icons/gray-arrow.png");
    background-repeat: no-repeat;
    background-position: right center;
    background-size: 18px;
    color: #1E293B;
    font-size: 12px;
    font-weight: 600;
    line-height: 16px;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian .cstm-data .select-btn button[b-rp2zc8c6j2] {
    min-height: 32px;
    padding: 8px 12px;
    border: none;
    border-radius: 8px;
    background: #5263FF;
    color: #FFFFFF;
    font-size: 12px;
    font-weight: 600;
    line-height: 16px;
    white-space: nowrap;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian .cstm-data .select-btn button.white-btn[b-rp2zc8c6j2] {
    border: 1px solid rgba(30, 41, 59, 0.09);
    background: #FFFFFF;
    color: #475569;
    box-shadow: 0 2px 1.5px -0.5px rgba(30, 41, 59, 0.03);
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian .cstm-data .select-btn .txt[b-rp2zc8c6j2] {
    width: 100%;
    padding: 0;
    border: none;
    background: transparent;
    box-shadow: none;
    text-align: end;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian .cstm-data .select-btn .txt p[b-rp2zc8c6j2] {
    margin: 0;
    color: #1E293B;
    font-size: 12px;
    font-weight: 700;
    line-height: 16px;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian .cstm-data .select-btn .txt span[b-rp2zc8c6j2] {
    color: #475569;
    font-size: 12px;
    font-weight: 500;
    line-height: 16px;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian.sub-accordian .cstm-data .right-sub-data button.s-btn[b-rp2zc8c6j2],
.zoneDispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian.sub-accordian .cstm-data .right-sub-data button.time-date-btn[b-rp2zc8c6j2] {
    height: 24px;
    min-height: 24px;
    padding: 4px 6px;
    border-radius: 8px;
    font-size: 12px;
    line-height: 16px;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian.sub-accordian .cstm-data .right-sub-data button.s-btn[b-rp2zc8c6j2] {
    border: none;
    background: rgba(82, 99, 255, 0.12);
    color: #363AF5;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian.sub-accordian .cstm-data .right-sub-data button.s-btn.light-btn[b-rp2zc8c6j2] {
    border: 1px solid rgba(30, 41, 59, 0.09);
    background: #FFFFFF;
    color: #475569;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian.sub-accordian .cstm-data .right-sub-data button.time-date-btn[b-rp2zc8c6j2] {
    border: none;
    gap: 2px;
    white-space: nowrap;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian.sub-accordian .cstm-data .right-sub-data button.time-date-btn span[b-rp2zc8c6j2] {
    white-space: nowrap;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian.sub-accordian .cstm-data .right-sub-data button.time-date-btn img[b-rp2zc8c6j2] {
    width: 14px;
    height: 14px;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian.sub-accordian .cstm-data .right-sub-data button.time-date-btn.green[b-rp2zc8c6j2] {
    background: rgba(64, 155, 63, 0.12);
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian.sub-accordian .cstm-data .right-sub-data button.time-date-btn.green span[b-rp2zc8c6j2] {
    color: #296C28;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian.sub-accordian .cstm-data .right-sub-data button.time-date-btn.red[b-rp2zc8c6j2] {
    background: rgba(237, 64, 48, 0.12);
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian.sub-accordian .cstm-data .right-sub-data button.time-date-btn.red span[b-rp2zc8c6j2] {
    color: #B82213;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian.sub-accordian .cstm-data .right-sub-data button.time-date-btn.light[b-rp2zc8c6j2] {
    border: 1px solid rgba(30, 41, 59, 0.03);
    background: rgba(241, 245, 249, 0.8);
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian.sub-accordian .cstm-data .right-sub-data button.time-date-btn.light span[b-rp2zc8c6j2] {
    color: #1E293B;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .details-tab .timeline-multi-tab[b-rp2zc8c6j2] {
    display: block;
    padding: 24px !important;
}

.dds-placeholder-box[b-rp2zc8c6j2] {
    margin-top: 12px;
    padding: 16px;
    border: 1px solid rgba(30, 41, 59, 0.09);
    border-radius: 12px;
    background: #F8FAFC;
    color: #475569;
    font-size: 13px;
    font-weight: 600;
    line-height: 20px;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .details-tab .timeline-multi-tab .timeline-header[b-rp2zc8c6j2] {
    gap: 16px;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .details-tab .timeline-multi-tab h5[b-rp2zc8c6j2] {
    margin: 0;
    color: #1E293B;
    font-size: 18px;
    font-weight: 800;
    line-height: 24px;
    letter-spacing: 0;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .details-tab .timeline-multi-tab .search[b-rp2zc8c6j2] {
    width: min(346px, 50%);
    min-width: 220px;
    height: 32px;
    padding: 8px;
    background: #FFFFFF;
    border: 1px solid rgba(30, 41, 59, 0.12);
    border-radius: 50px;
    box-shadow: 0 1px 1px -0.5px rgba(30, 41, 59, 0.03);
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .details-tab .timeline-multi-tab .search img[b-rp2zc8c6j2] {
    width: 16px;
    height: 16px;
    flex: 0 0 16px;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .details-tab .timeline-multi-tab .search input[b-rp2zc8c6j2] {
    width: 100%;
    min-width: 0;
    height: 100%;
    border: 0;
    outline: 0;
    color: #1E293B;
    font-size: 13px;
    font-weight: 600;
    line-height: 16px;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .details-tab .timeline-multi-tab .timeline-table[b-rp2zc8c6j2] {
    table-layout: fixed;
    overflow: hidden;
    border: 1px solid rgba(30, 41, 59, 0.09);
    border-collapse: separate;
    border-spacing: 0;
    border-radius: 12px;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .details-tab .timeline-multi-tab .timeline-table th[b-rp2zc8c6j2],
.zoneDispatchDetailsSlider.ID-popup .modal-body .details-tab .timeline-multi-tab .timeline-table td[b-rp2zc8c6j2] {
    vertical-align: top;
    overflow-wrap: anywhere;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .details-tab .timeline-multi-tab .timeline-table th:nth-child(1)[b-rp2zc8c6j2],
.zoneDispatchDetailsSlider.ID-popup .modal-body .details-tab .timeline-multi-tab .timeline-table td:nth-child(1)[b-rp2zc8c6j2] {
    width: 33%;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .details-tab .timeline-multi-tab .timeline-table th:nth-child(2)[b-rp2zc8c6j2],
.zoneDispatchDetailsSlider.ID-popup .modal-body .details-tab .timeline-multi-tab .timeline-table td:nth-child(2)[b-rp2zc8c6j2] {
    width: 34%;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .details-tab .timeline-multi-tab .timeline-table th:nth-child(3)[b-rp2zc8c6j2],
.zoneDispatchDetailsSlider.ID-popup .modal-body .details-tab .timeline-multi-tab .timeline-table td:nth-child(3)[b-rp2zc8c6j2] {
    width: 33%;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .details-tab .timeline-multi-tab .timeline-table tr.title-tr[b-rp2zc8c6j2] {
    background: #F1F5F9 !important;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .details-tab .timeline-multi-tab .timeline-table tr:nth-child(odd):not(.title-tr)[b-rp2zc8c6j2] {
    background: #F8FAFC;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .details-tab .timeline-multi-tab .timeline-table tr:nth-child(even):not(.title-tr)[b-rp2zc8c6j2] {
    background: #FFFFFF;
}

.timeline-creator[b-rp2zc8c6j2] {
    display: flex;
    min-width: 0;
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
}

.timeline-business-pill[b-rp2zc8c6j2] {
    max-width: 100%;
    gap: 2px;
    padding: 4px 6px;
    background: rgba(82, 99, 255, 0.12);
    border-radius: 8px;
    color: #363AF5;
}

.timeline-business-pill img[b-rp2zc8c6j2] {
    width: 14px;
    height: 14px;
    flex: 0 0 14px;
}

.timeline-business-pill span[b-rp2zc8c6j2] {
    min-width: 0;
    overflow: hidden;
    color: #363AF5;
    font-size: 12px;
    font-weight: 600;
    line-height: 16px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

@media (max-width: 720px) {
    .dispatchDetailsSlider.right .modal-dialog[b-rp2zc8c6j2] {
        max-width: 100%;
    }

    .zoneDispatchDetailsSlider.ID-popup .modal-body .details-tab .timeline-multi-tab .timeline-header[b-rp2zc8c6j2] {
        align-items: stretch !important;
        flex-direction: column;
    }

    .zoneDispatchDetailsSlider.ID-popup .modal-body .details-tab .timeline-multi-tab .search[b-rp2zc8c6j2] {
        width: 100%;
        min-width: 0;
    }

    .dds-header-main[b-rp2zc8c6j2] {
        align-items: flex-start !important;
    }

    .dds-detail-grid[b-rp2zc8c6j2] {
        grid-template-columns: 1fr;
    }

    .dds-address-row[b-rp2zc8c6j2] {
        align-items: flex-start;
    }
}

.dispatchDetailsSlider.ID-popup .modal-body .details-tab[b-rp2zc8c6j2] {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    min-height: 0;
    margin-top: 0;
    padding-top: 16px;
    overflow: hidden;
}

.dispatchDetailsSlider.ID-popup .modal-body .details-tab .details-multi-tabs[b-rp2zc8c6j2] {
    flex: 0 0 auto;
    border-bottom: 1px #1E293B17 solid;
}

.dispatchDetailsSlider.ID-popup .modal-body .details-tab .overview-multi-tab[b-rp2zc8c6j2],
.dispatchDetailsSlider.ID-popup .modal-body .details-tab .admin-phonecall-multi-tab[b-rp2zc8c6j2],
.dispatchDetailsSlider.ID-popup .modal-body .details-tab .timeline-multi-tab[b-rp2zc8c6j2] {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-color: #CBD5E1 transparent;
    scrollbar-width: thin;
}

.dispatchDetailsSlider.ID-popup .modal-body .details-tab .overview-multi-tab[b-rp2zc8c6j2]::-webkit-scrollbar,
.dispatchDetailsSlider.ID-popup .modal-body .details-tab .admin-phonecall-multi-tab[b-rp2zc8c6j2]::-webkit-scrollbar,
.dispatchDetailsSlider.ID-popup .modal-body .details-tab .timeline-multi-tab[b-rp2zc8c6j2]::-webkit-scrollbar {
    width: 6px;
}

.dispatchDetailsSlider.ID-popup .modal-body .details-tab .overview-multi-tab[b-rp2zc8c6j2]::-webkit-scrollbar-thumb,
.dispatchDetailsSlider.ID-popup .modal-body .details-tab .admin-phonecall-multi-tab[b-rp2zc8c6j2]::-webkit-scrollbar-thumb,
.dispatchDetailsSlider.ID-popup .modal-body .details-tab .timeline-multi-tab[b-rp2zc8c6j2]::-webkit-scrollbar-thumb {
    border-radius: 999px;
    background: #CBD5E1;
}

.dispatchDetailsSlider.ID-popup .modal-body .details-tab .details-multi-tabs .tab[b-rp2zc8c6j2] {
    gap: 2px;
    background-color: #FFFFFF;
    border: none;
    outline: none;
    border-radius: 0;
    width: 100%;
    padding: 4px 0 12px;
}

.dispatchDetailsSlider.ID-popup .modal-body .details-tab .details-multi-tabs .tab img[b-rp2zc8c6j2] {
    padding-right: 4px;
    height: 18px;
}

.dispatchDetailsSlider.ID-popup .modal-body .details-tab .details-multi-tabs .tab span[b-rp2zc8c6j2] {
    font-size: 13px;
    font-weight: 600;
    line-height: 24px;
    letter-spacing: -0.2px;
    color: #475569;
}

.dispatchDetailsSlider.ID-popup .modal-body .details-tab .details-multi-tabs .tab.active[b-rp2zc8c6j2] {
    border-bottom: 2px #5263FF solid;
}

.dispatchDetailsSlider.ID-popup .modal-body .details-tab .details-multi-tabs .tab.active span[b-rp2zc8c6j2] {
    color: #5263FF;
}

.dispatchDetailsSlider.ID-popup .modal-body .details-tab .overview-multi-tab .box[b-rp2zc8c6j2] {
    margin-bottom: 32px;
}

.dispatchDetailsSlider.ID-popup .modal-body .details-tab .overview-multi-tab .box h5[b-rp2zc8c6j2],
.dispatchDetailsSlider.ID-popup .modal-body .details-tab .admin-phonecall-multi-tab h5[b-rp2zc8c6j2],
.dispatchDetailsSlider.ID-popup .modal-body .details-tab .timeline-multi-tab h5[b-rp2zc8c6j2] {
    font-size: 18px;
    font-weight: 800;
    line-height: 24px;
    letter-spacing: -0.2px;
    color: #1E293B;
    margin-bottom: 16px;
}

.dispatchDetailsSlider.ID-popup .modal-body .details-tab .overview-multi-tab .box .three-btn button[b-rp2zc8c6j2] {
    border-radius: 10px;
    padding: 8px 10px;
}

.dispatchDetailsSlider.ID-popup .modal-body .details-tab .overview-multi-tab .box .three-btn button.cancel-btn[b-rp2zc8c6j2] {
    background-color: #409B3F1F;
    border: 1px transparent solid;
}

.dispatchDetailsSlider.ID-popup .modal-body .details-tab .overview-multi-tab .box .three-btn button.cancel-btn span[b-rp2zc8c6j2],
.dispatchDetailsSlider.ID-popup .modal-body .details-tab .overview-multi-tab .box .three-btn button.change-work-btn span[b-rp2zc8c6j2],
.dispatchDetailsSlider.ID-popup .modal-body .details-tab .overview-multi-tab .box .three-btn button.cancel-dispatch-btn span[b-rp2zc8c6j2] {
    font-size: 13px;
    font-weight: 600;
    line-height: 24px;
    letter-spacing: -0.2px;
}

.dispatchDetailsSlider.ID-popup .modal-body .details-tab .overview-multi-tab .box .three-btn button.change-work-btn[b-rp2zc8c6j2],
.dispatchDetailsSlider.ID-popup .modal-body .details-tab .overview-multi-tab .box .three-btn button.cancel-dispatch-btn[b-rp2zc8c6j2] {
    background-color: #F1F5F9CC;
    border: 1px #1E293B17 solid;
}

.dispatchDetailsSlider.ID-popup .modal-body .details-tab .overview-multi-tab .box .three-btn button.change-work-btn img[b-rp2zc8c6j2] {
    height: 18px;
}

.dispatchDetailsSlider.ID-popup .modal-body .details-tab .overview-multi-tab .box .three-btn button.change-work-btn span[b-rp2zc8c6j2] {
    color: #1E293B;
}

.dispatchDetailsSlider.ID-popup .modal-body .details-tab .overview-multi-tab .box .three-btn button.cancel-dispatch-btn[b-rp2zc8c6j2] {
    background-color: #ED40301F;
    border: 1px transparent solid;
}

.dispatchDetailsSlider.ID-popup .modal-body .details-tab .overview-multi-tab .box .three-btn button.cancel-dispatch-btn span[b-rp2zc8c6j2] {
    color: #B82213;
}

.dispatchDetailsSlider.ID-popup .modal-body .details-tab .overview-multi-tab .box-2 .row .icon[b-rp2zc8c6j2] {
    min-height: 40px;
    min-width: 40px;
    background-color: #5263FF1F;
    border-radius: 8px;
}

.dispatchDetailsSlider.ID-popup .modal-body .details-tab .overview-multi-tab .box-2 .row .icon img[b-rp2zc8c6j2] {
    height: 22px;
}

.dispatchDetailsSlider.ID-popup .modal-body .details-tab .overview-multi-tab .box-2 .row .icon-txt[b-rp2zc8c6j2] {
    font-size: 13px;
    letter-spacing: -0.2px;
}

.dispatchDetailsSlider.ID-popup .modal-body .details-tab .overview-multi-tab .box-2 .row .icon-txt p[b-rp2zc8c6j2] {
    margin: 0;
    font-weight: 700;
    color: #1E293B;
}

.dispatchDetailsSlider.ID-popup .modal-body .details-tab .overview-multi-tab .box-2 .row .icon-txt span[b-rp2zc8c6j2] {
    font-weight: 500;
    color: #475569;
}

.dispatchDetailsSlider.ID-popup .modal-body .details-tab .overview-multi-tab .box-3 .selected .name[b-rp2zc8c6j2] {
    gap: 2px;
    padding: 6px;
    background-color: #5263FF1F;
    border-radius: 8px;
}

.dispatchDetailsSlider.ID-popup .modal-body .details-tab .overview-multi-tab .box-3 .selected .name img[b-rp2zc8c6j2] {
    height: 16px;
}

.dispatchDetailsSlider.ID-popup .modal-body .details-tab .overview-multi-tab .box-3 .selected .name span[b-rp2zc8c6j2] {
    font-size: 12px;
    font-weight: 600;
    line-height: 16px;
    letter-spacing: -0.2px;
    color: #363AF5;
}

.dispatchDetailsSlider.ID-popup .modal-body .details-tab .overview-multi-tab .box-4 .file-name p[b-rp2zc8c6j2],
.dispatchDetailsSlider.ID-popup .modal-body .details-tab .overview-multi-tab .box-4 .file-name a[b-rp2zc8c6j2] {
    font-size: 13px;
    font-weight: 600;
    line-height: 20px;
    letter-spacing: -0.2px;
}

.dispatchDetailsSlider.ID-popup .modal-body .details-tab .overview-multi-tab .box-4 .file-name a[b-rp2zc8c6j2] {
    color: #5263FF;
    text-decoration: underline;
    text-decoration-color: #5263ff5b;
    text-decoration-thickness: 2px;
    text-underline-offset: 3px;
}

.dispatchDetailsSlider.ID-popup .modal-body .details-tab .overview-multi-tab .box-5 table[b-rp2zc8c6j2],
.dispatchDetailsSlider.ID-popup .modal-body .details-tab .admin-phonecall-multi-tab table[b-rp2zc8c6j2],
.dispatchDetailsSlider.ID-popup .modal-body .details-tab .timeline-multi-tab table[b-rp2zc8c6j2] {
    border: 1px #1E293B0F solid;
    border-collapse: separate;
    border-spacing: 0;
    border-radius: 12px;
    overflow: hidden;
    font-size: 13px;
}

.dispatchDetailsSlider.ID-popup .modal-body .details-tab .overview-multi-tab .box-5 table tbody tr th[b-rp2zc8c6j2],
.dispatchDetailsSlider.ID-popup .modal-body .details-tab .admin-phonecall-multi-tab table tr th[b-rp2zc8c6j2],
.dispatchDetailsSlider.ID-popup .modal-body .details-tab .timeline-multi-tab table tr th[b-rp2zc8c6j2] {
    padding: 12px 16px;
    font-size: 13px;
    font-weight: 700;
    line-height: 20px;
    border-bottom: 1px #1E293B0F solid;
    color: #1E293B;
}

.dispatchDetailsSlider.ID-popup .modal-body .details-tab .overview-multi-tab .box-5 table tbody tr.title-tr[b-rp2zc8c6j2],
.dispatchDetailsSlider.ID-popup .modal-body .details-tab .admin-phonecall-multi-tab table tr.title-tr[b-rp2zc8c6j2],
.dispatchDetailsSlider.ID-popup .modal-body .details-tab .timeline-multi-tab table tr.title-tr[b-rp2zc8c6j2] {
    background-color: #F1F5F9 !important;
}

.dispatchDetailsSlider.ID-popup .modal-body .details-tab .overview-multi-tab .box-5 table tbody tr.title-tr th:first-child[b-rp2zc8c6j2],
.dispatchDetailsSlider.ID-popup .modal-body .details-tab .admin-phonecall-multi-tab table tr.title-tr th:first-child[b-rp2zc8c6j2],
.dispatchDetailsSlider.ID-popup .modal-body .details-tab .timeline-multi-tab table tr.title-tr th:first-child[b-rp2zc8c6j2] {
    border-radius: 12px 0 0 0 !important;
}

.dispatchDetailsSlider.ID-popup .modal-body .details-tab .overview-multi-tab .box-5 table tbody tr.title-tr th:last-child[b-rp2zc8c6j2],
.dispatchDetailsSlider.ID-popup .modal-body .details-tab .admin-phonecall-multi-tab table tr.title-tr th:last-child[b-rp2zc8c6j2],
.dispatchDetailsSlider.ID-popup .modal-body .details-tab .timeline-multi-tab table tr.title-tr th:last-child[b-rp2zc8c6j2] {
    border-radius: 0 12px 0 0 !important;
}

.dispatchDetailsSlider.ID-popup .modal-body .details-tab .overview-multi-tab .box-5 table tbody tr th img[b-rp2zc8c6j2] {
    height: 16px;
    margin-right: 8px;
}

.dispatchDetailsSlider.ID-popup .modal-body .details-tab .overview-multi-tab .box-5 table tbody tr td[b-rp2zc8c6j2],
.dispatchDetailsSlider.ID-popup .modal-body .details-tab .admin-phonecall-multi-tab table tr td[b-rp2zc8c6j2],
.dispatchDetailsSlider.ID-popup .modal-body .details-tab .timeline-multi-tab table tr td[b-rp2zc8c6j2] {
    padding: 8px 16px;
    font-size: 13px;
    font-weight: 600;
    line-height: 20px;
    color: #475569;
}

.dispatchDetailsSlider.ID-popup .modal-body .details-tab .overview-multi-tab .box-5 table tbody tr:nth-child(odd)[b-rp2zc8c6j2],
.dispatchDetailsSlider.ID-popup .modal-body .details-tab .admin-phonecall-multi-tab table tr:nth-child(odd)[b-rp2zc8c6j2],
.dispatchDetailsSlider.ID-popup .modal-body .details-tab .timeline-multi-tab table tr:nth-child(odd)[b-rp2zc8c6j2] {
    background-color: #F8FAFC;
}

.dispatchDetailsSlider.ID-popup .modal-body .details-tab .overview-multi-tab .box-5 table tbody tr td:nth-child(1)[b-rp2zc8c6j2] {
    border-right: 1px #1E293B0F solid;
}

.dispatchDetailsSlider.ID-popup .modal-body .details-tab .timeline-multi-tab .search[b-rp2zc8c6j2] {
    padding: 8px;
    background-color: #FFFFFF;
    border: 1px #1E293B1F solid;
    border-radius: 50px;
    box-shadow: 0 1px 1px -0.5px #1E293B08;
}

.dispatchDetailsSlider.ID-popup .modal-body .details-tab .timeline-multi-tab .search img[b-rp2zc8c6j2] {
    height: 16px;
    cursor: pointer;
}

.dispatchDetailsSlider.ID-popup .modal-body .details-tab .timeline-multi-tab .search input[b-rp2zc8c6j2] {
    height: 100%;
    border: none;
    outline: none;
    font-size: 13px;
    font-weight: 500;
}

.dispatchDetailsSlider.ID-popup .modal-body .details-tab .timeline-multi-tab div h5[b-rp2zc8c6j2] {
    margin-bottom: 0;
}

.own-route-popup .addresses-tab .add-location-txt button.white-btn[b-rp2zc8c6j2],
.zoneDispatchDetailsSlider .addresses-tab .add-location-txt button.white-btn[b-rp2zc8c6j2] {
    background-color: #FFFFFF;
    padding: 8px 12px;
    border: 1px #1E293B17 solid;
    border-radius: 8px;
    outline: none;
    font-size: 12px;
    font-weight: 600;
    line-height: 16px;
    letter-spacing: 0;
    color: #475569;
    white-space: nowrap;
}

.own-route-popup .addresses-tab .invite-banner[b-rp2zc8c6j2],
.zoneDispatchDetailsSlider .addresses-tab .invite-banner[b-rp2zc8c6j2] {
    border: 1px #1E293B0F solid;
    border-radius: 8px;
    margin-bottom: 20px;
}

/* Invoicing box: per-business slice rows (confirmable subs / awaiting roots) */
.zoneDispatchDetailsSlider.ID-popup .modal-body .details-tab .overview-multi-tab .box .invoicing-slice-row[b-rp2zc8c6j2] {
    font-size: 14px;
    color: #14161f;
}
.zoneDispatchDetailsSlider.ID-popup .modal-body .details-tab .overview-multi-tab .box .invoicing-slice-row .slice-status[b-rp2zc8c6j2] {
    font-size: 13px;
    font-weight: 600;
    white-space: nowrap;
}
.zoneDispatchDetailsSlider.ID-popup .modal-body .details-tab .overview-multi-tab .box .invoicing-slice-row .slice-status.green[b-rp2zc8c6j2] {
    color: #2f9e44;
}
.zoneDispatchDetailsSlider.ID-popup .modal-body .details-tab .overview-multi-tab .box .invoicing-slice-row .slice-status.red[b-rp2zc8c6j2] {
    color: #e03131;
}

/* Addresses view: per-subcontractor confirm-invoicing pill on the group header */
button.confirm-invoicing-btn[b-rp2zc8c6j2] {
    border: 1px solid #4263eb;
    color: #4263eb;
    background: #fff;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 600;
    padding: 4px 12px;
    white-space: nowrap;
}
button.confirm-invoicing-btn:hover[b-rp2zc8c6j2] { background: #edf2ff; }
button.confirm-invoicing-btn:disabled[b-rp2zc8c6j2] { opacity: .6; }

/* Add-more kind dropdown — mirrors the Opret udkald menu */
.extend-kind-backdrop[b-rp2zc8c6j2] {
    position: fixed;
    inset: 0;
    z-index: 1079;
}

.extend-kind-menu[b-rp2zc8c6j2] {
    position: absolute;
    top: calc(100% + 8px);
    left: 0;
    z-index: 1080;
    background: #fff;
    border-radius: 12px;
    border: 1px solid #1E293B0F;
    box-shadow: 0 32px 32px -16px #1E293B14;
    padding: 16px;
    width: max-content;
}

.extend-kind-item[b-rp2zc8c6j2] {
    height: 36px;
    width: 190px;
    gap: 2px;
    border: none;
    outline: none;
    border-radius: 8px;
    background: linear-gradient(var(--purple), var(--purple)) padding-box, linear-gradient(90deg, #1E293B17, #1E293B2E) border-box;
    color: #fff !important;
    font-size: 13px;
    font-weight: 600;
}

.extend-kind-item p[b-rp2zc8c6j2] {
    color: #fff !important;
    margin: 0;
    padding: 0 4px;
}

.extend-kind-item img[b-rp2zc8c6j2] {
    width: 16px;
}

.extend-kind-item:hover[b-rp2zc8c6j2] {
    filter: brightness(1.06);
}

/* The dispatch's terminal state, stated where it cannot be missed. */
.dds-header-status[b-rp2zc8c6j2] {
	flex-shrink: 0;
	font-size: 12px;
	font-weight: 700;
	border-radius: 99px;
	padding: 3px 12px;
	white-space: nowrap;
}

.dds-header-status--cancelled[b-rp2zc8c6j2] {
	background: #FEE2E2;
	/* !important: the header's own text rule outweighs this class and greyed it out. */
	color: #B91C1C !important;
}

.dds-header-status--completed[b-rp2zc8c6j2] {
	background: #DCFCE7;
	color: #15803D !important;
}

/* Tri-state subcontractor answer badge on the zone subgroup header: the send's
   state is data, not an alarm — grey awaiting, green accepted, red denied. */
.bagee.send-answer[b-rp2zc8c6j2] {
    display: inline-flex;
    align-items: center;
    flex-shrink: 0;
    white-space: nowrap;
    padding: 4px 8px;
    border-radius: 8px;
    gap: 6px;
}

.bagee.send-answer .dot[b-rp2zc8c6j2] {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    flex-shrink: 0;
}

.bagee.send-answer span[b-rp2zc8c6j2] {
    font-size: 12px;
    font-weight: 600;
    white-space: nowrap;
}

.bagee.send-answer.accepted[b-rp2zc8c6j2] { background-color: #409B3F1F; }
.bagee.send-answer.accepted span[b-rp2zc8c6j2] { color: #296C28; }
.bagee.send-answer.accepted .dot[b-rp2zc8c6j2] { background-color: #337C33; }

.bagee.send-answer.denied[b-rp2zc8c6j2] { background-color: #ED40301F; }
.bagee.send-answer.denied span[b-rp2zc8c6j2] { color: #B82213; }
.bagee.send-answer.denied .dot[b-rp2zc8c6j2] { background-color: #ED4030; }

.bagee.send-answer.pending[b-rp2zc8c6j2] { background-color: #1E293B14; }
.bagee.send-answer.pending span[b-rp2zc8c6j2] { color: #5F6E85; }
.bagee.send-answer.pending .dot[b-rp2zc8c6j2] { background-color: #94A3B8; }

/* ── Density pass: the zone list must survive 10 zones with several contractors
   each. Tighter header and tab spacing, shorter group/sub/stop rows, slightly
   smaller titles, decorative left bars removed (the red alert bar on stop rows
   stays — it carries meaning), and stop rows advertise their click. ── */

.zoneDispatchDetailsSlider.ID-popup .modal-header[b-rp2zc8c6j2] {
    padding: 10px 24px 6px;
}

.zoneDispatchDetailsSlider.ID-popup .modal-header .icon-image[b-rp2zc8c6j2] {
    width: 40px;
    height: 40px;
}

.zoneDispatchDetailsSlider.ID-popup .modal-header .icon-image img[b-rp2zc8c6j2] {
    width: 20px;
    height: 20px;
}

.zoneDispatchDetailsSlider.ID-popup .modal-header .modal-title[b-rp2zc8c6j2] {
    font-size: 20px;
    line-height: 24px;
}

.zoneDispatchDetailsSlider.ID-popup .modal-header .txt p[b-rp2zc8c6j2] {
    font-size: 15px;
    line-height: 20px;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .tabs[b-rp2zc8c6j2] {
    padding: 4px;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .tabs button[b-rp2zc8c6j2] {
    padding: 4px;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .multi-tabs[b-rp2zc8c6j2] {
    margin-top: 8px !important;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .multi-tabs button[b-rp2zc8c6j2] {
    padding: 2px 5px 8px 5px;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian .cstm-title[b-rp2zc8c6j2] {
    min-height: 48px;
    padding: 8px 16px;
    gap: 16px !important;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian .cstm-title .left-title .icon[b-rp2zc8c6j2] {
    width: 28px;
    height: 28px;
    flex: 0 0 28px;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian .cstm-title .left-title .icon img[b-rp2zc8c6j2] {
    width: 18px;
    height: 18px;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian .cstm-title .left-title p[b-rp2zc8c6j2] {
    font-size: 16px;
    line-height: 22px;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian.sub-accordian .cstm-title[b-rp2zc8c6j2] {
    min-height: 52px;
    padding: 6px 16px;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian.sub-accordian .cstm-title .left-title .img-txt p[b-rp2zc8c6j2] {
    font-size: 14px;
    line-height: 20px;
}

/* Decorative left bars: gone on group and subcontractor headers */
.zoneDispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian .cstm-title .left-title .v-line[b-rp2zc8c6j2] {
    display: none;
}

/* Stop rows: the neutral bar loses its color but keeps its width so rows with a
   red alert bar stay aligned */
.zoneDispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian.sub-accordian .cstm-data .address-name .v-line.p-trans[b-rp2zc8c6j2] {
    background: transparent;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian .cstm-data .address-name[b-rp2zc8c6j2] {
    min-height: 44px;
    padding: 6px 16px 6px 36px;
    cursor: pointer;
}

/* Picking which of the handed-over routes an answer covers, and the reason left behind on
   the ones that were turned down. */
.invite-banner-body[b-rp2zc8c6j2] {
    min-width: 0;
}

.invite-routes[b-rp2zc8c6j2] {
    list-style: none;
    margin: 0;
    padding: 0;
    max-width: 460px;
}

.invite-route-row[b-rp2zc8c6j2] {
    display: flex;
    align-items: center;
    /* The reason line takes a whole row of its own (flex-basis 100% below); without wrapping
       it shared the line and squeezed the route's name down to "Sneryd...". */
    flex-wrap: wrap;
    gap: 10px;
    padding: 7px 2px;
    border-bottom: 1px solid #EBECED;
}

.invite-route-row:last-child[b-rp2zc8c6j2] {
    border-bottom: none;
}

.invite-route-name[b-rp2zc8c6j2] {
    flex: 1 1 auto;
    min-width: 0;
    font-size: 14px;
    line-height: 20px;
    color: #23262F;
    cursor: pointer;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.invite-route-count[b-rp2zc8c6j2] {
    flex: 0 0 auto;
    padding: 1px 8px;
    border-radius: 999px;
    background: #F1F2F4;
    font-size: 12px;
    line-height: 18px;
    color: #6F767E;
}

.decline-reason-line[b-rp2zc8c6j2] {
    font-style: italic;
}

/* A route that was turned down: the header says so where the progress bar would have been,
   and its stops carry the same word instead of "Pending". */
.group-declined-status[b-rp2zc8c6j2] {
    position: relative;
    display: inline-flex;
    align-items: center;
    padding: 4px 12px;
    border-radius: 999px;
    background: #FCE9EB;
    font-size: 13px;
    font-weight: 500;
    line-height: 18px;
    color: #C0392F;
    white-space: nowrap;
}

/* A run that was called off: same shape as the declined pill beside it - a word, no
   progress bar - because neither has any work left to report. */
.group-cancelled-status[b-rp2zc8c6j2] {
    position: relative;
    display: inline-flex;
    align-items: center;
    padding: 4px 12px;
    border-radius: 999px;
    background: #FCE9EB;
    font-size: 13px;
    font-weight: 500;
    line-height: 18px;
    color: #C0392F;
    white-space: nowrap;
}

/* Who refused, when and why now hang off the pill through the shared WMTooltip hover,
   so the old attribute-driven CSS bubble is gone; the pill only keeps its cursor. */
.group-declined-status[b-rp2zc8c6j2] {
    cursor: help;
}

/* The chain out of a refusal: the denying business's own dispatch covering the stop.
   A chip rather than plain text because it opens that dispatch. */
.covered-by-chip[b-rp2zc8c6j2] {
    border: 1px solid #1E293B17;
    background: #FFFFFF;
    border-radius: 999px;
    padding: 3px 10px;
    font-size: 12px;
    font-weight: 600;
    line-height: 18px;
    color: #5263FF;
    white-space: nowrap;
    cursor: pointer;
}

.covered-by-chip:hover[b-rp2zc8c6j2] {
    text-decoration: underline;
}

.s-btn.light-btn.declined-stop[b-rp2zc8c6j2] {
    background: #FCE9EB;
    color: #C0392F;
}

/* The dispatch's short code (two letters, four digits) beside the header title. The
   route-titled header had no room for it in the title itself, and it is the handle the
   run is known by everywhere else. */
.dds-header-code[b-rp2zc8c6j2] {
	flex-shrink: 0;
	font-size: 12px;
	font-weight: 700;
	border-radius: 99px;
	padding: 3px 12px;
	white-space: nowrap;
	background: #EEF2FF;
	color: #3730A3 !important;
}

/* The owner's "Awaiting response" pill is a button: the same grey pill, with a ring on hover
   and a focus ring for the keyboard, so it reads as pressable without shouting. */
.bagee.send-answer.clickable[b-rp2zc8c6j2] {
	cursor: pointer;
}

.bagee.send-answer.clickable:hover[b-rp2zc8c6j2] {
	box-shadow: inset 0 0 0 1px #94A3B8;
}

.bagee.send-answer.clickable:focus-visible[b-rp2zc8c6j2] {
	outline: 2px solid #4A55E1;
	outline-offset: 2px;
}

/* A route stop whose season has ended still belongs to the route, so it is shown here greyed
   rather than hidden: the dispatcher sees the whole route and why one stop will not be worked. */
.dds-active-route-address--inactive[b-rp2zc8c6j2] {
    opacity: 0.55;
}

/* Each route records its own answer in the same segmented control the driver invitation rows
   use (.dds-driver-answer above): green accept and red deny joined in the middle, with the half
   not chosen fading once a choice is made. One control for one question, whichever party is
   being asked, so the control itself is not restyled here. All the route row adds is that the
   pair keeps its own width while the route name takes the rest. */
.invite-route-row .dds-driver-answer[b-rp2zc8c6j2] {
    flex: 0 0 auto;
}

/* The name no longer toggles anything, so it stops pretending to be clickable. */
.invite-route-name[b-rp2zc8c6j2] {
    cursor: default;
}

/* A row whose answer has gone fixed: the crew has been out on that route, so the pair is
   replaced by the answer it stands at and a line saying why it can no longer be moved. Both
   the explanation and a refusal's reason wrap onto their own line under the name rather than
   squeezing the row to nothing. */
.invite-route-row.fixed-answer .invite-route-name[b-rp2zc8c6j2] {
    color: #6F767E;
}

.invite-route-answer[b-rp2zc8c6j2] {
    flex: 0 0 auto;
    padding: 2px 10px;
    border-radius: 999px;
    font-size: 12px;
    line-height: 18px;
    font-weight: 600;
}

.invite-route-answer.accepted[b-rp2zc8c6j2] {
    background: #E7F3E7;
    color: #27632A;
}

.invite-route-answer.declined[b-rp2zc8c6j2] {
    background: #FCE9EB;
    color: #B82213;
}

.invite-route-answer.pending[b-rp2zc8c6j2] {
    background: #F1F2F4;
    color: #6F767E;
}

.invite-route-fixed-why[b-rp2zc8c6j2],
.invite-route-row .decline-reason-line[b-rp2zc8c6j2] {
    flex: 1 1 100%;
    font-size: 12px;
    line-height: 18px;
    color: #6F767E;
}

/* Confirm belongs to the list it confirms, so it lines up under it rather than running the
   banner's full width. */
.invite-confirm-row[b-rp2zc8c6j2] {
    max-width: 460px;
}

/* Narrow panels: the pair drops under the name rather than squeezing it to nothing. */
@media (max-width: 575px) {
    .invite-route-row[b-rp2zc8c6j2] {
        flex-wrap: wrap;
    }

    .invite-route-row .dds-driver-answer[b-rp2zc8c6j2] {
        width: 100%;
        justify-content: flex-end;
    }
}

/* The answer panel as a section of the Details pane: the heading, the blue instruction tile
   and the full width every other box there has (Fakturering, Detaljer). On Addresses it keeps
   the banner it has always been — same markup, two settings. */
.dispatchDetailsSlider.ID-popup .modal-body .details-tab .overview-multi-tab .invite-answer-box .invite-banner[b-rp2zc8c6j2] {
    border: none;
    border-radius: 0;
    margin: 0;
    padding: 0;
    background: transparent;
}

.dispatchDetailsSlider.ID-popup .modal-body .details-tab .overview-multi-tab .invite-answer-box .invite-banner-body > p[b-rp2zc8c6j2] {
    margin: 0 0 8px;
    font-size: 18px;
    font-weight: 800;
    line-height: 24px;
    letter-spacing: -0.2px;
    color: #1E293B;
}

.dispatchDetailsSlider.ID-popup .modal-body .details-tab .overview-multi-tab .invite-answer-box .invite-banner-body > span[b-rp2zc8c6j2] {
    display: block;
    margin: 8px 0 12px;
    padding: 10px 12px;
    border: 1px solid #BFDBFE;
    border-radius: 8px;
    background: #EFF6FF;
    color: #1D4ED8;
    font-size: 13px;
    font-weight: 700;
    line-height: 20px;
}

/* The routes are a table of the pane, not a column of the banner. */
.dispatchDetailsSlider.ID-popup .modal-body .details-tab .overview-multi-tab .invite-answer-box .invite-routes[b-rp2zc8c6j2],
.dispatchDetailsSlider.ID-popup .modal-body .details-tab .overview-multi-tab .invite-answer-box .invite-confirm-row[b-rp2zc8c6j2] {
    max-width: none;
}


/* A settled stop says which way it settled. The row's chip could only say "done",
   "refused" or "not yet", so a called-off address read "Pending".

   Written out to the same depth as the plain chip it is overriding: a two-class
   selector loses to that one on specificity and the chip stays white, which is
   what had already happened to .declined-stop below. */
.zoneDispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian.sub-accordian .cstm-data .right-sub-data button.s-btn.light-btn.cancelled-stop[b-rp2zc8c6j2],
.zoneDispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian.sub-accordian .cstm-data .right-sub-data button.s-btn.light-btn.declined-stop[b-rp2zc8c6j2] {
    background: #FCE9EB;
    border-color: rgba(192, 57, 47, 0.16);
    color: #C0392F;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian.sub-accordian .cstm-data .right-sub-data button.s-btn.light-btn.removed-stop[b-rp2zc8c6j2] {
    background: #F1F5F9;
    color: #475569;
}

/* A settled group's word carries its colour; "not started" and "started" are the
   ordinary course of a run and stay as plain as they were. */
.zoneDispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian .cstm-title .center-title .progress-card span.status.status-cancelled[b-rp2zc8c6j2] {
    color: #C0392F;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian .cstm-title .center-title .progress-card span.status.status-completed[b-rp2zc8c6j2] {
    color: #337C33;
}

/* A long company name has to give way to the progress card, not run underneath it.
   The name already truncates; its flex parents did not allow it to, because a flex
   item will not shrink past its content without min-width: 0. */
.zoneDispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian .cstm-title .left-title > .flex-column[b-rp2zc8c6j2],
.zoneDispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian .cstm-title .left-title .img-txt[b-rp2zc8c6j2],
.zoneDispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian .cstm-title .left-title > .flex-column > .d-flex[b-rp2zc8c6j2] {
    min-width: 0;
}

.zoneDispatchDetailsSlider.ID-popup .modal-body .id-cstn-accordian .cstm-title .left-title p[b-rp2zc8c6j2] {
    min-width: 0;
    flex: 0 1 auto;
}


/* Settled with nothing billable: neither a success nor a hold-up, so neither green nor red. */
.zoneDispatchDetailsSlider.ID-popup .modal-body .details-tab .overview-multi-tab .box .invoicing-slice-row .slice-status.muted[b-rp2zc8c6j2] {
    color: #64748B;
}

/* The route table's status column. */
.dds-route-status[b-rp2zc8c6j2] {
    font-weight: 600;
}

.dds-route-status.status-cancelled[b-rp2zc8c6j2] {
    color: #C0392F;
}

.dds-route-status.status-completed[b-rp2zc8c6j2] {
    color: #337C33;
}
/* /Pages/Dispatch/Dispatch.razor.rz.scp.css */
/* ---- Sort menu ---- */
.sort-item[b-t2zf31q7pj] {
    display: block;
    width: 100%;
    text-align: left;
    padding: 8px 12px;
    border: none;
    background: transparent;
    border-radius: 8px;
    font-size: 13px;
    font-weight: 600;
    color: #1E293B;
    cursor: pointer;
}

.sort-item:hover[b-t2zf31q7pj] {
    background: #F1F5F9;
}

/* ---- Active filter badge on Filters button ---- */
.dispatch .main-content .data-left-right .main-table .table-title .close-txt[b-t2zf31q7pj] {
    border: none;
}

/* .dispatch-filter-select button {
    position: relative;
} */

.dispatch-filter-select .filter-dot[b-t2zf31q7pj] {
    position: absolute;
    top: 8px;
    right: 10px;
    width: 7px;
    height: 7px;
    border-radius: 999px;
    background: #5263FF;
}

/* ---- Dispatch list surface ---- */
/* No extra top padding: the shared .data-left-right rule already insets the card
   24px below the title bar, same as every other list page. (An extra 40px here
   used to make room for the since-removed Group/Own tab strip.) */

.dispatch .main-content .data-left-right .dispatch-tab-btn[b-t2zf31q7pj] {
    border-radius: 16px;
}

.dispatch .main-content .data-left-right .main-table.dispatch-own-main-table[b-t2zf31q7pj] {
    margin-top: 24px;
    border-radius: 20px;
    overflow-x: auto;
}

.dispatch .main-content .data-left-right .main-table .dispatch-table-title[b-t2zf31q7pj] {
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding: 16px;
}

.dispatch .main-content .data-left-right .main-table .dispatch-list-heading h5[b-t2zf31q7pj] {
    margin: 0;
    color: #475569;
}

.dispatch .main-content .data-left-right .main-table .dispatch-list-toolbar[b-t2zf31q7pj] {
    width: 100%;
}

.dispatch .main-content .data-left-right .main-table .dispatch-list-actions[b-t2zf31q7pj] {
    margin-left: auto;
}



.dispatch .main-content .data-left-right .main-table .custom-select[b-t2zf31q7pj] {
    width: 112px;
}

.dispatch .main-content .data-left-right .main-table .custom-select button[b-t2zf31q7pj] {
    min-height: 40px;
    padding-left: 36px;
    padding-right: 30px;
    background-color: #F8FAFC;
    box-shadow: 0 1px 1px -0.5px #1E293B08;
}

/* .dispatch .main-content .data-left-right .main-table .dispatch-filter-select::before {
    opacity: 0.28;
} */

.dispatch .main-content .data-left-right .dispatch-group-btn-tab .main-table[b-t2zf31q7pj] {
    overflow-x: auto;
    scrollbar-width: thin;
}

.dispatch .main-content .data-left-right .main-table .dispatch-table[b-t2zf31q7pj] {
    table-layout: fixed;
}

/* No min-width (style.css gives every dispatch page table 1000px): the table
   is table-layout fixed with percent columns and truncating cells, so it must
   compress to the viewport (13" laptops) rather than force horizontal
   scrolling. */
.dispatch .main-content .data-left-right .main-table .dispatch-group-table[b-t2zf31q7pj] {
    width: 100%;
    min-width: 0;
}

.dispatch .main-content .data-left-right .main-table .dispatch-group-table th:nth-child(1)[b-t2zf31q7pj],
.dispatch .main-content .data-left-right .main-table .dispatch-group-table td:nth-child(1)[b-t2zf31q7pj] {
    width: 28%;
}

.dispatch .main-content .data-left-right .main-table .dispatch-group-table th:nth-child(2)[b-t2zf31q7pj],
.dispatch .main-content .data-left-right .main-table .dispatch-group-table td:nth-child(2)[b-t2zf31q7pj] {
    width: 22%;
}

.dispatch .main-content .data-left-right .main-table .dispatch-group-table th:nth-child(3)[b-t2zf31q7pj],
.dispatch .main-content .data-left-right .main-table .dispatch-group-table td:nth-child(3)[b-t2zf31q7pj] {
    width: 20%;
}

.dispatch .main-content .data-left-right .main-table .dispatch-group-table th:nth-child(4)[b-t2zf31q7pj],
.dispatch .main-content .data-left-right .main-table .dispatch-group-table td:nth-child(4)[b-t2zf31q7pj] {
    width: 12%;
}

.dispatch .main-content .data-left-right .main-table .dispatch-group-table th:nth-child(5)[b-t2zf31q7pj],
.dispatch .main-content .data-left-right .main-table .dispatch-group-table td:nth-child(5)[b-t2zf31q7pj] {
    width: 18%;
}

/* Keep badges inside their fixed-width cells: truncate instead of overlapping neighbours. */
.dispatch .main-content .data-left-right .main-table .dispatch-table td .job-details-badgee[b-t2zf31q7pj],
.dispatch .main-content .data-left-right .main-table .dispatch-table td .type-badgee[b-t2zf31q7pj] {
    max-width: 100%;
}

.dispatch .main-content .data-left-right .main-table .dispatch-table td .job-details-badgee p[b-t2zf31q7pj],
.dispatch .main-content .data-left-right .main-table .dispatch-table td .type-badgee p[b-t2zf31q7pj] {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.dispatch .main-content .data-left-right .main-table .dispatch-group-table .dispatch-row-actions[b-t2zf31q7pj] {
    min-width: 0;
    flex-wrap: wrap;
}

.dispatch .main-content .data-left-right .main-table .dispatch-table th[b-t2zf31q7pj] {
    text-transform: none;
}

.dispatch .main-content .data-left-right .main-table .dispatch-table td[b-t2zf31q7pj] {
    vertical-align: middle;
}

.dispatch .main-content .data-left-right .main-table .dispatch-row-actions[b-t2zf31q7pj] {
    min-width: 280px;
    white-space: nowrap;
}

.dispatch .main-content .data-left-right .main-table .mark-complete-btn[b-t2zf31q7pj] {
    min-height: 40px;
    padding: 8px 16px;
    border: none;
    border-radius: 8px;
    background: #26732F;
    color: #FFFFFF;
    font-size: 14px;
    font-weight: 700;
    line-height: 20px;
    box-shadow: 0 1px 2px #1E293B14;
}

.dispatch .main-content .data-left-right .main-table .mark-complete-btn:hover:not(:disabled)[b-t2zf31q7pj] {
    background: #277A31;
}

.dispatch .main-content .data-left-right .main-table .mark-complete-btn:disabled[b-t2zf31q7pj] {
    cursor: not-allowed;
    opacity: 0.7;
}

[b-t2zf31q7pj] .dds-complete-dispatch-popup .modal-dialog {
    min-width: min(480px, calc(100vw - 32px)) !important;
}

[b-t2zf31q7pj] .dds-complete-dispatch-popup .wm-popup-modal-content {
    padding: 0 !important;
    border: 1px solid rgba(30, 41, 59, 0.03) !important;
    border-radius: 20px !important;
    background: #FFFFFF !important;
    box-shadow:
        0 1px 1px -0.5px rgba(30, 41, 59, 0.03),
        0 3px 3px -1.5px rgba(30, 41, 59, 0.03),
        0 20px 20px -12px rgba(30, 41, 59, 0.03),
        0 32px 32px -16px rgba(30, 41, 59, 0.03) !important;
}

[b-t2zf31q7pj] .dds-complete-dispatch-popup .modal-header {
    min-height: 80px;
    padding: 16px 20px !important;
    align-items: flex-end !important;
    border-bottom: 0 !important;
}

[b-t2zf31q7pj] .dds-complete-dispatch-popup .wm-popup-header-section {
    gap: 4px;
}

[b-t2zf31q7pj] .dds-complete-dispatch-popup .modal-header h5.modal-title {
    margin: 0 !important;
    color: #1E293B !important;
    font-size: 18px !important;
    font-weight: 700 !important;
    line-height: 24px !important;
    letter-spacing: -0.2px !important;
}

[b-t2zf31q7pj] .dds-complete-dispatch-popup .wm-popup-header-subtext {
    margin: 0 !important;
    color: #5F6E85 !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    line-height: 20px !important;
    letter-spacing: -0.2px !important;
}

[b-t2zf31q7pj] .dds-complete-dispatch-popup .modal-header .btn-close {
    position: absolute;
    top: 12px;
    right: 12px;
    width: 32px !important;
    height: 32px !important;
    margin: 0 !important;
    border: 1px solid rgba(30, 41, 59, 0.06) !important;
    border-radius: 8px !important;
    background-color: rgba(241, 245, 249, 0.8) !important;
    opacity: 1 !important;
}

[b-t2zf31q7pj] .dds-complete-dispatch-popup .modal-body {
    display: none !important;
}

[b-t2zf31q7pj] .dds-complete-dispatch-popup .wm-popup-modal-footer {
    min-height: 72px;
    padding: 16px 20px !important;
    gap: 12px !important;
    border-top: 1px solid rgba(30, 41, 59, 0.09) !important;
    background: #FFFFFF !important;
}

[b-t2zf31q7pj] .dds-complete-dispatch-popup .wm-popup-modal-footer button {
    min-height: 40px;
    border-radius: 10px;
    font-size: 13px;
    font-weight: 600;
    line-height: 24px;
    letter-spacing: -0.2px;
}

[b-t2zf31q7pj] .dds-complete-dispatch-popup .wm-popup-modal-footer .btn-wm-secondary {
    border: 1px solid rgba(30, 41, 59, 0.06);
    background: rgba(241, 245, 249, 0.8);
    color: #1E293B;
}

[b-t2zf31q7pj] .dds-complete-dispatch-popup .wm-popup-modal-footer .btn-wm-primary {
    border: none;
    background: #296C28;
    color: #FFFFFF;
    box-shadow: 0 1px 1px -0.5px rgba(30, 41, 59, 0.03), inset 0 3px 3px rgba(255, 255, 255, 0.12);
}

.dispatch .main-content .data-left-right .main-table .dispatch-own-table[b-t2zf31q7pj] {
    min-width: 1120px;
}

.dispatch .main-content .data-left-right .main-table .dispatch-own-table th:nth-child(1)[b-t2zf31q7pj],
.dispatch .main-content .data-left-right .main-table .dispatch-own-table td:nth-child(1)[b-t2zf31q7pj] {
    width: 32%;
}

.dispatch .main-content .data-left-right .main-table .dispatch-own-table th:nth-child(2)[b-t2zf31q7pj],
.dispatch .main-content .data-left-right .main-table .dispatch-own-table td:nth-child(2)[b-t2zf31q7pj] {
    width: 27%;
}

.dispatch .main-content .data-left-right .main-table .dispatch-own-table th:nth-child(3)[b-t2zf31q7pj],
.dispatch .main-content .data-left-right .main-table .dispatch-own-table td:nth-child(3)[b-t2zf31q7pj] {
    width: 20%;
}

.dispatch .main-content .data-left-right .main-table .dispatch-own-table th:nth-child(4)[b-t2zf31q7pj],
.dispatch .main-content .data-left-right .main-table .dispatch-own-table td:nth-child(4)[b-t2zf31q7pj] {
    width: 11%;
}

.dispatch .main-content .data-left-right .main-table .dispatch-own-table th:nth-child(5)[b-t2zf31q7pj],
.dispatch .main-content .data-left-right .main-table .dispatch-own-table td:nth-child(5)[b-t2zf31q7pj] {
    width: 10%;
}

.dispatch .main-content .data-left-right .main-table .dispatch-own-table tr td[b-t2zf31q7pj] {
    height: 112px;
}

.dispatch .main-content .data-left-right .main-table .dispatch-own-table .job-details[b-t2zf31q7pj],
.dispatch .main-content .data-left-right .main-table .dispatch-own-table .type[b-t2zf31q7pj] {
    align-items: center;
}

.dispatch .main-content .data-left-right .main-table .dispatch-own-table .job-details-badgee[b-t2zf31q7pj] {
    margin-bottom: 0;
}

.dispatch .main-content .data-left-right .main-table .dispatch-own-table .type-badgee[b-t2zf31q7pj] {
    margin-bottom: 0;
}

.dispatch .main-content .data-left-right .main-table .dispatch-own-table .status-badge[b-t2zf31q7pj] {
    min-width: 88px;
    border-radius: 8px;
}

@media (max-width: 768px) {
    .dispatch .main-content .data-left-right .main-table .dispatch-table-title[b-t2zf31q7pj] {
        gap: 12px;
    }

    .dispatch .main-content .data-left-right .main-table .dispatch-list-toolbar[b-t2zf31q7pj],
    .dispatch .main-content .data-left-right .main-table .dispatch-list-actions[b-t2zf31q7pj] {
        align-items: stretch !important;
        width: 100%;
    }

    
}

/* ---- Dispatch errors dropdown style overrides ---- */
.top-errors-container[b-t2zf31q7pj] {
    background-color: #ED40301F;
    /* No bottom margin: .data-left-right's own 24px top padding is the standard
       title-to-card gap on every list page. */
    margin: 0;
}

.top-errors-container .top-errors[b-t2zf31q7pj] {
    margin: 0;
}

.top-errors button.dropdown-toggle[b-t2zf31q7pj] {
    background-color: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

.top-errors button.dropdown-toggle:hover[b-t2zf31q7pj],
.top-errors button.dropdown-toggle:focus[b-t2zf31q7pj],
.top-errors button.dropdown-toggle:active[b-t2zf31q7pj] {
    background-color: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

.dispatch-errors-arrow[b-t2zf31q7pj] {
    transition: transform 0.15s ease;
}

.top-errors-container.expanded .dispatch-errors-arrow[b-t2zf31q7pj] {
    transform: rotate(180deg);
}

/* Menu items list styles */
.top-errors-menu[b-t2zf31q7pj] {
    border-top: 1px solid rgba(237, 64, 48, 0.2);
    list-style: none;
    padding: 0;
    margin: 0;
}

.top-errors-menu li[b-t2zf31q7pj] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 8px 64px;
}

@media (max-width:768px) {
    .top-errors-menu li[b-t2zf31q7pj] {
        padding: 8px 20px;
    }
}

.top-errors-menu li div span[b-t2zf31q7pj] {
    font-size: 13px;
    font-weight: 600;
    line-height: 20px;
    letter-spacing: -0.2px;
    color: #B82213; /* --orange */
}

.top-errors-menu li button[b-t2zf31q7pj] {
    padding: 8px 12px;
    background-color: #B82213; /* --orange */
    color: #fff;
    font-size: 12px;
    font-weight: 600;
    line-height: 16px;
    letter-spacing: -0.2px;
    border: none;
    outline: none;
    border-radius: 8px;
}

.status-badge[b-t2zf31q7pj] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 24px;
    padding: 4px 8px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    line-height: 16px;
    letter-spacing: 0;
    white-space: nowrap;
}

.status-badge.completed[b-t2zf31q7pj] {
    color: #296C28;
    background: #409B3F1F;
}

.status-badge.planned[b-t2zf31q7pj] {
    color: #363AF5;
    background: #5263FF1F;
}

.status-badge.in-progress[b-t2zf31q7pj] {
    color: #A16207;
    background: #FEF3C7;
}

.status-badge.cancelled[b-t2zf31q7pj] {
    color: #475569;
    background: #E2E8F0;
    border: 1px solid #CBD5E1;
}

/* ================================================================
   #filter-dispatches  –  Figma design
   ================================================================ */

#filter-dispatches[b-t2zf31q7pj] {
    z-index: 1070;
}

/* Right-anchored panel, vertically centred.

   The panel is a WMPopup only in looks: it is hand-rolled markup, so the "fits the screen"
   rules in WMPopup.razor.css do not reach it and it needs the same cap of its own. It needs
   it more, in fact - it is position: fixed and centred with a transform, so whatever it grows
   past the window hangs off both edges with no page behind it to scroll. At nine filter
   sections it stands 814px tall, which put the Apply button below the fold on any window
   shorter than about 860px and pushed the title off the top of a short one. */
#filter-dispatches .modal-right[b-t2zf31q7pj] {
    position: fixed;
    right: 20px;
    margin: 0;
    top: 50%;
    transform: translateY(-50%);
    max-width: 360px;
    width: 360px;
    max-height: calc(100vh - 40px);
}

/* Capped against the window rather than against the panel: a percentage max-height needs a
   definite height to resolve against, and the panel's height is this element's own. */
#filter-dispatches .modal-content[b-t2zf31q7pj] {
    padding: 0 !important;
    border-radius: 16px;
    overflow: hidden;
    max-height: calc(100vh - 40px);
}

/* The header and the footer keep their height (Bootstrap gives both flex-shrink: 0); the
   filter sections are what scrolls. */
#filter-dispatches .modal-body[b-t2zf31q7pj] {
    min-height: 0;
    overflow-y: auto;
}

#filter-dispatches .modal-header[b-t2zf31q7pj] {
    padding: 8px 16px;
    border-bottom: 1px #dee2e6 solid !important;
}

#filter-dispatches .modal-header h6[b-t2zf31q7pj] {
    font-size: 15px;
    font-weight: 700;
    line-height: 24px;
    letter-spacing: -0.2px;
    color: #1E293B;
}

/* ---- Section labels ---- */
#filter-dispatches .modal-body .status label[b-t2zf31q7pj],
#filter-dispatches .modal-body .dispatch-type-filter label[b-t2zf31q7pj],
#filter-dispatches .modal-body .date label[b-t2zf31q7pj],
#filter-dispatches .modal-body .dispatch-by label[b-t2zf31q7pj],
#filter-dispatches .modal-body .errors label[b-t2zf31q7pj] {
    font-size: 12px;
    font-weight: 600;
    line-height: 16px;
    letter-spacing: -0.2px;
    color: #475569;
}

/* ---- Chip tokens (selected / not-selected) ---- */
#filter-dispatches .modal-body .status .selected[b-t2zf31q7pj],
#filter-dispatches .modal-body .dispatch-type-filter .selected[b-t2zf31q7pj],
#filter-dispatches .modal-body .errors .selected[b-t2zf31q7pj] {
    background-color: #5263FF1F;
    padding: 8px;
    gap: 2px;
    font-size: 12px;
    font-weight: 600;
    line-height: 16px;
    letter-spacing: -0.2px;
    color: #363AF5;
    border-radius: 8px;
    border: none;
    cursor: pointer;
    transition: background-color 0.15s ease, color 0.15s ease;
}

#filter-dispatches .modal-body .status .selected.not[b-t2zf31q7pj],
#filter-dispatches .modal-body .dispatch-type-filter .selected.not[b-t2zf31q7pj],
#filter-dispatches .modal-body .errors .selected.not[b-t2zf31q7pj] {
    background-color: #F1F5F9CC;
    color: #1E293B;
}

#filter-dispatches .modal-body .status .selected:hover[b-t2zf31q7pj],
#filter-dispatches .modal-body .dispatch-type-filter .selected:hover[b-t2zf31q7pj],
#filter-dispatches .modal-body .errors .selected:hover[b-t2zf31q7pj] {
    filter: brightness(0.97);
}

/* Figma hover popover for truncated dispatched routes/zones/addresses. */
.dispatch-item-info[b-t2zf31q7pj] {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    flex-shrink: 0;
    cursor: help;
    outline: none;
}

.dispatch-item-info > img[b-t2zf31q7pj] {
    width: 18px;
    height: 18px;
}

.dispatch-item-popover[b-t2zf31q7pj] {
    position: absolute;
    left: 50%;
    bottom: calc(100% + 14px);
    z-index: 30;
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 260px;
    max-width: 320px;
    padding: 20px 22px;
    border: 1px solid #E2E8F0;
    border-radius: 20px;
    background: #FFFFFF;
    box-shadow: 0 18px 42px rgba(15, 23, 42, 0.14);
    color: #5F6E85;
    font-size: 17px;
    font-weight: 500;
    line-height: 24px;
    opacity: 0;
    pointer-events: none;
    transform: translate(-50%, 6px);
    transition: opacity 0.14s ease, transform 0.14s ease;
    white-space: normal;
}

.dispatch-item-popover[b-t2zf31q7pj]::after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: -10px;
    width: 20px;
    height: 20px;
    background: #FFFFFF;
    border-right: 1px solid #E2E8F0;
    border-bottom: 1px solid #E2E8F0;
    transform: translateX(-50%) rotate(45deg);
}

.dispatch-item-popover strong[b-t2zf31q7pj] {
    margin-bottom: 6px;
    color: #1E293B;
    font-size: 17px;
    font-weight: 800;
    line-height: 24px;
}

.dispatch-item-popover span[b-t2zf31q7pj] {
    overflow-wrap: anywhere;
}

.dispatch-item-info:hover .dispatch-item-popover[b-t2zf31q7pj],
.dispatch-item-info:focus-visible .dispatch-item-popover[b-t2zf31q7pj] {
    opacity: 1;
    transform: translate(-50%, 0);
}

/* Speech-bubble badge: something textual sits underneath the dispatch. Hover
   lists each message via the shared popover, one block per message: the address or
   business in bold, the author, the first line, a hairline between them. */
.message-indicator .dispatch-item-popover[b-t2zf31q7pj] {
    gap: 0;
}

/* Like the worktype popover below, this one drops BELOW the anchor: the table
   card clips what sticks out above it, so opening upward on the first row cut
   the heading off. The list itself scrolls past a few messages so a long one on
   the last row stays inside the card instead of running off its bottom. */
.message-indicator .dispatch-item-popover[b-t2zf31q7pj],
.complaint-indicator .dispatch-item-popover[b-t2zf31q7pj],
.admin-completed-indicator .dispatch-item-popover[b-t2zf31q7pj] {
    bottom: auto;
    top: calc(100% + 14px);
    transform: translate(-50%, -6px);
}

.message-indicator .dispatch-item-popover[b-t2zf31q7pj]::after,
.complaint-indicator .dispatch-item-popover[b-t2zf31q7pj]::after,
.admin-completed-indicator .dispatch-item-popover[b-t2zf31q7pj]::after {
    bottom: auto;
    top: -10px;
    border-right: none;
    border-bottom: none;
    border-left: 1px solid #E2E8F0;
    border-top: 1px solid #E2E8F0;
}

.message-indicator:hover .dispatch-item-popover[b-t2zf31q7pj],
.message-indicator:focus-visible .dispatch-item-popover[b-t2zf31q7pj],
.complaint-indicator:hover .dispatch-item-popover[b-t2zf31q7pj],
.complaint-indicator:focus-visible .dispatch-item-popover[b-t2zf31q7pj],
.admin-completed-indicator:hover .dispatch-item-popover[b-t2zf31q7pj],
.admin-completed-indicator:focus-visible .dispatch-item-popover[b-t2zf31q7pj] {
    transform: translate(-50%, 0);
}

.message-indicator .message-preview-list[b-t2zf31q7pj] {
    display: block;
    max-height: 240px;
    overflow-y: auto;
    scrollbar-width: thin;
}

.message-indicator .message-preview[b-t2zf31q7pj] {
    display: block;
    padding: 7px 0;
    border-top: 1px solid #EEF2F7;
    color: #475569;
    font-size: 13px;
    line-height: 18px;
}

.message-indicator .message-preview:first-of-type[b-t2zf31q7pj] {
    padding-top: 0;
    border-top: 0;
}

.message-indicator .message-preview:last-of-type[b-t2zf31q7pj] {
    padding-bottom: 0;
}

.message-indicator .dispatch-item-popover .message-preview strong[b-t2zf31q7pj] {
    display: inline;
    margin: 0;
    color: #1E293B;
    font-size: 13px;
    font-weight: 700;
    line-height: 18px;
}

.message-indicator .message-preview-dot[b-t2zf31q7pj] {
    margin: 0 5px;
    color: #94A3B8;
}

.message-indicator .message-preview-author[b-t2zf31q7pj] {
    margin-right: 4px;
    color: #1E293B;
    font-weight: 600;
}

.message-indicator[b-t2zf31q7pj] {
    width: auto;
    height: auto;
    gap: 4px;
    padding: 1px 8px;
    border-radius: 10px;
    background: #5263FF14;
}

.message-indicator > img[b-t2zf31q7pj] {
    width: 14px;
    height: 14px;
}

.message-indicator .message-count[b-t2zf31q7pj] {
    color: #5263FF;
    font-size: 12px;
    font-weight: 700;
    line-height: 18px;
}

/* Complaint drive: the same compact pill as the message badge, in the complaint yellow. */
.complaint-indicator[b-t2zf31q7pj] {
    width: auto;
    height: auto;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 1px 8px;
    border-radius: 10px;
    background: #F59E0B1F;
    cursor: help;
}

.complaint-indicator > img[b-t2zf31q7pj] {
    width: 14px;
    height: 14px;
}

.complaint-indicator .dispatch-item-popover span[b-t2zf31q7pj] {
    color: #475569;
    font-size: 13px;
    line-height: 18px;
}

.complaint-indicator .complaint-count[b-t2zf31q7pj] {
    color: #B45309;
    font-size: 12px;
    font-weight: 700;
    line-height: 18px;
}

/* Settled from the office: one or more stops completed by hand rather than driven.
   Red, like the stop row's own red-man icon, and the same chip shape as the complaint
   and message indicators beside it. */
.admin-completed-indicator[b-t2zf31q7pj] {
    width: auto;
    height: auto;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 1px 8px;
    border-radius: 10px;
    background: #EF44441F;
    cursor: help;
}

.admin-completed-indicator > img[b-t2zf31q7pj] {
    width: 14px;
    height: 14px;
}

.admin-completed-indicator .dispatch-item-popover span[b-t2zf31q7pj] {
    color: #475569;
    font-size: 13px;
    line-height: 18px;
}

.admin-completed-indicator .admin-completed-count[b-t2zf31q7pj] {
    color: #B91C1C;
    font-size: 12px;
    font-weight: 700;
    line-height: 18px;
}

/* Mixed worktypes: compact per-worktype stop counts in the worktype cell. The chips
   themselves are the global .wt-chip / .wt-slot-N classes (app.css), one stable colour
   per worktype, shared with the dispatch sidebar. */
.worktype-mix-info[b-t2zf31q7pj] {
    width: auto;
    height: auto;
    gap: 4px;
    flex-wrap: wrap;
    justify-content: flex-start;
}

/* The worktype cell sits in the upper half of its row, so its popover drops BELOW
   the anchor - opening upward on the first table row put most of the tooltip
   outside the card and cut it off. */
.worktype-mix-info .dispatch-item-popover[b-t2zf31q7pj] {
    bottom: auto;
    top: calc(100% + 14px);
    transform: translate(-50%, -6px);
}

.worktype-mix-info .dispatch-item-popover[b-t2zf31q7pj]::after {
    bottom: auto;
    top: -10px;
    border-right: none;
    border-bottom: none;
    border-left: 1px solid #E2E8F0;
    border-top: 1px solid #E2E8F0;
}

.worktype-mix-info:hover .dispatch-item-popover[b-t2zf31q7pj],
.worktype-mix-info:focus-visible .dispatch-item-popover[b-t2zf31q7pj] {
    transform: translate(-50%, 0);
}

.worktype-mix-dot[b-t2zf31q7pj] {
    color: #94A3B8;
    font-weight: 700;
}

/* ---- Date range box ---- */
#filter-dispatches .modal-body .date .full-date[b-t2zf31q7pj] {
    border: 1px #1E293B1F solid;
    border-radius: 10px;
    background-color: #fff;
    width: 100%;
}

#filter-dispatches .modal-body .date .full-date img[b-t2zf31q7pj] {
    height: 16px;
    flex-shrink: 0;
}

#filter-dispatches .modal-body .date .full-date input[b-t2zf31q7pj] {
    font-size: 12px;
    font-weight: 600;
    line-height: 16px;
    letter-spacing: -0.2px;
    color: #1E293B;
    border: none;
    outline: none;
    width: 120px;
    background: transparent;
}

#filter-dispatches .modal-body .date .date-separator[b-t2zf31q7pj] {
    font-size: 12px;
    font-weight: 600;
    color: #94A3B8;
    flex-shrink: 0;
}

/* ---- Dispatched by select ---- */
#filter-dispatches .modal-body .dispatch-by .cstm-select[b-t2zf31q7pj] {
    border: 1px #1E293B1F solid;
    border-radius: 8px;
    box-shadow: 0 1px 1px -0.5px #1E293B08;
    padding: 8px;
}

#filter-dispatches .modal-body .dispatch-by .cstm-select img[b-t2zf31q7pj] {
    height: 16px;
    flex-shrink: 0;
}

#filter-dispatches .modal-body .dispatch-by .cstm-select select[b-t2zf31q7pj] {
    border: none;
    outline: none;
    color: #1E293B;
    font-size: 12px;
    font-weight: 600;
    line-height: 16px;
    letter-spacing: -0.2px;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    background-image: url("../img/icons/gray-arrow.png");
    background-repeat: no-repeat;
    background-position: right 0 center;
    background-size: 18px;
    cursor: pointer;
    background-color: transparent;
}

/* ---- Manual dispatches only – toggle switch ---- */
#filter-dispatches .modal-body .manual-only h6[b-t2zf31q7pj] {
    font-size: 13px;
    font-weight: 600;
    line-height: 20px;
    letter-spacing: -0.2px;
    color: #1E293B;
}

#filter-dispatches .modal-body .manual-only .toggle-switch[b-t2zf31q7pj] {
    position: relative;
    display: inline-block;
    width: 46px;
    height: 28px;
    background: linear-gradient(180deg, #E2E8F0 0%, #F8FAFC 100%);
    border-radius: 50px;
    padding: 3px;
}

#filter-dispatches .modal-body .manual-only .toggle-switch input[b-t2zf31q7pj] {
    opacity: 0;
    width: 0;
    height: 0;
}

#filter-dispatches .modal-body .manual-only .slider[b-t2zf31q7pj] {
    position: absolute;
    cursor: pointer;
    border-radius: 30px;
    background-color: #D3DDE8;
    transition: 0.3s;
    height: 22px;
    width: 40px;
}

#filter-dispatches .modal-body .manual-only .slider[b-t2zf31q7pj]:before {
    content: "";
    position: absolute;
    height: 18px;
    width: 18px;
    left: 2px;
    top: 2px;
    border-radius: 50%;
    background: #E2E8F0;
    transition: 0.3s;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.15);
}

#filter-dispatches .modal-body .manual-only .toggle-switch input:checked + .slider[b-t2zf31q7pj] {
    background: linear-gradient(135deg, #5B67F6, #4C57E0);
}

#filter-dispatches .modal-body .manual-only .toggle-switch input:checked + .slider[b-t2zf31q7pj]:before {
    transform: translateX(18px);
    background: #fff;
}

/* ---- Footer buttons ---- */
#filter-dispatches .modal-footer[b-t2zf31q7pj] {
    padding: 12px 16px;
    border-top: 1px #dee2e6 solid;
}

#filter-dispatches .modal-footer button[b-t2zf31q7pj] {
    white-space: nowrap;
    font-size: 12px;
    font-weight: 600;
    line-height: 16px;
    letter-spacing: -0.2px;
    border-radius: 8px;
    border: 1px transparent solid;
    padding: 8px 12px;
}

#filter-dispatches .modal-footer button.reset-btn[b-t2zf31q7pj] {
    color: #475569;
    background: transparent;
}

#filter-dispatches .modal-footer button.cancel-btn[b-t2zf31q7pj] {
    background-color: #F1F5F9CC;
    border-color: #1E293B17;
    color: #1E293B;
}

#filter-dispatches .modal-footer button.apply-btn[b-t2zf31q7pj] {
    background-color: #5263FF;
    color: #fff;
}

/* ---- Responsive ---- */
@media (max-width: 425px) {
    #filter-dispatches .modal-right[b-t2zf31q7pj] {
        position: fixed;
        right: 10px;
        margin: none;
        top: 0;
        transform: translateY(0%);
        max-width: 100%;
        width: 95%;
        /* Anchored to the top here rather than centred, so the gutter is only at the bottom. */
        max-height: calc(100vh - 20px);
    }

    #filter-dispatches .modal-content[b-t2zf31q7pj] {
        max-height: calc(100vh - 20px);
    }
}

/* ---- Worked-time box: "00:01 - 04:00" on the left, "3H 59M" on the right ---- */
.worked-time-box[b-t2zf31q7pj] {
    margin-top: 8px;
    padding: 6px 10px;
    border: 1px solid #E2E8F0;
    border-radius: 8px;
    background: #F8FAFC;
    white-space: nowrap;
}

.worked-time-box .worked-time-range[b-t2zf31q7pj] {
    font-size: 12px;
    font-weight: 600;
    line-height: 16px;
    letter-spacing: -0.2px;
    color: var(--gray-txt-2);
}

.worked-time-box .worked-time-total[b-t2zf31q7pj] {
    font-size: 12px;
    font-weight: 700;
    line-height: 16px;
    letter-spacing: -0.2px;
    color: #0F172A;
}

/* ---- Dropdown menu backdrop overlay ---- */
.menu-backdrop[b-t2zf31q7pj] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    z-index: 998;
    background: transparent;
}

/* ═════════════════════════════════════════════════════════════════════════════
   Live map tab — the map IS the tab, edge to edge under the title bar, and the
   running-items panel floats on top of it as a translucent glass overlay. The
   page root carries `wm-fixed-page`, so the tab just claims the leftover space.
   Fullscreen needs no rules of its own: the panel lives inside .dl-layout, so
   it rides along.
   ═════════════════════════════════════════════════════════════════════════════ */

.dispatch-live-tab[b-t2zf31q7pj] {
    display: flex;
    flex-direction: column;
    flex-grow: 1;
    min-height: 0;
}

.dl-layout[b-t2zf31q7pj] {
    position: relative;
    flex: 1;
    min-height: 0;
    overflow: hidden;
}

/* ---- Left panel: floats over the map ---- */
.dl-left-panel[b-t2zf31q7pj] {
    position: absolute;
    top: 16px;
    left: 16px;
    bottom: 16px;
    /* Above the map canvas and its built-in controls, below WMMap's popups. */
    z-index: 5;
    width: 374px;
    max-width: calc(100% - 32px);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    background-color: #FFFFFFB8;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border: 1px solid #1E293B17;
    border-radius: 16px;
    box-shadow: 0 8px 24px -8px #1E293B33;
}

.dl-panel-top[b-t2zf31q7pj] {
    padding: 10px 12px;
    flex-shrink: 0;
    border-bottom: 1px solid #1E293B17;
}

.dl-panel-title[b-t2zf31q7pj] {
    font-size: 14px;
    font-weight: 700;
    color: #1E293B;
    letter-spacing: -0.2px;
}

/* The pulse is the one thing on the page that says "this is not a snapshot". */
.dl-live-dot[b-t2zf31q7pj] {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #22C55E;
    flex-shrink: 0;
    animation: dl-pulse-b-t2zf31q7pj 2s ease-in-out infinite;
}

@keyframes dl-pulse-b-t2zf31q7pj {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.35; }
}

.dl-count-badge[b-t2zf31q7pj] {
    background: #F1F5F9;
    color: #475569;
    font-size: 12px;
    font-weight: 600;
    border-radius: 99px;
    padding: 2px 8px;
    line-height: 1.6;
}

/* The units-out pill is the one number on the header that is about people rather than
   paperwork, so it takes the same green a fresh fix does. */
.dl-unit-badge[b-t2zf31q7pj] {
    color: #22C55E;
}

.dl-updated[b-t2zf31q7pj] {
    margin-top: 2px;
    font-size: 11px;
    color: #94A3B8;
    line-height: 16px;
}

/* The day picker sits under the title, on its own row: it changes what the whole panel is
   about, so it must not read as one more badge beside the count. */
.dl-day-picker[b-t2zf31q7pj] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 8px;
}

.dl-day-picker-field[b-t2zf31q7pj] {
    flex: 1;
    min-width: 0;
}

.dl-back-to-live[b-t2zf31q7pj] {
    flex-shrink: 0;
    border: 1px solid #1E293B26;
    background: #FFFFFF;
    border-radius: 8px;
    padding: 5px 10px;
    font-size: 12px;
    font-weight: 600;
    color: #475569;
    line-height: 16px;
    cursor: pointer;
}

    .dl-back-to-live:hover[b-t2zf31q7pj] {
        background: #F1F5F9;
        color: #1E293B;
    }

.dl-state-center[b-t2zf31q7pj] {
    flex: 1;
    min-height: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #5263FF;
}

.dl-empty[b-t2zf31q7pj] {
    flex-direction: column;
    gap: 6px;
    padding: 24px;
    text-align: center;
}

.dl-empty-icon[b-t2zf31q7pj] {
    width: 28px;
    height: 28px;
    opacity: 0.5;
    margin-bottom: 4px;
}

.dl-empty-title[b-t2zf31q7pj] {
    margin: 0;
    font-size: 14px;
    font-weight: 600;
    color: #475569;
}

.dl-empty-text[b-t2zf31q7pj] {
    margin: 0;
    font-size: 12px;
    line-height: 18px;
    color: #94A3B8;
}

/* ---- The tree: zone -> company -> route -> address ----
   The dispatch slider's language made smaller: a coloured bar for a zone, the slider's
   building, route and pin icons for the rest, a count over a thin progress bar, and the
   slider's blue chevron. Flat rows divided by hairlines rather than cards, so a municipality's
   worth of routes still reads as one list. */
.dl-item-list[b-t2zf31q7pj] {
    flex: 1;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    scrollbar-width: none;
}

.dl-node[b-t2zf31q7pj] {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
    min-height: 44px;
    padding: 6px 10px 6px 12px;
    border-bottom: 1px solid #1E293B0F;
    cursor: pointer;
    transition: background-color .15s;
}

.dl-node:hover[b-t2zf31q7pj] {
    background: #5263FF14;
}

.dl-node--zone[b-t2zf31q7pj] {
    min-height: 52px;
    background: #FFFFFFE6;
}

.dl-node--contractor[b-t2zf31q7pj] {
    background: #F8FAFCE6;
}

.dl-node--route[b-t2zf31q7pj],
.dl-node--address[b-t2zf31q7pj] {
    background: #F1F5F9D9;
}

.dl-node--address[b-t2zf31q7pj] {
    min-height: 38px;
}

.dl-node--selected[b-t2zf31q7pj] {
    background: #5263FF1F;
    box-shadow: inset 3px 0 0 #5263FF;
}

/* Each step in is one icon's width, so the nesting reads without guide rules. */
.dl-depth-1[b-t2zf31q7pj] {
    padding-left: 24px;
}

.dl-depth-2[b-t2zf31q7pj] {
    padding-left: 36px;
}

.dl-depth-3[b-t2zf31q7pj] {
    padding-left: 48px;
}

.dl-zone-bar[b-t2zf31q7pj] {
    width: 4px;
    align-self: stretch;
    flex: 0 0 4px;
    border-radius: 99px;
}

.dl-node-icon[b-t2zf31q7pj] {
    width: 18px;
    height: 18px;
    flex: 0 0 18px;
}

.dl-node--address .dl-node-icon[b-t2zf31q7pj] {
    width: 16px;
    height: 16px;
    flex-basis: 16px;
}

.dl-node-text[b-t2zf31q7pj] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
}

.dl-node-title[b-t2zf31q7pj] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 13px;
    font-weight: 600;
    line-height: 18px;
    letter-spacing: -0.2px;
    color: #1E293B;
}

.dl-node--zone .dl-node-title[b-t2zf31q7pj] {
    font-size: 14px;
    font-weight: 700;
}

.dl-node--contractor .dl-node-title[b-t2zf31q7pj] {
    color: #475569;
}

.dl-node--address .dl-node-title[b-t2zf31q7pj] {
    font-size: 12px;
    font-weight: 500;
}

.dl-node-sub[b-t2zf31q7pj] {
    display: flex;
    align-items: center;
    gap: 6px;
    min-width: 0;
    font-size: 11px;
    line-height: 16px;
    color: #5F6E85;
    white-space: nowrap;
}

.dl-node-detail[b-t2zf31q7pj] {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
}

.dl-node-end[b-t2zf31q7pj] {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.dl-node-progress[b-t2zf31q7pj] {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 3px;
    width: 52px;
}

.dl-node-count[b-t2zf31q7pj] {
    font-size: 12px;
    font-weight: 700;
    line-height: 14px;
    color: #1E293B;
    font-variant-numeric: tabular-nums;
}

.dl-node-bar[b-t2zf31q7pj] {
    width: 100%;
    height: 4px;
    border-radius: 99px;
    background: #E2E8F0;
    overflow: hidden;
}

.dl-node-bar-fill[b-t2zf31q7pj] {
    display: block;
    height: 100%;
    border-radius: 99px;
    background: #5263FF;
    transition: width .4s ease;
}

.dl-node-bar-fill--done[b-t2zf31q7pj] {
    background: #337C33;
}

/* The slider's status pills, one size down. */
.dl-status[b-t2zf31q7pj] {
    flex-shrink: 0;
    padding: 0 6px;
    border-radius: 6px;
    font-size: 11px;
    font-weight: 600;
    line-height: 16px;
}

.dl-status--done[b-t2zf31q7pj] {
    background: #409B3F1F;
    color: #296C28;
}

.dl-status--progress[b-t2zf31q7pj] {
    background: #FFC30A2E;
    color: #9D6600;
}

.dl-status--unable[b-t2zf31q7pj] {
    background: #ED40301F;
    color: #B82213;
}

.dl-status--waiting[b-t2zf31q7pj] {
    background: #F1F5F9;
    color: #475569;
}

/* The map toggle: what is hidden from the map stays in the panel, dimmed, so it can be
   brought back. The eye itself keeps full opacity: it is the way back. */
.dl-eye[b-t2zf31q7pj] {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    padding: 0;
    border: 0;
    border-radius: 6px;
    background: transparent;
    cursor: pointer;
}

.dl-eye:hover[b-t2zf31q7pj] {
    background: #1E293B0F;
}

.dl-eye img[b-t2zf31q7pj] {
    width: 14px;
    height: 14px;
}

.dl-node--off > *:not(.dl-node-end)[b-t2zf31q7pj],
.dl-node--off .dl-node-progress[b-t2zf31q7pj],
.dl-node--off .dl-chevron[b-t2zf31q7pj] {
    opacity: 0.45;
}

.dl-chevron[b-t2zf31q7pj] {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    padding: 0;
    border: 0;
    border-radius: 6px;
    background: #5263FF1F;
    cursor: pointer;
}

.dl-chevron img[b-t2zf31q7pj] {
    width: 12px;
    height: 12px;
    transition: transform .15s;
}

.dl-chevron img.dl-chevron-open[b-t2zf31q7pj] {
    transform: rotate(180deg);
}

.dl-chevron-spacer[b-t2zf31q7pj] {
    width: 24px;
    flex-shrink: 0;
}

/* A company's crew, counted by freshness rather than named. */
.dl-dots[b-t2zf31q7pj] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
}

.dl-dot-count[b-t2zf31q7pj] {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    font-size: 11px;
    font-weight: 600;
    color: #475569;
}

.dl-driver-dot[b-t2zf31q7pj] {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    flex-shrink: 0;
}

/* ---- Map: fills the whole tab; the panel floats above it ---- */
.dl-map-area[b-t2zf31q7pj] {
    position: absolute;
    inset: 0;
    overflow: hidden;
}

/* Cascade 100% height into WMMap's wrapper chain, the way the zone map does. */
.dl-map-area[b-t2zf31q7pj]  .wm-map-wrapper,
.dl-map-area[b-t2zf31q7pj]  .wm-map-wrapper > div {
    height: 100%;
}

.dl-map-area[b-t2zf31q7pj]  .wm-map-container {
    border-radius: 0;
}

/* ---- Timeline: floats along the bottom of the map, clear of the left panel ---- */
.dl-timeline[b-t2zf31q7pj] {
    position: absolute;
    /* 16 panel-left + 374 panel + 32 breathing room */
    left: 422px;
    right: 16px;
    bottom: 16px;
    z-index: 5;
    max-width: 680px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 16px;
    background-color: #FFFFFFB8;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border: 1px solid #1E293B17;
    border-radius: 99px;
    box-shadow: 0 8px 24px -8px #1E293B33;
}

.dl-timeline-live[b-t2zf31q7pj] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    flex-shrink: 0;
    border: none;
    background: #F1F5F9;
    color: #475569;
    font-size: 12px;
    font-weight: 700;
    border-radius: 99px;
    padding: 4px 12px;
    cursor: pointer;
}

.dl-timeline-live--on[b-t2zf31q7pj] {
    background: #22C55E1A;
    color: #15803D;
}

/* Off live, the dot stops pulsing — the map is a frozen moment, not a feed. */
.dl-timeline-live:not(.dl-timeline-live--on) .dl-live-dot[b-t2zf31q7pj] {
    background: #94A3B8;
    animation: none;
}

.dl-timeline-slider[b-t2zf31q7pj] {
    flex: 1;
    min-width: 0;
    height: 4px;
    cursor: pointer;
    accent-color: #5263FF;
}

.dl-timeline-time[b-t2zf31q7pj] {
    flex-shrink: 0;
    min-width: 64px;
    text-align: right;
    font-size: 12px;
    font-weight: 600;
    color: #1E293B;
    font-variant-numeric: tabular-nums;
}

.dl-map-loading[b-t2zf31q7pj] {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #F8FAFC;
    color: #5263FF;
}

/* A cancelled dispatch's progress must not read as success: red text, red bar. */
.progress-card.cancelled .status[b-t2zf31q7pj],
.progress-card.cancelled .percent[b-t2zf31q7pj] {
	color: #B91C1C !important;
}

.progress-card.cancelled .progress-fill[b-t2zf31q7pj] {
	background: #DC2626 !important;
}


/* Search suggestions (zones / routes / addresses) under the list search box */
.dispatch-search-wrap[b-t2zf31q7pj] {
    position: relative;
}

.dispatch-search-suggestions[b-t2zf31q7pj] {
    position: absolute;
    top: calc(100% + 6px);
    left: 0;
    z-index: 1051;
    min-width: 320px;
    max-width: 420px;
    max-height: min(420px, 60vh);
    overflow-y: auto;
    scrollbar-width: thin;
    padding: 6px;
    border: 1px solid #E4E5E7;
    border-radius: 12px;
    box-shadow: 0 8px 24px rgba(30, 41, 59, 0.16);
    background-color: #FFFFFF;
}

.dispatch-search-suggestions .suggestion-group-title[b-t2zf31q7pj] {
    margin: 6px 8px 2px;
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: #94A3B8;
}

.dispatch-search-suggestions .suggestion-item[b-t2zf31q7pj] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    width: 100%;
    padding: 6px 8px;
    border: none;
    border-radius: 8px;
    background: none;
    text-align: left;
    cursor: pointer;
}

.dispatch-search-suggestions .suggestion-item:hover[b-t2zf31q7pj] {
    background-color: #F1F5F9;
}

.dispatch-search-suggestions .suggestion-name[b-t2zf31q7pj] {
    display: flex;
    flex-direction: column;
    min-width: 0;
    font-size: 13px;
    color: #1E293B;
    overflow-wrap: anywhere;
}

.dispatch-search-suggestions .suggestion-detail[b-t2zf31q7pj] {
    font-size: 11px;
    color: #94A3B8;
}



/* Error bar (design A): one slim line, each error type a clickable chip. */
.dispatch-error-bar[b-t2zf31q7pj] {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    background-color: #ED40301F;
    padding: 10px 40px;
}

.dispatch-error-bar .error-bar-lead[b-t2zf31q7pj] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    font-weight: 700;
    color: var(--orange);
}

.dispatch-error-bar .error-bar-lead img[b-t2zf31q7pj] {
    height: 20px;
    width: 20px;
}

.dispatch-error-bar .error-chip[b-t2zf31q7pj] {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    background-color: #FFFFFF;
    border: 1px solid rgba(237, 64, 48, 0.35);
    color: var(--orange);
    font-size: 12.5px;
    font-weight: 600;
    padding: 5px 12px;
    border-radius: 999px;
    cursor: pointer;
    outline: none;
}

.dispatch-error-bar .error-chip:hover[b-t2zf31q7pj] {
    background-color: #FBEBE9;
}

.dispatch-error-bar .error-chip-count[b-t2zf31q7pj] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background-color: var(--orange);
    color: #fff;
    border-radius: 999px;
    min-width: 20px;
    height: 20px;
    padding: 0 6px;
    font-size: 11.5px;
    font-weight: 800;
    font-variant-numeric: tabular-nums;
}

@media (max-width: 768px) {
    .dispatch-error-bar[b-t2zf31q7pj] {
        padding: 10px 20px;
    }
}

/* ---- Snow depth chip (snow-depth pricing phase 4) ---- */
.snow-depth-chip[b-t2zf31q7pj] {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    padding: 1px 8px;
    border: 1px solid #BFDBFE;
    border-radius: 10px;
    background: #EFF6FF;
    color: #1D4ED8;
    font-size: 11px;
    font-weight: 600;
    line-height: 16px;
    white-space: nowrap;
}
/* /Pages/Driver/DriverMobileAppInfo.razor.rz.scp.css */
.logout-btn[b-tyvrpy65lp] {
  padding: 6px;
  border-radius: 6px;
  cursor: pointer;
}

.logout-btn:hover[b-tyvrpy65lp] {
  background-color: #dadada;
}
/* /Pages/Forecast/Components/CreateOrEditTrackerPopup.razor.rz.scp.css */
.tr-body[b-cv6tpzr6z0] {
    padding: 16px 20px 4px 20px;
    max-height: 70vh;
    overflow-y: auto;
}

.tr-body h6[b-cv6tpzr6z0] {
    margin: 0;
    font-size: 14px;
    font-weight: 600;
    color: #0F172A;
}

.tr-body input[type="text"][b-cv6tpzr6z0],
.tr-body input[type="number"][b-cv6tpzr6z0] {
    width: 100%;
    height: 40px;
    padding: 0 12px;
    border: 1px solid #E5E7EB;
    border-radius: 8px;
    font-size: 14px;
    color: #0F172A;
    background: #FFFFFF;
}

.tr-body input:focus[b-cv6tpzr6z0] {
    outline: none;
    border-color: #5263FF;
}

.tr-grid-2[b-cv6tpzr6z0] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}

.tr-hint[b-cv6tpzr6z0] {
    margin: 0;
    font-size: 12px;
    color: #5F6E85;
}

.tr-error[b-cv6tpzr6z0] {
    margin: 0;
    font-size: 12px;
    color: #B82213;
}

/* Two per row on a desktop dialog, one per row once the modal is phone-width: six optional
   numbers read as a checklist, and a checklist that wraps mid-label stops reading as one. */
.tr-thresholds[b-cv6tpzr6z0] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    margin-top: 12px;
}

@media (max-width: 560px) {
    .tr-grid-2[b-cv6tpzr6z0],
    .tr-thresholds[b-cv6tpzr6z0] {
        grid-template-columns: 1fr;
    }
}

.tr-threshold[b-cv6tpzr6z0] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.tr-label[b-cv6tpzr6z0] {
    font-size: 12px;
    font-weight: 500;
    color: #5F6E85;
}

/* The unit sits inside the field's border rather than beside it: "2" and "cm/h" are one
   value, and a stray number with no unit is the misreading this feature cannot afford. */
.tr-measure[b-cv6tpzr6z0] {
    position: relative;
    display: flex;
    align-items: center;
}

.tr-measure input[b-cv6tpzr6z0] {
    padding-right: 52px !important;
}

.tr-unit[b-cv6tpzr6z0] {
    position: absolute;
    right: 12px;
    font-size: 12px;
    color: #94A3B8;
    pointer-events: none;
}

.tr-switch-row[b-cv6tpzr6z0] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.tr-notify[b-cv6tpzr6z0] {
    border: 1px solid #E8EDF5;
    border-radius: 10px;
    background: #F8FAFC;
}

.tr-notify-head[b-cv6tpzr6z0] {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 12px 14px;
    border: none;
    background: transparent;
    font-size: 14px;
    font-weight: 600;
    color: #0F172A;
    cursor: pointer;
}

.tr-notify-body[b-cv6tpzr6z0] {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 0 14px 14px 14px;
}

.tr-chevron[b-cv6tpzr6z0] {
    width: 8px;
    height: 8px;
    border-right: 2px solid #94A3B8;
    border-bottom: 2px solid #94A3B8;
    transform: rotate(45deg);
    transition: transform .15s ease;
}

.tr-chevron.open[b-cv6tpzr6z0] {
    transform: rotate(-135deg);
}

.tr-select[b-cv6tpzr6z0] {
    width: 100%;
    height: 40px;
    padding: 0 12px;
    border: 1px solid #E5E7EB;
    border-radius: 8px;
    font-size: 14px;
    color: #0F172A;
    background: #FFFFFF;
}

.tr-select:disabled[b-cv6tpzr6z0],
.tr-body input:disabled[b-cv6tpzr6z0] {
    background: #F1F5F9;
    color: #94A3B8;
    cursor: not-allowed;
}
/* /Pages/Forecast/Forecast.razor.rz.scp.css */
/* Full-height: title bar sits on top, the layout fills the rest of the viewport. */
.main-content[b-g8kqbqnw8v] {
	height: 100vh;
	min-height: 100vh;
	display: flex;
	flex-direction: column;
	overflow: hidden;
}

/* Title bar spans full width (override any global centred max-width cap) so it lines
   up with the full-width map/panel below. */
.main-content .main-title[b-g8kqbqnw8v] {
	max-width: none;
	margin: 0;
}

.fc-layout[b-g8kqbqnw8v] {
	flex: 1 1 auto;
	min-height: 0;
	padding: 16px 24px 24px;
}

/* ---- Map -------------------------------------------------------------- */
.fc-map-wrap[b-g8kqbqnw8v] {
	position: relative;
	border: 1px solid #E5E7EB;
	border-radius: 12px;
	overflow: hidden;
	background: #0a0f18;
}

/* Google location search overlaid on the map (the app's shared search box —
   it lives out here because the isolated iframe cannot call the authenticated API). */
.fc-map-search[b-g8kqbqnw8v] {
	position: absolute;
	top: 12px;
	right: 12px;
	z-index: 5;
	width: min(364px, 60%);
	display: flex;
	align-items: flex-start;
	gap: 8px;
}

.fc-search-grow[b-g8kqbqnw8v] {
	flex: 1 1 auto;
	min-width: 0;
}

.fc-map-search[b-g8kqbqnw8v]  .fc-search-field {
	background: #fff;
	box-shadow: 0 2px 10px rgba(10, 15, 24, .35);
}

.fc-fullscreen-btn[b-g8kqbqnw8v] {
	flex-shrink: 0;
	width: 40px;
	height: 40px;
	border-radius: 999px;
	border: 1px solid #E4E5E7;
	background: #fff;
	box-shadow: 0 2px 10px rgba(10, 15, 24, .35);
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	transition: background .15s ease;
}
.fc-fullscreen-btn:hover[b-g8kqbqnw8v] { background: #F1F5F9; }

/* ---- Fullscreen mode -------------------------------------------------- */
/* Map covers the viewport; the info panel floats on top in a tighter form. */
.fc-layout.fc-fullscreen[b-g8kqbqnw8v] {
	position: fixed;
	inset: 0;
	z-index: 2000;
	margin: 0;
	padding: 0;
	background: #0a0f18;
}

.fc-layout.fc-fullscreen .fc-map-wrap[b-g8kqbqnw8v] {
	border: none;
	border-radius: 0;
}

/* Keep the search clear of the floating panel */
.fc-layout.fc-fullscreen .fc-map-search[b-g8kqbqnw8v] {
	right: 324px;
}

.fc-layout.fc-fullscreen .fc-panel[b-g8kqbqnw8v] {
	position: absolute;
	top: 12px;
	right: 12px;
	bottom: 12px;
	min-width: 0;
	z-index: 6;
	padding-right: 0;
}

.fc-layout.fc-fullscreen .fc-card[b-g8kqbqnw8v] {
	background: rgba(255, 255, 255, .94);
	backdrop-filter: blur(8px);
	border-color: rgba(228, 229, 231, .7);
}

.fc-layout.fc-fullscreen .fc-footer[b-g8kqbqnw8v] {
	color: #E2E8F0;
	text-shadow: 0 1px 2px rgba(10, 15, 24, .6);
	padding: 0 0 2px;
}

.fc-map[b-g8kqbqnw8v] {
	width: 100%;
	height: 100%;
	min-height: 0;
	border: 0;
	display: block;
}

/* ---- Panel (compact) -------------------------------------------------- */
.fc-panel[b-g8kqbqnw8v] {
	width: 300px;
	min-width: 280px;
	overflow-y: auto;
	display: flex;
	flex-direction: column;
	gap: 8px;
	padding-right: 2px;
}

.fc-card[b-g8kqbqnw8v] {
	background: #fff;
	border: 1px solid #E5E7EB;
	border-radius: 10px;
	padding: 10px 12px;
}

.fc-card-head[b-g8kqbqnw8v] {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 8px;
}

.fc-label[b-g8kqbqnw8v] {
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: #94A3B8;
}

.fc-alert[b-g8kqbqnw8v] {
	background: #FEF2F2;
	border: 1px solid #FECACA;
	color: #B82213;
	border-radius: 12px;
	padding: 12px 14px;
	font-size: 13px;
	font-weight: 500;
}

/* ---- Status / traffic light ------------------------------------------ */
.fc-status[b-g8kqbqnw8v] {
	display: flex;
	align-items: center;
	gap: 12px;
}

.fc-traffic[b-g8kqbqnw8v] {
	display: flex;
	flex-direction: column;
	gap: 5px;
	padding: 7px;
	background: #0A1C3D;
	border-radius: 999px;
	flex-shrink: 0;
}

.fc-light[b-g8kqbqnw8v] {
	width: 16px;
	height: 16px;
	border-radius: 50%;
	background: rgba(255, 255, 255, .12);
	transition: all .4s ease;
}

.fc-light.on.green[b-g8kqbqnw8v]  { background: #30A46C; box-shadow: 0 0 10px rgba(48,164,108,.7), 0 0 20px rgba(48,164,108,.35); }
.fc-light.on.yellow[b-g8kqbqnw8v] { background: #FFC30A; box-shadow: 0 0 10px rgba(255,195,10,.7), 0 0 20px rgba(255,195,10,.35); }
.fc-light.on.red[b-g8kqbqnw8v]    { background: #ED4030; box-shadow: 0 0 10px rgba(237,64,48,.7), 0 0 20px rgba(237,64,48,.35); }

.fc-status-text[b-g8kqbqnw8v] { min-width: 0; }

.fc-status-label[b-g8kqbqnw8v] {
	font-size: 15px;
	font-weight: 800;
	letter-spacing: .12em;
}
.fc-status-label.level-green[b-g8kqbqnw8v]  { color: #296C28; }
.fc-status-label.level-yellow[b-g8kqbqnw8v] { color: #9D6600; }
.fc-status-label.level-red[b-g8kqbqnw8v]    { color: #B82213; }

.fc-status-desc[b-g8kqbqnw8v] {
	margin: 4px 0 0;
	font-size: 12px;
	color: #475569;
	line-height: 1.45;
}

/* ---- Timeline -------------------------------------------------------- */
.fc-now-btn[b-g8kqbqnw8v] {
	border: none;
	background: transparent;
	color: #5263FF;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: .04em;
	text-transform: uppercase;
	cursor: pointer;
	padding: 0;
}
.fc-now-btn:hover[b-g8kqbqnw8v] { color: #363AF5; }

.fc-active-time[b-g8kqbqnw8v] {
	font-size: 13px;
	color: #1E293B;
	font-weight: 500;
	margin-bottom: 10px;
}
.fc-active-temp[b-g8kqbqnw8v] {
	margin-left: 8px;
	font-weight: 700;
	padding: 1px 6px;
	border-radius: 6px;
}
.fc-active-temp.seg-cold[b-g8kqbqnw8v] { color: #B82213; }
.fc-active-temp.seg-warn[b-g8kqbqnw8v] { color: #9D6600; }
.fc-active-temp.seg-ok[b-g8kqbqnw8v]   { color: #296C28; }

.fc-track[b-g8kqbqnw8v] {
	position: relative;
	height: 26px;
	border-radius: 8px;
	overflow: visible;
}

.fc-segments[b-g8kqbqnw8v] {
	position: absolute;
	inset: 0;
	display: flex;
	border-radius: 8px;
	overflow: hidden;
	border: 1px solid #E5E7EB;
}
.fc-seg[b-g8kqbqnw8v] { height: 100%; flex: 1 1 0; }
.fc-seg.seg-cold[b-g8kqbqnw8v] { background: rgba(223, 41, 23, .55); }
.fc-seg.seg-warn[b-g8kqbqnw8v] { background: rgba(255, 195, 10, .5); }
.fc-seg.seg-ok[b-g8kqbqnw8v]   { background: rgba(51, 135, 50, .28); }
.fc-seg.seg-none[b-g8kqbqnw8v] { background: #EEF2F6; }

.fc-now-marker[b-g8kqbqnw8v] {
	position: absolute;
	top: -2px;
	bottom: -2px;
	width: 2px;
	background: #0A1C3D;
	z-index: 2;
	pointer-events: none;
}
.fc-now-marker[b-g8kqbqnw8v]::before {
	content: "";
	position: absolute;
	top: -3px;
	left: 50%;
	transform: translateX(-50%);
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: #0A1C3D;
}

/* A transparent range input overlays the segment bar and supplies the scrubber handle. */
.fc-range[b-g8kqbqnw8v] {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	margin: 0;
	background: transparent;
	-webkit-appearance: none;
	appearance: none;
	cursor: pointer;
	z-index: 3;
}
.fc-range[b-g8kqbqnw8v]::-webkit-slider-runnable-track { background: transparent; height: 100%; }
.fc-range[b-g8kqbqnw8v]::-moz-range-track { background: transparent; height: 100%; }
.fc-range[b-g8kqbqnw8v]::-webkit-slider-thumb {
	-webkit-appearance: none;
	appearance: none;
	width: 12px;
	height: 30px;
	margin-top: -2px;
	border-radius: 4px;
	background: #5263FF;
	border: 2px solid #fff;
	box-shadow: 0 0 0 1px rgba(82,99,255,.5), 0 2px 6px rgba(82,99,255,.45);
}
.fc-range[b-g8kqbqnw8v]::-moz-range-thumb {
	width: 12px;
	height: 30px;
	border-radius: 4px;
	background: #5263FF;
	border: 2px solid #fff;
	box-shadow: 0 0 0 1px rgba(82,99,255,.5), 0 2px 6px rgba(82,99,255,.45);
}

.fc-day-labels[b-g8kqbqnw8v] {
	position: relative;
	height: 18px;
	margin-top: 6px;
}
.fc-day-label[b-g8kqbqnw8v] {
	position: absolute;
	transform: translateX(-50%);
	font-size: 11px;
	color: #94A3B8;
	font-weight: 600;
	white-space: nowrap;
}

.fc-legend[b-g8kqbqnw8v] {
	display: flex;
	gap: 14px;
	margin-top: 6px;
}
.fc-legend-item[b-g8kqbqnw8v] {
	display: flex;
	align-items: center;
	gap: 5px;
	font-size: 11px;
	color: #5F6E85;
}
.fc-dot[b-g8kqbqnw8v] { width: 10px; height: 10px; border-radius: 3px; display: inline-block; }
.fc-dot.seg-cold[b-g8kqbqnw8v] { background: rgba(223, 41, 23, .55); }
.fc-dot.seg-warn[b-g8kqbqnw8v] { background: rgba(255, 195, 10, .5); }
.fc-dot.seg-ok[b-g8kqbqnw8v]   { background: rgba(51, 135, 50, .28); }

/* ---- Location -------------------------------------------------------- */
.fc-location-name[b-g8kqbqnw8v] {
	margin: 0;
	font-size: 14px;
	font-weight: 600;
	color: #1E293B;
}
.fc-hint[b-g8kqbqnw8v] {
	margin: 4px 0 0;
	font-size: 12px;
	color: #94A3B8;
}

/* ---- Past day report -------------------------------------------------- */
.fc-history-date[b-g8kqbqnw8v] {
	width: 100%;
	margin: 8px 0;
	padding: 6px 9px;
	border: 1px solid #E2E8F0;
	border-radius: 8px;
	font-size: 13px;
	color: #1E293B;
	background: #FFFFFF;
}
.fc-history-date:focus[b-g8kqbqnw8v] {
	outline: none;
	border-color: #363AF5;
}
.fc-history-source[b-g8kqbqnw8v] {
	margin: 8px 0 0;
	font-size: 11px;
	color: #94A3B8;
	/* The provider line can run long; wrapping it beats widening the panel. */
	overflow-wrap: anywhere;
}

/* ---- Conditions ------------------------------------------------------ */
.fc-conditions[b-g8kqbqnw8v] {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 10px;
}
.fc-cell[b-g8kqbqnw8v] {
	background: #F8FAFC;
	border: 1px solid #EEF2F6;
	border-radius: 10px;
	padding: 7px 9px;
}
.fc-cell-label[b-g8kqbqnw8v] {
	font-size: 10px;
	font-weight: 700;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: #94A3B8;
	margin-bottom: 4px;
}
.fc-cell-value[b-g8kqbqnw8v] {
	font-size: 15px;
	font-weight: 700;
	color: #1E293B;
}
.fc-cell-value.danger[b-g8kqbqnw8v] { color: #B82213; }

.fc-badge[b-g8kqbqnw8v] {
	font-size: 10px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .06em;
	color: #9D6600;
	background: #FFF7E6;
	border: 1px solid #FFE3A3;
	border-radius: 6px;
	padding: 2px 8px;
}

/* ---- Crossing -------------------------------------------------------- */
.fc-crossing[b-g8kqbqnw8v] {
	background: #FEF2F2;
	border: 1px solid #FECACA;
	border-radius: 10px;
	padding: 12px;
}
.fc-crossing-main[b-g8kqbqnw8v] {
	font-size: 13px;
	font-weight: 700;
	color: #B82213;
}
.fc-crossing-sub[b-g8kqbqnw8v] {
	font-size: 12px;
	color: #5F6E85;
	margin-top: 3px;
}

/* ---- Footer ---------------------------------------------------------- */
.fc-footer[b-g8kqbqnw8v] {
	text-align: center;
	font-size: 12px;
	color: #94A3B8;
	padding: 4px 0 8px;
}

/* ---- Responsive ------------------------------------------------------ */
@media (max-width: 1100px) {
	.main-content[b-g8kqbqnw8v] {
		height: auto;
		min-height: 100vh;
		overflow: visible;
	}
	.fc-layout[b-g8kqbqnw8v] {
		flex-direction: column;
		flex: 0 0 auto;
	}
	.fc-panel[b-g8kqbqnw8v] {
		width: 100%;
		max-width: none;
	}
	.fc-map-wrap[b-g8kqbqnw8v] { min-height: 420px; }
	.fc-map[b-g8kqbqnw8v]      { min-height: 420px; }
}

/* ---- Weather trackers ---------------------------------------------------- */

.fc-tracker-add[b-g8kqbqnw8v] {
	border: none;
	background: transparent;
	padding: 0;
	font-size: 12px;
	font-weight: 600;
	color: #5263FF;
	cursor: pointer;
}

.fc-tracker-list[b-g8kqbqnw8v] {
	display: flex;
	flex-direction: column;
	gap: 8px;
	margin-top: 10px;
}

.fc-tracker[b-g8kqbqnw8v] {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 8px;
	padding: 10px 12px;
	border: 1px solid #E8EDF5;
	border-radius: 10px;
	background: #FFFFFF;
}

/* An inactive tracker is still listed, because it is still a point somebody chose to watch.
   Muting it is what keeps a silent row from reading as a broken one. */
.fc-tracker.muted[b-g8kqbqnw8v] {
	opacity: .6;
}

.fc-tracker-main[b-g8kqbqnw8v] {
	display: flex;
	flex-direction: column;
	gap: 2px;
	min-width: 0;
}

.fc-tracker-name[b-g8kqbqnw8v] {
	display: flex;
	align-items: center;
	gap: 6px;
	font-size: 13px;
	font-weight: 600;
	color: #0F172A;
	overflow-wrap: anywhere;
}

.fc-tracker-inactive[b-g8kqbqnw8v] {
	padding: 1px 6px;
	border-radius: 999px;
	background: #F1F5F9;
	font-size: 10px;
	font-weight: 600;
	color: #64748B;
	text-transform: uppercase;
}

.fc-tracker-point[b-g8kqbqnw8v] {
	font-size: 11px;
	color: #94A3B8;
}

.fc-tracker .fc-status-label[b-g8kqbqnw8v] {
	display: flex;
	align-items: center;
	gap: 6px;
	margin-top: 4px;
}

.fc-tracker-reason[b-g8kqbqnw8v] {
	font-size: 12px;
	color: #5F6E85;
}

.fc-tracker-actions[b-g8kqbqnw8v] {
	display: flex;
	align-items: center;
	gap: 4px;
	flex-shrink: 0;
}

.fc-tracker-icon[b-g8kqbqnw8v] {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 28px;
	height: 28px;
	padding: 0;
	border: none;
	border-radius: 6px;
	background: transparent;
	cursor: pointer;
}

.fc-tracker-icon:hover[b-g8kqbqnw8v] {
	background: #F1F5F9;
}

.fc-tracker-icon img[b-g8kqbqnw8v] {
	width: 16px;
	height: 16px;
}
/* /Pages/Index.razor.rz.scp.css */
:root[b-lnm2c3xtlv] {
  --primary: #5865f2;
  --bg-light: #f8fafc;
  --text-dark: #1e293b;
}

body[b-lnm2c3xtlv] {
  background-color: var(--bg-light);
  color: var(--text-dark);
  font-family:
    "Inter",
    system-ui,
    -apple-system,
    sans-serif;
}

/* The only thing behind the login dialog. */
.auth-backdrop[b-lnm2c3xtlv] {
  position: fixed;
  inset: 0;
  background:
    radial-gradient(circle at top right, rgba(88, 101, 242, 0.05), transparent),
    radial-gradient(
      circle at bottom left,
      rgba(88, 101, 242, 0.02),
      transparent
    ),
    var(--bg-light);
}
/* /Pages/Invoices/Components/InvoiceExportModal.razor.rz.scp.css */
.invoice-export-csv-modal[b-pcwujusxdt] {
    z-index: 1060;
}

.invoice-export-csv-modal .modal-dialog[b-pcwujusxdt] {
    max-width: 920px;
    width: calc(100% - 32px);
}

.invoice-export-modal[b-pcwujusxdt] {
    background: #ffffff;
    border: 1px solid rgba(30, 41, 59, .03);
    border-radius: 20px;
    box-shadow: 0 1px 1px -.5px rgba(30, 41, 59, .03), 0 3px 3px -1.5px rgba(30, 41, 59, .03), 0 20px 20px -12px rgba(30, 41, 59, .03), 0 32px 32px -16px rgba(30, 41, 59, .03);
    height: 600px;
    overflow: hidden;
}

.invoice-export-header[b-pcwujusxdt] {
    align-items: flex-end;
    border-bottom: 1px solid rgba(30, 41, 59, .09);
    display: flex;
    height: 80px;
    justify-content: space-between;
    padding: 16px 20px;
    position: relative;
}

.invoice-export-header h5[b-pcwujusxdt] {
    color: #1e293b;
    font-size: 18px;
    font-weight: 700;
    letter-spacing: -.2px;
    line-height: 24px;
    margin: 0;
}

.invoice-export-header p[b-pcwujusxdt] {
    color: #5F6E85;
    font-size: 13px;
    font-weight: 500;
    letter-spacing: -.2px;
    line-height: 20px;
    margin: 4px 0 0;
}

.invoice-export-close[b-pcwujusxdt] {
    align-items: center;
    background: rgba(241, 245, 249, .8);
    border: 1px solid rgba(30, 41, 59, .06);
    border-radius: 8px;
    display: flex;
    height: 32px;
    justify-content: center;
    padding: 0;
    position: absolute;
    right: 12px;
    top: 12px;
    width: 32px;
}

.invoice-export-close img[b-pcwujusxdt] {
    height: 18px;
    width: 18px;
}

.invoice-export-body[b-pcwujusxdt] {
    display: grid;
    grid-template-columns: 420px minmax(0, 1fr);
    height: 520px;
}

.invoice-export-panel[b-pcwujusxdt] {
    min-height: 0;
    min-width: 0;
}

.invoice-export-generate[b-pcwujusxdt] {
    border-right: 1px solid rgba(30, 41, 59, .09);
    display: grid;
    grid-template-rows: 48px minmax(0, 1fr) auto;
}

/* Heading, fields, button: the fields take what is left and scroll, so a template with more
   inputs than fits never pushes the generate button out of the dialog. */
.invoice-export-fields[b-pcwujusxdt] {
    min-height: 0;
    overflow-y: auto;
    padding: 16px 20px 0;
}

.invoice-export-panel h6[b-pcwujusxdt] {
    align-items: center;
    border-bottom: 1px solid rgba(30, 41, 59, .09);
    color: #1e293b;
    display: flex;
    font-size: 15px;
    font-weight: 700;
    letter-spacing: -.2px;
    line-height: 24px;
    margin: 0;
    padding: 12px 20px;
}

.invoice-export-toggle[b-pcwujusxdt] {
    margin-left: 20px;
    margin-right: 20px;
}

.invoice-export-field[b-pcwujusxdt] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    margin-bottom: 12px;
    position: relative;
}

.invoice-export-field label[b-pcwujusxdt] {
    color: #475569;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: -.2px;
    line-height: 20px;
    padding: 0 2px;
}

.invoice-export-field label span[b-pcwujusxdt] {
    color: #ef4444;
}

.invoice-export-input[b-pcwujusxdt] {
    background: #ffffff;
    border: 1px solid rgba(30, 41, 59, .12);
    border-radius: 10px;
    box-shadow: 0 1px 1px -.5px rgba(30, 41, 59, .03), 0 3px 3px -1.5px rgba(30, 41, 59, .03);
    color: #1e293b;
    font-size: 13px;
    font-weight: 600;
    height: 40px;
    line-height: 24px;
    padding: 8px 10px;
    width: 100%;
}

.invoice-export-tag-input[b-pcwujusxdt] {
    align-items: center;
    display: flex;
    justify-content: space-between;
    text-align: left;
}

.invoice-export-tags[b-pcwujusxdt] {
    align-items: center;
    display: flex;
    flex: 1;
    gap: 4px;
    min-width: 0;
    overflow: hidden;
}

.invoice-export-chip[b-pcwujusxdt],
.invoice-export-more[b-pcwujusxdt],
.invoice-export-history-tags span[b-pcwujusxdt] {
    align-items: center;
    background: rgba(82, 99, 255, .12);
    border-radius: 8px;
    color: #363af5;
    display: inline-flex;
    font-size: 12px;
    font-weight: 600;
    gap: 2px;
    height: 24px;
    letter-spacing: -.2px;
    line-height: 16px;
    max-width: 150px;
    padding: 4px 6px;
}

.invoice-export-chip button[b-pcwujusxdt] {
    align-items: center;
    background: transparent;
    border: 0;
    display: flex;
    height: 14px;
    justify-content: center;
    padding: 0;
    width: 14px;
}

.invoice-export-chip img[b-pcwujusxdt] {
    height: 14px;
    width: 14px;
}

.invoice-export-tag-input > img[b-pcwujusxdt] {
    flex: 0 0 16px;
    height: 16px;
    width: 16px;
}

.invoice-export-picker[b-pcwujusxdt] {
    background: #ffffff;
    border: 1px solid rgba(30, 41, 59, .09);
    border-radius: 12px;
    box-shadow: 0 20px 30px -20px rgba(15, 23, 42, .25);
    display: flex;
    flex-direction: column;
    left: 0;
    max-height: 176px;
    overflow-y: auto;
    padding: 6px;
    position: absolute;
    right: 0;
    top: 68px;
    z-index: 4;
}

.invoice-export-picker label[b-pcwujusxdt] {
    align-items: center;
    border-radius: 8px;
    display: flex;
    gap: 8px;
    min-height: 32px;
    padding: 6px 8px;
}

.invoice-export-picker label:hover[b-pcwujusxdt] {
    background: #f8fafc;
}

.invoice-export-toggle[b-pcwujusxdt] {
    align-items: center;
    color: #1e293b;
    display: flex;
    font-size: 13px;
    font-weight: 600;
    gap: 10px;
    line-height: 20px;
    margin-bottom: 18px;
}

.invoice-export-generate-btn[b-pcwujusxdt] {
    align-self: end;
    background: #5263ff;
    border: 0;
    border-radius: 10px;
    color: #ffffff;
    font-size: 13px;
    font-weight: 700;
    height: 40px;
    margin: 12px 20px 20px;
}

.invoice-export-generate-btn:disabled[b-pcwujusxdt] {
    background: #94a3b8;
    cursor: not-allowed;
}

.invoice-export-history[b-pcwujusxdt] {
    background: #f8fafc;
    display: flex;
    flex-direction: column;
}

.invoice-export-history-list[b-pcwujusxdt] {
    display: flex;
    min-height: 0;
    flex-direction: column;
    gap: 12px;
    overflow-y: auto;
    padding: 14px 20px 20px;
}

.invoice-export-history-card[b-pcwujusxdt] {
    background: #ffffff;
    border: 1px solid rgba(30, 41, 59, .06);
    border-radius: 16px;
    box-shadow: 0 1px 1px -.5px rgba(30, 41, 59, .03);
    overflow: hidden;
}

.invoice-export-history-top[b-pcwujusxdt] {
    align-items: center;
    display: flex;
    gap: 8px;
    min-height: 48px;
    padding: 8px 12px;
}

.invoice-export-history-top strong[b-pcwujusxdt] {
    color: #1e293b;
    flex: 1;
    font-size: 13px;
    font-weight: 800;
    letter-spacing: -.2px;
    line-height: 24px;
}

.invoice-export-generating[b-pcwujusxdt] {
    align-items: center;
    color: #363af5;
    display: flex;
    font-size: 13px;
    font-weight: 600;
    gap: 6px;
}

.invoice-export-generating span[b-pcwujusxdt] {
    border: 1.5px solid rgba(82, 99, 255, .3);
    border-radius: 50%;
    border-top-color: #363af5;
    height: 16px;
    width: 16px;
}

.invoice-export-note[b-pcwujusxdt] {
    align-items: center;
    border-top: 1px solid rgba(30, 41, 59, .06);
    color: #475569;
    display: flex;
    font-size: 12px;
    font-weight: 500;
    gap: 8px;
    line-height: 16px;
    margin: 0;
    padding: 8px 12px;
}

.invoice-export-note img[b-pcwujusxdt],
.invoice-export-history-line img[b-pcwujusxdt] {
    height: 16px;
    width: 16px;
}

.invoice-export-download[b-pcwujusxdt] {
    align-items: center;
    background: rgba(82, 99, 255, .12);
    border: 0;
    border-radius: 8px;
    display: flex;
    height: 32px;
    justify-content: center;
    padding: 0;
    width: 32px;
}

.invoice-export-download img[b-pcwujusxdt] {
    height: 18px;
    width: 18px;
}

.invoice-export-history-line[b-pcwujusxdt] {
    align-items: center;
    border-top: 1px solid rgba(30, 41, 59, .06);
    color: #475569;
    display: flex;
    font-size: 13px;
    font-weight: 500;
    gap: 8px;
    height: 32px;
    padding: 6px 12px;
}

.invoice-export-history-tags[b-pcwujusxdt] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding: 12px;
}

.invoice-export-history-tags span[b-pcwujusxdt] {
    background: rgba(241, 245, 249, .8);
    border: 1px solid rgba(30, 41, 59, .03);
    color: #1e293b;
}

.invoice-export-backdrop[b-pcwujusxdt] {
    z-index: 1055;
}

@media (max-width: 900px) {
    .invoice-export-modal[b-pcwujusxdt] {
        height: min(720px, calc(100vh - 32px));
    }

    .invoice-export-body[b-pcwujusxdt] {
        grid-template-columns: 1fr;
        height: calc(100% - 80px);
        overflow-y: auto;
    }

    .invoice-export-generate[b-pcwujusxdt] {
        border-right: 0;
    }

    .invoice-export-history[b-pcwujusxdt] {
        min-height: 320px;
    }
}

/* The two files this export can be produced as, picked the way the Reports export page picks
   them: a pair of chips rather than a dropdown, because there are two of them and both fit. */
.invoice-export-formats[b-pcwujusxdt] {
    padding: 2px 0;
}

.invoice-export-format[b-pcwujusxdt] {
    background: #ffffff;
    border: 1px solid rgba(30, 41, 59, .12);
    border-radius: 999px;
    color: #475569;
    font-size: 13px;
    font-weight: 600;
    line-height: 20px;
    padding: 6px 14px;
}

.invoice-export-format.selected[b-pcwujusxdt] {
    background: #eef1ff;
    border-color: #5263ff;
    color: #5263ff;
}

.invoice-export-format:disabled[b-pcwujusxdt] {
    opacity: .6;
}

/* A run that failed says so on its own row. Red, because a history that reported a failure in
   the same grey as everything else is how a missing file goes unnoticed for a week. */
.invoice-export-error[b-pcwujusxdt] {
    color: #ef4444;
    font-size: 12px;
    font-weight: 500;
    line-height: 18px;
    margin: 4px 0 0;
    padding: 0 2px;
}
/* /Pages/Invoices/CustomerInvoices/Components/CustomerInvoiceCreateModal.razor.rz.scp.css */
.invoice-create-picker-shell .modal-dialog[b-66b9kdrnnj] {
    max-width: 600px;
}

.invoice-create-modal[b-66b9kdrnnj] {
    border: 0;
    border-radius: 12px;
    box-shadow: 0 24px 60px rgba(15, 23, 42, .2);
    overflow: hidden;
}

.invoice-create-modal .modal-header[b-66b9kdrnnj] {
    align-items: flex-start;
    border-bottom: 1px solid #eaecf0;
    padding: 22px 24px 18px;
}

.invoice-create-modal .modal-header h5[b-66b9kdrnnj] {
    color: #101828;
    font-size: 22px;
    font-weight: 800;
    line-height: 28px;
    margin: 0;
}

.invoice-create-modal .modal-header p[b-66b9kdrnnj] {
    color: #475467;
    font-size: 14px;
    line-height: 20px;
    margin: 6px 0 0;
}

.invoice-create-subhelp[b-66b9kdrnnj] {
    margin-top: 2px !important;
}

.invoice-create-modal .btn-close[b-66b9kdrnnj] {
    background-color: #f8fafc;
    border-radius: 8px;
    box-shadow: none;
    margin: 0;
    opacity: 1;
    padding: 10px;
}

.invoice-create-modal .modal-body[b-66b9kdrnnj] {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 20px 24px;
}

.invoice-create-modal .modal-footer[b-66b9kdrnnj] {
    border-top: 1px solid #eaecf0;
    display: grid;
    gap: 14px;
    grid-template-columns: 1fr 1.3fr;
    padding: 18px 24px;
}

.invoice-create-modal .modal-footer .btn[b-66b9kdrnnj] {
    border-radius: 10px;
    font-size: 15px;
    font-weight: 700;
    height: 48px;
    margin: 0;
}

.invoice-create-modal .cancel-btn[b-66b9kdrnnj] {
    background: #f8fafc;
    border: 1px solid #dbe3ef;
    color: #344054;
}

.invoice-create-modal .apply-btn[b-66b9kdrnnj] {
    background: #5263ff;
    border: 1px solid #5263ff;
    color: #ffffff;
}

.invoice-create-modal .apply-btn.disabled[b-66b9kdrnnj],
.invoice-create-modal .apply-btn:disabled[b-66b9kdrnnj] {
    cursor: not-allowed;
    opacity: .5;
}

.invoice-customer-search[b-66b9kdrnnj] {
    align-items: center;
    background: #ffffff;
    border: 1px solid #dbe3ef;
    border-radius: 10px;
    display: flex;
    gap: 8px;
    min-height: 44px;
    padding: 0 14px;
}

.invoice-customer-search img[b-66b9kdrnnj] {
    height: 16px;
    width: 16px;
}

.invoice-customer-search input[b-66b9kdrnnj] {
    border: 0;
    color: #1e293b;
    flex: 1;
    font-size: 13px;
    min-width: 0;
    outline: 0;
}

.invoice-create-customer-list[b-66b9kdrnnj] {
    display: flex;
    flex-direction: column;
    gap: 10px;
    max-height: 312px;
    overflow-y: auto;
    padding-right: 2px;
}

.invoice-create-customer-card[b-66b9kdrnnj] {
    align-items: center;
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    color: #1e293b;
    display: flex;
    gap: 10px;
    justify-content: space-between;
    min-height: 78px;
    padding: 14px 20px;
    position: relative;
    text-align: left;
    transition: border-color .15s ease, box-shadow .15s ease;
    width: 100%;
}

.invoice-create-customer-card:hover[b-66b9kdrnnj],
.invoice-create-customer-card.selected[b-66b9kdrnnj] {
    border-color: #5263ff;
    box-shadow: 0 0 0 3px rgba(82, 99, 255, .18);
}

.invoice-create-customer-card.selected[b-66b9kdrnnj]::after {
    background: #5263ff;
    background-image: url("/img/icons/check-white.svg");
    background-position: center;
    background-repeat: no-repeat;
    background-size: 11px 11px;
    border: 2px solid #ffffff;
    border-radius: 999px;
    content: "";
    height: 22px;
    position: absolute;
    right: 10px;
    top: 10px;
    width: 22px;
}

.invoice-create-customer-main[b-66b9kdrnnj] {
    display: flex;
    flex: 1;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
}

.invoice-create-customer-main strong[b-66b9kdrnnj] {
    color: #1e293b;
    font-size: 14px;
    font-weight: 800;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.invoice-create-customer-main small[b-66b9kdrnnj] {
    color: #5F6E85;
    font-size: 12px;
}

.invoice-create-customer-meta[b-66b9kdrnnj] {
    align-items: center;
    display: flex;
    flex-direction: row;
    flex-shrink: 0;
    gap: 8px;
}

.invoice-create-customer-meta span[b-66b9kdrnnj] {
    align-items: center;
    border-radius: 8px;
    display: inline-flex;
    font-size: 12px;
    font-weight: 600;
    gap: 5px;
    min-height: 26px;
    padding: 4px 10px;
}

.invoice-create-customer-nr[b-66b9kdrnnj] {
    background: #f2f4f7;
    color: #475467;
}

.invoice-create-customer-count[b-66b9kdrnnj] {
    background: #eef0ff;
    color: #5263ff;
}

.invoice-create-customer-meta img[b-66b9kdrnnj] {
    height: 14px;
    width: 14px;
}

.invoice-create-empty[b-66b9kdrnnj] {
    height: 120px;
}

.invoice-empty[b-66b9kdrnnj] {
    align-items: center;
    color: #5F6E85;
    display: flex;
    height: 300px;
    justify-content: center;
}
/* /Pages/Invoices/CustomerInvoices/Components/CustomerInvoiceDriftModal.razor.rz.scp.css */
.invoice-create-modal[b-8hz5ril9bj] {
    border: 0;
    border-radius: 12px;
    box-shadow: 0 24px 60px rgba(15, 23, 42, .2);
    overflow: hidden;
}

.invoice-drift-dialog[b-8hz5ril9bj] {
    max-width: 1080px;
}

.invoice-create-modal .modal-header[b-8hz5ril9bj] {
    align-items: flex-start;
    border-bottom: 1px solid #eaecf0;
    justify-content: space-between;
    padding: 22px 24px 18px;
}

.invoice-create-modal .modal-header h5[b-8hz5ril9bj] {
    color: #101828;
    font-size: 22px;
    font-weight: 800;
    line-height: 28px;
    margin: 0;
}

.invoice-create-modal .modal-header p[b-8hz5ril9bj] {
    color: #475467;
    font-size: 14px;
    line-height: 20px;
    margin: 6px 0 0;
}

.invoice-create-modal .btn-close[b-8hz5ril9bj] {
    align-self: flex-start;
    background-color: #f8fafc;
    border-radius: 8px;
    box-shadow: none;
    margin: 0 0 0 auto;
    opacity: 1;
    padding: 10px;
}

.invoice-create-modal .modal-body[b-8hz5ril9bj] {
    display: flex;
    flex-direction: column;
    gap: 14px;
    max-height: 62vh;
    overflow-y: auto;
    padding: 20px 24px;
}

.invoice-create-modal .modal-footer[b-8hz5ril9bj] {
    border-top: 1px solid #eaecf0;
    display: flex;
    justify-content: flex-end;
    padding: 18px 24px;
}

.invoice-create-modal .modal-footer .btn[b-8hz5ril9bj] {
    border-radius: 10px;
    font-size: 15px;
    font-weight: 700;
    height: 44px;
    margin: 0;
    min-width: 120px;
}

.invoice-create-modal .cancel-btn[b-8hz5ril9bj] {
    background: #f8fafc;
    border: 1px solid #dbe3ef;
    color: #344054;
}

.invoice-drift-empty[b-8hz5ril9bj] {
    color: #5F6E85;
    font-size: 14px;
    padding: 24px 0;
    text-align: center;
}

.invoice-drift-table[b-8hz5ril9bj] {
    border-collapse: collapse;
    font-size: 13px;
}

.invoice-drift-table th[b-8hz5ril9bj],
.invoice-drift-table td[b-8hz5ril9bj] {
    border-bottom: 1px solid #f1f5f9;
    padding: 6px 8px;
    text-align: left;
    vertical-align: top;
}

.invoice-drift-table thead th[b-8hz5ril9bj] {
    color: #5F6E85;
    font-size: 12px;
    font-weight: 600;
}

.invoice-drift-table tbody td[b-8hz5ril9bj] {
    color: #1e293b;
}

.invoice-drift-table td.invoice-drift-diff[b-8hz5ril9bj] {
    background: #fef3c7;
    color: #92400e;
    font-weight: 600;
}

.invoice-drift-table-wrap[b-8hz5ril9bj] {
    overflow-x: auto;
}

.invoice-drift-primary[b-8hz5ril9bj] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.invoice-drift-primary span[b-8hz5ril9bj] {
    color: #5F6E85;
    font-size: 12px;
}

.invoice-drift-side[b-8hz5ril9bj] {
    align-items: center;
    display: flex;
    gap: 10px;
    white-space: nowrap;
}

.invoice-drift-state-active[b-8hz5ril9bj] {
    color: #16a34a;
    font-weight: 600;
}

.invoice-drift-state-archived[b-8hz5ril9bj] {
    color: #5F6E85;
}

.invoice-drift-diff-text[b-8hz5ril9bj] {
    color: #92400e;
    font-weight: 600;
}

/* Missing counterpart: the work was billed on one invoice only. */
.invoice-drift-missing[b-8hz5ril9bj] {
    color: #ef4444;
    font-weight: 600;
}

.invoice-drift-unpaired td[b-8hz5ril9bj] {
    background: #fef2f2;
}

.invoice-drift-action[b-8hz5ril9bj] {
    background: #f8fafc;
    border: 1px solid #dbe3ef;
    border-radius: 8px;
    color: #344054;
    font-size: 12px;
    font-weight: 600;
    height: 26px;
    padding: 0 10px;
}

.invoice-drift-action:disabled[b-8hz5ril9bj] {
    opacity: .6;
}

/* Opens from inside the settlement view (z-index 1055) — must stack above it,
   backdrop included, or the background doesn't darken. */
.invoice-drift-modal[b-8hz5ril9bj] {
    z-index: 1060;
}

.invoice-drift-modal + .modal-backdrop[b-8hz5ril9bj] {
    z-index: 1058;
}


/* A pair aligned via the toggles: greyed in place, gone on the next reload. */
.invoice-drift-table tr.invoice-drift-resolved td[b-8hz5ril9bj] {
    color: #94a3b8;
}

.invoice-drift-table tr.invoice-drift-resolved td.invoice-drift-diff[b-8hz5ril9bj] {
    background: #f8fafc;
    color: #94a3b8;
    font-weight: 400;
}

.invoice-drift-resolved .invoice-drift-state-active[b-8hz5ril9bj],
.invoice-drift-resolved .invoice-drift-state-archived[b-8hz5ril9bj],
.invoice-drift-resolved .invoice-drift-diff-text[b-8hz5ril9bj] {
    color: #94a3b8;
    font-weight: 400;
}
/* /Pages/Invoices/CustomerInvoices/Components/CustomerInvoiceFilterPopup.razor.rz.scp.css */
.invoice-filter-popup .modal-dialog[b-3k7z1z906q] {
    max-width: 360px;
}

.invoice-filter-modal[b-3k7z1z906q] {
    border: 1px solid rgba(30, 41, 59, 0.09);
    border-radius: 20px;
    box-shadow: 0 1px 1px -0.5px rgba(30, 41, 59, 0.03),
        0 3px 3px -1.5px rgba(30, 41, 59, 0.03),
        0 20px 20px -12px rgba(30, 41, 59, 0.03),
        0 32px 32px -16px rgba(30, 41, 59, 0.03);
    min-height: 308px;
}

.invoice-filter-popup .invoice-filter-modal[b-3k7z1z906q] {
    background: #ffffff;
    overflow: hidden;
}

.invoice-filter-popup .modal-header[b-3k7z1z906q] {
    align-items: flex-end;
    border-bottom: 1px solid rgba(30, 41, 59, 0.09);
    min-height: 40px;
    padding: 8px 16px;
}

.invoice-filter-popup .modal-title[b-3k7z1z906q] {
    color: #1e293b;
    font-size: 15px;
    font-weight: 700;
    letter-spacing: -0.2px;
    line-height: 24px;
    margin: 0;
}

.invoice-filter-popup .modal-body[b-3k7z1z906q] {
    display: flex;
    flex-direction: column;
    gap: 16px;
    min-height: 212px;
    overflow-y: auto;
    padding: 16px;
}

.invoice-filter-popup label[b-3k7z1z906q] {
    color: #475569;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: -0.2px;
    line-height: 16px;
    margin: 0 0 4px;
    padding: 0 2px;
}

.invoice-filter-field[b-3k7z1z906q] {
    display: flex;
    flex-direction: column;
}

.invoice-filter-select[b-3k7z1z906q],
.invoice-filter-clear[b-3k7z1z906q],
.invoice-filter-date-display[b-3k7z1z906q] {
    background: #ffffff;
    border: 1px solid rgba(30, 41, 59, 0.12);
    border-radius: 8px;
    box-shadow: 0 1px 1px -0.5px rgba(30, 41, 59, 0.03),
        0 3px 3px -1.5px rgba(30, 41, 59, 0.03);
    color: #1e293b;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: -0.2px;
    line-height: 16px;
    min-height: 32px;
}

.invoice-filter-customer-field[b-3k7z1z906q],
.invoice-filter-date-display[b-3k7z1z906q] {
    align-items: center;
    display: flex;
    gap: 4px;
    padding: 8px;
}

.invoice-filter-customer-field input[b-3k7z1z906q] {
    border: 0;
    color: #1e293b;
    flex: 1;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: -0.2px;
    line-height: 16px;
    min-width: 0;
    outline: 0;
}

.invoice-filter-customer-field img:first-child[b-3k7z1z906q] {
    height: 18px;
    width: 18px;
}

.invoice-filter-customer-field img:last-child[b-3k7z1z906q] {
    height: 14px;
    width: 14px;
}

.invoice-filter-season-row[b-3k7z1z906q] {
    display: grid;
    gap: 8px;
    grid-template-columns: 1fr 55px;
}

.invoice-filter-date-row[b-3k7z1z906q] {
    display: grid;
    grid-template-columns: 117px 211px;
}

.invoice-filter-select[b-3k7z1z906q] {
    appearance: none;
    background-image: url("img/icons/dark-down-arrow.svg");
    background-position: right 8px center;
    background-repeat: no-repeat;
    background-size: 16px;
    padding: 8px 28px 8px 8px;
}

.invoice-filter-date-row .invoice-filter-select[b-3k7z1z906q] {
    border-radius: 10px 0 0 10px;
    min-height: 40px;
}

.invoice-filter-clear[b-3k7z1z906q] {
    background: rgba(241, 245, 249, 0.8);
    border-color: rgba(30, 41, 59, 0.06);
    box-shadow: none;
    color: #1e293b;
    padding: 4px 8px;
}

.invoice-filter-date-display[b-3k7z1z906q] {
    position: relative;
}

.invoice-filter-date-row .invoice-filter-date-display[b-3k7z1z906q] {
    border-left: 0;
    border-radius: 0 10px 10px 0;
    min-height: 40px;
    padding: 8px 10px;
}

.invoice-filter-calendar[b-3k7z1z906q] {
    background: url("img/icons/Calender.svg") center / contain no-repeat;
    display: inline-block;
    flex-shrink: 0;
    height: 18px;
    width: 18px;
}

.invoice-filter-date-display span:not(.invoice-filter-calendar)[b-3k7z1z906q] {
    font-size: 13px;
    font-weight: 600;
    letter-spacing: -0.2px;
    line-height: 24px;
    white-space: nowrap;
}

.invoice-filter-date-display input[b-3k7z1z906q] {
    bottom: 0;
    cursor: pointer;
    opacity: 0;
    position: absolute;
    top: 0;
    width: 50%;
}

.invoice-filter-date-display input:first-of-type[b-3k7z1z906q] {
    left: 0;
}

.invoice-filter-date-display input:last-of-type[b-3k7z1z906q] {
    right: 0;
}

.invoice-filter-popup .modal-footer[b-3k7z1z906q] {
    align-items: center;
    border-top: 1px solid rgba(30, 41, 59, 0.09);
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    min-height: 56px;
    padding: 12px 16px;
}

.invoice-filter-popup .modal-footer .btn[b-3k7z1z906q] {
    border-radius: 8px;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: -0.2px;
    line-height: 16px;
    min-height: 32px;
    padding: 4px 8px;
}

.invoice-filter-popup .reset-btn[b-3k7z1z906q] {
    background: transparent;
    border: 0;
    color: #475467;
    margin-right: auto;
    padding-left: 0;
}

.invoice-filter-popup .cancel-btn[b-3k7z1z906q] {
    background: rgba(241, 245, 249, 0.8);
    border: 1px solid rgba(30, 41, 59, 0.06);
    color: #1e293b;
    min-width: 64px;
}

.invoice-filter-popup .apply-btn[b-3k7z1z906q] {
    background: #5263ff;
    border: 1px solid #5263ff;
    box-shadow: 0 1px 1px -0.5px rgba(30, 41, 59, 0.03), inset 0 3px 3px rgba(255, 255, 255, 0.12);
    color: #ffffff;
    min-width: 91px;
}
/* /Pages/Invoices/CustomerInvoices/Components/CustomerInvoiceHistoryDrawer.razor.rz.scp.css */
/* Same popup shell as the reconciliation modal (invoice-create-modal look). Opens from
   inside the full-screen invoice preview (z-index 1055), so both the popup and its
   backdrop must stack above it for the background to darken. */
.invoice-history-modal[b-497v79m4cg] {
    z-index: 1060;
}

.invoice-history-backdrop[b-497v79m4cg] {
    z-index: 1059;
}

.invoice-history-dialog[b-497v79m4cg] {
    max-width: 560px;
}

.invoice-history-modal .modal-content[b-497v79m4cg] {
    border: 0;
    border-radius: 12px;
    box-shadow: 0 24px 60px rgba(15, 23, 42, .2);
    overflow: hidden;
}

.invoice-history-modal .modal-header[b-497v79m4cg] {
    align-items: flex-start;
    justify-content: space-between;
    padding: 22px 24px 12px;
}

.invoice-history-modal .modal-header h5[b-497v79m4cg] {
    color: #101828;
    font-size: 22px;
    font-weight: 800;
    line-height: 28px;
    margin: 0;
}

.invoice-history-modal .modal-header p[b-497v79m4cg] {
    color: #475467;
    font-size: 14px;
    line-height: 20px;
    margin: 6px 0 0;
}

.invoice-history-modal .btn-close[b-497v79m4cg] {
    align-self: flex-start;
    background-color: #f8fafc;
    border-radius: 8px;
    box-shadow: none;
    margin: 0 0 0 auto;
    opacity: 1;
    padding: 10px;
}

.invoice-history-modal .modal-body[b-497v79m4cg] {
    max-height: 62vh;
    overflow-y: auto;
    padding: 4px 24px 20px;
}

.invoice-empty[b-497v79m4cg] {
    align-items: center;
    color: #5F6E85;
    display: flex;
    height: 300px;
    justify-content: center;
}

.invoice-overview-card[b-497v79m4cg] {
    border-bottom: 1px solid #e2e8f0;
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 12px 0;
}

.invoice-overview-card:last-child[b-497v79m4cg] {
    border-bottom: 0;
}

.invoice-overview-card strong[b-497v79m4cg] {
    color: #1e293b;
}

.invoice-overview-card span[b-497v79m4cg] {
    color: #5F6E85;
    font-size: 13px;
}

.invoice-history-change[b-497v79m4cg] {
    color: #334155;
}

.invoice-history-old[b-497v79m4cg] {
    color: #94a3b8;
    text-decoration: line-through;
}

.invoice-history-arrow[b-497v79m4cg] {
    color: #94a3b8;
}

.invoice-history-new[b-497v79m4cg] {
    color: #1e293b;
    font-weight: 600;
}

.invoice-history-line[b-497v79m4cg] {
    color: #475569;
    font-style: italic;
}
/* /Pages/Invoices/CustomerInvoices/Components/CustomerInvoiceNoteModal.razor.rz.scp.css */
.invoice-create-modal[b-4hbf97zru4] {
    border: 0;
    border-radius: 12px;
    box-shadow: 0 24px 60px rgba(15, 23, 42, .2);
    overflow: hidden;
}

.invoice-create-modal .modal-header[b-4hbf97zru4] {
    align-items: flex-start;
    border-bottom: 1px solid #eaecf0;
    padding: 22px 24px 18px;
}

.invoice-create-modal .modal-header h5[b-4hbf97zru4] {
    color: #101828;
    font-size: 22px;
    font-weight: 800;
    line-height: 28px;
    margin: 0;
}

.invoice-create-modal .modal-header p[b-4hbf97zru4] {
    color: #475467;
    font-size: 14px;
    line-height: 20px;
    margin: 6px 0 0;
}

.invoice-create-modal .btn-close[b-4hbf97zru4] {
    background-color: #f8fafc;
    border-radius: 8px;
    box-shadow: none;
    margin: 0;
    opacity: 1;
    padding: 10px;
}

.invoice-create-modal .modal-body[b-4hbf97zru4] {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 20px 24px;
}

.invoice-create-modal .modal-footer[b-4hbf97zru4] {
    border-top: 1px solid #eaecf0;
    display: grid;
    gap: 14px;
    grid-template-columns: 1fr 1.3fr;
    padding: 18px 24px;
}

.invoice-create-modal .modal-footer .btn[b-4hbf97zru4] {
    border-radius: 10px;
    font-size: 15px;
    font-weight: 700;
    height: 48px;
    margin: 0;
}

.invoice-create-modal .cancel-btn[b-4hbf97zru4] {
    background: #f8fafc;
    border: 1px solid #dbe3ef;
    color: #344054;
}

.invoice-create-modal .apply-btn[b-4hbf97zru4] {
    background: #5263ff;
    border: 1px solid #5263ff;
    color: #ffffff;
}

.invoice-input[b-4hbf97zru4] {
    background: #ffffff;
    border: 1px solid #dbe3ef;
    border-radius: 8px;
    color: #1e293b;
    font-size: 13px;
    min-height: 36px;
    padding: 8px 10px;
    width: 100%;
}

.invoice-note-input[b-4hbf97zru4] {
    min-height: 130px;
    resize: vertical;
}
/* /Pages/Invoices/CustomerInvoices/Components/CustomerInvoiceOverviewDetailsDrawer.razor.rz.scp.css */
.reconciliation-detail-overlay[b-imd04s6s95] {
    inset: 0;
    position: fixed;
    z-index: 1060;
}

.reconciliation-detail-backdrop[b-imd04s6s95] {
    background: rgba(30, 41, 59, .96);
    border: 0;
    inset: 0;
    position: absolute;
}

.reconciliation-detail-panel[b-imd04s6s95] {
    background: #ffffff;
    bottom: 0;
    display: flex;
    flex-direction: column;
    position: absolute;
    right: 0;
    top: 0;
    width: min(740px, 100vw);
}

.reconciliation-detail-header[b-imd04s6s95] {
    align-items: center;
    border-bottom: 1px solid rgba(30, 41, 59, .09);
    display: flex;
    height: 96px;
    justify-content: space-between;
    padding: 24px;
}

.reconciliation-detail-header h5[b-imd04s6s95] {
    color: #1e293b;
    font-size: 18px;
    font-weight: 800;
    line-height: 24px;
    margin: 0;
}

.reconciliation-detail-header p[b-imd04s6s95] {
    color: #475569;
    font-size: 15px;
    font-weight: 700;
    line-height: 24px;
    margin: 0;
}

.reconciliation-detail-close[b-imd04s6s95] {
    align-items: center;
    background: rgba(241, 245, 249, .8);
    border: 1px solid rgba(30, 41, 59, .06);
    border-radius: 10px;
    color: #1e293b;
    display: inline-flex;
    font-size: 26px;
    height: 40px;
    justify-content: center;
    line-height: 1;
    width: 40px;
}

.reconciliation-detail-table-wrap[b-imd04s6s95] {
    background: #f8fafc;
    flex: 1;
    min-height: 0;
    overflow: auto;
}

.reconciliation-detail-table[b-imd04s6s95] {
    border-collapse: separate;
    border-spacing: 0;
    min-width: 740px;
    width: 100%;
}

.reconciliation-detail-table th[b-imd04s6s95] {
    background: #f1f5f9;
    border-bottom: 1px solid rgba(30, 41, 59, .06);
    border-right: 1px solid rgba(30, 41, 59, .06);
    color: #1e293b;
    font-size: 13px;
    font-weight: 800;
    line-height: 20px;
    padding: 12px 16px;
    text-align: left;
    vertical-align: top;
}

.reconciliation-detail-table th:nth-child(3)[b-imd04s6s95],
.reconciliation-detail-table th:nth-child(4)[b-imd04s6s95] {
    width: 100px;
}

.reconciliation-detail-table td[b-imd04s6s95] {
    border-right: 1px solid rgba(30, 41, 59, .06);
    color: #1e293b;
    font-size: 13px;
    font-weight: 700;
    line-height: 20px;
    padding: 8px 16px;
    vertical-align: top;
}

.reconciliation-detail-table tbody tr[b-imd04s6s95] {
    background: #ffffff;
}

.reconciliation-detail-table tbody tr:nth-child(even)[b-imd04s6s95] {
    background: #f8fafc;
}

.reconciliation-detail-table td:first-child[b-imd04s6s95] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.reconciliation-detail-table td:first-child strong[b-imd04s6s95] {
    color: #1e293b;
    font-size: 13px;
    font-weight: 800;
    line-height: 20px;
}

.reconciliation-detail-table td:first-child span[b-imd04s6s95] {
    color: #475569;
    font-size: 12px;
    font-weight: 700;
    line-height: 16px;
}

.reconciliation-detail-empty[b-imd04s6s95] {
    align-items: center;
    color: #5F6E85;
    display: flex;
    min-height: 260px;
    justify-content: center;
}
/* /Pages/Invoices/CustomerInvoices/Components/CustomerInvoiceOverviewModal.razor.rz.scp.css */
.reconciliation-modal[b-2exag78poy] {
    background: #ffffff;
    color: #1e293b;
    display: flex;
    flex-direction: column;
    inset: 0;
    min-height: 100vh;
    position: fixed;
    z-index: 1055;
}

.reconciliation-header[b-2exag78poy] {
    align-items: center;
    border-bottom: 1px solid rgba(30, 41, 59, .09);
    display: flex;
    height: 56px;
    justify-content: space-between;
    padding: 12px 20px;
}

.reconciliation-header h5[b-2exag78poy] {
    color: #1e293b;
    font-size: 18px;
    font-weight: 800;
    line-height: 24px;
    margin: 0;
}

.reconciliation-close[b-2exag78poy] {
    align-items: center;
    background: rgba(241, 245, 249, .8);
    border: 1px solid rgba(30, 41, 59, .06);
    border-radius: 10px;
    color: #1e293b;
    display: inline-flex;
    font-size: 22px;
    height: 32px;
    justify-content: center;
    line-height: 1;
    width: 32px;
}

.reconciliation-filters[b-2exag78poy] {
    align-items: end;
    border-bottom: 1px solid rgba(30, 41, 59, .09);
    display: flex;
    gap: 16px;
    min-height: 76px;
    padding: 12px 20px;
}

.reconciliation-field[b-2exag78poy] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.reconciliation-field label[b-2exag78poy] {
    color: #475569;
    font-size: 12px;
    font-weight: 700;
    line-height: 16px;
    margin: 0;
}

.reconciliation-date-field[b-2exag78poy] {
    width: 194px;
}

[b-2exag78poy] .reconciliation-date-picker {
    height: 32px;
}

[b-2exag78poy] .reconciliation-date-picker .wm-drp-trigger {
    border-color: rgba(30, 41, 59, .12);
    border-radius: 8px;
    box-shadow: 0 1px 1px -.5px rgba(30, 41, 59, .03), 0 3px 3px -1.5px rgba(30, 41, 59, .03);
}

[b-2exag78poy] .reconciliation-date-picker .wm-drp-trigger-range {
    height: 32px;
    padding: 0 8px;
}

[b-2exag78poy] .reconciliation-date-picker .wm-drp-icon {
    height: 16px;
    width: 16px;
}

[b-2exag78poy] .reconciliation-date-picker .wm-drp-trigger-range-text {
    color: #1e293b;
    font-size: 13px;
    font-weight: 700;
}

.reconciliation-contractor-field[b-2exag78poy] {
    width: 194px;
}

.reconciliation-contractor-field select[b-2exag78poy] {
    appearance: none;
    background: #ffffff url("img/icons/dark-down-arrow.svg") no-repeat right 10px center;
    background-size: 12px;
    border: 1px solid rgba(30, 41, 59, .12);
    border-radius: 8px;
    box-shadow: 0 1px 1px -.5px rgba(30, 41, 59, .03), 0 3px 3px -1.5px rgba(30, 41, 59, .03);
    color: #1e293b;
    font-size: 13px;
    font-weight: 700;
    height: 32px;
    line-height: 20px;
    padding: 4px 34px 4px 12px;
}

.reconciliation-show-routes[b-2exag78poy] {
    align-items: center;
    color: #1e293b;
    display: inline-flex;
    font-size: 13px;
    font-weight: 700;
    gap: 8px;
    margin: 0 0 10px auto;
    white-space: nowrap;
}

.reconciliation-show-routes input[b-2exag78poy] {
    accent-color: #5263ff;
    height: 18px;
    width: 18px;
}

.reconciliation-table-wrap[b-2exag78poy] {
    flex: 1;
    min-height: 0;
    overflow: auto;
}

.reconciliation-table[b-2exag78poy] {
    border-collapse: separate;
    border-spacing: 0;
    min-width: 1180px;
    width: 100%;
}

.reconciliation-table th[b-2exag78poy] {
    background: #f1f5f9;
    border-bottom: 1px solid rgba(30, 41, 59, .06);
    border-right: 1px solid rgba(30, 41, 59, .06);
    color: #1e293b;
    font-size: 13px;
    font-weight: 800;
    line-height: 20px;
    padding: 12px 16px;
    text-align: left;
    vertical-align: top;
    white-space: nowrap;
}

.reconciliation-table td[b-2exag78poy] {
    border-right: 1px solid rgba(30, 41, 59, .06);
    color: #1e293b;
    font-size: 13px;
    font-weight: 700;
    line-height: 20px;
    padding: 8px 16px;
    vertical-align: top;
    white-space: pre-line;
}

.reconciliation-table tbody tr[b-2exag78poy] {
    background: #ffffff;
}

.reconciliation-table tbody tr:nth-child(even)[b-2exag78poy] {
    background: #f8fafc;
}

.reconciliation-overview-btn[b-2exag78poy] {
    background: rgba(82, 99, 255, .12);
    border: 0;
    border-radius: 8px;
    color: #363af5;
    font-size: 12px;
    font-weight: 700;
    height: 32px;
    line-height: 16px;
    padding: 4px 12px;
}

.reconciliation-loading[b-2exag78poy],
.reconciliation-empty[b-2exag78poy] {
    align-items: center;
    color: #5F6E85;
    display: flex;
    min-height: 320px;
    justify-content: center;
}

.reconciliation-actions[b-2exag78poy] {
    align-items: center;
    border-top: 1px solid rgba(30, 41, 59, .09);
    display: flex;
    height: 72px;
    justify-content: flex-end;
    padding: 16px 20px;
}

.reconciliation-export-btn[b-2exag78poy] {
    background: #5263ff;
    border: 0;
    border-radius: 10px;
    color: #ffffff;
    font-size: 13px;
    font-weight: 700;
    height: 40px;
    padding: 4px 16px;
}

@media (max-width: 800px) {
    .reconciliation-filters[b-2exag78poy] {
        align-items: stretch;
        flex-direction: column;
    }

    .reconciliation-date-field[b-2exag78poy],
    .reconciliation-contractor-field[b-2exag78poy] {
        width: 100%;
    }

    .reconciliation-show-routes[b-2exag78poy] {
        margin-left: 0;
    }
}
/* The declined marker beside a contractor that denied the work: same red pill the
   dispatch views use for declined routes and stops. */
.contractor-declined-pill[b-2exag78poy] {
    display: inline-flex;
    align-items: center;
    margin-left: 6px;
    padding: 2px 8px;
    border-radius: 999px;
    background: #FCE9EB;
    font-size: 12px;
    font-weight: 500;
    line-height: 16px;
    color: #C0392F;
}
/* /Pages/Invoices/CustomerInvoices/Components/CustomerInvoicePreviewModal.razor.rz.scp.css */
/* ===== Base table / cells / checkbox ===== */
.invoice-table[b-cetzq0218e] {
    border-collapse: collapse;
    width: 100%;
}

.invoice-table thead th[b-cetzq0218e] {
    background: #f8fafc;
    border-bottom: 1px solid #e2e8f0;
    color: #5F6E85;
    font-size: 12px;
    font-weight: 700;
    padding: 12px;
    white-space: nowrap;
}

.invoice-table tbody td[b-cetzq0218e] {
    border-bottom: 1px solid #eef2f7;
    color: #334155;
    font-size: 13px;
    padding: 12px;
    vertical-align: middle;
}

.invoice-table tbody tr[b-cetzq0218e] {
    cursor: pointer;
}

.invoice-table tbody tr:hover[b-cetzq0218e] {
    background: #f8faff;
}

.invoice-primary-cell[b-cetzq0218e] {
    display: flex;
    flex-direction: column;
    gap: 3px;
    min-width: 180px;
}

.invoice-primary-cell strong[b-cetzq0218e] {
    color: #1e293b;
    font-size: 13px;
}

.invoice-primary-cell span[b-cetzq0218e] {
    color: #5F6E85;
    font-size: 12px;
}

.invoice-check[b-cetzq0218e] {
    align-items: center;
    background: #ffffff;
    border: 2px solid #d8dee6;
    border-radius: 5px;
    display: inline-flex;
    height: 20px;
    justify-content: center;
    width: 20px;
}

.invoice-check.checked[b-cetzq0218e] {
    background: #5263ff;
    border-color: #5263ff;
}

.invoice-check.checked[b-cetzq0218e]::after {
    border: solid #ffffff;
    border-width: 0 2px 2px 0;
    content: "";
    height: 9px;
    margin-top: -2px;
    transform: rotate(45deg);
    width: 5px;
}

.invoice-check.indeterminate[b-cetzq0218e] {
    background: rgba(82, 99, 255, .12);
    border-color: transparent;
}

.invoice-check.indeterminate[b-cetzq0218e]::after {
    background: #5263ff;
    border-radius: 1px;
    content: "";
    height: 2px;
    width: 8px;
}

/* ===== Status pill ===== */
.invoice-status[b-cetzq0218e] {
    border-radius: 8px;
    display: inline-flex;
    font-size: 12px;
    font-weight: 700;
    padding: 4px 8px;
}

.invoice-status.draft[b-cetzq0218e] {
    background: #eef2ff;
    color: #5263ff;
}

.invoice-status.ready[b-cetzq0218e] {
    background: #fff7ed;
    color: #f59e0b;
}

.invoice-status.sent[b-cetzq0218e] {
    background: #ecfdf5;
    color: #16a34a;
}

.invoice-status.archived[b-cetzq0218e] {
    background: #f1f5f9;
    color: #5F6E85;
}

.invoice-status.error[b-cetzq0218e] {
    background: #fee2e2;
    color: #ef4444;
}

.invoice-detail-status[b-cetzq0218e] {
    align-items: center;
    background: #f8fafc;
    border: 1px solid #eaecf0;
    border-radius: 8px;
    color: #101828;
    display: inline-flex;
    gap: 6px;
    font-weight: 600;
    height: 28px;
    min-height: 28px;
    padding: 4px 6px;
}

.invoice-detail-status img[b-cetzq0218e] {
    height: 14px;
    width: 14px;
}

/* ===== Action menus ===== */
.invoice-action-menu[b-cetzq0218e] {
    position: relative;
}

.invoice-menu-panel[b-cetzq0218e] {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    box-shadow: 0 16px 32px rgba(15, 23, 42, .14);
    display: flex;
    flex-direction: column;
    min-width: 180px;
    padding: 6px;
    position: absolute;
    right: 0;
    top: calc(100% + 6px);
    z-index: 1060;
}

.invoice-menu-panel button[b-cetzq0218e] {
    background: transparent;
    border: 0;
    border-radius: 6px;
    color: #1e293b;
    font-size: 13px;
    padding: 8px 10px;
    text-align: left;
}

.invoice-menu-panel button:hover[b-cetzq0218e] {
    background: #f1f5ff;
    color: #5263ff;
}

.invoice-menu-panel button:disabled[b-cetzq0218e],
.invoice-menu-panel button.disabled[b-cetzq0218e] {
    color: #94a3b8 !important;
    background: transparent !important;
    cursor: not-allowed;
    opacity: 0.6;
}

.invoice-menu-panel button:disabled:hover[b-cetzq0218e],
.invoice-menu-panel button.disabled:hover[b-cetzq0218e] {
    color: #94a3b8 !important;
    background: transparent !important;
}

.invoice-row-menu-btn[b-cetzq0218e] {
    align-items: center;
    background: #f8fafc;
    border: 0;
    border-radius: 8px;
    display: inline-flex;
    height: 34px;
    justify-content: center;
    width: 34px;
}

.invoice-row-menu-btn img[b-cetzq0218e] {
    height: 18px;
    width: 18px;
}

.invoice-row-menu-panel[b-cetzq0218e] {
    border-radius: 18px;
    box-shadow: 0 24px 42px rgba(15, 23, 42, .18);
    gap: 4px;
    min-width: 142px;
    padding: 8px;
    top: calc(100% + 8px);
}

.invoice-row-menu-panel button[b-cetzq0218e] {
    align-items: center;
    display: flex;
    gap: 10px;
    font-size: 15px;
    font-weight: 700;
    min-height: 44px;
}

.invoice-row-menu-panel button:first-child[b-cetzq0218e] {
    background: #eef0ff;
    color: #334155;
}

.invoice-row-menu-panel img[b-cetzq0218e] {
    height: 18px;
    width: 18px;
}

.invoice-bulk-menu[b-cetzq0218e] {
    min-width: 188px;
}

.invoice-bulk-menu button[b-cetzq0218e] {
    align-items: center;
    display: flex;
    gap: 10px;
}

.invoice-bulk-menu button img[b-cetzq0218e] {
    height: 16px;
    width: 16px;
}

/* ===== Detail modal shell / header ===== */
.invoice-detail-dialog[b-cetzq0218e] {
    height: 100vh;
    margin: 0;
    max-width: none;
    min-width: 1280px;
    width: 100vw;
}

.invoice-detail-modal[b-cetzq0218e] {
    overflow-x: auto;
}

.invoice-detail-modal *[b-cetzq0218e] {
    box-sizing: border-box;
}

.invoice-detail-modal .modal-dialog-centered[b-cetzq0218e] {
    align-items: stretch;
    min-height: 100vh;
}

.invoice-detail-modal .modal-content[b-cetzq0218e] {
    background: #ffffff;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    display: flex;
    flex-direction: column;
    height: 100vh;
    max-height: 100vh;
    min-height: 100vh;
    min-width: 1280px;
    overflow: hidden;
}

.invoice-detail-backdrop[b-cetzq0218e] {
    opacity: 0;
}

.invoice-detail-header[b-cetzq0218e] {
    align-items: center;
    border-bottom: 1px solid #eaecf0;
    display: flex;
    flex: 0 0 auto;
    gap: 16px;
    min-height: 80px;
    justify-content: space-between;
    padding: 16px 20px;
}

.invoice-detail-title[b-cetzq0218e] {
    align-items: center;
    display: flex;
    gap: 8px;
    min-width: 0;
}

.invoice-detail-avatar[b-cetzq0218e] {
    align-items: center;
    background: #eef0ff;
    border-radius: 12px;
    display: inline-flex;
    flex-shrink: 0;
    height: 48px;
    justify-content: center;
    width: 48px;
}

.invoice-detail-title > div[b-cetzq0218e] {
    min-width: 0;
}

.invoice-detail-avatar img[b-cetzq0218e] {
    height: 28px;
    width: 28px;
}

.invoice-detail-title h5[b-cetzq0218e] {
    color: #101828;
    font-size: 18px;
    font-weight: 700;
    margin: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.invoice-detail-title p[b-cetzq0218e] {
    color: #5c6b82;
    font-size: 13px;
    font-weight: 500;
    margin: 4px 0 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.invoice-detail-header-right[b-cetzq0218e] {
    flex: 0 0 auto;
}

.invoice-detail-close[b-cetzq0218e] {
    background-color: #f2f4f7;
    background-size: 12px;
    border-radius: 8px;
    box-shadow: none;
    height: 32px;
    margin: 0;
    opacity: 1;
    padding: 9px;
    width: 32px;
}

/* ===== Detail toolbar ===== */
.invoice-detail-toolbar[b-cetzq0218e] {
    align-items: center;
    border-bottom: 1px solid #eaecf0;
    display: flex;
    flex: 0 0 auto;
    flex-wrap: nowrap;
    gap: 12px;
    justify-content: space-between;
    height: 56px;
    min-height: 56px;
    padding: 12px 20px;
}

.invoice-detail-toolbar-left[b-cetzq0218e] {
    align-items: center;
    display: flex;
    flex: 1 1 auto;
    flex-wrap: nowrap;
    gap: 32px;
    min-width: 0;
}

.invoice-detail-tabs[b-cetzq0218e] {
    flex: 0 0 auto;
    gap: 8px !important;
}

.invoice-detail-tabs button[b-cetzq0218e] {
    background: #f3f6fb;
    border: 0;
    border-radius: 8px;
    color: #101828;
    font-size: 13px;
    font-weight: 600;
    height: 32px;
    min-height: 32px;
    padding: 4px 8px;
}

.invoice-detail-tabs button.active[b-cetzq0218e] {
    background: #eef0ff;
    color: #5263ff;
}

.invoice-detail-filters[b-cetzq0218e] {
    align-items: center;
    display: flex;
    flex: 0 0 auto;
    gap: 10px;
}

/* Size the picker to its content: pinned to 193px the preset and the date range
   no longer fit on one row, so the trigger wrapped and the toolbar's fixed
   56px height clipped the date range out of sight. */
[b-cetzq0218e] .invoice-detail-daterange-picker {
    flex: 0 0 auto;
    height: 32px;
    min-width: max-content;
    width: auto !important;
}

[b-cetzq0218e] .invoice-detail-daterange-picker .wm-drp-trigger {
    background: #ffffff;
    border-color: #d0d5dd;
    border-radius: 8px;
}

[b-cetzq0218e] .invoice-detail-daterange-picker .wm-drp-trigger-range {
    height: 32px;
    gap: 4px;
    padding: 0 8px;
}

[b-cetzq0218e] .invoice-detail-daterange-picker .wm-drp-icon {
    height: 16px;
    width: 16px;
}

[b-cetzq0218e] .invoice-detail-daterange-picker .wm-drp-trigger-range-text {
    color: #344054;
    font-size: 12px;
    font-weight: 600;
    line-height: 16px;
}

.invoice-detail-filters[b-cetzq0218e]  .invoice-detail-select.custom-select-button {
    appearance: none;
    background: #ffffff !important;
    border: 1px solid #d0d5dd !important;
    border-radius: 8px !important;
    box-shadow: 0 1px 1px -.5px rgba(30, 41, 59, .03), 0 3px 3px -1.5px rgba(30, 41, 59, .03) !important;
    color: #344054 !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    gap: 4px !important;
    height: 32px !important;
    line-height: 16px !important;
    min-height: 32px;
    min-width: 0;
    padding: 0 8px !important;
}

.invoice-detail-filters[b-cetzq0218e]  .invoice-detail-select .custom-select-button-label {
    max-width: calc(100% - 16px) !important;
    min-width: 0;
}

.invoice-detail-filter-dropdown[b-cetzq0218e] {
    flex: 0 0 auto;
    min-width: 0;
}

.invoice-detail-location-filter[b-cetzq0218e] {
    flex-basis: 112px;
    width: 112px;
}

.invoice-detail-worktype-filter[b-cetzq0218e] {
    flex-basis: 123px;
    width: 123px;
}

.invoice-detail-filters[b-cetzq0218e]  .invoice-detail-select.custom-select-button:focus,
.invoice-detail-filters[b-cetzq0218e]  .invoice-detail-select.custom-select-button:focus-visible {
    border-color: #5263ff !important;
    box-shadow: 0 0 0 3px rgba(82, 99, 255, .14) !important;
    outline: 0;
}

.invoice-detail-toolbar-right .normal-btn[b-cetzq0218e] {
    background: rgba(241, 245, 249, .8);
    border: 1px solid rgba(30, 41, 59, .06);
    border-radius: 8px;
    color: #101828;
    font-size: 13px;
    font-weight: 500;
    gap: 2px;
    height: 32px;
    justify-content: center;
    padding: 4px 8px;
    white-space: nowrap;
}

.invoice-detail-bulk[b-cetzq0218e] {
    background: rgba(241, 245, 249, .8);
    border: 1px solid rgba(30, 41, 59, .06);
    border-radius: 8px;
    color: #101828;
    font-size: 13px;
    font-weight: 500;
    gap: 2px;
    height: 32px;
    justify-content: center;
    padding: 4px 8px;
    width: 130px;
    white-space: nowrap;
}

.invoice-detail-bulk.open[b-cetzq0218e] {
    border-color: #c7ccff;
    box-shadow: 0 0 0 3px rgba(82, 99, 255, .18);
}

.invoice-detail-bulk p[b-cetzq0218e],
.invoice-detail-toolbar-right .normal-btn p[b-cetzq0218e] {
    display: inline-flex;
    line-height: 16px;
    margin: 0;
    white-space: nowrap;
}

.invoice-detail-bulk img[b-cetzq0218e],
.invoice-detail-toolbar-right .normal-btn img[b-cetzq0218e] {
    flex: 0 0 auto;
    height: 15px;
    width: 15px;
}

.invoice-detail-new-line[b-cetzq0218e] {
    width: 136px;
}

/* ===== Calendar icon ===== */
.invoice-filter-calendar[b-cetzq0218e] {
    background: url("img/icons/Calender.svg") center / contain no-repeat;
    display: inline-block;
    flex-shrink: 0;
    height: 18px;
    width: 18px;
}

/* ===== Inline "new invoice line" form ===== */
.invoice-input[b-cetzq0218e] {
    background: #ffffff;
    border: 1px solid #dbe3ef;
    border-radius: 8px;
    color: #1e293b;
    font-size: 13px;
    height: 32px;
    min-height: 32px;
    padding: 6px 10px;
    width: 100%;
}

.invoice-line-form[b-cetzq0218e] {
    align-items: end;
    background: #ffffff;
    border: 0;
    border-bottom: 1px solid #eaecf0;
    border-radius: 0;
    display: grid;
    flex: 0 0 auto;
    gap: 10px;
    grid-template-columns: 200fr 200fr 200fr 201fr 200fr 201fr 137fr;
    height: 76px;
    margin: 0;
    min-height: 76px;
    padding: 10px 20px 12px;
}

.invoice-line-form-field[b-cetzq0218e] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
}

.invoice-line-form-field label[b-cetzq0218e] {
    color: #344054;
    font-size: 12px;
    font-weight: 600;
    line-height: 16px;
}

.invoice-line-form-grow[b-cetzq0218e] {
    min-width: 0;
}

.invoice-line-form-narrow[b-cetzq0218e] {
    min-width: 0;
}

.invoice-line-form-datetime[b-cetzq0218e] {
    display: grid;
    gap: 0;
    grid-template-columns: 124px 77px;
    min-width: 0;
}

.invoice-line-form-datetime[b-cetzq0218e]  .invoice-line-date-picker .wm-calendar-input {
    border-radius: 8px 0 0 8px !important;
    height: 32px !important;
    min-height: 32px !important;
    padding: 0 8px !important;
}

.invoice-line-form-datetime[b-cetzq0218e]  .wm-time-input {
    border-left: 0 !important;
    border-radius: 0 8px 8px 0 !important;
    height: 32px !important;
    padding: 0 8px !important;
}

.invoice-line-form-datetime[b-cetzq0218e]  .wm-time-input .wm-time-icon {
    font-size: 14px !important;
}

.invoice-line-form .invoice-input[b-cetzq0218e] {
    height: 32px;
    min-height: 32px;
    padding: 6px 10px;
}

.invoice-line-form[b-cetzq0218e]  .invoice-input.custom-select-button,
.invoice-row-editing[b-cetzq0218e]  .invoice-input.custom-select-button {
    border: 1px solid #dbe3ef !important;
    border-radius: 8px !important;
    box-shadow: none !important;
    font-size: 13px !important;
    height: 32px !important;
    min-height: 32px !important;
    padding: 0 10px !important;
}

.invoice-line-form select.invoice-input[b-cetzq0218e] {
    overflow: hidden;
    text-overflow: ellipsis;
}

.invoice-line-form-actions[b-cetzq0218e] {
    align-items: end;
    display: grid;
    gap: 8px;
    grid-template-columns: 72px 55px;
    white-space: nowrap;
}

.invoice-line-form-actions .btn[b-cetzq0218e] {
    border-radius: 8px;
    font-size: 13px;
    font-weight: 700;
    height: 40px;
    min-width: 0;
    padding: 0 12px;
}

.invoice-line-form-actions .cancel-btn[b-cetzq0218e] {
    background: #fff3f0;
    border: 1px solid #fff3f0;
    color: #d92d20;
}

.invoice-line-form-actions .apply-btn[b-cetzq0218e] {
    background: #5263ff;
    border: 1px solid #5263ff;
    color: #ffffff;
}

.invoice-line-form-actions .apply-btn.disabled[b-cetzq0218e],
.invoice-line-form-actions .apply-btn:disabled[b-cetzq0218e] {
    cursor: not-allowed;
    opacity: .5;
}

/* ===== Detail table ===== */
.invoice-detail-table-scroll[b-cetzq0218e] {
    flex: 1 1 auto;
    min-height: 0;
    overflow: auto;
    position: relative;
    scrollbar-gutter: stable;
}

.invoice-detail-table-scroll.loading[b-cetzq0218e] {
    overflow: hidden;
}

.invoice-detail-loading[b-cetzq0218e] {
    align-items: center;
    background: rgba(255, 255, 255, .86);
    display: flex;
    inset: 0;
    justify-content: center;
    min-height: 220px;
    position: absolute;
    z-index: 2;
}

.invoice-detail-table thead th[b-cetzq0218e] {
    background: #f8fafc;
    border-bottom: 1px solid #eaecf0;
    color: #53657f;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0;
    height: 40px;
    padding: 0 20px;
    position: sticky;
    text-transform: uppercase;
    top: 0;
    z-index: 1;
}

.invoice-detail-table tbody td[b-cetzq0218e] {
    border-bottom: 1px solid #f2f4f7;
    color: #101828;
    font-size: 13px;
    line-height: 17px;
    padding: 10px 20px;
    vertical-align: middle;
}

.invoice-detail-table[b-cetzq0218e] {
    min-width: 1280px;
    table-layout: fixed;
}

.invoice-detail-table tbody tr[b-cetzq0218e] {
    cursor: default;
    min-height: 64px;
}

.invoice-detail-table tbody tr.selected[b-cetzq0218e] {
    background: #ffffff;
}

.invoice-detail-table .invoice-primary-cell strong[b-cetzq0218e] {
    color: #101828;
    font-weight: 700;
}

.invoice-detail-check-col[b-cetzq0218e] {
    width: 3.056%;
}

.invoice-detail-location-col[b-cetzq0218e] {
    width: 24.167%;
}

.invoice-detail-description-col[b-cetzq0218e] {
    width: 19.722%;
}

.invoice-detail-worktype-col[b-cetzq0218e] {
    width: 10%;
}

.invoice-detail-date-col[b-cetzq0218e] {
    width: 10%;
}

.invoice-detail-amount-col[b-cetzq0218e] {
    width: 8.611%;
}

.invoice-detail-price-col[b-cetzq0218e] {
    width: 10%;
}

.invoice-detail-total-col[b-cetzq0218e] {
    width: 10%;
}

.invoice-detail-actions-col[b-cetzq0218e] {
    width: 4.444%;
}

.invoice-detail-desc[b-cetzq0218e] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    max-width: 280px;
}

.invoice-detail-desc strong[b-cetzq0218e] {
    color: #101828;
    font-size: 13px;
    font-weight: 600;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.invoice-detail-desc span[b-cetzq0218e] {
    color: #667085;
    font-size: 12px;
}

.invoice-detail-desc-note[b-cetzq0218e] {
    color: #5263ff !important;
}

.invoice-detail-date[b-cetzq0218e] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.invoice-detail-date span:last-child[b-cetzq0218e] {
    color: #101828;
    font-size: 13px;
}

.invoice-detail-row-menu-btn[b-cetzq0218e] {
    background: transparent;
    height: 24px;
    width: 24px;
}

.invoice-detail-row-menu[b-cetzq0218e] {
    background: #ffffff;
    border: 1px solid #edf0f5;
    border-radius: 22px;
    box-shadow: 0 18px 46px rgba(15, 23, 42, .18);
    gap: 2px;
    min-width: 174px;
    padding: 8px;
    right: 0;
    top: calc(100% + 10px);
    z-index: 1080;
}

.invoice-detail-table tbody tr:nth-last-child(-n + 2):not(:first-child) .invoice-detail-row-menu[b-cetzq0218e] {
    bottom: calc(100% + 4px);
    top: auto;
}

.invoice-detail-row-menu button[b-cetzq0218e] {
    border-radius: 12px;
    color: #35465f;
    font-size: 14px;
    font-weight: 600;
    gap: 8px;
    line-height: 18px;
    min-height: 40px;
    padding: 9px 10px;
}

.invoice-detail-row-menu img[b-cetzq0218e] {
    height: 16px;
    width: 16px;
}

.invoice-detail-row-menu button:first-child[b-cetzq0218e] {
    background: #eef0ff;
    color: #35465f;
}

.invoice-detail-bulk-menu[b-cetzq0218e] {
    border: 1px solid #edf0f5;
    border-radius: 20px;
    box-shadow: 0 18px 46px rgba(15, 23, 42, .16);
    min-width: 124px;
    padding: 8px;
    right: 0;
    top: calc(100% + 10px);
}

.invoice-detail-bulk-menu button[b-cetzq0218e] {
    border-radius: 10px;
    color: #35465f;
    font-size: 14px;
    font-weight: 600;
    min-height: 36px;
    padding: 8px 10px;
}

.invoice-detail-bulk-menu button:first-child[b-cetzq0218e] {
    background: #eef0ff;
}

.invoice-row-muted[b-cetzq0218e] {
    opacity: .55;
}

/* ===== Inline row editing ===== */
.invoice-row-editing td[b-cetzq0218e] {
    vertical-align: middle;
}

.invoice-row-editing .invoice-input[b-cetzq0218e] {
    height: 32px;
    min-height: 32px;
    padding: 7px 10px;
}

.invoice-row-editing td:nth-child(3) > input.invoice-input[b-cetzq0218e] {
    height: 48px;
    min-height: 48px;
}

.invoice-row-editing .invoice-line-form-datetime[b-cetzq0218e] {
    grid-template-columns: 104px;
    gap: 4px;
}

.invoice-row-editing .invoice-line-form-datetime[b-cetzq0218e]  .invoice-line-date-picker .wm-calendar-input,
.invoice-row-editing .invoice-line-form-datetime[b-cetzq0218e]  .wm-time-input {
    border: 1px solid #dbe3ef !important;
    border-radius: 8px !important;
}

.invoice-line-edit-actions[b-cetzq0218e] {
    display: inline-flex;
    gap: 0;
    justify-content: flex-end;
    overflow: hidden;
    border-radius: 8px;
}

.invoice-line-edit-cancel[b-cetzq0218e],
.invoice-line-edit-save[b-cetzq0218e] {
    align-items: center;
    border: 0;
    border-radius: 0;
    cursor: pointer;
    display: inline-flex;
    height: 28px;
    justify-content: center;
    width: 28px;
}

.invoice-line-edit-cancel[b-cetzq0218e] {
    background: #fee4e2;
}

.invoice-line-edit-save[b-cetzq0218e] {
    background: #5263ff;
}

.invoice-line-edit-save.disabled[b-cetzq0218e],
.invoice-line-edit-save:disabled[b-cetzq0218e] {
    cursor: not-allowed;
    opacity: .48;
}

.invoice-line-edit-cancel img[b-cetzq0218e],
.invoice-line-edit-save img[b-cetzq0218e] {
    height: 16px;
    width: 16px;
}

/* ===== Selected bar ===== */
.invoice-selected-bar[b-cetzq0218e] {
    align-items: center;
    border-top: 1px solid #e5e7eb;
    display: flex;
    flex: 0 0 auto;
    gap: 16px;
    justify-content: space-between;
    min-height: 72px;
    padding: 12px 20px;
}

.invoice-selected-count[b-cetzq0218e] {
    align-items: center;
    color: #5F6E85;
    display: flex;
    font-size: 15px;
    font-weight: 700;
    gap: 10px;
}

.invoice-selected-count button[b-cetzq0218e] {
    background: transparent;
    border: 0;
    padding: 0;
}

.invoice-selected-count img[b-cetzq0218e] {
    height: 18px;
    width: 18px;
}

.invoice-selected-actions[b-cetzq0218e] {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    justify-content: flex-end;
}

.invoice-detail-selected-bar[b-cetzq0218e] {
    background: #ffffff;
    min-height: 48px;
    padding: 8px 20px;
}

.invoice-detail-selected-bar .invoice-selected-count[b-cetzq0218e] {
    font-size: 13px;
    font-weight: 600;
}

.invoice-detail-selected-bar .invoice-selected-count button[b-cetzq0218e] {
    align-items: center;
    border-radius: 6px;
    display: inline-flex;
    height: 28px;
    justify-content: center;
    width: 28px;
}

.invoice-detail-selected-bar .invoice-selected-count button:focus-visible[b-cetzq0218e],
.invoice-detail-selected-bar .normal-btn:focus-visible[b-cetzq0218e],
.invoice-detail-footer .invoice-send-economic:focus-visible[b-cetzq0218e] {
    box-shadow: 0 0 0 3px rgba(82, 99, 255, .18);
    outline: 0;
}

.invoice-detail-selected-bar .invoice-selected-actions[b-cetzq0218e] {
    gap: 8px;
}

.invoice-detail-selected-bar .normal-btn[b-cetzq0218e] {
    background: #f8fafc;
    border: 1px solid #e4e9f0;
    border-radius: 8px;
    color: #344054;
    font-size: 12px;
    font-weight: 600;
    gap: 6px;
    height: 34px;
    padding: 0 10px;
}

.invoice-detail-selected-bar .normal-btn img[b-cetzq0218e] {
    height: 14px;
    width: 14px;
}

.invoice-detail-selected-bar .normal-btn p[b-cetzq0218e] {
    line-height: 16px;
    margin: 0;
}

.invoice-detail-selected-bar .normal-btn:hover:not(:disabled)[b-cetzq0218e] {
    background: #f8faff;
    border-color: #c7d2fe;
    color: #5263ff;
}

.invoice-detail-selected-bar .normal-btn.disabled[b-cetzq0218e],
.invoice-detail-selected-bar .normal-btn:disabled[b-cetzq0218e] {
    background: #f8fafc;
    border-color: #e5e7eb;
    color: #98a2b3;
    cursor: not-allowed;
    opacity: 1;
}

/* ===== Footer ===== */
.invoice-send-economic[b-cetzq0218e] {
    background: #5263ff;
    border: 1px solid #5263ff;
    border-radius: 10px;
    color: #ffffff;
    gap: 8px;
    height: 44px;
    padding: 0 16px;
}

.invoice-send-economic img[b-cetzq0218e] {
    height: 18px;
    width: 18px;
}

.invoice-send-economic.disabled[b-cetzq0218e],
.invoice-send-economic:disabled[b-cetzq0218e] {
    cursor: not-allowed;
    opacity: .48;
}

.invoice-total-pill[b-cetzq0218e] {
    background: #ecfdf5;
    border-radius: 999px;
    color: #16a34a;
    font-size: 13px;
    font-weight: 700;
    padding: 8px 12px;
}

.invoice-detail-footer[b-cetzq0218e] {
    align-items: center;
    border-top: 1px solid #eaecf0;
    display: flex;
    flex: 0 0 auto;
    gap: 14px;
    justify-content: flex-end;
    min-height: 72px;
    padding: 14px 20px;
}

.invoice-detail-total-label[b-cetzq0218e] {
    color: #101828;
    font-size: 16px;
    font-weight: 700;
}

.invoice-detail-total-pill[b-cetzq0218e] {
    align-items: center;
    border-radius: 8px;
    display: inline-flex;
    font-size: 14px;
    gap: 8px;
    padding: 9px 14px;
}

.invoice-detail-total-pill img[b-cetzq0218e] {
    height: 16px;
    width: 16px;
}

.invoice-detail-footer .invoice-send-economic[b-cetzq0218e] {
    border-radius: 8px;
    font-size: 14px;
    font-weight: 600;
    gap: 8px;
    height: 40px;
    min-width: 220px;
    padding: 0 18px;
}

.invoice-detail-footer .invoice-send-economic p[b-cetzq0218e] {
    margin: 0;
}

.invoice-push-error[b-cetzq0218e] {
    align-items: flex-start;
    background: #FEE2E2;
    border-radius: 6px;
    color: #B91C1C;
    display: flex;
    font-size: 13px;
    gap: 10px;
    margin: 12px 24px 0;
    padding: 10px 12px;
}

.invoice-push-error img[b-cetzq0218e] {
    height: 20px;
    margin-top: 1px;
    width: 20px;
}

.invoice-push-error strong[b-cetzq0218e] {
    display: block;
    margin-bottom: 2px;
}

.invoice-push-error p[b-cetzq0218e] {
    margin: 0;
    white-space: pre-wrap;
    word-break: break-word;
}

/* ===== Manual-registration link badges ===== */
.invoice-link-badges[b-cetzq0218e] {
    display: inline-flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 4px;
}

.invoice-link-badge[b-cetzq0218e] {
    border-radius: 8px;
    display: inline-flex;
    font-size: 11px;
    font-weight: 700;
    line-height: 16px;
    padding: 2px 8px;
    white-space: nowrap;
}

.invoice-link-badge.counterpart-sent[b-cetzq0218e] {
    background: #f1f5f9;
    color: #475569;
}

.invoice-link-badge.drift[b-cetzq0218e] {
    background: #fef3c7;
    color: #92400e;
}

.invoice-link-badge.duplicate[b-cetzq0218e] {
    background: #fee2e2;
    color: #b91c1c;
}

.invoice-link-badge.one-sided[b-cetzq0218e] {
    background: #e0e7ff;
    color: #3730a3;
}

.invoice-link-badge.complaint-charge-back[b-cetzq0218e] {
    background: #ffedd5;
    color: #9a3412;
}

/* The stop was registered by hand, not driven. */
.invoice-link-badge.manual[b-cetzq0218e] {
    background: #ccfbf1;
    color: #115e59;
}

.invoice-history-btn[b-cetzq0218e] {
    align-items: center;
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    color: #475569;
    display: inline-flex;
    font-size: 13px;
    font-weight: 600;
    gap: 6px;
    padding: 6px 12px;
}

.invoice-history-btn:hover[b-cetzq0218e] {
    background: #f8fafc;
}

.invoice-history-btn img[b-cetzq0218e] {
    height: 16px;
    width: 16px;
}

/* Marker on lines whose unit price came from a location price rule. The pill sits right-aligned
   on the work-type row; hovering it opens a styled tooltip box with the full explanation. */
.price-rule-meta[b-cetzq0218e] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.price-rule-badge[b-cetzq0218e] {
    position: relative;
    display: inline-block;
    padding: 1px 8px;
    border-radius: 999px;
    background: #eef0ff;
    color: #5a67f2;
    font-size: 11px;
    font-weight: 600;
    cursor: help;
    white-space: nowrap;
}

.price-rule-badge .price-rule-tooltip[b-cetzq0218e] {
    display: none;
    position: absolute;
    right: 0;
    top: calc(100% + 6px);
    padding: 8px 12px;
    border-radius: 8px;
    background: #1f2437;
    color: #ffffff;
    font-size: 12px;
    font-weight: 400;
    line-height: 1.4;
    white-space: normal;
    width: max-content;
    max-width: 260px;
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.18);
    z-index: 20;
}

.price-rule-badge:hover .price-rule-tooltip[b-cetzq0218e] {
    display: block;
}

/* Billing-period tag ("Jan 2026") on dispatch-generated monthly invoices. */
.invoice-period-tag[b-cetzq0218e] {
    background: #f1f3f9;
    border-radius: 8px;
    color: #5a6070;
    display: inline-flex;
    font-size: 11px;
    font-weight: 600;
    padding: 2px 8px;
    white-space: nowrap;
    width: fit-content;
}

/* Marks the picked address as one whose contract window has ended. Selectable on purpose —
   only flagged, so a hand-written line is never billed to a dead address unnoticed. */
.invoice-inactive-tag[b-cetzq0218e] {
    background: #fef3c7;
    border-radius: 6px;
    color: #92400e;
    display: inline-flex;
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 0.02em;
    margin-left: 6px;
    padding: 1px 6px;
    text-transform: uppercase;
    white-space: nowrap;
}

/* A contractor that declined the stop stays named on the line: subdued name, plus the
   same red declined pill the dispatch views use. */
.contractor-declined-meta[b-cetzq0218e] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    cursor: help;
}

.contractor-declined-name[b-cetzq0218e] {
    color: #5F6E85;
}

.contractor-declined-pill[b-cetzq0218e] {
    display: inline-flex;
    align-items: center;
    padding: 2px 8px;
    border-radius: 999px;
    background: #FCE9EB;
    font-size: 12px;
    font-weight: 500;
    line-height: 16px;
    color: #C0392F;
}
/* /Pages/Invoices/CustomerInvoices/Components/CustomerInvoiceSeasonalFeeModal.razor.rz.scp.css */
.invoice-wide-modal .modal-dialog[b-g35y3stn6o] {
    max-width: 1000px;
    width: calc(100% - 32px);
}

.invoice-wide-modal .modal-content[b-g35y3stn6o] {
    border: 0;
    border-radius: 16px;
    overflow: hidden;
}

.invoice-wide-modal .modal-header[b-g35y3stn6o] {
    align-items: flex-start;
    padding: 24px 76px 16px 24px;
    position: relative;
}

.invoice-wide-modal .modal-header h5[b-g35y3stn6o] {
    color: #1e293b;
    font-size: 20px;
    font-weight: 700;
    margin: 0;
}

.invoice-wide-modal .modal-header p[b-g35y3stn6o] {
    color: #5F6E85;
    font-size: 13px;
    margin: 6px 0 0;
}

.invoice-wide-modal .modal-header .btn-close[b-g35y3stn6o] {
    background-color: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    height: 36px;
    margin: 0;
    opacity: 1;
    padding: 0;
    position: absolute;
    right: 24px;
    top: 24px;
    width: 36px;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23334155'%3e%3cpath d='M.293.293a1 1 0 0 1 1.414 0L8 6.586 14.293.293a1 1 0 1 1 1.414 1.414L9.414 8l6.293 6.293a1 1 0 0 1-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 0 1-1.414-1.414L6.586 8 .293 1.707a1 1 0 0 1 0-1.414z'/%3e%3c/svg%3e");
    background-position: center;
    background-repeat: no-repeat;
    background-size: 12px;
}

.invoice-wide-modal .modal-body[b-g35y3stn6o] {
    padding: 0 24px;
}

.invoice-modal-toolbar[b-g35y3stn6o] {
    align-items: flex-end;
    display: flex;
    gap: 16px;
    justify-content: space-between;
    padding: 8px 0 16px;
}

.invoice-modal-filters[b-g35y3stn6o] {
    display: flex;
    gap: 16px;
}

.invoice-mini-filter label[b-g35y3stn6o] {
    color: #475569;
    display: block;
    font-size: 13px;
    font-weight: 600;
    margin-bottom: 6px;
}

.invoice-input[b-g35y3stn6o] {
    background: #ffffff;
    border: 1px solid #dbe3ef;
    border-radius: 8px;
    color: #1e293b;
    font-size: 13px;
    min-height: 40px;
    min-width: 190px;
    padding: 8px 12px;
    width: 100%;
}

.invoice-status-pills[b-g35y3stn6o] {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.invoice-status-pills button[b-g35y3stn6o] {
    background: #f1f5f9;
    border: 0;
    border-radius: 8px;
    color: #334155;
    font-size: 13px;
    font-weight: 600;
    min-height: 36px;
    padding: 0 14px;
    white-space: nowrap;
}

.invoice-status-pills button span[b-g35y3stn6o] {
    color: #94a3b8;
    font-weight: 600;
}

.invoice-status-pills button.active[b-g35y3stn6o] {
    background: #eef0ff;
    color: #5263ff;
}

.invoice-status-pills button.active span[b-g35y3stn6o] {
    color: #8a97ff;
}

.invoice-modal-table-scroll[b-g35y3stn6o] {
    margin: 0 -24px;
    max-height: 48vh;
    overflow: auto;
}

.invoice-table[b-g35y3stn6o] {
    border-collapse: collapse;
    width: 100%;
}

.invoice-table thead th[b-g35y3stn6o] {
    background: #f8fafc;
    border-bottom: 1px solid #e2e8f0;
    color: #5F6E85;
    font-size: 12px;
    font-weight: 600;
    padding: 12px 16px;
    position: sticky;
    text-align: left;
    top: 0;
    white-space: nowrap;
    z-index: 1;
}

.invoice-table thead th + th[b-g35y3stn6o] {
    border-left: 1px solid #e2e8f0;
}

.invoice-table tbody td[b-g35y3stn6o] {
    border-bottom: 1px solid #f1f5f9;
    color: #334155;
    font-size: 13px;
    padding: 14px 16px;
    vertical-align: middle;
}

.invoice-table tbody td + td[b-g35y3stn6o] {
    border-left: 1px solid #f1f5f9;
}

.invoice-table tbody tr:nth-child(even) td[b-g35y3stn6o] {
    background: #f8fafc;
}

.invoice-table tbody tr[b-g35y3stn6o] {
    cursor: pointer;
}

.invoice-table tbody tr:hover td[b-g35y3stn6o] {
    background: #f4f7ff;
}

.invoice-check-col[b-g35y3stn6o] {
    width: 48px;
}

.invoice-check[b-g35y3stn6o] {
    align-items: center;
    background: #ffffff;
    border: 1px solid #cbd5e1;
    border-radius: 5px;
    display: inline-flex;
    height: 18px;
    justify-content: center;
    padding: 0;
    width: 18px;
}

.invoice-check:disabled[b-g35y3stn6o] {
    background: #f1f5f9;
    cursor: not-allowed;
}

.invoice-check.checked[b-g35y3stn6o] {
    background: #5263ff;
    border-color: #5263ff;
}

.invoice-check.checked[b-g35y3stn6o]::after {
    border: solid #ffffff;
    border-width: 0 2px 2px 0;
    content: "";
    height: 10px;
    margin-top: -2px;
    transform: rotate(45deg);
    width: 5px;
}

.invoice-check.indeterminate[b-g35y3stn6o] {
    background: #5263ff;
    border-color: #5263ff;
}

.invoice-check.indeterminate[b-g35y3stn6o]::after {
    background: #ffffff;
    border-radius: 1px;
    content: "";
    height: 2px;
    width: 10px;
}

.invoice-wide-modal .modal-footer[b-g35y3stn6o] {
    border-top: 1px solid #eef2f7;
    gap: 16px;
    padding: 16px 24px;
}

.invoice-modal-hint[b-g35y3stn6o] {
    color: #334155;
    font-size: 14px;
    font-weight: 500;
}

.invoice-wide-modal .apply-btn[b-g35y3stn6o] {
    background: #5263ff;
    border: 0;
    border-radius: 10px;
    color: #ffffff;
    font-size: 14px;
    font-weight: 600;
    margin: 0;
    min-height: 40px;
    padding: 8px 20px;
}

.invoice-wide-modal .apply-btn:hover:not(:disabled)[b-g35y3stn6o] {
    background: #4353e8;
    color: #ffffff;
}

.invoice-wide-modal .apply-btn:disabled[b-g35y3stn6o] {
    background: #aab4f5;
    color: #ffffff;
    cursor: not-allowed;
    opacity: 1;
}

@media (max-width: 900px) {
    .invoice-modal-toolbar[b-g35y3stn6o] {
        align-items: stretch;
        flex-direction: column;
    }

    .invoice-table[b-g35y3stn6o] {
        min-width: 860px;
    }
}

/* SM-443: the cost side of the season, under the customers' list in the same screen. */
.invoice-modal-subsection[b-g35y3stn6o] {
    border-top: 1px solid #e6e9f0;
    margin-top: 24px;
    padding-top: 16px;
}

.invoice-modal-subsection h6[b-g35y3stn6o] {
    color: #1e293b;
    font-size: 14px;
    font-weight: 600;
    margin: 0 0 12px;
}

.invoice-row-action[b-g35y3stn6o] {
    text-align: right;
    white-space: nowrap;
}
/* /Pages/Invoices/CustomerInvoices/Components/CustomerInvoiceTable.razor.rz.scp.css */
.invoice-customer-hourly-workspace[b-mz4z3sc7mu]{
    display: flex;
    flex-direction: column;
    gap: var(--wm-card-gap);
}.invoice-toolbar-card[b-mz4z3sc7mu], .invoice-list-card[b-mz4z3sc7mu]{
    background: var(--wm-card-bg);
    border: 1px solid var(--wm-card-border-color);
    border-radius: var(--wm-card-radius);
    box-shadow: var(--wm-card-shadow);
}.invoice-toolbar-card[b-mz4z3sc7mu]{
    min-height: var(--wm-header-row-height);
    padding: var(--wm-card-padding);
}.invoice-list-card[b-mz4z3sc7mu]{
    overflow: visible;
    padding: 0;
    position: relative;
    z-index: 1;
}.hourly-invoice-workspace .invoice-list-card[b-mz4z3sc7mu]{
    border-radius: var(--wm-card-radius);
}.invoice-customer-toolbar[b-mz4z3sc7mu]{
    justify-content: space-between;
    min-height: auto;
    width: 100%;
}.invoice-customer-toolbar-actions[b-mz4z3sc7mu]{
    flex-shrink: 0;
    gap: 8px;
}.normal-btn[b-mz4z3sc7mu], .invoice-create-btn[b-mz4z3sc7mu]{
    align-items: center;
    border-radius: 8px;
    display: inline-flex;
    font-size: 12px;
    font-weight: 600;
    gap: 2px;
    height: 32px;
    justify-content: center;
    line-height: 16px;
    padding: 4px 8px;
}.normal-btn[b-mz4z3sc7mu]{
    background: rgba(241, 245, 249, .8);
    border: 1px solid rgba(30, 41, 59, .06);
    color: #1e293b;
}.normal-btn img[b-mz4z3sc7mu], .invoice-create-btn img[b-mz4z3sc7mu]{
    height: 16px;
    width: 16px;
}.invoice-create-btn[b-mz4z3sc7mu], .invoice-send-economic[b-mz4z3sc7mu]{
    background: #5263ff;
    border: 0;
    color: #ffffff;
}.invoice-send-economic[b-mz4z3sc7mu]{
    align-items: center;
    border-radius: 10px;
    display: inline-flex;
    font-size: 13px;
    font-weight: 600;
    gap: 8px;
    height: 40px;
    justify-content: center;
    padding: 0 14px;
}.invoice-send-economic.disabled[b-mz4z3sc7mu], .invoice-send-economic:disabled[b-mz4z3sc7mu]{
    cursor: not-allowed;
    opacity: .48;
}.invoice-customer-tabs-row[b-mz4z3sc7mu]{
    margin-bottom: 0;
    min-height: 64px;
    padding: 16px;
    width: 100%;
}.invoice-customer-tabs button[b-mz4z3sc7mu]{
    background: var(--wm-control-bg);
    border: 1px solid rgba(30, 41, 59, .06);
    border-radius: var(--wm-control-radius);
    color: var(--wm-text-strong);
    font-size: var(--wm-font-sm);
    font-weight: var(--wm-weight-strong);
    line-height: var(--wm-line-sm);
    min-height: var(--wm-control-height);
    padding: var(--wm-control-padding);
}.invoice-customer-tabs button.active[b-mz4z3sc7mu]{
    background: rgba(82, 99, 255, .12);
    border-color: transparent;
    color: #363af5;
}.invoice-customer-filter-actions .close-txt[b-mz4z3sc7mu]{
    background: rgba(82, 99, 255, .12);
    border: 0;
    border-radius: 8px;
    color: #363af5;
    font-size: 12px;
    font-weight: 600;
    gap: 2px;
    height: 32px;
    line-height: 16px;
    padding: 4px 8px;
}.invoice-customer-filter-actions .close-txt img[b-mz4z3sc7mu]{
    height: 12px;
    width: 12px;
}.invoice-filter-btn-caret[b-mz4z3sc7mu]{
    height: 12px !important;
    width: 12px !important;
}.invoice-loading[b-mz4z3sc7mu], .invoice-empty[b-mz4z3sc7mu]{
    align-items: center;
    color: #5263ff;
    display: flex;
    height: 300px;
    justify-content: center;
}.invoice-empty[b-mz4z3sc7mu]{
    color: #5F6E85;
}.invoice-table-scroll[b-mz4z3sc7mu]{
    overflow: visible;
    position: relative;
    z-index: 2;
    width: 100%;
}.invoice-table[b-mz4z3sc7mu]{
    border-collapse: separate;
    border-spacing: 0;
    width: 100%;
    min-width: 1000px;
}.invoice-table tbody tr[b-mz4z3sc7mu]{
    cursor: pointer;
}.invoice-table tbody tr:hover[b-mz4z3sc7mu], .invoice-customer-table tbody tr.selected[b-mz4z3sc7mu]{
    background: #f5f7ff;
}.invoice-primary-cell[b-mz4z3sc7mu]{
    display: flex;
    flex-direction: column;
    gap: 0;
    min-width: 220px;
}.invoice-primary-cell strong[b-mz4z3sc7mu]{
    color: #1e293b;
    font-size: 13px;
    font-weight: 700;
    line-height: 20px;
}.invoice-primary-cell span[b-mz4z3sc7mu]{
    color: #5F6E85;
    font-size: 12px;
    font-weight: 500;
    line-height: 16px;
}.invoice-check[b-mz4z3sc7mu]{
    align-items: center;
    background: #ffffff;
    border: 1px solid #cbd5e1;
    border-radius: 5px;
    display: inline-flex;
    height: 16px;
    justify-content: center;
    width: 16px;
}.invoice-check.checked[b-mz4z3sc7mu], .invoice-check.indeterminate[b-mz4z3sc7mu]{
    background: #5263ff;
    border-color: #5263ff;
}.invoice-check.checked[b-mz4z3sc7mu]::after{
    border: solid #ffffff;
    border-width: 0 2px 2px 0;
    content: "";
    height: 9px;
    margin-top: -2px;
    transform: rotate(45deg);
    width: 5px;
}.invoice-check.indeterminate[b-mz4z3sc7mu]::after{
    background: #ffffff;
    border-radius: 1px;
    content: "";
    height: 2px;
    width: 9px;
}.invoice-status[b-mz4z3sc7mu]{
    border-radius: 8px;
    display: inline-flex;
    font-size: 12px;
    font-weight: 700;
    padding: 4px 8px;
}.invoice-customer-table .invoice-status[b-mz4z3sc7mu]{
    align-items: center;
    gap: 5px;
}.invoice-status.draft[b-mz4z3sc7mu]{
    background: #eef2ff;
    color: #5263ff;
}.invoice-status.ready[b-mz4z3sc7mu]{
    background: #fff7ed;
    color: #f59e0b;
}.invoice-status.sent[b-mz4z3sc7mu]{
    background: #ecfdf5;
    color: #16a34a;
}.invoice-status.archived[b-mz4z3sc7mu]{
    background: #f1f5f9;
    color: #5F6E85;
}.invoice-status.error[b-mz4z3sc7mu]{
    background: #fee2e2;
    color: #ef4444;
}.invoice-action-menu[b-mz4z3sc7mu]{
    position: relative;
}.invoice-menu-panel[b-mz4z3sc7mu]{
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    box-shadow: 0 16px 32px rgba(15, 23, 42, .14);
    display: flex;
    flex-direction: column;
    min-width: 180px;
    padding: 6px;
    position: absolute;
    right: 0;
    top: calc(100% + 6px);
    z-index: 1060;
}.invoice-menu-panel button[b-mz4z3sc7mu]{
    background: transparent;
    border: 0;
    border-radius: 6px;
    color: #1e293b;
    font-size: 13px;
    padding: 8px 10px;
    text-align: left;
}.invoice-menu-panel button:hover[b-mz4z3sc7mu]{
    background: #f1f5ff;
    color: #5263ff;
}.invoice-bulk-menu[b-mz4z3sc7mu]{
    background: linear-gradient(180deg, rgba(255, 255, 255, .8) 0%, #ffffff 100%);
    backdrop-filter: blur(48px);
    border: 0;
    border-radius: 0;
    box-shadow: 0 16px 32px rgba(15, 23, 42, .10);
    min-width: 161px;
    padding: 8px 4px;
    width: 161px;
}.invoice-bulk-menu button[b-mz4z3sc7mu]{
    align-items: center;
    border-radius: 16px;
    color: #475569;
    display: flex;
    gap: 2px;
    font-weight: 600;
    height: 40px;
    line-height: 24px;
    padding: 4px 10px;
}.invoice-bulk-menu button:hover[b-mz4z3sc7mu]{
    background: rgba(82, 99, 255, .12);
    color: #475569;
}.invoice-bulk-menu button:first-child[b-mz4z3sc7mu]{
    background: rgba(82, 99, 255, .12);
}.invoice-bulk-menu button img[b-mz4z3sc7mu]{
    height: 18px;
    width: 18px;
}.invoice-bulk-menu button span[b-mz4z3sc7mu]{
    padding: 0 4px;
    white-space: nowrap;
}.invoice-row-menu-btn[b-mz4z3sc7mu]{
    align-items: center;
    background: #f8fafc;
    border: 0;
    border-radius: 8px;
    display: inline-flex;
    height: 32px;
    justify-content: center;
    width: 32px;
}.invoice-row-menu-btn img[b-mz4z3sc7mu]{
    height: 18px;
    width: 18px;
}.invoice-row-menu-panel[b-mz4z3sc7mu]{
    border-radius: 18px;
    min-width: 142px;
}.invoice-selected-bar[b-mz4z3sc7mu]{
    align-items: center;
    border-top: 1px solid rgba(30, 41, 59, .09);
    display: flex;
    gap: 16px;
    justify-content: space-between;
    min-height: 72px;
    padding: 12px 16px;
}.invoice-selected-count[b-mz4z3sc7mu], .invoice-selected-actions[b-mz4z3sc7mu]{
    align-items: center;
    display: flex;
    gap: 10px;
}.invoice-selected-count[b-mz4z3sc7mu]{
    color: #5F6E85;
    font-size: 15px;
    font-weight: 700;
}.invoice-selected-count button[b-mz4z3sc7mu]{
    background: transparent;
    border: 0;
    padding: 0;
}[b-mz4z3sc7mu] .wm-pagination{
    border-top: 1px solid rgba(30, 41, 59, .09);
    min-height: 64px;
    padding: 8px 16px;
}@media (max-width: 900px){
    .invoice-customer-toolbar[b-mz4z3sc7mu],
    .invoice-customer-tabs-row[b-mz4z3sc7mu],
    .invoice-selected-bar[b-mz4z3sc7mu] {
        align-items: stretch;
        flex-direction: column;
    }.invoice-customer-toolbar-actions[b-mz4z3sc7mu], .invoice-selected-actions[b-mz4z3sc7mu]{
        justify-content: flex-start;
    }
}

/* Billing-period tag ("Jan 2026") on dispatch-generated monthly invoices. */
.invoice-period-tag[b-mz4z3sc7mu] {
    background: #f1f3f9;
    border-radius: 8px;
    color: #5a6070;
    display: inline-flex;
    font-size: 11px;
    font-weight: 600;
    padding: 2px 8px;
    white-space: nowrap;
    width: fit-content;
}

.invoice-duplicate-tag[b-mz4z3sc7mu] {
    background: #fee2e2;
    border-radius: 8px;
    color: #b91c1c;
    display: inline-flex;
    font-size: 11px;
    font-weight: 700;
    padding: 2px 8px;
    white-space: nowrap;
    width: fit-content;
}
/* /Pages/Invoices/CustomerInvoices/Components/InvoiceBulkLineEditPopup.razor.rz.scp.css */
/* WMPopup's body has no padding of its own; the 16px inset matches the header above it
   and the prompt option rows the other invoice prompts use. */
.bulk-edit-body[b-zvv2vfleg0] {
    display: flex;
    flex-direction: column;
    gap: 14px;
    padding: 8px 16px 12px;
}

.bulk-edit-field[b-zvv2vfleg0] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin: 0;
}

.bulk-edit-field > span[b-zvv2vfleg0] {
    color: #1e293b;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: -0.2px;
    line-height: 20px;
}

/* The same field look the invoice modal's inline editors use. */
.bulk-edit-input[b-zvv2vfleg0],
[b-zvv2vfleg0] .bulk-edit-input.custom-select-button {
    background: #ffffff;
    border: 1px solid #e4e9f0;
    border-radius: 8px;
    color: #1e293b;
    font-size: 13px;
    font-weight: 500;
    height: 38px;
    padding: 0 12px;
    width: 100%;
}

.bulk-edit-input:focus[b-zvv2vfleg0] {
    border-color: #5263ff;
    outline: none;
}

/* The prompt option class carries its own horizontal inset; the body already has one. */
.bulk-edit-option[b-zvv2vfleg0] {
    padding-left: 0;
    padding-right: 0;
}
/* /Pages/Invoices/CustomerInvoices/CustomerInvoiceWorkspace.razor.rz.scp.css */
/* The manual-registration prompt's declined-contractor note: the contractor that denied
   the work stays named, marked with the same red pill the dispatch views use. The block
   is informational, so it does not read as clickable the way the checkbox options do. */
.invoice-prompt-info[b-ptwa5931ol] {
    cursor: default;
}

.contractor-declined-pill[b-ptwa5931ol] {
    display: inline-flex;
    align-items: center;
    margin-left: 6px;
    padding: 2px 8px;
    border-radius: 999px;
    background: #FCE9EB;
    font-size: 12px;
    font-weight: 500;
    line-height: 16px;
    color: #C0392F;
    vertical-align: middle;
}

.invoice-bulk-send-failures[b-ptwa5931ol] {
    list-style: none;
    margin: 0;
    padding: 0.5rem 0;
    max-height: 50vh;
    overflow-y: auto;
}

.invoice-bulk-send-failures li[b-ptwa5931ol] {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
    padding: 0.5rem 0;
    border-bottom: 1px solid #eaecf0;
}

.invoice-bulk-send-failures li:last-child[b-ptwa5931ol] {
    border-bottom: none;
}
/* /Pages/Invoices/HourlyInvoices/Components/HourlyInvoiceCustomerPreviewModal.razor.rz.scp.css */
/* ===== Base table / cells / checkbox ===== */
.invoice-table[b-u436oioyv2] {
    border-collapse: collapse;
    width: 100%;
}

.invoice-table thead th[b-u436oioyv2] {
    background: #f8fafc;
    border-bottom: 1px solid #e2e8f0;
    color: #5F6E85;
    font-size: 12px;
    font-weight: 700;
    padding: 12px;
    white-space: nowrap;
}

.invoice-table tbody td[b-u436oioyv2] {
    border-bottom: 1px solid #eef2f7;
    color: #334155;
    font-size: 13px;
    padding: 12px;
    vertical-align: middle;
}

.invoice-table tbody tr[b-u436oioyv2] {
    cursor: pointer;
}

.invoice-table tbody tr:hover[b-u436oioyv2] {
    background: #f8faff;
}

.invoice-primary-cell[b-u436oioyv2] {
    display: flex;
    flex-direction: column;
    gap: 3px;
    min-width: 180px;
}

.invoice-primary-cell strong[b-u436oioyv2] {
    color: #1e293b;
    font-size: 13px;
}

.invoice-primary-cell span[b-u436oioyv2] {
    color: #5F6E85;
    font-size: 12px;
}

.invoice-check[b-u436oioyv2] {
    align-items: center;
    background: #ffffff;
    border: 2px solid #d8dee6;
    border-radius: 5px;
    display: inline-flex;
    height: 20px;
    justify-content: center;
    width: 20px;
}

.invoice-check.checked[b-u436oioyv2] {
    background: #5263ff;
    border-color: #5263ff;
}

.invoice-check.checked[b-u436oioyv2]::after {
    border: solid #ffffff;
    border-width: 0 2px 2px 0;
    content: "";
    height: 9px;
    margin-top: -2px;
    transform: rotate(45deg);
    width: 5px;
}

.invoice-check.indeterminate[b-u436oioyv2] {
    background: rgba(82, 99, 255, .12);
    border-color: transparent;
}

.invoice-check.indeterminate[b-u436oioyv2]::after {
    background: #5263ff;
    border-radius: 1px;
    content: "";
    height: 2px;
    width: 8px;
}

/* ===== Status pill ===== */
.invoice-status[b-u436oioyv2] {
    border-radius: 8px;
    display: inline-flex;
    font-size: 12px;
    font-weight: 700;
    padding: 4px 8px;
}

.invoice-status.draft[b-u436oioyv2] {
    background: #eef2ff;
    color: #5263ff;
}

.invoice-status.ready[b-u436oioyv2] {
    background: #fff7ed;
    color: #f59e0b;
}

.invoice-status.sent[b-u436oioyv2] {
    background: #ecfdf5;
    color: #16a34a;
}

.invoice-status.archived[b-u436oioyv2] {
    background: #f1f5f9;
    color: #5F6E85;
}

.invoice-status.error[b-u436oioyv2] {
    background: #fee2e2;
    color: #ef4444;
}

.invoice-detail-status[b-u436oioyv2] {
    align-items: center;
    background: #f8fafc;
    border: 1px solid #eaecf0;
    border-radius: 8px;
    color: #101828;
    display: inline-flex;
    gap: 6px;
    font-weight: 600;
    height: 28px;
    min-height: 28px;
    padding: 4px 6px;
}

.invoice-detail-status img[b-u436oioyv2] {
    height: 14px;
    width: 14px;
}

/* ===== Action menus ===== */
.invoice-action-menu[b-u436oioyv2] {
    position: relative;
}

.invoice-menu-panel[b-u436oioyv2] {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    box-shadow: 0 16px 32px rgba(15, 23, 42, .14);
    display: flex;
    flex-direction: column;
    min-width: 180px;
    padding: 6px;
    position: absolute;
    right: 0;
    top: calc(100% + 6px);
    z-index: 1060;
}

.invoice-menu-panel button[b-u436oioyv2] {
    background: transparent;
    border: 0;
    border-radius: 6px;
    color: #1e293b;
    font-size: 13px;
    padding: 8px 10px;
    text-align: left;
}

.invoice-menu-panel button:hover[b-u436oioyv2] {
    background: #f1f5ff;
    color: #5263ff;
}

.invoice-menu-panel button:disabled[b-u436oioyv2],
.invoice-menu-panel button.disabled[b-u436oioyv2] {
    color: #94a3b8 !important;
    background: transparent !important;
    cursor: not-allowed;
    opacity: 0.6;
}

.invoice-menu-panel button:disabled:hover[b-u436oioyv2],
.invoice-menu-panel button.disabled:hover[b-u436oioyv2] {
    color: #94a3b8 !important;
    background: transparent !important;
}

.invoice-row-menu-btn[b-u436oioyv2] {
    align-items: center;
    background: #f8fafc;
    border: 0;
    border-radius: 8px;
    display: inline-flex;
    height: 34px;
    justify-content: center;
    width: 34px;
}

.invoice-row-menu-btn img[b-u436oioyv2] {
    height: 18px;
    width: 18px;
}

.invoice-row-menu-panel[b-u436oioyv2] {
    border-radius: 18px;
    box-shadow: 0 24px 42px rgba(15, 23, 42, .18);
    gap: 4px;
    min-width: 142px;
    padding: 8px;
    top: calc(100% + 8px);
}

.invoice-row-menu-panel button[b-u436oioyv2] {
    align-items: center;
    display: flex;
    gap: 10px;
    font-size: 15px;
    font-weight: 700;
    min-height: 44px;
}

.invoice-row-menu-panel button:first-child[b-u436oioyv2] {
    background: #eef0ff;
    color: #334155;
}

.invoice-row-menu-panel img[b-u436oioyv2] {
    height: 18px;
    width: 18px;
}

.invoice-bulk-menu[b-u436oioyv2] {
    min-width: 188px;
}

.invoice-bulk-menu button[b-u436oioyv2] {
    align-items: center;
    display: flex;
    gap: 10px;
}

.invoice-bulk-menu button img[b-u436oioyv2] {
    height: 16px;
    width: 16px;
}

/* ===== Detail modal shell / header ===== */
.invoice-detail-dialog[b-u436oioyv2] {
    height: 100vh;
    margin: 0;
    max-width: none;
    min-width: 1280px;
    width: 100vw;
}

.invoice-detail-modal[b-u436oioyv2] {
    overflow-x: auto;
}

.invoice-detail-modal *[b-u436oioyv2] {
    box-sizing: border-box;
}

.invoice-detail-modal .modal-dialog-centered[b-u436oioyv2] {
    align-items: stretch;
    min-height: 100vh;
}

.invoice-detail-modal .modal-content[b-u436oioyv2] {
    background: #ffffff;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    display: flex;
    flex-direction: column;
    height: 100vh;
    max-height: 100vh;
    min-height: 100vh;
    min-width: 1280px;
    overflow: hidden;
}

.invoice-detail-backdrop[b-u436oioyv2] {
    opacity: 0;
}

.invoice-detail-header[b-u436oioyv2] {
    align-items: center;
    border-bottom: 1px solid #eaecf0;
    display: flex;
    flex: 0 0 auto;
    gap: 16px;
    min-height: 80px;
    justify-content: space-between;
    padding: 16px 20px;
}

.invoice-detail-title[b-u436oioyv2] {
    align-items: center;
    display: flex;
    gap: 8px;
    min-width: 0;
}

.invoice-detail-avatar[b-u436oioyv2] {
    align-items: center;
    background: #eef0ff;
    border-radius: 12px;
    display: inline-flex;
    flex-shrink: 0;
    height: 48px;
    justify-content: center;
    width: 48px;
}

.invoice-detail-title > div[b-u436oioyv2] {
    min-width: 0;
}

.invoice-detail-avatar img[b-u436oioyv2] {
    height: 28px;
    width: 28px;
}

.invoice-detail-title h5[b-u436oioyv2] {
    color: #101828;
    font-size: 18px;
    font-weight: 700;
    margin: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.invoice-detail-title p[b-u436oioyv2] {
    color: #5c6b82;
    font-size: 13px;
    font-weight: 500;
    margin: 4px 0 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.invoice-detail-header-right[b-u436oioyv2] {
    flex: 0 0 auto;
}

.invoice-detail-close[b-u436oioyv2] {
    background-color: #f2f4f7;
    background-size: 12px;
    border-radius: 8px;
    box-shadow: none;
    height: 32px;
    margin: 0;
    opacity: 1;
    padding: 9px;
    width: 32px;
}

/* ===== Detail toolbar ===== */
.invoice-detail-toolbar[b-u436oioyv2] {
    align-items: center;
    border-bottom: 1px solid #eaecf0;
    display: flex;
    flex: 0 0 auto;
    flex-wrap: nowrap;
    gap: 12px;
    justify-content: space-between;
    height: 56px;
    min-height: 56px;
    padding: 12px 20px;
}

.invoice-detail-toolbar-left[b-u436oioyv2] {
    align-items: center;
    display: flex;
    flex: 1 1 auto;
    flex-wrap: nowrap;
    gap: 32px;
    min-width: 0;
}

.invoice-detail-tabs[b-u436oioyv2] {
    flex: 0 0 auto;
    gap: 8px !important;
}

.invoice-detail-tabs button[b-u436oioyv2] {
    background: #f3f6fb;
    border: 0;
    border-radius: 8px;
    color: #101828;
    font-size: 13px;
    font-weight: 600;
    height: 32px;
    min-height: 32px;
    padding: 4px 8px;
}

.invoice-detail-tabs button.active[b-u436oioyv2] {
    background: #eef0ff;
    color: #5263ff;
}

.invoice-detail-filters[b-u436oioyv2] {
    align-items: center;
    display: flex;
    flex: 0 0 auto;
    gap: 10px;
}

/* Size the picker to its content: pinned to 193px the preset and the date range
   no longer fit on one row, so the trigger wrapped and the toolbar's fixed
   56px height clipped the date range out of sight. */
[b-u436oioyv2] .invoice-detail-daterange-picker {
    flex: 0 0 auto;
    height: 32px;
    min-width: max-content;
    width: auto !important;
}

[b-u436oioyv2] .invoice-detail-daterange-picker .wm-drp-trigger {
    background: #ffffff;
    border-color: #d0d5dd;
    border-radius: 8px;
}

[b-u436oioyv2] .invoice-detail-daterange-picker .wm-drp-trigger-range {
    height: 32px;
    gap: 4px;
    padding: 0 8px;
}

[b-u436oioyv2] .invoice-detail-daterange-picker .wm-drp-icon {
    height: 16px;
    width: 16px;
}

[b-u436oioyv2] .invoice-detail-daterange-picker .wm-drp-trigger-range-text {
    color: #344054;
    font-size: 12px;
    font-weight: 600;
    line-height: 16px;
}

.invoice-detail-filters[b-u436oioyv2]  .invoice-detail-select.custom-select-button {
    appearance: none;
    background: #ffffff !important;
    border: 1px solid #d0d5dd !important;
    border-radius: 8px !important;
    box-shadow: 0 1px 1px -.5px rgba(30, 41, 59, .03), 0 3px 3px -1.5px rgba(30, 41, 59, .03) !important;
    color: #344054 !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    gap: 4px !important;
    height: 32px !important;
    line-height: 16px !important;
    min-height: 32px;
    min-width: 0;
    padding: 0 8px !important;
}

.invoice-detail-filters[b-u436oioyv2]  .invoice-detail-select .custom-select-button-label {
    max-width: calc(100% - 16px) !important;
    min-width: 0;
}

.invoice-detail-filter-dropdown[b-u436oioyv2] {
    flex: 0 0 auto;
    min-width: 0;
}

.invoice-detail-location-filter[b-u436oioyv2] {
    flex-basis: 112px;
    width: 112px;
}

.invoice-detail-worktype-filter[b-u436oioyv2] {
    flex-basis: 123px;
    width: 123px;
}

.invoice-detail-filters[b-u436oioyv2]  .invoice-detail-select.custom-select-button:focus,
.invoice-detail-filters[b-u436oioyv2]  .invoice-detail-select.custom-select-button:focus-visible {
    border-color: #5263ff !important;
    box-shadow: 0 0 0 3px rgba(82, 99, 255, .14) !important;
    outline: 0;
}

.invoice-detail-toolbar-right .normal-btn[b-u436oioyv2] {
    background: rgba(241, 245, 249, .8);
    border: 1px solid rgba(30, 41, 59, .06);
    border-radius: 8px;
    color: #101828;
    font-size: 13px;
    font-weight: 500;
    gap: 2px;
    height: 32px;
    justify-content: center;
    padding: 4px 8px;
    white-space: nowrap;
}

.invoice-detail-bulk[b-u436oioyv2] {
    background: rgba(241, 245, 249, .8);
    border: 1px solid rgba(30, 41, 59, .06);
    border-radius: 8px;
    color: #101828;
    font-size: 13px;
    font-weight: 500;
    gap: 2px;
    height: 32px;
    justify-content: center;
    padding: 4px 8px;
    width: 130px;
    white-space: nowrap;
}

.invoice-detail-bulk.open[b-u436oioyv2] {
    border-color: #c7ccff;
    box-shadow: 0 0 0 3px rgba(82, 99, 255, .18);
}

.invoice-detail-bulk p[b-u436oioyv2],
.invoice-detail-toolbar-right .normal-btn p[b-u436oioyv2] {
    display: inline-flex;
    line-height: 16px;
    margin: 0;
    white-space: nowrap;
}

.invoice-detail-bulk img[b-u436oioyv2],
.invoice-detail-toolbar-right .normal-btn img[b-u436oioyv2] {
    flex: 0 0 auto;
    height: 15px;
    width: 15px;
}

.invoice-detail-new-line[b-u436oioyv2] {
    width: 136px;
}

/* ===== Calendar icon ===== */
.invoice-filter-calendar[b-u436oioyv2] {
    background: url("img/icons/Calender.svg") center / contain no-repeat;
    display: inline-block;
    flex-shrink: 0;
    height: 18px;
    width: 18px;
}

/* ===== Inline "new invoice line" form ===== */
.invoice-input[b-u436oioyv2] {
    background: #ffffff;
    border: 1px solid #dbe3ef;
    border-radius: 8px;
    color: #1e293b;
    font-size: 13px;
    height: 32px;
    min-height: 32px;
    padding: 6px 10px;
    width: 100%;
}

.invoice-line-form[b-u436oioyv2] {
    align-items: end;
    background: #ffffff;
    border: 0;
    border-bottom: 1px solid #eaecf0;
    border-radius: 0;
    display: grid;
    flex: 0 0 auto;
    gap: 10px;
    grid-template-columns: 200fr 200fr 200fr 201fr 200fr 201fr 137fr;
    height: 76px;
    margin: 0;
    min-height: 76px;
    padding: 10px 20px 12px;
}

.invoice-line-form-field[b-u436oioyv2] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
}

.invoice-line-form-field label[b-u436oioyv2] {
    color: #344054;
    font-size: 12px;
    font-weight: 600;
    line-height: 16px;
}

.invoice-line-form-grow[b-u436oioyv2] {
    min-width: 0;
}

.invoice-line-form-narrow[b-u436oioyv2] {
    min-width: 0;
}

.invoice-line-form-datetime[b-u436oioyv2] {
    display: grid;
    gap: 0;
    grid-template-columns: 124px 77px;
    min-width: 0;
}

.invoice-line-form-datetime[b-u436oioyv2]  .invoice-line-date-picker .wm-calendar-input {
    border-radius: 8px 0 0 8px !important;
    height: 32px !important;
    min-height: 32px !important;
    padding: 0 8px !important;
}

.invoice-line-form-datetime[b-u436oioyv2]  .wm-time-input {
    border-left: 0 !important;
    border-radius: 0 8px 8px 0 !important;
    height: 32px !important;
    padding: 0 8px !important;
}

.invoice-line-form-datetime[b-u436oioyv2]  .wm-time-input .wm-time-icon {
    font-size: 14px !important;
}

.invoice-line-form .invoice-input[b-u436oioyv2] {
    height: 32px;
    min-height: 32px;
    padding: 6px 10px;
}

.invoice-line-form[b-u436oioyv2]  .invoice-input.custom-select-button,
.invoice-row-editing[b-u436oioyv2]  .invoice-input.custom-select-button {
    border: 1px solid #dbe3ef !important;
    border-radius: 8px !important;
    box-shadow: none !important;
    font-size: 13px !important;
    height: 32px !important;
    min-height: 32px !important;
    padding: 0 10px !important;
}

.invoice-line-form select.invoice-input[b-u436oioyv2] {
    overflow: hidden;
    text-overflow: ellipsis;
}

.invoice-line-form-actions[b-u436oioyv2] {
    align-items: end;
    display: grid;
    gap: 8px;
    grid-template-columns: 72px 55px;
    white-space: nowrap;
}

.invoice-line-form-actions .btn[b-u436oioyv2] {
    border-radius: 8px;
    font-size: 13px;
    font-weight: 700;
    height: 40px;
    min-width: 0;
    padding: 0 12px;
}

.invoice-line-form-actions .cancel-btn[b-u436oioyv2] {
    background: #fff3f0;
    border: 1px solid #fff3f0;
    color: #d92d20;
}

.invoice-line-form-actions .apply-btn[b-u436oioyv2] {
    background: #5263ff;
    border: 1px solid #5263ff;
    color: #ffffff;
}

.invoice-line-form-actions .apply-btn.disabled[b-u436oioyv2],
.invoice-line-form-actions .apply-btn:disabled[b-u436oioyv2] {
    cursor: not-allowed;
    opacity: .5;
}

/* ===== Detail table ===== */
.invoice-detail-table-scroll[b-u436oioyv2] {
    flex: 1 1 auto;
    min-height: 0;
    overflow: auto;
    position: relative;
    scrollbar-gutter: stable;
}

.invoice-detail-table-scroll.loading[b-u436oioyv2] {
    overflow: hidden;
}

.invoice-detail-loading[b-u436oioyv2] {
    align-items: center;
    background: rgba(255, 255, 255, .86);
    display: flex;
    inset: 0;
    justify-content: center;
    min-height: 220px;
    position: absolute;
    z-index: 2;
}

.invoice-detail-table thead th[b-u436oioyv2] {
    background: #f8fafc;
    border-bottom: 1px solid #eaecf0;
    color: #53657f;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0;
    height: 40px;
    padding: 0 20px;
    position: sticky;
    text-transform: uppercase;
    top: 0;
    z-index: 1;
}

.invoice-detail-table tbody td[b-u436oioyv2] {
    border-bottom: 1px solid #f2f4f7;
    color: #101828;
    font-size: 13px;
    line-height: 17px;
    padding: 10px 20px;
    vertical-align: middle;
}

.invoice-detail-table[b-u436oioyv2] {
    min-width: 1280px;
    table-layout: fixed;
}

.invoice-detail-table tbody tr[b-u436oioyv2] {
    cursor: default;
    min-height: 64px;
}

.invoice-detail-table tbody tr.selected[b-u436oioyv2] {
    background: #ffffff;
}

.invoice-detail-table .invoice-primary-cell strong[b-u436oioyv2] {
    color: #101828;
    font-weight: 700;
}

.invoice-detail-check-col[b-u436oioyv2] {
    width: 3.056%;
}

.invoice-detail-location-col[b-u436oioyv2] {
    width: 24.167%;
}

.invoice-detail-description-col[b-u436oioyv2] {
    width: 19.722%;
}

.invoice-detail-worktype-col[b-u436oioyv2] {
    width: 10%;
}

.invoice-detail-date-col[b-u436oioyv2] {
    width: 10%;
}

.invoice-detail-amount-col[b-u436oioyv2] {
    width: 8.611%;
}

.invoice-detail-price-col[b-u436oioyv2] {
    width: 10%;
}

.invoice-detail-total-col[b-u436oioyv2] {
    width: 10%;
}

.invoice-detail-actions-col[b-u436oioyv2] {
    width: 4.444%;
}

.invoice-detail-desc[b-u436oioyv2] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    max-width: 280px;
}

.invoice-detail-desc strong[b-u436oioyv2] {
    color: #101828;
    font-size: 13px;
    font-weight: 600;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.invoice-detail-desc span[b-u436oioyv2] {
    color: #667085;
    font-size: 12px;
}

.invoice-detail-desc-note[b-u436oioyv2] {
    color: #5263ff !important;
}

.invoice-detail-date[b-u436oioyv2] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.invoice-detail-date span:last-child[b-u436oioyv2] {
    color: #101828;
    font-size: 13px;
}

.invoice-detail-row-menu-btn[b-u436oioyv2] {
    background: transparent;
    height: 24px;
    width: 24px;
}

.invoice-detail-row-menu[b-u436oioyv2] {
    background: #ffffff;
    border: 1px solid #edf0f5;
    border-radius: 22px;
    box-shadow: 0 18px 46px rgba(15, 23, 42, .18);
    gap: 2px;
    min-width: 174px;
    padding: 8px;
    right: 0;
    top: calc(100% + 10px);
    z-index: 1080;
}

.invoice-detail-table tbody tr:nth-last-child(-n + 2):not(:first-child) .invoice-detail-row-menu[b-u436oioyv2] {
    bottom: calc(100% + 4px);
    top: auto;
}

.invoice-detail-row-menu button[b-u436oioyv2] {
    border-radius: 12px;
    color: #35465f;
    font-size: 14px;
    font-weight: 600;
    gap: 8px;
    line-height: 18px;
    min-height: 40px;
    padding: 9px 10px;
}

.invoice-detail-row-menu img[b-u436oioyv2] {
    height: 16px;
    width: 16px;
}

.invoice-detail-row-menu button:first-child[b-u436oioyv2] {
    background: #eef0ff;
    color: #35465f;
}

.invoice-detail-bulk-menu[b-u436oioyv2] {
    border: 1px solid #edf0f5;
    border-radius: 20px;
    box-shadow: 0 18px 46px rgba(15, 23, 42, .16);
    min-width: 124px;
    padding: 8px;
    right: 0;
    top: calc(100% + 10px);
}

.invoice-detail-bulk-menu button[b-u436oioyv2] {
    border-radius: 10px;
    color: #35465f;
    font-size: 14px;
    font-weight: 600;
    min-height: 36px;
    padding: 8px 10px;
}

.invoice-detail-bulk-menu button:first-child[b-u436oioyv2] {
    background: #eef0ff;
}

.invoice-row-muted[b-u436oioyv2] {
    opacity: .55;
}

/* ===== Inline row editing ===== */
.invoice-row-editing td[b-u436oioyv2] {
    vertical-align: middle;
}

.invoice-row-editing .invoice-input[b-u436oioyv2] {
    height: 32px;
    min-height: 32px;
    padding: 7px 10px;
}

.invoice-row-editing td:nth-child(3) > input.invoice-input[b-u436oioyv2] {
    height: 48px;
    min-height: 48px;
}

.invoice-row-editing .invoice-line-form-datetime[b-u436oioyv2] {
    grid-template-columns: 104px;
    gap: 4px;
}

.invoice-row-editing .invoice-line-form-datetime[b-u436oioyv2]  .invoice-line-date-picker .wm-calendar-input,
.invoice-row-editing .invoice-line-form-datetime[b-u436oioyv2]  .wm-time-input {
    border: 1px solid #dbe3ef !important;
    border-radius: 8px !important;
}

.invoice-line-edit-actions[b-u436oioyv2] {
    display: inline-flex;
    gap: 0;
    justify-content: flex-end;
    overflow: hidden;
    border-radius: 8px;
}

.invoice-line-edit-cancel[b-u436oioyv2],
.invoice-line-edit-save[b-u436oioyv2] {
    align-items: center;
    border: 0;
    border-radius: 0;
    cursor: pointer;
    display: inline-flex;
    height: 28px;
    justify-content: center;
    width: 28px;
}

.invoice-line-edit-cancel[b-u436oioyv2] {
    background: #fee4e2;
}

.invoice-line-edit-save[b-u436oioyv2] {
    background: #5263ff;
}

.invoice-line-edit-save.disabled[b-u436oioyv2],
.invoice-line-edit-save:disabled[b-u436oioyv2] {
    cursor: not-allowed;
    opacity: .48;
}

.invoice-line-edit-cancel img[b-u436oioyv2],
.invoice-line-edit-save img[b-u436oioyv2] {
    height: 16px;
    width: 16px;
}

/* ===== Selected bar ===== */
.invoice-selected-bar[b-u436oioyv2] {
    align-items: center;
    border-top: 1px solid #e5e7eb;
    display: flex;
    flex: 0 0 auto;
    gap: 16px;
    justify-content: space-between;
    min-height: 72px;
    padding: 12px 20px;
}

.invoice-selected-count[b-u436oioyv2] {
    align-items: center;
    color: #5F6E85;
    display: flex;
    font-size: 15px;
    font-weight: 700;
    gap: 10px;
}

.invoice-selected-count button[b-u436oioyv2] {
    background: transparent;
    border: 0;
    padding: 0;
}

.invoice-selected-count img[b-u436oioyv2] {
    height: 18px;
    width: 18px;
}

.invoice-selected-actions[b-u436oioyv2] {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    justify-content: flex-end;
}

.invoice-detail-selected-bar[b-u436oioyv2] {
    background: #ffffff;
    min-height: 48px;
    padding: 8px 20px;
}

.invoice-detail-selected-bar .invoice-selected-count[b-u436oioyv2] {
    font-size: 13px;
    font-weight: 600;
}

.invoice-detail-selected-bar .invoice-selected-count button[b-u436oioyv2] {
    align-items: center;
    border-radius: 6px;
    display: inline-flex;
    height: 28px;
    justify-content: center;
    width: 28px;
}

.invoice-detail-selected-bar .invoice-selected-count button:focus-visible[b-u436oioyv2],
.invoice-detail-selected-bar .normal-btn:focus-visible[b-u436oioyv2],
.invoice-detail-footer .invoice-send-economic:focus-visible[b-u436oioyv2] {
    box-shadow: 0 0 0 3px rgba(82, 99, 255, .18);
    outline: 0;
}

.invoice-detail-selected-bar .invoice-selected-actions[b-u436oioyv2] {
    gap: 8px;
}

.invoice-detail-selected-bar .normal-btn[b-u436oioyv2] {
    background: #f8fafc;
    border: 1px solid #e4e9f0;
    border-radius: 8px;
    color: #344054;
    font-size: 12px;
    font-weight: 600;
    gap: 6px;
    height: 34px;
    padding: 0 10px;
}

.invoice-detail-selected-bar .normal-btn img[b-u436oioyv2] {
    height: 14px;
    width: 14px;
}

.invoice-detail-selected-bar .normal-btn p[b-u436oioyv2] {
    line-height: 16px;
    margin: 0;
}

.invoice-detail-selected-bar .normal-btn:hover:not(:disabled)[b-u436oioyv2] {
    background: #f8faff;
    border-color: #c7d2fe;
    color: #5263ff;
}

.invoice-detail-selected-bar .normal-btn.disabled[b-u436oioyv2],
.invoice-detail-selected-bar .normal-btn:disabled[b-u436oioyv2] {
    background: #f8fafc;
    border-color: #e5e7eb;
    color: #98a2b3;
    cursor: not-allowed;
    opacity: 1;
}

/* ===== Footer ===== */
.invoice-send-economic[b-u436oioyv2] {
    background: #5263ff;
    border: 1px solid #5263ff;
    border-radius: 10px;
    color: #ffffff;
    gap: 8px;
    height: 44px;
    padding: 0 16px;
}

.invoice-send-economic img[b-u436oioyv2] {
    height: 18px;
    width: 18px;
}

.invoice-send-economic.disabled[b-u436oioyv2],
.invoice-send-economic:disabled[b-u436oioyv2] {
    cursor: not-allowed;
    opacity: .48;
}

.invoice-total-pill[b-u436oioyv2] {
    background: #ecfdf5;
    border-radius: 999px;
    color: #16a34a;
    font-size: 13px;
    font-weight: 700;
    padding: 8px 12px;
}

.invoice-detail-footer[b-u436oioyv2] {
    align-items: center;
    border-top: 1px solid #eaecf0;
    display: flex;
    flex: 0 0 auto;
    gap: 14px;
    justify-content: flex-end;
    min-height: 72px;
    padding: 14px 20px;
}

.invoice-detail-total-label[b-u436oioyv2] {
    color: #101828;
    font-size: 16px;
    font-weight: 700;
}

.invoice-detail-total-pill[b-u436oioyv2] {
    align-items: center;
    border-radius: 8px;
    display: inline-flex;
    font-size: 14px;
    gap: 8px;
    padding: 9px 14px;
}

.invoice-detail-total-pill img[b-u436oioyv2] {
    height: 16px;
    width: 16px;
}

.invoice-detail-footer .invoice-send-economic[b-u436oioyv2] {
    border-radius: 8px;
    font-size: 14px;
    font-weight: 600;
    gap: 8px;
    height: 40px;
    min-width: 220px;
    padding: 0 18px;
}

.invoice-detail-footer .invoice-send-economic p[b-u436oioyv2] {
    margin: 0;
}

.invoice-history-btn[b-u436oioyv2] {
    align-items: center;
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    color: #475569;
    display: inline-flex;
    font-size: 13px;
    font-weight: 600;
    gap: 6px;
    padding: 6px 12px;
}

.invoice-history-btn:hover[b-u436oioyv2] {
    background: #f8fafc;
}

.invoice-history-btn img[b-u436oioyv2] {
    height: 16px;
    width: 16px;
}

/* Marker on lines whose unit price came from a location price rule. The pill sits right-aligned
   on the work-type row; hovering it opens a styled tooltip box with the full explanation. */
.price-rule-meta[b-u436oioyv2] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.price-rule-badge[b-u436oioyv2] {
    position: relative;
    display: inline-block;
    padding: 1px 8px;
    border-radius: 999px;
    background: #eef0ff;
    color: #5a67f2;
    font-size: 11px;
    font-weight: 600;
    cursor: help;
    white-space: nowrap;
}

.price-rule-badge .price-rule-tooltip[b-u436oioyv2] {
    display: none;
    position: absolute;
    right: 0;
    top: calc(100% + 6px);
    padding: 8px 12px;
    border-radius: 8px;
    background: #1f2437;
    color: #ffffff;
    font-size: 12px;
    font-weight: 400;
    line-height: 1.4;
    white-space: normal;
    width: max-content;
    max-width: 260px;
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.18);
    z-index: 20;
}

.price-rule-badge:hover .price-rule-tooltip[b-u436oioyv2] {
    display: block;
}

/* Marks the picked address as one whose contract window has ended. Selectable on purpose —
   only flagged, so a hand-written line is never billed to a dead address unnoticed. */
.invoice-inactive-tag[b-u436oioyv2] {
    background: #fef3c7;
    border-radius: 6px;
    color: #92400e;
    display: inline-flex;
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 0.02em;
    margin-left: 6px;
    padding: 1px 6px;
    text-transform: uppercase;
    white-space: nowrap;
}

/* A contractor that declined the stop stays named on the line: subdued name, plus the
   same red declined pill the dispatch views use. */
.contractor-declined-meta[b-u436oioyv2] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    cursor: help;
}

.contractor-declined-name[b-u436oioyv2] {
    color: #5F6E85;
}

.contractor-declined-pill[b-u436oioyv2] {
    display: inline-flex;
    align-items: center;
    padding: 2px 8px;
    border-radius: 999px;
    background: #FCE9EB;
    font-size: 12px;
    font-weight: 500;
    line-height: 16px;
    color: #C0392F;
}

/* ===== Line markers (same look as the customer invoice preview) ===== */
.invoice-link-badges[b-u436oioyv2] {
    display: inline-flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 4px;
}

.invoice-link-badge[b-u436oioyv2] {
    border-radius: 8px;
    display: inline-flex;
    font-size: 11px;
    font-weight: 700;
    line-height: 16px;
    padding: 2px 8px;
    white-space: nowrap;
}

.invoice-link-badge.one-sided[b-u436oioyv2] {
    background: #e0e7ff;
    color: #3730a3;
}

/* The stop was registered by hand, not driven. */
.invoice-link-badge.manual[b-u436oioyv2] {
    background: #ccfbf1;
    color: #115e59;
}
/* /Pages/Invoices/HourlyInvoices/Components/HourlyInvoiceFilterPopup.razor.rz.scp.css */
.invoice-filter-popup .modal-dialog[b-zgp1goth74] {
    max-width: 360px;
}

.invoice-filter-modal[b-zgp1goth74] {
    box-sizing: border-box;
    border: 1px solid rgba(30, 41, 59, 0.09);
    border-radius: 20px;
    box-shadow: 0 1px 1px -0.5px rgba(30, 41, 59, 0.03),
        0 3px 3px -1.5px rgba(30, 41, 59, 0.03),
        0 20px 20px -12px rgba(30, 41, 59, 0.03),
        0 32px 32px -16px rgba(30, 41, 59, 0.03);
    min-height: 308px;
    width: 360px;
}

.invoice-filter-popup .invoice-filter-modal[b-zgp1goth74] {
    background: #ffffff;
    overflow: hidden;
}

.invoice-filter-popup .modal-header[b-zgp1goth74] {
    align-items: flex-end;
    box-sizing: border-box;
    border-bottom: 1px solid rgba(30, 41, 59, 0.09);
    height: 40px;
    padding: 8px 16px;
}

.invoice-filter-popup .modal-title[b-zgp1goth74] {
    color: #1e293b;
    font-size: 15px;
    font-weight: 700;
    letter-spacing: -0.2px;
    line-height: 24px;
    margin: 0;
}

.invoice-filter-popup .modal-body[b-zgp1goth74] {
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    min-height: 212px;
    overflow-y: auto;
    padding: 16px;
}

.invoice-filter-popup label[b-zgp1goth74] {
    color: #475569;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: -0.2px;
    line-height: 16px;
    margin: 0 0 4px;
    padding: 0 2px;
}

.invoice-filter-field[b-zgp1goth74] {
    display: flex;
    flex-direction: column;
    min-height: 52px;
}

.invoice-filter-fields[b-zgp1goth74] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    width: 100%;
}

.invoice-filter-select[b-zgp1goth74],
.invoice-filter-clear[b-zgp1goth74] {
    background: #ffffff;
    border: 1px solid rgba(30, 41, 59, 0.12);
    border-radius: 8px;
    box-shadow: 0 1px 1px -0.5px rgba(30, 41, 59, 0.03),
        0 3px 3px -1.5px rgba(30, 41, 59, 0.03);
    color: #1e293b;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: -0.2px;
    line-height: 16px;
    min-height: 32px;
}

.invoice-filter-season-row[b-zgp1goth74] {
    display: grid;
    gap: 8px;
    grid-template-columns: 1fr 55px;
}

.invoice-filter-select[b-zgp1goth74] {
    appearance: none;
    background-image: url("img/icons/dark-down-arrow.svg");
    background-position: right 8px center;
    background-repeat: no-repeat;
    background-size: 16px;
    padding: 8px 28px 8px 8px;
}

.invoice-filter-clear[b-zgp1goth74] {
    background: rgba(241, 245, 249, 0.8);
    border-color: rgba(30, 41, 59, 0.06);
    box-shadow: none;
    color: #1e293b;
    padding: 4px 8px;
}

.invoice-filter-popup .modal-footer[b-zgp1goth74] {
    align-items: center;
    box-sizing: border-box;
    border-top: 1px solid rgba(30, 41, 59, 0.09);
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    height: 56px;
    padding: 12px 16px;
}

.invoice-filter-popup .modal-footer .btn[b-zgp1goth74] {
    border-radius: 8px;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: -0.2px;
    line-height: 16px;
    min-height: 32px;
    padding: 4px 8px;
}

.invoice-filter-popup .reset-btn[b-zgp1goth74] {
    background: transparent;
    border: 0;
    color: #475467;
    margin-right: auto;
    padding-left: 0;
}

.invoice-filter-popup .cancel-btn[b-zgp1goth74] {
    background: rgba(241, 245, 249, 0.8);
    border: 1px solid rgba(30, 41, 59, 0.06);
    color: #1e293b;
    min-width: 64px;
}

.invoice-filter-popup .apply-btn[b-zgp1goth74] {
    background: #5263ff;
    border: 1px solid #5263ff;
    box-shadow: 0 1px 1px -0.5px rgba(30, 41, 59, 0.03), inset 0 3px 3px rgba(255, 255, 255, 0.12);
    color: #ffffff;
    min-width: 91px;
}
/* /Pages/Invoices/HourlyInvoices/Components/HourlyInvoiceNoteModal.razor.rz.scp.css */
.invoice-create-modal[b-o24dqmfwyv] {
    border: 0;
    border-radius: 12px;
    box-shadow: 0 24px 60px rgba(15, 23, 42, .2);
    overflow: hidden;
}

.invoice-create-modal .modal-header[b-o24dqmfwyv] {
    align-items: flex-start;
    border-bottom: 1px solid #eaecf0;
    padding: 22px 24px 18px;
}

.invoice-create-modal .modal-header h5[b-o24dqmfwyv] {
    color: #101828;
    font-size: 22px;
    font-weight: 800;
    line-height: 28px;
    margin: 0;
}

.invoice-create-modal .modal-header p[b-o24dqmfwyv] {
    color: #475467;
    font-size: 14px;
    line-height: 20px;
    margin: 6px 0 0;
}

.invoice-create-modal .btn-close[b-o24dqmfwyv] {
    background-color: #f8fafc;
    border-radius: 8px;
    box-shadow: none;
    margin: 0;
    opacity: 1;
    padding: 10px;
}

.invoice-create-modal .modal-body[b-o24dqmfwyv] {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 20px 24px;
}

.invoice-create-modal .modal-footer[b-o24dqmfwyv] {
    border-top: 1px solid #eaecf0;
    display: grid;
    gap: 14px;
    grid-template-columns: 1fr 1.3fr;
    padding: 18px 24px;
}

.invoice-create-modal .modal-footer .btn[b-o24dqmfwyv] {
    border-radius: 10px;
    font-size: 15px;
    font-weight: 700;
    height: 48px;
    margin: 0;
}

.invoice-create-modal .cancel-btn[b-o24dqmfwyv] {
    background: #f8fafc;
    border: 1px solid #dbe3ef;
    color: #344054;
}

.invoice-create-modal .apply-btn[b-o24dqmfwyv] {
    background: #5263ff;
    border: 1px solid #5263ff;
    color: #ffffff;
}

.invoice-input[b-o24dqmfwyv] {
    background: #ffffff;
    border: 1px solid #dbe3ef;
    border-radius: 8px;
    color: #1e293b;
    font-size: 13px;
    min-height: 36px;
    padding: 8px 10px;
    width: 100%;
}

.invoice-note-input[b-o24dqmfwyv] {
    min-height: 130px;
    resize: vertical;
}
/* /Pages/Invoices/HourlyInvoices/Components/HourlyInvoiceTable.razor.rz.scp.css */
.hourly-overview-workspace[b-6bz0mjygyx]{    display: block;}.hourly-overview-card[b-6bz0mjygyx]{    background: var(--wm-card-bg);    border: 1px solid var(--wm-card-border-color);    border-radius: var(--wm-card-radius);    box-shadow: var(--wm-card-shadow);    overflow: hidden;}.hourly-overview-toolbar[b-6bz0mjygyx]{    align-items: center;    border-bottom: 1px solid #e5e7eb;    display: flex;    gap: 16px;    justify-content: space-between;    min-height: var(--wm-header-row-height);    padding: var(--wm-card-padding);}.hourly-filter-actions[b-6bz0mjygyx]{    align-items: center;    display: flex;    flex-wrap: wrap;    gap: 8px;    justify-content: flex-end;}.normal-btn[b-6bz0mjygyx], .hourly-export-btn[b-6bz0mjygyx]{    align-items: center;    border-radius: 8px;    display: inline-flex;    font-size: 13px;    font-weight: 600;    gap: 6px;    height: 32px;    justify-content: center;    padding: 0 10px;}.normal-btn[b-6bz0mjygyx]{    background: #f8fafc;    border: 1px solid #e2e8f0;    color: #1e293b;}.normal-btn img[b-6bz0mjygyx], .hourly-export-btn img[b-6bz0mjygyx]{    height: 16px;    width: 16px;}.normal-btn p[b-6bz0mjygyx], .close-txt p[b-6bz0mjygyx], .hourly-export-btn p[b-6bz0mjygyx]{    margin: 0;}.close-txt[b-6bz0mjygyx]{    background: #eef0ff;    border: 0;    border-radius: 8px;    color: #363af5;    font-size: 13px;    font-weight: 600;    gap: 6px;    height: 32px;    max-width: 260px;    padding: 0 10px;}.close-txt p[b-6bz0mjygyx]{    overflow: hidden;    text-overflow: ellipsis;    white-space: nowrap;}.close-txt img[b-6bz0mjygyx]{    flex: 0 0 14px;    height: 14px;    width: 14px;}.hourly-filter-caret[b-6bz0mjygyx]{    height: 14px !important;    width: 14px !important;}.hourly-loading[b-6bz0mjygyx], .hourly-empty[b-6bz0mjygyx]{    align-items: center;    color: #5263ff;    display: flex;    height: 300px;    justify-content: center;}.hourly-empty[b-6bz0mjygyx]{    color: #5F6E85;}.hourly-table-scroll[b-6bz0mjygyx]{    overflow-x: auto;    width: 100%;}.hourly-table[b-6bz0mjygyx]{    border-collapse: collapse;    min-width: 1180px;    width: 100%;}.hourly-table tbody tr[b-6bz0mjygyx]{    cursor: pointer;}.hourly-table tbody tr.selected[b-6bz0mjygyx]{    background: #eef0ff;}.hourly-table tbody tr:hover[b-6bz0mjygyx]{    background: #f4f6ff;}.hourly-select-column[b-6bz0mjygyx]{    padding-left: 20px !important;    padding-right: 4px !important;    width: 44px;}.hourly-location-cell[b-6bz0mjygyx]{    display: flex;    flex-direction: column;    min-width: 230px;}.hourly-location-cell strong[b-6bz0mjygyx]{    color: #10213a;    font-size: 14px;    line-height: 20px;}.hourly-location-cell span[b-6bz0mjygyx]{    color: #52627a;    font-size: 13px;    line-height: 18px;}.hourly-type-cell[b-6bz0mjygyx]{    max-width: 180px;    white-space: normal;}.invoice-check[b-6bz0mjygyx]{    align-items: center;    background: #ffffff;    border: 2px solid #dbe3ef;    border-radius: 6px;    display: inline-flex;    height: 20px;    justify-content: center;    width: 20px;}.invoice-check.checked[b-6bz0mjygyx], .invoice-check.indeterminate[b-6bz0mjygyx]{    background: #5263ff;    border-color: #5263ff;}.invoice-check.checked[b-6bz0mjygyx]::after{    border: solid #ffffff;    border-width: 0 2px 2px 0;    content: "";    height: 10px;    margin-top: -2px;    transform: rotate(45deg);    width: 5px;}.invoice-check.indeterminate[b-6bz0mjygyx]::after{    background: #ffffff;    border-radius: 1px;    content: "";    height: 2px;    width: 10px;}.hourly-selected-bar[b-6bz0mjygyx]{    align-items: center;    border-top: 1px solid #e5e7eb;    display: flex;    gap: 16px;    justify-content: space-between;    min-height: 48px;    padding: 8px 20px;}.hourly-selected-count[b-6bz0mjygyx]{    align-items: center;    color: #52627a;    display: flex;    font-size: 14px;    font-weight: 600;    gap: 10px;}.hourly-selected-count button[b-6bz0mjygyx]{    background: transparent;    border: 0;    padding: 0;}.hourly-export-btn[b-6bz0mjygyx]{    background: #5263ff;    border: 1px solid #5263ff;    color: #ffffff;}[b-6bz0mjygyx] .wm-pagination{    height: 64px;    padding: 10px 20px;}[b-6bz0mjygyx] .wm-pagination .go-page, [b-6bz0mjygyx] .wm-pagination hr{    display: none !important;}@media (max-width: 900px){    .hourly-overview-toolbar[b-6bz0mjygyx],    .hourly-selected-bar[b-6bz0mjygyx] {        align-items: stretch;        flex-direction: column;    }}

/* Billing-period tag ("Jan 2026") on dispatch-generated monthly invoices. */
.invoice-period-tag[b-6bz0mjygyx] {
    background: #f1f3f9;
    border-radius: 8px;
    color: #5a6070;
    display: inline-flex;
    font-size: 11px;
    font-weight: 600;
    padding: 2px 8px;
    white-space: nowrap;
    width: fit-content;
}

.invoice-duplicate-tag[b-6bz0mjygyx] {
    background: #fee2e2;
    border-radius: 8px;
    color: #b91c1c;
    display: inline-flex;
    font-size: 11px;
    font-weight: 700;
    padding: 2px 8px;
    white-space: nowrap;
    width: fit-content;
}

/* The bulk actions and the export as one group at the end of the selection bar, the way the
   customer invoice page groups them. */
.hourly-selected-actions[b-6bz0mjygyx] {
    align-items: center;
    display: flex;
    gap: 10px;
}

@media (max-width: 900px) {
    .hourly-selected-actions[b-6bz0mjygyx] {
        justify-content: flex-start;
    }
}
/* /Pages/Invoices/SubcontractorInvoices/AsSubcontractor/Components/InvoiceAsSubcontractorFilterPopup.razor.rz.scp.css */
.invoice-filter-popup .modal-dialog[b-gg38xzspvo] {
    max-width: 360px;
}

.invoice-filter-modal[b-gg38xzspvo] {
    border: 1px solid rgba(30, 41, 59, 0.09);
    border-radius: 20px;
    box-shadow: 0 1px 1px -0.5px rgba(30, 41, 59, 0.03),
        0 3px 3px -1.5px rgba(30, 41, 59, 0.03),
        0 20px 20px -12px rgba(30, 41, 59, 0.03),
        0 32px 32px -16px rgba(30, 41, 59, 0.03);
    min-height: 308px;
}

.invoice-filter-popup .invoice-filter-modal[b-gg38xzspvo] {
    background: #ffffff;
    overflow: hidden;
}

.invoice-filter-popup .modal-header[b-gg38xzspvo] {
    align-items: flex-end;
    border-bottom: 1px solid rgba(30, 41, 59, 0.09);
    min-height: 40px;
    padding: 8px 16px;
}

.invoice-filter-popup .modal-title[b-gg38xzspvo] {
    color: #1e293b;
    font-size: 15px;
    font-weight: 700;
    letter-spacing: -0.2px;
    line-height: 24px;
    margin: 0;
}

.invoice-filter-popup .modal-body[b-gg38xzspvo] {
    display: flex;
    flex-direction: column;
    gap: 16px;
    min-height: 212px;
    overflow-y: auto;
    padding: 16px;
}

.invoice-filter-popup label[b-gg38xzspvo] {
    color: #475569;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: -0.2px;
    line-height: 16px;
    margin: 0 0 4px;
    padding: 0 2px;
}

.invoice-filter-field[b-gg38xzspvo] {
    display: flex;
    flex-direction: column;
}

.invoice-filter-select[b-gg38xzspvo],
.invoice-filter-clear[b-gg38xzspvo],
.invoice-filter-date-display[b-gg38xzspvo] {
    background: #ffffff;
    border: 1px solid rgba(30, 41, 59, 0.12);
    border-radius: 8px;
    box-shadow: 0 1px 1px -0.5px rgba(30, 41, 59, 0.03),
        0 3px 3px -1.5px rgba(30, 41, 59, 0.03);
    color: #1e293b;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: -0.2px;
    line-height: 16px;
    min-height: 32px;
}

.invoice-filter-customer-field[b-gg38xzspvo],
.invoice-filter-date-display[b-gg38xzspvo] {
    align-items: center;
    display: flex;
    gap: 4px;
    padding: 8px;
}

.invoice-filter-customer-field input[b-gg38xzspvo] {
    border: 0;
    color: #1e293b;
    flex: 1;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: -0.2px;
    line-height: 16px;
    min-width: 0;
    outline: 0;
}

.invoice-filter-customer-field img:first-child[b-gg38xzspvo] {
    height: 18px;
    width: 18px;
}

.invoice-filter-customer-field img:last-child[b-gg38xzspvo] {
    height: 14px;
    width: 14px;
}

.invoice-filter-season-row[b-gg38xzspvo] {
    display: grid;
    gap: 8px;
    grid-template-columns: 1fr 55px;
}

.invoice-filter-date-row[b-gg38xzspvo] {
    display: grid;
    grid-template-columns: 117px 211px;
}

.invoice-filter-select[b-gg38xzspvo] {
    appearance: none;
    background-image: url("img/icons/dark-down-arrow.svg");
    background-position: right 8px center;
    background-repeat: no-repeat;
    background-size: 16px;
    padding: 8px 28px 8px 8px;
}

.invoice-filter-date-row .invoice-filter-select[b-gg38xzspvo] {
    border-radius: 10px 0 0 10px;
    min-height: 40px;
}

.invoice-filter-clear[b-gg38xzspvo] {
    background: rgba(241, 245, 249, 0.8);
    border-color: rgba(30, 41, 59, 0.06);
    box-shadow: none;
    color: #1e293b;
    padding: 4px 8px;
}

.invoice-filter-date-display[b-gg38xzspvo] {
    position: relative;
}

.invoice-filter-date-row .invoice-filter-date-display[b-gg38xzspvo] {
    border-left: 0;
    border-radius: 0 10px 10px 0;
    min-height: 40px;
    padding: 8px 10px;
}

.invoice-filter-calendar[b-gg38xzspvo] {
    background: url("img/icons/Calender.svg") center / contain no-repeat;
    display: inline-block;
    flex-shrink: 0;
    height: 18px;
    width: 18px;
}

.invoice-filter-date-display span:not(.invoice-filter-calendar)[b-gg38xzspvo] {
    font-size: 13px;
    font-weight: 600;
    letter-spacing: -0.2px;
    line-height: 24px;
    white-space: nowrap;
}

.invoice-filter-date-display input[b-gg38xzspvo] {
    bottom: 0;
    cursor: pointer;
    opacity: 0;
    position: absolute;
    top: 0;
    width: 50%;
}

.invoice-filter-date-display input:first-of-type[b-gg38xzspvo] {
    left: 0;
}

.invoice-filter-date-display input:last-of-type[b-gg38xzspvo] {
    right: 0;
}

.invoice-filter-popup .modal-footer[b-gg38xzspvo] {
    align-items: center;
    border-top: 1px solid rgba(30, 41, 59, 0.09);
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    min-height: 56px;
    padding: 12px 16px;
}

.invoice-filter-popup .modal-footer .btn[b-gg38xzspvo] {
    border-radius: 8px;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: -0.2px;
    line-height: 16px;
    min-height: 32px;
    padding: 4px 8px;
}

.invoice-filter-popup .reset-btn[b-gg38xzspvo] {
    background: transparent;
    border: 0;
    color: #475467;
    margin-right: auto;
    padding-left: 0;
}

.invoice-filter-popup .cancel-btn[b-gg38xzspvo] {
    background: rgba(241, 245, 249, 0.8);
    border: 1px solid rgba(30, 41, 59, 0.06);
    color: #1e293b;
    min-width: 64px;
}

.invoice-filter-popup .apply-btn[b-gg38xzspvo] {
    background: #5263ff;
    border: 1px solid #5263ff;
    box-shadow: 0 1px 1px -0.5px rgba(30, 41, 59, 0.03), inset 0 3px 3px rgba(255, 255, 255, 0.12);
    color: #ffffff;
    min-width: 91px;
}
/* /Pages/Invoices/SubcontractorInvoices/AsSubcontractor/Components/InvoiceAsSubcontractorTable.razor.rz.scp.css */
.invoice-as-subcontractor-workspace[b-dgsiq7gxru]{    display: flex;    flex-direction: column;    gap: var(--wm-card-gap);}.invoice-subcontractor-toolbar[b-dgsiq7gxru], .invoice-subcontractor-card[b-dgsiq7gxru]{    background: var(--wm-card-bg);    border: 1px solid var(--wm-card-border-color);    border-radius: var(--wm-card-radius);    box-shadow: var(--wm-card-shadow);}.invoice-subcontractor-toolbar[b-dgsiq7gxru]{    align-items: center;    display: flex;    gap: 16px;    justify-content: space-between;    min-height: var(--wm-header-row-height);    padding: var(--wm-card-padding);}.invoice-subcontractor-toolbar-actions[b-dgsiq7gxru], .invoice-status-pills[b-dgsiq7gxru], .invoice-subcontractor-filter-actions[b-dgsiq7gxru], .invoice-selected-actions[b-dgsiq7gxru]{    align-items: center;    display: flex;    flex-wrap: wrap;    gap: 10px;}.invoice-subcontractor-toolbar-actions[b-dgsiq7gxru], .invoice-subcontractor-filter-actions[b-dgsiq7gxru], .invoice-selected-actions[b-dgsiq7gxru]{    justify-content: flex-end;}.normal-btn[b-dgsiq7gxru], .invoice-create-btn[b-dgsiq7gxru], .invoice-send-economic[b-dgsiq7gxru]{    align-items: center;    border-radius: 8px;    display: inline-flex;    font-size: 12px;    font-weight: 600;    gap: 6px;    height: 32px;    justify-content: center;    padding: 4px 8px;}.normal-btn[b-dgsiq7gxru]{    background: #f8fafc;    border: 1px solid #e5e7eb;    color: #334155;}.invoice-create-btn img[b-dgsiq7gxru]{    height: 16px;    width: 16px;}.invoice-create-btn[b-dgsiq7gxru], .invoice-send-economic[b-dgsiq7gxru]{    background: #5263ff;    border: 1px solid #5263ff;    color: #ffffff;}.invoice-subcontractor-card[b-dgsiq7gxru]{    overflow: visible;    position: relative;    z-index: 1;}.invoice-subcontractor-card-header[b-dgsiq7gxru]{    align-items: center;    border-bottom: 1px solid #e5e7eb;    display: flex;    gap: 16px;    justify-content: space-between;    min-height: var(--wm-header-row-height);    padding: var(--wm-card-padding);}.invoice-status-pills button[b-dgsiq7gxru]{    background: var(--wm-control-bg);    border: 0;    border-radius: var(--wm-control-radius);    color: var(--wm-text-strong);    font-size: var(--wm-font-sm);    font-weight: var(--wm-weight-strong);    min-height: var(--wm-control-height);    padding: var(--wm-control-padding);}.invoice-status-pills button.active[b-dgsiq7gxru]{    background: #eef0ff;    color: #5263ff;}.close-txt[b-dgsiq7gxru]{    background: #eef0ff;    border: 0;    border-radius: 8px;    color: #5263ff;    font-size: 14px;    font-weight: 700;    gap: 8px;    height: 40px;    padding: 0 14px;}.close-txt img[b-dgsiq7gxru]{    height: 14px;    width: 14px;}.invoice-loading[b-dgsiq7gxru], .invoice-empty[b-dgsiq7gxru]{    align-items: center;    color: #5263ff;    display: flex;    height: 300px;    justify-content: center;}.invoice-empty[b-dgsiq7gxru]{    color: #5F6E85;}.invoice-table-scroll[b-dgsiq7gxru]{    overflow: visible;    position: relative;    z-index: 2;    width: 100%;}.invoice-table[b-dgsiq7gxru]{    border-collapse: collapse;    width: 100%;    min-width: 1000px;
}.invoice-subcontractor-table tbody tr.selected[b-dgsiq7gxru]{    background: #eef0ff;}.invoice-subcontractor-table tbody tr:hover[b-dgsiq7gxru]{    background: #f4f6ff;}.invoice-primary-cell[b-dgsiq7gxru]{    display: flex;    flex-direction: column;    min-width: 220px;}.invoice-primary-cell strong[b-dgsiq7gxru]{    color: #1e293b;    font-size: 15px;}.invoice-check[b-dgsiq7gxru]{    align-items: center;    background: #ffffff;    border: 2px solid #dbe3ef;    border-radius: 6px;    display: inline-flex;    height: 24px;    justify-content: center;    width: 24px;}.invoice-check.checked[b-dgsiq7gxru]{    background: #5263ff;    border-color: #5263ff;}.invoice-check.checked[b-dgsiq7gxru]::after{    border: solid #ffffff;    border-width: 0 2px 2px 0;    content: "";    height: 12px;    margin-top: -2px;    transform: rotate(45deg);    width: 6px;}.invoice-status[b-dgsiq7gxru]{    align-items: center;    border-radius: 8px;    display: inline-flex;    font-size: 14px;    font-weight: 700;    gap: 6px;    min-height: 34px;    padding: 6px 10px;}.invoice-status[b-dgsiq7gxru]::before{    background: currentColor;    border-radius: 999px;    content: "";    height: 8px;    width: 8px;}.invoice-status.draft[b-dgsiq7gxru]{    background: #eef2ff;    color: #5263ff;}.invoice-status.sent[b-dgsiq7gxru]{    background: #ecfdf5;    color: #16a34a;}.invoice-status.error[b-dgsiq7gxru]{    background: #fee2e2;    color: #ef4444;}.invoice-status.archived[b-dgsiq7gxru]{    background: #fef3c7;    color: #d97706;}.invoice-status.draft[b-dgsiq7gxru]::before, .invoice-status.archived[b-dgsiq7gxru]::before{    border-radius: 2px;}.invoice-action-menu[b-dgsiq7gxru]{    position: relative;}.invoice-menu-panel[b-dgsiq7gxru]{    background: #ffffff;    border: 1px solid #e2e8f0;    border-radius: 8px;    box-shadow: 0 16px 32px rgba(15, 23, 42, .14);    display: flex;    flex-direction: column;    min-width: 180px;    padding: 6px;    position: absolute;    right: 0;    top: calc(100% + 6px);    z-index: 1060;}.invoice-menu-panel button[b-dgsiq7gxru]{    background: transparent;    border: 0;    border-radius: 6px;    color: #1e293b;    font-size: 13px;    padding: 8px 10px;    text-align: left;}.invoice-menu-panel button:hover[b-dgsiq7gxru]{    background: #f1f5ff;    color: #5263ff;}.invoice-row-menu-btn[b-dgsiq7gxru]{    align-items: center;    background: #f8fafc;    border: 0;    border-radius: 8px;    display: inline-flex;    height: 34px;    justify-content: center;    width: 34px;}.invoice-row-menu-btn img[b-dgsiq7gxru]{    height: 18px;    width: 18px;}.invoice-row-menu-panel[b-dgsiq7gxru]{    border-radius: 18px;    box-shadow: 0 24px 42px rgba(15, 23, 42, .18);    gap: 4px;    min-width: 142px;    padding: 8px;    top: calc(100% + 8px);}.invoice-row-menu-panel button[b-dgsiq7gxru]{    align-items: center;    display: flex;    gap: 10px;    font-weight: 600;    min-height: 36px;}.invoice-row-menu-panel button:first-child[b-dgsiq7gxru]{    background: #eef0ff;    color: #334155;}.invoice-selected-bar[b-dgsiq7gxru]{    align-items: center;    border-top: 1px solid #e5e7eb;    display: flex;    gap: 16px;    justify-content: space-between;    min-height: 72px;    padding: 12px 20px;}.invoice-selected-count[b-dgsiq7gxru]{    align-items: center;    color: #5F6E85;    display: flex;    font-size: 15px;    font-weight: 700;    gap: 10px;}.invoice-selected-count button[b-dgsiq7gxru]{    background: transparent;    border: 0;    padding: 0;}@media (max-width: 900px){    .invoice-subcontractor-toolbar[b-dgsiq7gxru],    .invoice-subcontractor-card-header[b-dgsiq7gxru],    .invoice-selected-bar[b-dgsiq7gxru] {        align-items: stretch;        flex-direction: column;    }}

/* Billing-period tag ("Jan 2026") on dispatch-generated monthly invoices. */
.invoice-period-tag[b-dgsiq7gxru] {
    background: #f1f3f9;
    border-radius: 8px;
    color: #5a6070;
    display: inline-flex;
    font-size: 11px;
    font-weight: 600;
    padding: 2px 8px;
    white-space: nowrap;
    width: fit-content;
}

/* As-subcontractor specifics: rows open the received-invoice preview. */
.invoice-as-table tbody tr[b-dgsiq7gxru] {
    cursor: pointer;
}

/* This table is .invoice-as-table, not .invoice-subcontractor-table, so the row
   highlight above never applied here — rows stayed flat on hover unlike every
   other invoice list. */
.invoice-as-table tbody tr:hover[b-dgsiq7gxru],
.invoice-as-table tbody tr.selected[b-dgsiq7gxru] {
    background: #f5f7ff;
}

.invoice-select-column[b-dgsiq7gxru] {
    padding-left: 20px !important;
    padding-right: 4px !important;
    width: 44px;
}
/* /Pages/Invoices/SubcontractorInvoices/ForSubcontractor/Components/InvoiceForSubcontractorCreateModal.razor.rz.scp.css */
.invoice-create-picker-shell .modal-dialog[b-rlxljkv0nc] {
    max-width: 600px;
}

.invoice-create-modal[b-rlxljkv0nc] {
    border: 0;
    border-radius: 12px;
    box-shadow: 0 24px 60px rgba(15, 23, 42, .2);
    overflow: hidden;
}

.invoice-create-modal .modal-header[b-rlxljkv0nc] {
    align-items: flex-start;
    border-bottom: 1px solid #eaecf0;
    padding: 22px 24px 18px;
}

.invoice-create-modal .modal-header h5[b-rlxljkv0nc] {
    color: #101828;
    font-size: 22px;
    font-weight: 800;
    line-height: 28px;
    margin: 0;
}

.invoice-create-modal .modal-header p[b-rlxljkv0nc] {
    color: #475467;
    font-size: 14px;
    line-height: 20px;
    margin: 6px 0 0;
}

.invoice-create-subhelp[b-rlxljkv0nc] {
    margin-top: 2px !important;
}

.invoice-create-modal .btn-close[b-rlxljkv0nc] {
    background-color: #f8fafc;
    border-radius: 8px;
    box-shadow: none;
    margin: 0;
    opacity: 1;
    padding: 10px;
}

.invoice-create-modal .modal-body[b-rlxljkv0nc] {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 20px 24px;
}

.invoice-create-modal .modal-footer[b-rlxljkv0nc] {
    border-top: 1px solid #eaecf0;
    display: grid;
    gap: 14px;
    grid-template-columns: 1fr 1.3fr;
    padding: 18px 24px;
}

.invoice-create-modal .modal-footer .btn[b-rlxljkv0nc] {
    border-radius: 10px;
    font-size: 15px;
    font-weight: 700;
    height: 48px;
    margin: 0;
}

.invoice-create-modal .cancel-btn[b-rlxljkv0nc] {
    background: #f8fafc;
    border: 1px solid #dbe3ef;
    color: #344054;
}

.invoice-create-modal .apply-btn[b-rlxljkv0nc] {
    background: #5263ff;
    border: 1px solid #5263ff;
    color: #ffffff;
}

.invoice-create-modal .apply-btn.disabled[b-rlxljkv0nc],
.invoice-create-modal .apply-btn:disabled[b-rlxljkv0nc] {
    cursor: not-allowed;
    opacity: .5;
}

.invoice-customer-search[b-rlxljkv0nc] {
    align-items: center;
    background: #ffffff;
    border: 1px solid #dbe3ef;
    border-radius: 10px;
    display: flex;
    gap: 8px;
    min-height: 44px;
    padding: 0 14px;
}

.invoice-customer-search img[b-rlxljkv0nc] {
    height: 16px;
    width: 16px;
}

.invoice-customer-search input[b-rlxljkv0nc] {
    border: 0;
    color: #1e293b;
    flex: 1;
    font-size: 13px;
    min-width: 0;
    outline: 0;
}

.invoice-create-customer-list[b-rlxljkv0nc] {
    display: flex;
    flex-direction: column;
    gap: 10px;
    max-height: 312px;
    overflow-y: auto;
    padding-right: 2px;
}

.invoice-create-customer-card[b-rlxljkv0nc] {
    align-items: center;
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    color: #1e293b;
    display: flex;
    gap: 10px;
    justify-content: space-between;
    min-height: 78px;
    padding: 14px 20px;
    position: relative;
    text-align: left;
    transition: border-color .15s ease, box-shadow .15s ease;
    width: 100%;
}

.invoice-create-customer-card:hover[b-rlxljkv0nc],
.invoice-create-customer-card.selected[b-rlxljkv0nc] {
    border-color: #5263ff;
    box-shadow: 0 0 0 3px rgba(82, 99, 255, .18);
}

.invoice-create-customer-card.selected[b-rlxljkv0nc]::after {
    background: #5263ff;
    background-image: url("/img/icons/check-white.svg");
    background-position: center;
    background-repeat: no-repeat;
    background-size: 11px 11px;
    border: 2px solid #ffffff;
    border-radius: 999px;
    content: "";
    height: 22px;
    position: absolute;
    right: 10px;
    top: 10px;
    width: 22px;
}

.invoice-create-customer-main[b-rlxljkv0nc] {
    display: flex;
    flex: 1;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
}

.invoice-create-customer-main strong[b-rlxljkv0nc] {
    color: #1e293b;
    font-size: 14px;
    font-weight: 800;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.invoice-create-customer-main small[b-rlxljkv0nc] {
    color: #64748b;
    font-size: 12px;
}

.invoice-create-customer-meta[b-rlxljkv0nc] {
    align-items: center;
    display: flex;
    flex-direction: row;
    flex-shrink: 0;
    gap: 8px;
}

.invoice-create-customer-meta span[b-rlxljkv0nc] {
    align-items: center;
    border-radius: 8px;
    display: inline-flex;
    font-size: 12px;
    font-weight: 600;
    gap: 5px;
    min-height: 26px;
    padding: 4px 10px;
}

.invoice-create-customer-nr[b-rlxljkv0nc] {
    background: #f2f4f7;
    color: #475467;
}

.invoice-create-customer-count[b-rlxljkv0nc] {
    background: #eef0ff;
    color: #5263ff;
}

.invoice-create-customer-meta img[b-rlxljkv0nc] {
    height: 14px;
    width: 14px;
}

.invoice-create-empty[b-rlxljkv0nc] {
    height: 120px;
}

.invoice-empty[b-rlxljkv0nc] {
    align-items: center;
    color: #64748b;
    display: flex;
    height: 300px;
    justify-content: center;
}
/* /Pages/Invoices/SubcontractorInvoices/ForSubcontractor/Components/InvoiceForSubcontractorExportCsvModal.razor.rz.scp.css */
.invoice-export-csv-modal[b-wr7m9zub72] {
    z-index: 1060;
}

.invoice-export-csv-modal .modal-dialog[b-wr7m9zub72] {
    max-width: 920px;
    width: calc(100% - 32px);
}

.invoice-export-modal[b-wr7m9zub72] {
    background: #ffffff;
    border: 1px solid rgba(30, 41, 59, .03);
    border-radius: 20px;
    box-shadow: 0 1px 1px -.5px rgba(30, 41, 59, .03), 0 3px 3px -1.5px rgba(30, 41, 59, .03), 0 20px 20px -12px rgba(30, 41, 59, .03), 0 32px 32px -16px rgba(30, 41, 59, .03);
    height: 600px;
    overflow: hidden;
}

.invoice-export-header[b-wr7m9zub72] {
    align-items: flex-end;
    border-bottom: 1px solid rgba(30, 41, 59, .09);
    display: flex;
    height: 80px;
    justify-content: space-between;
    padding: 16px 20px;
    position: relative;
}

.invoice-export-header h5[b-wr7m9zub72] {
    color: #1e293b;
    font-size: 18px;
    font-weight: 700;
    letter-spacing: -.2px;
    line-height: 24px;
    margin: 0;
}

.invoice-export-header p[b-wr7m9zub72] {
    color: #5F6E85;
    font-size: 13px;
    font-weight: 500;
    letter-spacing: -.2px;
    line-height: 20px;
    margin: 4px 0 0;
}

.invoice-export-close[b-wr7m9zub72] {
    align-items: center;
    background: rgba(241, 245, 249, .8);
    border: 1px solid rgba(30, 41, 59, .06);
    border-radius: 8px;
    display: flex;
    height: 32px;
    justify-content: center;
    padding: 0;
    position: absolute;
    right: 12px;
    top: 12px;
    width: 32px;
}

.invoice-export-close img[b-wr7m9zub72] {
    height: 18px;
    width: 18px;
}

.invoice-export-body[b-wr7m9zub72] {
    display: grid;
    grid-template-columns: 420px minmax(0, 1fr);
    height: 520px;
}

.invoice-export-panel[b-wr7m9zub72] {
    min-height: 0;
    min-width: 0;
}

.invoice-export-generate[b-wr7m9zub72] {
    border-right: 1px solid rgba(30, 41, 59, .09);
    display: grid;
    grid-template-rows: 48px minmax(0, 1fr) auto;
}

/* Heading, fields, button: the fields take what is left and scroll, so a template with more
   inputs than fits never pushes the generate button out of the dialog. */
.invoice-export-fields[b-wr7m9zub72] {
    min-height: 0;
    overflow-y: auto;
    padding: 16px 20px 0;
}

.invoice-export-panel h6[b-wr7m9zub72] {
    align-items: center;
    border-bottom: 1px solid rgba(30, 41, 59, .09);
    color: #1e293b;
    display: flex;
    font-size: 15px;
    font-weight: 700;
    letter-spacing: -.2px;
    line-height: 24px;
    margin: 0;
    padding: 12px 20px;
}

.invoice-export-toggle[b-wr7m9zub72] {
    margin-left: 20px;
    margin-right: 20px;
}

.invoice-export-field[b-wr7m9zub72] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    margin-bottom: 12px;
    position: relative;
}

.invoice-export-field label[b-wr7m9zub72] {
    color: #475569;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: -.2px;
    line-height: 20px;
    padding: 0 2px;
}

.invoice-export-field label span[b-wr7m9zub72] {
    color: #ef4444;
}

.invoice-export-input[b-wr7m9zub72] {
    background: #ffffff;
    border: 1px solid rgba(30, 41, 59, .12);
    border-radius: 10px;
    box-shadow: 0 1px 1px -.5px rgba(30, 41, 59, .03), 0 3px 3px -1.5px rgba(30, 41, 59, .03);
    color: #1e293b;
    font-size: 13px;
    font-weight: 600;
    height: 40px;
    line-height: 24px;
    padding: 8px 10px;
    width: 100%;
}

.invoice-export-tag-input[b-wr7m9zub72] {
    align-items: center;
    display: flex;
    justify-content: space-between;
    text-align: left;
}

.invoice-export-tags[b-wr7m9zub72] {
    align-items: center;
    display: flex;
    flex: 1;
    gap: 4px;
    min-width: 0;
    overflow: hidden;
}

.invoice-export-chip[b-wr7m9zub72],
.invoice-export-more[b-wr7m9zub72],
.invoice-export-history-tags span[b-wr7m9zub72] {
    align-items: center;
    background: rgba(82, 99, 255, .12);
    border-radius: 8px;
    color: #363af5;
    display: inline-flex;
    font-size: 12px;
    font-weight: 600;
    gap: 2px;
    height: 24px;
    letter-spacing: -.2px;
    line-height: 16px;
    max-width: 150px;
    padding: 4px 6px;
}

.invoice-export-chip button[b-wr7m9zub72] {
    align-items: center;
    background: transparent;
    border: 0;
    display: flex;
    height: 14px;
    justify-content: center;
    padding: 0;
    width: 14px;
}

.invoice-export-chip img[b-wr7m9zub72] {
    height: 14px;
    width: 14px;
}

.invoice-export-tag-input > img[b-wr7m9zub72] {
    flex: 0 0 16px;
    height: 16px;
    width: 16px;
}

.invoice-export-picker[b-wr7m9zub72] {
    background: #ffffff;
    border: 1px solid rgba(30, 41, 59, .09);
    border-radius: 12px;
    box-shadow: 0 20px 30px -20px rgba(15, 23, 42, .25);
    display: flex;
    flex-direction: column;
    left: 0;
    max-height: 176px;
    overflow-y: auto;
    padding: 6px;
    position: absolute;
    right: 0;
    top: 68px;
    z-index: 4;
}

.invoice-export-picker label[b-wr7m9zub72] {
    align-items: center;
    border-radius: 8px;
    display: flex;
    gap: 8px;
    min-height: 32px;
    padding: 6px 8px;
}

.invoice-export-picker label:hover[b-wr7m9zub72] {
    background: #f8fafc;
}

.invoice-export-toggle[b-wr7m9zub72] {
    align-items: center;
    color: #1e293b;
    display: flex;
    font-size: 13px;
    font-weight: 600;
    gap: 10px;
    line-height: 20px;
    margin-bottom: 18px;
}

.invoice-export-generate-btn[b-wr7m9zub72] {
    align-self: end;
    background: #5263ff;
    border: 0;
    border-radius: 10px;
    color: #ffffff;
    font-size: 13px;
    font-weight: 700;
    height: 40px;
    margin: 12px 20px 20px;
}

.invoice-export-generate-btn:disabled[b-wr7m9zub72] {
    background: #94a3b8;
    cursor: not-allowed;
}

.invoice-export-history[b-wr7m9zub72] {
    background: #f8fafc;
    display: flex;
    flex-direction: column;
}

.invoice-export-history-list[b-wr7m9zub72] {
    display: flex;
    min-height: 0;
    flex-direction: column;
    gap: 12px;
    overflow-y: auto;
    padding: 14px 20px 20px;
}

.invoice-export-history-card[b-wr7m9zub72] {
    background: #ffffff;
    border: 1px solid rgba(30, 41, 59, .06);
    border-radius: 16px;
    box-shadow: 0 1px 1px -.5px rgba(30, 41, 59, .03);
    overflow: hidden;
}

.invoice-export-history-top[b-wr7m9zub72] {
    align-items: center;
    display: flex;
    gap: 8px;
    min-height: 48px;
    padding: 8px 12px;
}

.invoice-export-history-top strong[b-wr7m9zub72] {
    color: #1e293b;
    flex: 1;
    font-size: 13px;
    font-weight: 800;
    letter-spacing: -.2px;
    line-height: 24px;
}

.invoice-export-generating[b-wr7m9zub72] {
    align-items: center;
    color: #363af5;
    display: flex;
    font-size: 13px;
    font-weight: 600;
    gap: 6px;
}

.invoice-export-generating span[b-wr7m9zub72] {
    border: 1.5px solid rgba(82, 99, 255, .3);
    border-radius: 50%;
    border-top-color: #363af5;
    height: 16px;
    width: 16px;
}

.invoice-export-note[b-wr7m9zub72] {
    align-items: center;
    border-top: 1px solid rgba(30, 41, 59, .06);
    color: #475569;
    display: flex;
    font-size: 12px;
    font-weight: 500;
    gap: 8px;
    line-height: 16px;
    margin: 0;
    padding: 8px 12px;
}

.invoice-export-note img[b-wr7m9zub72],
.invoice-export-history-line img[b-wr7m9zub72] {
    height: 16px;
    width: 16px;
}

.invoice-export-download[b-wr7m9zub72] {
    align-items: center;
    background: rgba(82, 99, 255, .12);
    border: 0;
    border-radius: 8px;
    display: flex;
    height: 32px;
    justify-content: center;
    padding: 0;
    width: 32px;
}

.invoice-export-download img[b-wr7m9zub72] {
    height: 18px;
    width: 18px;
}

.invoice-export-history-line[b-wr7m9zub72] {
    align-items: center;
    border-top: 1px solid rgba(30, 41, 59, .06);
    color: #475569;
    display: flex;
    font-size: 13px;
    font-weight: 500;
    gap: 8px;
    height: 32px;
    padding: 6px 12px;
}

.invoice-export-history-tags[b-wr7m9zub72] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding: 12px;
}

.invoice-export-history-tags span[b-wr7m9zub72] {
    background: rgba(241, 245, 249, .8);
    border: 1px solid rgba(30, 41, 59, .03);
    color: #1e293b;
}

.invoice-export-backdrop[b-wr7m9zub72] {
    z-index: 1055;
}

@media (max-width: 900px) {
    .invoice-export-modal[b-wr7m9zub72] {
        height: min(720px, calc(100vh - 32px));
    }

    .invoice-export-body[b-wr7m9zub72] {
        grid-template-columns: 1fr;
        height: calc(100% - 80px);
        overflow-y: auto;
    }

    .invoice-export-generate[b-wr7m9zub72] {
        border-right: 0;
    }

    .invoice-export-history[b-wr7m9zub72] {
        min-height: 320px;
    }
}
/* /Pages/Invoices/SubcontractorInvoices/ForSubcontractor/Components/InvoiceForSubcontractorFilterPopup.razor.rz.scp.css */
.invoice-filter-popup .modal-dialog[b-k00dqcdaeb] {
    max-width: 360px;
}

.invoice-filter-modal[b-k00dqcdaeb] {
    border: 1px solid rgba(30, 41, 59, 0.09);
    border-radius: 20px;
    box-shadow: 0 1px 1px -0.5px rgba(30, 41, 59, 0.03),
        0 3px 3px -1.5px rgba(30, 41, 59, 0.03),
        0 20px 20px -12px rgba(30, 41, 59, 0.03),
        0 32px 32px -16px rgba(30, 41, 59, 0.03);
    min-height: 308px;
}

.invoice-filter-popup .invoice-filter-modal[b-k00dqcdaeb] {
    background: #ffffff;
    overflow: hidden;
}

.invoice-filter-popup .modal-header[b-k00dqcdaeb] {
    align-items: flex-end;
    border-bottom: 1px solid rgba(30, 41, 59, 0.09);
    min-height: 40px;
    padding: 8px 16px;
}

.invoice-filter-popup .modal-title[b-k00dqcdaeb] {
    color: #1e293b;
    font-size: 15px;
    font-weight: 700;
    letter-spacing: -0.2px;
    line-height: 24px;
    margin: 0;
}

.invoice-filter-popup .modal-body[b-k00dqcdaeb] {
    display: flex;
    flex-direction: column;
    gap: 16px;
    min-height: 212px;
    overflow-y: auto;
    padding: 16px;
}

.invoice-filter-popup label[b-k00dqcdaeb] {
    color: #475569;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: -0.2px;
    line-height: 16px;
    margin: 0 0 4px;
    padding: 0 2px;
}

.invoice-filter-field[b-k00dqcdaeb] {
    display: flex;
    flex-direction: column;
}

.invoice-filter-select[b-k00dqcdaeb],
.invoice-filter-clear[b-k00dqcdaeb],
.invoice-filter-date-display[b-k00dqcdaeb] {
    background: #ffffff;
    border: 1px solid rgba(30, 41, 59, 0.12);
    border-radius: 8px;
    box-shadow: 0 1px 1px -0.5px rgba(30, 41, 59, 0.03),
        0 3px 3px -1.5px rgba(30, 41, 59, 0.03);
    color: #1e293b;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: -0.2px;
    line-height: 16px;
    min-height: 32px;
}

.invoice-filter-customer-field[b-k00dqcdaeb],
.invoice-filter-date-display[b-k00dqcdaeb] {
    align-items: center;
    display: flex;
    gap: 4px;
    padding: 8px;
}

.invoice-filter-customer-field input[b-k00dqcdaeb] {
    border: 0;
    color: #1e293b;
    flex: 1;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: -0.2px;
    line-height: 16px;
    min-width: 0;
    outline: 0;
}

.invoice-filter-customer-field img:first-child[b-k00dqcdaeb] {
    height: 18px;
    width: 18px;
}

.invoice-filter-customer-field img:last-child[b-k00dqcdaeb] {
    height: 14px;
    width: 14px;
}

.invoice-filter-season-row[b-k00dqcdaeb] {
    display: grid;
    gap: 8px;
    grid-template-columns: 1fr 55px;
}

.invoice-filter-date-row[b-k00dqcdaeb] {
    display: grid;
    grid-template-columns: 117px 211px;
}

.invoice-filter-select[b-k00dqcdaeb] {
    appearance: none;
    background-image: url("img/icons/dark-down-arrow.svg");
    background-position: right 8px center;
    background-repeat: no-repeat;
    background-size: 16px;
    padding: 8px 28px 8px 8px;
}

.invoice-filter-date-row .invoice-filter-select[b-k00dqcdaeb] {
    border-radius: 10px 0 0 10px;
    min-height: 40px;
}

.invoice-filter-clear[b-k00dqcdaeb] {
    background: rgba(241, 245, 249, 0.8);
    border-color: rgba(30, 41, 59, 0.06);
    box-shadow: none;
    color: #1e293b;
    padding: 4px 8px;
}

.invoice-filter-date-display[b-k00dqcdaeb] {
    position: relative;
}

.invoice-filter-date-row .invoice-filter-date-display[b-k00dqcdaeb] {
    border-left: 0;
    border-radius: 0 10px 10px 0;
    min-height: 40px;
    padding: 8px 10px;
}

.invoice-filter-calendar[b-k00dqcdaeb] {
    background: url("img/icons/Calender.svg") center / contain no-repeat;
    display: inline-block;
    flex-shrink: 0;
    height: 18px;
    width: 18px;
}

.invoice-filter-date-display span:not(.invoice-filter-calendar)[b-k00dqcdaeb] {
    font-size: 13px;
    font-weight: 600;
    letter-spacing: -0.2px;
    line-height: 24px;
    white-space: nowrap;
}

.invoice-filter-date-display input[b-k00dqcdaeb] {
    bottom: 0;
    cursor: pointer;
    opacity: 0;
    position: absolute;
    top: 0;
    width: 50%;
}

.invoice-filter-date-display input:first-of-type[b-k00dqcdaeb] {
    left: 0;
}

.invoice-filter-date-display input:last-of-type[b-k00dqcdaeb] {
    right: 0;
}

.invoice-filter-popup .modal-footer[b-k00dqcdaeb] {
    align-items: center;
    border-top: 1px solid rgba(30, 41, 59, 0.09);
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    min-height: 56px;
    padding: 12px 16px;
}

.invoice-filter-popup .modal-footer .btn[b-k00dqcdaeb] {
    border-radius: 8px;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: -0.2px;
    line-height: 16px;
    min-height: 32px;
    padding: 4px 8px;
}

.invoice-filter-popup .reset-btn[b-k00dqcdaeb] {
    background: transparent;
    border: 0;
    color: #475467;
    margin-right: auto;
    padding-left: 0;
}

.invoice-filter-popup .cancel-btn[b-k00dqcdaeb] {
    background: rgba(241, 245, 249, 0.8);
    border: 1px solid rgba(30, 41, 59, 0.06);
    color: #1e293b;
    min-width: 64px;
}

.invoice-filter-popup .apply-btn[b-k00dqcdaeb] {
    background: #5263ff;
    border: 1px solid #5263ff;
    box-shadow: 0 1px 1px -0.5px rgba(30, 41, 59, 0.03), inset 0 3px 3px rgba(255, 255, 255, 0.12);
    color: #ffffff;
    min-width: 91px;
}
/* /Pages/Invoices/SubcontractorInvoices/ForSubcontractor/Components/InvoiceForSubcontractorTable.razor.rz.scp.css */
.invoice-for-subcontractor-workspace[b-7wcf6r18ho]{    display: flex;    flex-direction: column;    gap: var(--wm-card-gap);}.invoice-subcontractor-toolbar[b-7wcf6r18ho], .invoice-subcontractor-card[b-7wcf6r18ho]{    background: var(--wm-card-bg);    border: 1px solid var(--wm-card-border-color);    border-radius: var(--wm-card-radius);    box-shadow: var(--wm-card-shadow);}.invoice-subcontractor-toolbar[b-7wcf6r18ho]{    align-items: center;    display: flex;    gap: 16px;    justify-content: space-between;    min-height: var(--wm-header-row-height);    padding: var(--wm-card-padding);}.invoice-subcontractor-toolbar-actions[b-7wcf6r18ho], .invoice-status-pills[b-7wcf6r18ho], .invoice-subcontractor-filter-actions[b-7wcf6r18ho], .invoice-selected-actions[b-7wcf6r18ho]{    align-items: center;    display: flex;    flex-wrap: wrap;    gap: 10px;}.invoice-subcontractor-toolbar-actions[b-7wcf6r18ho], .invoice-subcontractor-filter-actions[b-7wcf6r18ho], .invoice-selected-actions[b-7wcf6r18ho]{    justify-content: flex-end;}.normal-btn[b-7wcf6r18ho], .invoice-create-btn[b-7wcf6r18ho], .invoice-send-economic[b-7wcf6r18ho]{    align-items: center;    border-radius: 8px;    display: inline-flex;    font-size: 12px;    font-weight: 600;    gap: 6px;    height: 32px;    justify-content: center;    padding: 4px 8px;}.normal-btn[b-7wcf6r18ho]{    background: #f8fafc;    border: 1px solid #e5e7eb;    color: #334155;}.invoice-create-btn img[b-7wcf6r18ho]{    height: 16px;    width: 16px;}.invoice-create-btn[b-7wcf6r18ho], .invoice-send-economic[b-7wcf6r18ho]{    background: #5263ff;    border: 1px solid #5263ff;    color: #ffffff;}.invoice-subcontractor-card[b-7wcf6r18ho]{    overflow: visible;    position: relative;    z-index: 1;}.invoice-subcontractor-card-header[b-7wcf6r18ho]{    align-items: center;    border-bottom: 1px solid #e5e7eb;    display: flex;    gap: 16px;    justify-content: space-between;    min-height: var(--wm-header-row-height);    padding: var(--wm-card-padding);}.invoice-status-pills button[b-7wcf6r18ho]{    background: var(--wm-control-bg);    border: 0;    border-radius: var(--wm-control-radius);    color: var(--wm-text-strong);    font-size: var(--wm-font-sm);    font-weight: var(--wm-weight-strong);    min-height: var(--wm-control-height);    padding: var(--wm-control-padding);}.invoice-status-pills button.active[b-7wcf6r18ho]{    background: #eef0ff;    color: #5263ff;}.close-txt[b-7wcf6r18ho]{    background: #eef0ff;    border: 0;    border-radius: 8px;    color: #5263ff;    font-size: 14px;    font-weight: 700;    gap: 8px;    height: 40px;    padding: 0 14px;}.close-txt img[b-7wcf6r18ho]{    height: 14px;    width: 14px;}.invoice-loading[b-7wcf6r18ho], .invoice-empty[b-7wcf6r18ho]{    align-items: center;    color: #5263ff;    display: flex;    height: 300px;    justify-content: center;}.invoice-empty[b-7wcf6r18ho]{    color: #5F6E85;}.invoice-table-scroll[b-7wcf6r18ho]{    overflow: visible;    position: relative;    z-index: 2;    width: 100%;}.invoice-table[b-7wcf6r18ho]{    border-collapse: collapse;    width: 100%;    min-width: 1000px;
}.invoice-subcontractor-table tbody tr[b-7wcf6r18ho] {
    cursor: pointer;
}
.invoice-subcontractor-table tbody tr.selected[b-7wcf6r18ho]{    background: #eef0ff;}.invoice-subcontractor-table tbody tr:hover[b-7wcf6r18ho]{    background: #f4f6ff;}.invoice-primary-cell[b-7wcf6r18ho]{    display: flex;    flex-direction: column;    min-width: 220px;}.invoice-primary-cell strong[b-7wcf6r18ho]{    color: #1e293b;    font-size: 15px;}.invoice-check[b-7wcf6r18ho]{    align-items: center;    background: #ffffff;    border: 2px solid #dbe3ef;    border-radius: 6px;    display: inline-flex;    height: 24px;    justify-content: center;    width: 24px;}.invoice-check.checked[b-7wcf6r18ho]{    background: #5263ff;    border-color: #5263ff;}.invoice-check.checked[b-7wcf6r18ho]::after{    border: solid #ffffff;    border-width: 0 2px 2px 0;    content: "";    height: 12px;    margin-top: -2px;    transform: rotate(45deg);    width: 6px;}.invoice-status[b-7wcf6r18ho]{    align-items: center;    border-radius: 8px;    display: inline-flex;    font-size: 14px;    font-weight: 700;    gap: 6px;    min-height: 34px;    padding: 6px 10px;}.invoice-status[b-7wcf6r18ho]::before{    background: currentColor;    border-radius: 999px;    content: "";    height: 8px;    width: 8px;}.invoice-status.draft[b-7wcf6r18ho]{    background: #eef2ff;    color: #5263ff;}.invoice-status.sent[b-7wcf6r18ho]{    background: #ecfdf5;    color: #16a34a;}.invoice-status.error[b-7wcf6r18ho]{    background: #fee2e2;    color: #ef4444;}.invoice-status.archived[b-7wcf6r18ho]{    background: #fef3c7;    color: #d97706;}.invoice-status.draft[b-7wcf6r18ho]::before, .invoice-status.archived[b-7wcf6r18ho]::before{    border-radius: 2px;}.invoice-action-menu[b-7wcf6r18ho]{    position: relative;}.invoice-menu-panel[b-7wcf6r18ho]{    background: #ffffff;    border: 1px solid #e2e8f0;    border-radius: 8px;    box-shadow: 0 16px 32px rgba(15, 23, 42, .14);    display: flex;    flex-direction: column;    min-width: 180px;    padding: 6px;    position: absolute;    right: 0;    top: calc(100% + 6px);    z-index: 1060;}.invoice-menu-panel button[b-7wcf6r18ho]{    background: transparent;    border: 0;    border-radius: 6px;    color: #1e293b;    font-size: 13px;    padding: 8px 10px;    text-align: left;}.invoice-menu-panel button:hover[b-7wcf6r18ho]{    background: #f1f5ff;    color: #5263ff;}.invoice-row-menu-btn[b-7wcf6r18ho]{    align-items: center;    background: #f8fafc;    border: 0;    border-radius: 8px;    display: inline-flex;    height: 34px;    justify-content: center;    width: 34px;}.invoice-row-menu-btn img[b-7wcf6r18ho]{    height: 18px;    width: 18px;}.invoice-row-menu-panel[b-7wcf6r18ho]{    border-radius: 18px;    box-shadow: 0 24px 42px rgba(15, 23, 42, .18);    gap: 4px;    min-width: 142px;    padding: 8px;    top: calc(100% + 8px);}.invoice-row-menu-panel button[b-7wcf6r18ho]{    align-items: center;    display: flex;    gap: 10px;    font-weight: 600;    min-height: 36px;}.invoice-row-menu-panel button:first-child[b-7wcf6r18ho]{    background: #eef0ff;    color: #334155;}.invoice-selected-bar[b-7wcf6r18ho]{    align-items: center;    border-top: 1px solid #e5e7eb;    display: flex;    gap: 16px;    justify-content: space-between;    min-height: 72px;    padding: 12px 20px;}.invoice-selected-count[b-7wcf6r18ho]{    align-items: center;    color: #5F6E85;    display: flex;    font-size: 15px;    font-weight: 700;    gap: 10px;}.invoice-selected-count button[b-7wcf6r18ho]{    background: transparent;    border: 0;    padding: 0;}@media (max-width: 900px){    .invoice-subcontractor-toolbar[b-7wcf6r18ho],    .invoice-subcontractor-card-header[b-7wcf6r18ho],    .invoice-selected-bar[b-7wcf6r18ho] {        align-items: stretch;        flex-direction: column;    }}

/* Billing-period tag ("Jan 2026") on dispatch-generated monthly invoices. */
.invoice-period-tag[b-7wcf6r18ho] {
    background: #f1f3f9;
    border-radius: 8px;
    color: #5a6070;
    display: inline-flex;
    font-size: 11px;
    font-weight: 600;
    padding: 2px 8px;
    white-space: nowrap;
    width: fit-content;
}

.invoice-duplicate-tag[b-7wcf6r18ho] {
    background: #fee2e2;
    border-radius: 8px;
    color: #b91c1c;
    display: inline-flex;
    font-size: 11px;
    font-weight: 700;
    padding: 2px 8px;
    white-space: nowrap;
    width: fit-content;
}
/* /Pages/Locations/Complaints.razor.rz.scp.css */
/* The card, its inset, the scrolling and the row contents all come from `wm-fixed-page` and
   the ComplaintsTable component; the page itself only owns the title bar. */
/* /Pages/Locations/Components/AddLocationsToLocationGroupPopup.razor.rz.scp.css */
/* ── Modal shell ─────────────────────────────────────────────────────────── */
.lgp-modal-content[b-a3vqgjr78g] {
  border-radius: 16px;
  overflow: hidden;
  border: none;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.12);
}

/* ── Header ──────────────────────────────────────────────────────────────── */
.lgp-modal-header[b-a3vqgjr78g] {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 20px 20px 16px;
  background: #fff;
  border-bottom: 1px solid #f1f5f9;
}

.lgp-modal-title[b-a3vqgjr78g] {
  font-size: 18px;
  font-weight: 700;
  color: #1e293b;
  margin: 0;
}

.lgp-close-btn[b-a3vqgjr78g] {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  border-radius: 8px;
  border: 1px solid #e2e8f0;
  background: #fff;
  cursor: pointer;
  transition: background 0.15s;
  flex-shrink: 0;
}

.lgp-close-btn:hover[b-a3vqgjr78g] {
  background: #f1f5f9;
}

.lgp-loading-state[b-a3vqgjr78g] {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 220px;
}

/* ── Group name section (white band, full width) ─────────────────────────── */
.lgp-name-section[b-a3vqgjr78g] {
  background: #fff;
  padding: 16px 20px 20px;
  border-bottom: 1px solid #f1f5f9;
  margin: 0 -1.5rem;
}

.lgp-field-label[b-a3vqgjr78g] {
  display: block;
  font-size: 12px;
  font-weight: 600;
  color: #475569;
  margin-bottom: 6px;
}

.lgp-name-input[b-a3vqgjr78g] {
  width: 100%;
  padding: 8px 10px;
  background-color: var(--white);
  border: 1px #1e293b1f solid;
  border-radius: 10px;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
  outline: none;
  font-size: 13px;
  font-weight: 600;
  line-height: 24px;
  letter-spacing: -0.2px;
  color: var(--dark-txt);
}

.lgp-name-input:focus[b-a3vqgjr78g] {
  box-shadow: 0 0 0 0.2rem #dce0ff;
}

.lgp-name-input[b-a3vqgjr78g]::placeholder {
  color: #5F6E85;
}

/* ── Footer ──────────────────────────────────────────────────────────────── */
.lgp-modal-footer[b-a3vqgjr78g] {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 14px 20px;
  background: #fff;
  border-top: 1px solid #f1f5f9;
}

.lgp-btn-cancel[b-a3vqgjr78g] {
  background-color: #f1f5f9cc !important;
  border-color: #1e293b17 !important;
  color: var(--dark-txt) !important;
}

.lgp-btn-action[b-a3vqgjr78g] {
  background-color: var(--purple);
  border-color: #1e293b17;
  color: var(--white);
  backdrop-filter: blur(24px);
  box-shadow:
    0px 1px 1px -0.5px #1e293b08,
    0px 3px 3px 0px #ffffff1f inset;
}

.lgp-btn-action:disabled[b-a3vqgjr78g] {
  opacity: 0.6;
  cursor: not-allowed;
}
/* /Pages/Locations/Components/BulkLocationImportPopup.razor.rz.scp.css */
/* START bulk-location-import-popup */

.bulk-location-import-popup .modal-dialog[b-6wljncko4p] {
    min-width: 1100px;
}

.bulk-location-import-popup .modal-content[b-6wljncko4p] {
    padding: 0 !important;
}

.bulk-location-import-popup .modal-header[b-6wljncko4p] {
    padding: 16px 20px;
    border-bottom: 1px #dee2e6 solid !important;
}

    .bulk-location-import-popup .modal-header h6[b-6wljncko4p] {
        font-size: 18px;
        font-weight: 700;
        line-height: 24px;
        letter-spacing: -0.2px;
        color: var(--dark-txt);
    }

.bulk-location-import-popup .modal-body[b-6wljncko4p] {
    background-color: #F1F5F9;
}

    .bulk-location-import-popup .modal-body .two-box .box[b-6wljncko4p] {
        padding: 24px;
        background-color: var(--white);
        border: #1E293B0F solid;
        border-radius: 24px;
        box-shadow: 0px 3px 3px -1.5px #1E293B08;
    }

        .bulk-location-import-popup .modal-body .two-box .box h6[b-6wljncko4p] {
            font-size: 18px;
            font-weight: 800;
            line-height: 24px;
            letter-spacing: -0.2px;
            color: var(--dark-txt);
        }

        .bulk-location-import-popup .modal-body .two-box .box button[b-6wljncko4p] {
            height: 40px;
            border: none;
            outline: none;
            border-radius: 10px;
            width: 100%;
        }

        .bulk-location-import-popup .modal-body .two-box .box p[b-6wljncko4p] {
            font-size: 15px;
            font-weight: 500;
            line-height: 24px;
            letter-spacing: -0.2px;
            color: var(--gray-txt);
        }

            .bulk-location-import-popup .modal-body .two-box .box p b[b-6wljncko4p] {
                font-weight: 800;
            }

    .bulk-location-import-popup .modal-body .upload-box[b-6wljncko4p] {
        height: 404px;
        background-color: var(--white);
        border: 2px var(--purple) dashed;
        border-radius: 24px;
        box-shadow: 0px 3px 3px -0.5px #1E293B08;
    }

    .bulk-location-import-popup .modal-body .data-preview-box h6[b-6wljncko4p] {
        font-size: 18px;
        font-weight: 800;
        line-height: 24px;
        letter-spacing: -0.2px;
        color: var(--dark-txt);
    }

    .bulk-location-import-popup .modal-body .data-preview-box .top-header span.bagge[b-6wljncko4p] {
        padding: 6px 10px;
        background-color: var(--white);
        border: 1px #1E293B17 solid;
        border-radius: 8px;
        font-size: 12px;
        font-weight: 600;
        line-height: 16px;
        letter-spacing: -0.2px;
        color: var(--gray-txt);
        box-shadow: 0px 2px 1.5px -0.5px #1E293B08;
    }

    .bulk-location-import-popup .modal-body .data-preview-box .top-header div p[b-6wljncko4p] {
        font-size: 13px;
        font-weight: 600;
        line-height: 20px;
        letter-spacing: -0.2px;
        color: var(--dark-txt);
    }

    .bulk-location-import-popup .modal-body .data-preview-box table[b-6wljncko4p] {
        border: 1px #1E293B0F solid;
        border-radius: 16px;
        border-collapse: separate;
    }

        .bulk-location-import-popup .modal-body .data-preview-box table th[b-6wljncko4p] {
            padding: 12px 16px;
            background-color: #F1F5F9;
            font-size: 13px;
            font-weight: 700;
            line-height: 20px;
            letter-spacing: -0.2px;
            color: var(--dark-txt);
        }

        .bulk-location-import-popup .modal-body .data-preview-box table td[b-6wljncko4p] {
            background-color: var(--white);
            padding: 18px 16px;
            font-size: 13px;
            font-weight: 600;
            line-height: 20px;
            letter-spacing: -0.2px;
            color: var(--dark-txt);
            cursor: pointer;
        }

            .bulk-location-import-popup .modal-body .data-preview-box table td:hover[b-6wljncko4p] {
                background-color: #5263FF1F;
            }

            .bulk-location-import-popup .modal-body .data-preview-box table td img[b-6wljncko4p] {
                height: 24px;
            }

        .bulk-location-import-popup .modal-body .data-preview-box table tr:last-child td:first-child[b-6wljncko4p] {
            border-radius: 0 0 0 16px;
        }

        .bulk-location-import-popup .modal-body .data-preview-box table tr:last-child td:last-child[b-6wljncko4p] {
            border-radius: 0 0 16px 0;
        }

        .bulk-location-import-popup .modal-body .data-preview-box table tr:nth-child(2) td:first-child[b-6wljncko4p] {
            border-left: 2px var(--badge-orange) solid;
        }

    .bulk-location-import-popup .modal-body .validation-results .title h6[b-6wljncko4p] {
        font-size: 18px;
        font-weight: 800;
        line-height: 24px;
        letter-spacing: -0.2px;
        color: var(--dark-txt);
    }

    .bulk-location-import-popup .modal-body .validation-results .title .badgee[b-6wljncko4p] {
        background-color: #ED40301F;
        padding: 6px;
        border-radius: 8px;
        gap: 2px;
    }

    .bulk-location-import-popup .modal-body .validation-results .title .badgee-green[b-6wljncko4p] {
        background-color: #409B3F1F;
        color: var(--green);
        padding: 6px;
        border-radius: 8px;
        gap: 2px;
    }

        .bulk-location-import-popup .modal-body .validation-results .title .badgee img[b-6wljncko4p] {
            height: 16px;
        }

        .bulk-location-import-popup .modal-body .validation-results .title .badgee-green img[b-6wljncko4p] {
            height: 16px;
        }

        .bulk-location-import-popup .modal-body .validation-results .title .badgee p[b-6wljncko4p] {
            padding: 0 4px;
            font-size: 12px;
            font-weight: 600;
            line-height: 16px;
            letter-spacing: -0.2px;
            color: var(--orange);
        }

        .bulk-location-import-popup .modal-body .validation-results .title .badgee-green p[b-6wljncko4p] {
            padding: 0 4px;
            font-size: 12px;
            font-weight: 600;
            line-height: 16px;
            letter-spacing: -0.2px;
            color: var(--green);
        }

    .bulk-location-import-popup .modal-body .validation-results .error[b-6wljncko4p] {
        background-color: #ED40301F;
        border-left: 4px #ED403066 solid;
        padding: 16px;
        border-radius: 16px;
    }

        .bulk-location-import-popup .modal-body .validation-results .error p[b-6wljncko4p] {
            font-size: 15px;
            font-weight: 700;
            line-height: 24px;
            letter-spacing: -0.2px;
            color: #BA1E0F;
        }

            .bulk-location-import-popup .modal-body .validation-results .error p span[b-6wljncko4p] {
                font-weight: 500;
            }

.bulk-location-import-popup .modal-footer[b-6wljncko4p] {
    padding: 16px 20px;
}

    .bulk-location-import-popup .modal-footer button[b-6wljncko4p] {
        width: 214px;
    }

.slider[b-6wljncko4p]:before {
    content: "";
    position: absolute;
    height: 18px;
    width: 18px;
    left: 2px;
    top: 2px;
    border-radius: 1000px;
    background: linear-gradient(180deg, #e2e8f0 0%, #ffffff 100%);
    border: 3.5px solid #f9fbfc;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.15);
    transition: 0.3s;
}

/*Dropzone*/
.bulk-location-import-popup .upload-box[b-6wljncko4p] {
    height: 404px;
    background-color: var(--white);
    border: 2px var(--purple) dashed;
    border-radius: 24px;
    box-shadow: 0px 3px 3px -0.5px #1E293B08;
}

    .bulk-location-import-popup .upload-box img[b-6wljncko4p] {
        height: 32px;
    }

    .bulk-location-import-popup .upload-box h6[b-6wljncko4p] {
        font-size: 18px;
        font-weight: 800;
        line-height: 24px;
        letter-spacing: -0.2px;
        color: var(--dark-txt);
    }

    .bulk-location-import-popup .upload-box span[b-6wljncko4p] {
        font-size: 13px;
        font-weight: 500;
        line-height: 20px;
        letter-spacing: -0.2px;
        color: var(--gray-txt-2);
    }

    .bulk-location-import-popup .upload-box label[b-6wljncko4p] {
        display: flex;
        justify-content: center;
        align-items: center;
        text-align: center;
        gap: 2px;
        padding: 8px 10px;
        border: none;
        border-radius: 10px;
        outline: none;
        height: 40px;
        width: max-content;
        background: linear-gradient(var(--purple), var(--purple)) padding-box, linear-gradient(90deg, #1E293B17, #1E293B2E) border-box;
        backdrop-filter: blur(24px);
        box-shadow: 0px 1px 1px -0.5px #1E293B08, 0px 3px 3px 0px #FFFFFF1F inset;
        font-size: 13px;
        font-weight: 600;
        line-height: 24px;
        letter-spacing: -0.2px;
    }

        .bulk-location-import-popup .upload-box label img[b-6wljncko4p] {
            height: 18px;
        }

        .bulk-location-import-popup .upload-box label p[b-6wljncko4p] {
            font-size: 13px;
            font-weight: 600;
            line-height: 24px;
            letter-spacing: -0.2px;
            color: var(--white);
            padding: 0 4px;
        }

        .bulk-location-import-popup .upload-box label:hover[b-6wljncko4p] {
            opacity: 0.9;
        }

        .bulk-location-import-popup .upload-box label input[b-6wljncko4p] {
            position: absolute;
            left: 50%;
            top: 50%;
            transform: translate(-50%, -50%);
            height: 40px;
            width: 170px;
            opacity: 0;
        }

    .bulk-location-import-popup .upload-box.dragging[b-6wljncko4p] {
        border-color: var(--purple);
        background-color: #f5f3ff;
        transform: scale(1.01);
        transition: all 0.2s ease;
    }
/*Dropzone*/


@media (max-width:1240px) {
    .bulk-location-import-popup .modal-dialog[b-6wljncko4p] {
        min-width: 95%;
    }
}

/* END bulk-location-import-popup */
/* /Pages/Locations/Components/CreateOrEditRulePopup.razor.rz.scp.css */
.rule-modal-body[b-eeyf20by4q] {
    padding: 16px 20px !important;
    background-color: #F1F5F9 !important;
    max-height: 600px;
    overflow-y: scroll;
    scrollbar-width: none;
}

.day-btn[b-eeyf20by4q] {
    height: 40px;
    padding: 6px 14px;
    border-radius: 1000px;
    border: none;
    background: var(--white);
    font-size: 13px;
    font-weight: 600;
    color: var(--dark-txt);
    cursor: pointer;
    transition: all 0.15s;
}

    .day-btn:hover:not(.active)[b-eeyf20by4q] {
        background: #aab2ff1f;
        color: var(--purple-2);
    }

    .day-btn.active[b-eeyf20by4q] {
        background: #5263FF1F;
        color: var(--purple-2);
    }

.slider[b-eeyf20by4q]:before {
    content: "";
    position: absolute;
    height: 18px;
    width: 18px;
    left: 2px;
    top: 2px;
    border-radius: 1000px;
    background: linear-gradient(180deg, #e2e8f0 0%, #ffffff 100%);
    border: 3.5px solid #f9fbfc;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.15);
    transition: 0.3s;
}

.multi-tabs[b-eeyf20by4q] {
    padding: 4px;
    background-color: #F1F5F9CC;
    border: 1px #1E293B08 solid;
    border-radius: 12px;
    width: max-content;
}

.multi-tabs button.tab[b-eeyf20by4q] {
    padding: 6px;
    background-color: transparent;
    border: 1px transparent solid;
    border-radius: 10px;
    outline: none;
    font-size: 13px;
    font-weight: 600;
    line-height: 24px;
    letter-spacing: -0.2px;
    color: var(--gray-txt);
    width: 100%;
    transition: background-color 0.35s cubic-bezier(0.22, 1, 0.36, 1), border-color 0.35s cubic-bezier(0.22, 1, 0.36, 1), box-shadow 0.35s cubic-bezier(0.22, 1, 0.36, 1), color 0.25s ease, transform 0.25s cubic-bezier(0.22, 1, 0.36, 1);
    will-change: transform, box-shadow, background-color, border-color, color;
}

.multi-tabs button.tab.active[b-eeyf20by4q] {
    background: linear-gradient(to bottom, rgba(255, 255, 255, 1), rgba(248, 250, 252, 1));
    border: 1px solid rgba(15, 23, 42, 0.06);
    box-shadow: 0 1px 1px rgba(15, 23, 42, 0.03), 0 4px 10px rgba(15, 23, 42, 0.06), inset 0 1px 0 rgba(255, 255, 255, 0.8);
    color: var(--dark-txt);
    transform: scale(1.015);
}

.time-label[b-eeyf20by4q] {
    font-size: 13px;
    font-weight: 600;
    color: var(--dark-txt);
}

.time-input-box[b-eeyf20by4q] {
    background: var(--white);
    border: 1px solid #E2E8F0;
    border-radius: 12px;
    padding: 10px 14px;
    font-size: 13px;
    color: var(--dark-txt);
}

    .time-input-box i[b-eeyf20by4q] {
        font-size: 16px;
        color: #94A3B8;
    }

.time-input[b-eeyf20by4q] {
    border: none;
    outline: none;
    background: transparent;
    font-size: 13px;
    font-weight: 600;
    color: var(--dark-txt);
    width: 80px;
}

.time-separator[b-eeyf20by4q] {
    font-size: 13px;
    font-weight: 600;
    color: var(--dark-txt);
    flex-shrink: 0;
}

.day-label[b-eeyf20by4q] {
    font-size: 13px;
    font-weight: 700;
    color: var(--dark-txt);
    min-width: 100px;
}

.day-select[b-eeyf20by4q] {
    background: var(--white);
    border: 1px solid #E2E8F0;
    border-radius: 12px;
    padding: 10px 14px;
    font-size: 13px;
    font-weight: 600;
    color: var(--dark-txt);
    outline: none;
    cursor: pointer;
}

/* START new-rule-popup */

.modal-dialog[b-eeyf20by4q] {
    min-width: 600px;
    width: 760px;
}

.modal-content[b-eeyf20by4q] {
    padding: 0 !important;
}

.modal-header[b-eeyf20by4q] {
    padding: 16px 20px;
    border-bottom: 1px #dee2e6 solid !important;
}

    .modal-header .modal-title[b-eeyf20by4q] {
        font-size: 18px;
        font-weight: 700;
        line-height: 24px;
        letter-spacing: -0.2px;
        color: var(--dark-txt);
    }

.modal-header button.btn-close[b-eeyf20by4q] {
    height: 32px;
    width: 32px;
    background-size: 13px;
}

.modal-body[b-eeyf20by4q] {
    padding: 16px 20px;
    background-color: #F1F5F9;
    max-height: 668px;
    overflow: scroll;
    scrollbar-width: none;
}

    h6[b-eeyf20by4q] {
        font-size: 18px;
        font-weight: 800;
        line-height: 24px;
        letter-spacing: -0.2px;
        color: var(--dark-txt);
    }

    input[b-eeyf20by4q] {
        height: 40px;
        background-color: var(--white);
        border: 1px #1E293B1F solid;
        border-radius: 10px;
        outline: none;
        box-shadow: 0 1px 1px -0.5px #1E293B08;
        padding: 8px 14px;
        font-size: 13px;
        font-weight: 600;
        line-height: 24px;
        letter-spacing: -0.2px;
        color: var(--dark-txt);
    }

    .select-wrapper[b-eeyf20by4q] {
        position: relative;
    }

    .route-popup[b-eeyf20by4q] {
        position: absolute;
        top: 100%;
        left: 0%;
        width: 330px;
        max-height: 224px;
        overflow-y: scroll;
        scrollbar-width: none;
        background-color: var(--white);
        border: 1px #1E293B17 solid;
        border-radius: 20px;
        box-shadow: 0 10px 25px rgba(0, 0, 0, 0.15);
        padding: 4px;
        display: none;
        overflow-y: auto;
        z-index: 100;
    }

    .route-option[b-eeyf20by4q] {
        padding: 8px 10px;
        border-radius: 10px;
        cursor: pointer;
        font-size: 13px;
        font-weight: 600;
        line-height: 24px;
        color: var(--gray-txt);
        margin-bottom: 4px;
        display: flex;
    }

    .route-hidden[b-eeyf20by4q] {
        display: none !important;
    }

    .route-option:hover[b-eeyf20by4q] {
        background: #5263FF1F;
        color: var(--purple-2);
    }

    .route-option img[b-eeyf20by4q] {
        height: 18px;
    }

    .route-option.added-active[b-eeyf20by4q] {
        background-color: #5263FF1F;
        color: var(--purple-2);
    }

    .selected-name[b-eeyf20by4q] {
        background: #e8ecff;
        padding: 6px 10px;
        border-radius: 8px;
    }


    .box[b-eeyf20by4q] {
        background-color: var(--white);
        padding: 10px;
        border: 1px #1E293B1F solid;
        border-radius: 10px;
        box-shadow: 0px 3px 3px -1.5px #1E293B08;
        outline: none;
        appearance: none;
        -webkit-appearance: none;
        -moz-appearance: none;
        background-image: url("../img/icons/gray-arrow.png");
        background-repeat: no-repeat;
        background-position: right 8px center;
        background-size: 18px;
        cursor: pointer;
    }

        .box .selected-name[b-eeyf20by4q] {
            padding: 4px 6px 4px 8px;
            background-color: #5263FF1F;
            border-radius: 8px;
            font-size: 12px;
            font-weight: 600;
            line-height: 16px;
            letter-spacing: -0.2px;
            color: var(--purple-2);
            white-space: nowrap;
        }

        .box input[b-eeyf20by4q] {
            height: 100%;
            width: 95% !important;
            border: none;
            outline: none;
            font-size: 13px;
            font-weight: 600;
            line-height: 24px;
            letter-spacing: -0.2px;
            color: var(--gray-txt-2);
            padding-left: 4px;
        }

    .week-days span.p-head[b-eeyf20by4q] {
        font-size: 15px;
        font-weight: 600;
        line-height: 24px;
        letter-spacing: -0.2px;
        color: var(--dark-txt);
    }

    .week-days .week p[b-eeyf20by4q] {
        padding: 8px 14px;
        background-color: var(--white);
        border-radius: 50px;
        font-size: 13px;
        font-weight: 600;
        line-height: 24px;
        letter-spacing: -0.2px;
        color: var(--dark-txt);
        cursor: pointer;
    }

        .week-days .week p.active[b-eeyf20by4q] {
            background-color: #5263FF1F;
            color: var(--purple-2);
        }

    .restrict[b-eeyf20by4q] {
        padding: 16px;
        background-color: var(--white);
        border: none;
        box-shadow: 
            0px 20px 20px -12px #1E293B08,
            0px 3px 3px -1.5px #1E293B08,
            0px 1px 1px -0.5px #1E293B08;
        border-radius: 20px;
    }

        .restrict .title p[b-eeyf20by4q] {
            font-size: 15px;
            font-weight: 700;
            line-height: 24px;
            letter-spacing: -0.2px;
            color: var(--dark-txt);
        }

        .restrict .tabs[b-eeyf20by4q] {
            padding: 4px;
            background-color: #F1F5F9CC;
            border: 1px #1E293B08 solid;
            border-radius: 12px;
            width: max-content;
        }

            .restrict .tabs p[b-eeyf20by4q] {
                padding: 8px 12px;
                background-color: transparent;
                border: 1px transparent solid;
                border-radius: 8px;
                font-size: 12px;
                font-weight: 600;
                line-height: 16px;
                letter-spacing: -0.2px;
                color: var(--gray-txt);
                cursor: pointer;
            }

                .restrict .tabs p.active[b-eeyf20by4q] {
                    background-color: var(--white);
                    border-color: #1E293B0F;
                    box-shadow: 0 3px 3px -1.5px #1E293B08;
                    color: var(--dark-txt);
                }

        .restrict .date-select label[b-eeyf20by4q] {
            padding-left: 2px;
            font-size: 13px;
            font-weight: 600;
            line-height: 20px;
            letter-spacing: -0.2px;
            color: var(--gray-txt);
        }

        .restrict .date-select p[b-eeyf20by4q] {
            padding-bottom: 10px;
            font-size: 15px;
            font-weight: 700;
            line-height: 24px;
            letter-spacing: -0.2px;
            color: var(--gray-txt);
        }

        .restrict .date-select input[b-eeyf20by4q] {
            background-image: url(../img/icons/clock-gray-2.svg);
            background-size: 17px;
            background-repeat: no-repeat;
            background-position: center left 10px;
            padding-left: 34px;
        }

            .restrict .date-select input[type="time"][b-eeyf20by4q]::-webkit-calendar-picker-indicator {
                opacity: 0;
                display: none;
            }

    /* Rule price against the address's own price */
    .price-cell[b-eeyf20by4q] {
        display: flex;
        flex-direction: column;
        gap: 2px;
    }
    .price-base[b-eeyf20by4q] {
        font-size: 11px;
        font-weight: 600;
        line-height: 14px;
        color: var(--gray-txt);
        white-space: nowrap;
    }
    .price-row[b-eeyf20by4q] {
        display: flex;
        align-items: center;
        gap: 6px;
    }
    .price-row .price-input[b-eeyf20by4q] {
        flex: 1 1 0;
        min-width: 0;
    }
    .price-delta[b-eeyf20by4q] {
        flex: 0 0 auto;
    }
    .price-delta[b-eeyf20by4q] {
        font-size: 12px;
        font-weight: 700;
        line-height: 18px;
        padding: 0 6px;
        border-radius: 999px;
        white-space: nowrap;
    }
    .price-delta.up[b-eeyf20by4q] {
        color: #15803d;
        background: #dcfce7;
    }
    .price-delta.down[b-eeyf20by4q] {
        color: #b91c1c;
        background: #fee2e2;
    }

    .table-wrapper[b-eeyf20by4q] {
        border: 1px solid #1E293B0F;
        box-shadow: 
            0px 20px 20px -12px #1E293B08,
            0px 3px 3px -1.5px #1E293B08,
            0px 1px 1px -0.5px #1E293B08;
        border-radius: 16px;
        overflow: hidden;
    }
    
    table[b-eeyf20by4q] {
        border: none;
        box-shadow: none;
        border-radius: 16px;
        /* border-collapse: separate; */
        overflow: hidden;
    }

        table thead tr[b-eeyf20by4q] {
            background: #F1F5F9 !important;
        }

        table th[b-eeyf20by4q] {
            padding: 12px 12px 12px 0;
        }

        table td[b-eeyf20by4q] {
            padding: 8px 16px 8px 0;
        }

        table th p[b-eeyf20by4q] {
            font-size: 13px;
            font-weight: 700;
            line-height: 20px;
            letter-spacing: -0.2px;
            color: var(--dark-txt);
        }

        table td p[b-eeyf20by4q] {
            font-size: 13px;
            font-weight: 600;
            line-height: 20px;
            letter-spacing: -0.2px;
            color: var(--dark-txt);
        }

        table tr:nth-child(odd)[b-eeyf20by4q] {
            background-color: var(--white);
        }
        
        table tr:nth-child(even)[b-eeyf20by4q] {
            background-color: #F8FAFC;
        }

        table tr:last-child td:first-child[b-eeyf20by4q] {
            border-radius: 0 0 0 14px;
        }

        table tr:last-child td:last-child[b-eeyf20by4q] {
            border-radius: 0 0 14px 0;
        }

    .accordion .accordion-item[b-eeyf20by4q] {
        border: none;
        box-shadow: 
            0px 20px 20px -12px #1E293B08,
            0px 3px 3px -1.5px #1E293B08,
            0px 1px 1px -0.5px #1E293B08;
        border-radius: 20px;
    }

    .accordion .accordion-header button[b-eeyf20by4q] {
        font-size: 18px;
        font-weight: 800;
        line-height: 24px;
        letter-spacing: -0.2px;
        padding: 16px;
        box-shadow: none;
        border-radius: 20px !important;
        background-color: var(--white);
    }

    .accordion .accordion-collapse .accordion-body label[b-eeyf20by4q] {
        font-size: 13px;
        font-weight: 600;
        line-height: 20px;
        letter-spacing: -0.2px;
        color: var(--gray-txt);
        margin-left: 2px;
    }

    .accordion .accordion-collapse .accordion-body span[b-eeyf20by4q] {
        font-size: 12px;
        font-weight: 500;
        line-height: 16px;
        letter-spacing: -0.2px;
        color: var(--gray-txt-2);
    }

    .accordion .accordion-collapse .accordion-body textarea[b-eeyf20by4q] {
        height: 100px;
        padding: 8px 10px;
        background-color: var(--white);
        border: 1px #1E293B1F solid;
        border-radius: 10px;
        box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
        outline: none;
        font-size: 13px;
        font-weight: 600;
        line-height: 24px;
        letter-spacing: -0.2px;
        color: var(--dark-txt);
    }

    .accordion .accordion-collapse .accordion-body textarea[b-eeyf20by4q]::placeholder {
        color: #5F6E85;
    }

    .accordion .accordion-collapse .accordion-body textarea:focus[b-eeyf20by4q] {
        box-shadow: 0 0 0 0.2rem #dce0ff;
    }

    .accordion .accordion-collapse .accordion-body textarea:disabled[b-eeyf20by4q] {
        background: transparent;
        box-shadow: initial;
        cursor: not-allowed;
    }

    .accordion .accordion-collapse .accordion-body button.add-img[b-eeyf20by4q] {
        gap: 2px;
        background-color: #F1F5F9CC;
        border: 1px #1E293B0F solid;
        border-radius: 10px;
        padding: 8px;
        outline: none;
        position: relative;
        cursor: pointer !important;
    }

        .accordion .accordion-collapse .accordion-body button.add-img img[b-eeyf20by4q] {
            height: 18px;
        }

        .accordion .accordion-collapse .accordion-body button.add-img p[b-eeyf20by4q] {
            font-size: 13px;
            font-weight: 600;
            line-height: 24px;
            letter-spacing: -0.2px;
            color: var(--dark-txt);
            padding: 0 4px;
        }

        .accordion .accordion-collapse .accordion-body button.add-img input[b-eeyf20by4q] {
            opacity: 0;
            position: absolute;
            left: 0;
            top: 0;
            z-index: 99;
            width: 100%;
        }

.modal-footer[b-eeyf20by4q] {
    padding: 16px 20px;
}

    .modal-footer button[b-eeyf20by4q] {
        padding: 8px;
        background-color: transparent;
        border: 1px transparent solid;
        border-radius: 10px;
        font-size: 13px;
        font-weight: 600;
        line-height: 24px;
        letter-spacing: -0.2px;
    }

        .modal-footer button.close-btn[b-eeyf20by4q] {
            background-color: #F1F5F9CC;
            border-color: #1E293B0F;
            color: var(--dark-txt);
        }

        .modal-footer button.create-btn[b-eeyf20by4q] {
            background-color: var(--purple);
            border-color: #1E293B17;
            color: var(--white);
        }

.optional-label[b-eeyf20by4q] {
    font-size: 12px;
    font-weight: 400;
    color: #94A3B8;
}

.desc-textarea[b-eeyf20by4q] {
    width: 100%;
    border: 1px solid #E2E8F0;
    border-radius: 12px;
    padding: 12px 14px;
    font-size: 13px;
    font-weight: 500;
    color: var(--dark-txt);
    outline: none;
    resize: vertical;
    min-height: 100px;
    background: var(--white);
}

    .desc-textarea:focus[b-eeyf20by4q] {
        border-color: var(--purple);
    }

.add-img[b-eeyf20by4q] {
    background: #F8FAFC;
    border: 1px solid #E2E8F0;
    border-radius: 12px;
    padding: 12px;
    gap: 8px;
    transition: all 0.15s;
}

    .add-img:hover[b-eeyf20by4q] {
        background-color: #e2e8f0 !important;
    }

    .add-img p[b-eeyf20by4q] {
        font-size: 13px;
        font-weight: 600;
        color: var(--dark-txt);
    }

    .add-img img[b-eeyf20by4q] {
        height: 18px;
    }

.det-img-strip-outer[b-eeyf20by4q] {
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
    position: relative;
}

.det-img-strip[b-eeyf20by4q] {
    display: flex;
    gap: 10px;
    overflow-x: auto;
    scroll-behavior: smooth;
    scrollbar-width: none;
    flex: 1;
}

    .det-img-strip[b-eeyf20by4q]::-webkit-scrollbar {
        display: none;
    }

.det-img-thumb[b-eeyf20by4q] {
    position: relative;
    width: 120px;
    height: 120px;
    border-radius: 12px;
    overflow: hidden;
    flex-shrink: 0;
    background: #E2E8F0;
}

    .det-img-thumb img[b-eeyf20by4q] {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

.det-img-placeholder[b-eeyf20by4q] {
    width: 100%;
    height: 100%;
    background: #E2E8F0;
}

.det-img-thumb-delete[b-eeyf20by4q] {
    position: absolute;
    top: 6px;
    right: 6px;
}

    .det-img-thumb-delete button[b-eeyf20by4q] {
        background: #EF4444;
        border: none;
        border-radius: 8px;
        width: 28px;
        height: 28px;
        display: flex;
        align-items: center;
        justify-content: center;
        cursor: pointer;
    }

        .det-img-thumb-delete button img[b-eeyf20by4q] {
            height: 18px;
            width: 18px;
        }

    .det-img-thumb-delete button:hover:not(:disabled)[b-eeyf20by4q] {
        background: #F44A3B;
    }

.det-img-nav[b-eeyf20by4q] {
    flex-shrink: 0;
    width: 28px;
    height: stretch;
    background-color: #f1f5f9cc;
    border: 1px solid #1e293b17;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    font-weight: 700;
    color: var(--dark-txt);
    cursor: pointer;
    transition: background-color 0.12s;
    line-height: 1;
}

    .det-img-nav:hover[b-eeyf20by4q] {
        background-color: #e2e8f0;
    }

    .det-img-nav img[b-eeyf20by4q] {
        height: 18px;
    }
    
.day-select-merged[b-eeyf20by4q] {
    flex: 1;
    border: none !important;
    box-shadow: none !important;
    border-radius: 0 !important;
}

.range-group[b-eeyf20by4q] {
    width: 100%;
    height: 40px;
    display: flex;
    align-items: center;
    border: 1px solid #1E293B1F;
    border-radius: 10px;
    background: #fff;
    background-color: var(--white);
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
    overflow: hidden;
}

.range-group:focus[b-eeyf20by4q],
.range-group:focus-within[b-eeyf20by4q] {
    box-shadow: 0 0 0 0.2rem #dce0ff !important;
}

.range-group:hover:not(.disabled)[b-eeyf20by4q] {
    border-color: #eaecff !important;
}

.range-group.disabled[b-eeyf20by4q] {
    background: transparent !important;
    box-shadow: initial !important;
    cursor: not-allowed !important;
}

.range-group-divider[b-eeyf20by4q] {
    width: 1px;
    align-self: stretch;
    background-color: #1E293B1F;
    flex-shrink: 0;
}

[b-eeyf20by4q] .dropdown:has(> .range-day-merged) {
    width: fit-content !important;
}

[b-eeyf20by4q] .range-day-merged {
    border: none !important;
    box-shadow: none !important;
    border-radius: 0 !important;
    background: transparent !important;
    height: 40px !important;
    width: 145px !important;
    white-space: nowrap;
    outline: none !important;
}

[b-eeyf20by4q] .range-day-merged:focus {
    box-shadow: none !important;
}

[b-eeyf20by4q] .wm-time-container.range-time-merged {
    width: fit-content !important;
}

[b-eeyf20by4q] .range-time-merged .wm-time-input {
    border: none !important;
    box-shadow: none !important;
    border-radius: 0 !important;
    background: transparent !important;
    height: 40px !important;
    width: 91px !important;
    white-space: nowrap;
    outline: none !important;
}

[b-eeyf20by4q] .range-time-merged .wm-time-input:focus {
    box-shadow: none !important;
}

@media (max-width:767px) {
    .modal-dialog[b-eeyf20by4q] {
        min-width: 95%;
    }
}

/* END new-rule-popup */
.rule-hint[b-eeyf20by4q] {
    font-size: 13px;
    font-weight: 500;
    line-height: 18px;
    color: #475569;
    margin: 0;
}
/* /Pages/Locations/Components/DrawingConfiguratorModal.razor.rz.scp.css */
/* ── Modal body ──────────────────────────────────────────────────────────── */

.dcm-body[b-pvq1z6u925] {
	padding: 5px 20px 20px 20px;
	display: flex;
	flex-direction: column;
	gap: 16px;
}

.dcm-subtitle[b-pvq1z6u925] {
	font-size: 13px;
	color: #5F6E85;
	margin: 0;
}

/* ── Config list ─────────────────────────────────────────────────────────── */

.dcm-list[b-pvq1z6u925] {
	display: flex;
	flex-direction: column;
	gap: 16px;
	max-height: 400px;
	overflow: auto;
	scrollbar-width: none;
}

/* Neutralize the global `.new-location .modal-body form` styles that leak onto
   the EditForm-rendered <form>. `::deep` is required because the <form> is
   rendered by the child EditForm component and never receives this component's
   scope attribute. */
.dcm-form-row[b-pvq1z6u925]  form {
	padding: 0 !important;
	background-color: transparent !important;
	border: none !important;
	border-radius: 0 !important;
	box-shadow: none !important;
}

/* ── Display row ─────────────────────────────────────────────────────────── */
.dcm-config-row[b-pvq1z6u925] {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 16px;
	background: #F8FAFC;
	border: 1px solid #E2E8F0;
	border-radius: 12px;
}

.dcm-color-dot[b-pvq1z6u925] {
	width: 16px;
	height: 16px;
	border-radius: 50%;
	flex-shrink: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	color: #fff;
	font-size: 9px;
	line-height: 1;
}

.dcm-config-name[b-pvq1z6u925] {
	flex: 1;
	font-size: 15px;
	font-weight: 700;
	color: #1E293B;
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	letter-spacing: -0.2px;
	line-height: 24px;
}

.dcm-type-badge[b-pvq1z6u925] {
	font-size: 12px;
	font-weight: 600;
	line-height: 16px;
	letter-spacing: -0.02px;
	color: #475569;
	background: #FFFFFF;
	border: 1px solid #1E293B17;
	border-radius: 8px;
	padding: 4px 6px;
	white-space: nowrap;
	flex-shrink: 0;
	backdrop-filter: blur(24px);
	box-shadow: 0px 2px 1.5px -0.5px #1E293B08;
	box-shadow: 0px 2px 3px 0px #FFFFFF08 inset;
}

.dcm-row-actions[b-pvq1z6u925] {
	display: flex;
	gap: 4px;
	flex-shrink: 0;
}

.dcm-icon-btn[b-pvq1z6u925] {
	width: 24px;
	height: 24px;
	border: none;
	background: none;
	border-radius: 6px;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0;
}


/* ── Inline form row ─────────────────────────────────────────────────────── */

.dcm-form-row[b-pvq1z6u925] {
	padding: 14px 15px;
	background: #F8FAFC;
	border: 1.5px solid #E2E8F0;
	border-radius: 12px;
}

.dcm-form-fields[b-pvq1z6u925] {
	display: flex;
	align-items: flex-end;
	gap: 8px;
	flex-wrap: wrap;
}

.dcm-field[b-pvq1z6u925] {
	display: flex;
	flex-direction: column;
	gap: 4px;
	flex: 1;
	min-width: 120px;
}

.dcm-field-type[b-pvq1z6u925] {
	min-width: 140px;
	max-width: 160px;
}

.dcm-label[b-pvq1z6u925] {
	font-size: 13px;
	font-weight: 600;
	color: #475569;
	letter-spacing:-0.2px;
	line-height:20px;
}

.dcm-input[b-pvq1z6u925] {
	height: 40px;
	padding: 8px 10px;
	border: 1px solid #E2E8F0;
	border-radius: 8px;
	font-size: 13px;
	color: #1E293B;
	background: white;
	outline: none;
	transition: border-color .15s;
	font-family: inherit;
	gap:4px;
}

	.dcm-input:focus[b-pvq1z6u925] {
		box-shadow: 0px 0px 0px 3px #5263FF33;
	}

/* ── Inline color picker (WMColorPicker) ─────────────────────────────────── */

.dcm-color-field[b-pvq1z6u925] {
	display: flex;
	align-items: center;
	gap: 8px;
	flex-shrink: 0;
}

/* ── Save button in inline form ──────────────────────────────────────────── */

.dcm-save-btn[b-pvq1z6u925] {
	height: 36px;
	padding: 0 16px;
	flex-shrink: 0;
	align-self: flex-end;
}

/* ── Add new button ──────────────────────────────────────────────────────── */

.dcm-add-btn[b-pvq1z6u925] {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 7px 14px;
	border: 1.5px dashed #CBD5E1;
	border-radius: 10px;
	background: transparent;
	color: #3B82F6;
	font-size: 13px;
	font-weight: 500;
	cursor: pointer;
	transition: border-color .15s, background .15s;
	align-self: flex-start;
}

	.dcm-add-btn:hover[b-pvq1z6u925] {
		border-color: #3B82F6;
		background: #EFF6FF;
	}

/* ── Footer ──────────────────────────────────────────────────────────────── */

.dcm-footer[b-pvq1z6u925] {
	display: flex;
	justify-content: flex-end;
	padding-top: 4px;
}
/* /Pages/Locations/Components/DrawingToolModal.razor.rz.scp.css */
/* ── Outer layout ────────────────────────────────────────────────────────── */

.dtm-body[b-vw3vn4b1wl] {
	display: flex;
	flex-direction: column;
	height: 100%;
}

/* Map area stretches to fill all remaining height between header and footer */
.dtm-map-area[b-vw3vn4b1wl] {
	flex: 1;
	position: relative;
	min-height: 0;
}

	/* Cascade 100% height into the WMMap wrapper chain */
	.dtm-map-area[b-vw3vn4b1wl]  .wm-map-wrapper,
	.dtm-map-area[b-vw3vn4b1wl]  .wm-map-wrapper > div {
		height: 100%;
	}

/* ── Work type row ───────────────────────────────────────────────────────── */

.dtm-worktype-row[b-vw3vn4b1wl] {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 0 20px;
}

.dtm-worktype-label[b-vw3vn4b1wl] {
	font-size: 13px;
	font-weight: 600;
	color: #475569;
	white-space: nowrap;
	flex-shrink: 0;
}

.dtm-wt-tags[b-vw3vn4b1wl] {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
}

.dtm-wt-tag[b-vw3vn4b1wl] {
	display: inline-flex;
	align-items: center;
	padding: 3px 10px;
	background: #F1F5F9;
	border: 1px solid #E2E8F0;
	border-radius: 20px;
	font-size: 12px;
	font-weight: 500;
	color: #1E293B;
}

/* ── Sub-header: legend chips + hint ────────────────────────────────────── */

.dtm-subheader[b-vw3vn4b1wl] {
	position: absolute;
	top: 10px;
	left: 10px;
	right: 10px;
	z-index: 4;
	/* Spans the map width so the toolbar can shrink; let empty space pass clicks to the map */
	pointer-events: none;
	display: flex;
	flex-direction: column;
	gap: 6px;
	align-items: flex-start;
	box-shadow: 0px 56px 56px -28px #1E293B08;
	box-shadow: 0px 32px 32px -16px #1E293B08;
	box-shadow: 0px 20px 20px -12px #1E293B08;
	box-shadow: 0px 3px 3px -1.5px #1E293B08;
	box-shadow: 0px 1px 1px -0.5px #1E293B08;
	box-shadow: 0px 72px 72px -36px #1E293B08;
}

	.dtm-subheader > *[b-vw3vn4b1wl] {
		pointer-events: auto;
	}

.dtm-legend[b-vw3vn4b1wl] {
	display: flex;
	flex-wrap: wrap;
	padding: 6px;
	background: #ffffff;
	border-radius: 12px;
	width: fit-content;
	max-height: 110px;
	overflow-y: auto;
/*	scrollbar-width: none;*/
	gap: 8px;
	border: 1px solid #1E293B17;
	align-items: flex-start;
	box-shadow: 0px 1px 4px rgba(30,41,59,0.10);
}

	.dtm-legend[b-vw3vn4b1wl]::-webkit-scrollbar {
		display: none;
	}

/* ── Drawing type toolbar (edit/new mode) ────────────────────────────────── */

.dtm-draw-toolbar[b-vw3vn4b1wl] {
	display: flex;
	/* Wraps rather than scrolls. The cap used to be min(1100px, 100%), which put a scrollbar
	   under a dozen chips on a 2560px screen with two feet of empty map beside them; the only
	   width that matters is the one that is actually there. */
	flex-wrap: wrap;
	padding: 6px;
	background: #ffffff;
	border-radius: 12px;
	max-width: 100%;
	gap: 8px;
	align-items: center;
	box-shadow: 0px 1px 4px rgba(30,41,59,0.10);
}

/* The tools section — select/undo/redo stay fixed to its left. It takes the room the fixed
   buttons leave and wraps inside it, so a toolbar that genuinely does not fit grows a second
   row instead of hiding its last tools off the right-hand edge. */
.dtm-toolbar-tools[b-vw3vn4b1wl] {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	align-items: center;
	min-width: 0;
}

/* ── Toolbar buttons (arrow, undo, redo, add) ────────────────────────────── */

.dtm-tool-btn[b-vw3vn4b1wl] {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	flex-shrink: 0;
	border-radius: 8px;
	background: transparent;
	border: 1px solid transparent;
	color: #475569;
	cursor: pointer;
	transition: background .15s, border-color .15s, box-shadow .15s, color .15s;
}

	.dtm-tool-btn:hover:not(:disabled)[b-vw3vn4b1wl] {
		background: #F1F5F9;
		border-color: #E2E8F0;
	}

	.dtm-tool-btn:disabled[b-vw3vn4b1wl] {
		color: #CBD5E1;
		cursor: not-allowed;
	}

	.dtm-tool-btn.dtm-tool-btn-active[b-vw3vn4b1wl] {
		background: #5263FF1F;
		box-shadow: 0 0 0 3px rgba(59,130,246,0.15);
		color: #363AF5;
		border-color: #C7CBFF;
	}

.dtm-tool-btn-add[b-vw3vn4b1wl] {
	color: #363AF5;
}

.dtm-toolbar-divider[b-vw3vn4b1wl] {
	width: 1px;
	height: 24px;
	flex-shrink: 0;
	background: #E2E8F0;
}

/* ── Config chips (clickable, drive drawing mode) ────────────────────────── */

.dtm-chip-wrap[b-vw3vn4b1wl] {
	display: flex;
	align-items: center;
	flex-shrink: 0;
	border-radius: 8px;
	background: #F1F5F9CC;
	border: 1px solid;
	border-image-source: linear-gradient(180deg, rgba(30, 41, 59, 0.06) 48%, rgba(30, 41, 59, 0.12) 100%);
	transition: background .15s, box-shadow .15s;
}

	.dtm-chip-wrap:hover[b-vw3vn4b1wl] {
		background: #F1F5F9;
	}

	.dtm-chip-wrap.dtm-chip-wrap-active[b-vw3vn4b1wl] {
		background: #5263FF1F;
		box-shadow: 0 0 0 3px rgba(59,130,246,0.15);
		border-color: #C7CBFF;
	}

	.dtm-chip-wrap.dtm-chip-wrap-active .dtm-config-chip[b-vw3vn4b1wl] {
		color: #363AF5;
	}

.dtm-config-chip[b-vw3vn4b1wl] {
	display: flex;
	align-items: center;
	gap: 6px;
	padding: 7px 6px 7px 10px;
	border: none;
	background: transparent;
	border-radius: 8px 0 0 8px;
	font-size: 13px;
	color: #1E293B;
	font-weight: 600;
	cursor: pointer;
	user-select: none;
	letter-spacing: -0.2px;
	line-height: 18px;
}

/* Pencil stays out of the way until the chip is hovered or focused. */
.dtm-chip-edit[b-vw3vn4b1wl] {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 24px;
	height: 32px;
	padding: 0 8px 0 2px;
	border: none;
	background: transparent;
	border-radius: 0 8px 8px 0;
	color: #94A3B8;
	cursor: pointer;
	opacity: 0;
	transition: opacity .15s, color .15s;
}

/* Also shown while the chip is armed — hover doesn't exist on touch devices,
   so tapping the chip is the path that reveals its edit affordance. */
.dtm-chip-wrap:hover .dtm-chip-edit[b-vw3vn4b1wl],
.dtm-chip-wrap.dtm-chip-wrap-active .dtm-chip-edit[b-vw3vn4b1wl],
.dtm-chip-edit:focus-visible[b-vw3vn4b1wl] {
	opacity: 1;
}

	.dtm-chip-edit:hover[b-vw3vn4b1wl] {
		color: #1E293B;
	}

/* ── Export panel ────────────────────────────────────────────────────────── */

.dtm-export-form[b-vw3vn4b1wl] {
	min-width: 360px;
	max-height: calc(100vh - 160px);
	overflow-y: auto;
}

/* The preview is the point of the panel, so it leads. Checkerboard behind it, because a
   legend-only export is mostly white and would otherwise look like a broken image. */
.dtm-export-preview[b-vw3vn4b1wl] {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 120px;
	max-height: 240px;
	padding: 8px;
	border: 1px solid #E2E8F0;
	border-radius: 8px;
	background-color: #F8FAFC;
	background-image: linear-gradient(45deg, #EEF2F7 25%, transparent 25%, transparent 75%, #EEF2F7 75%),
					  linear-gradient(45deg, #EEF2F7 25%, transparent 25%, transparent 75%, #EEF2F7 75%);
	background-size: 16px 16px;
	background-position: 0 0, 8px 8px;
	overflow: hidden;
}

	.dtm-export-preview img[b-vw3vn4b1wl] {
		max-width: 100%;
		max-height: 224px;
		object-fit: contain;
		box-shadow: 0 1px 4px rgba(15, 23, 42, 0.18);
	}

.dtm-export-preview-empty[b-vw3vn4b1wl] {
	color: #0D6EFD;
}

.dtm-export-field[b-vw3vn4b1wl] {
	display: flex;
	flex-direction: column;
	gap: 5px;
}

.dtm-export-label[b-vw3vn4b1wl] {
	font-size: 11px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	color: #94A3B8;
}

.dtm-export-check[b-vw3vn4b1wl] {
	display: flex;
	align-items: center;
	gap: 8px;
	font-size: 13px;
	color: #1E293B;
	cursor: pointer;
	user-select: none;
}

	.dtm-export-check input[b-vw3vn4b1wl] {
		width: 15px;
		height: 15px;
		accent-color: #363AF5;
		cursor: pointer;
	}

/* ── Arranging the toolbar ───────────────────────────────────────────────── */
/* While the row is being arranged, a chip is a thing to drag rather than a tool to
   arm: the chip body stops taking clicks so the press reaches the wrap SortableJS
   is holding, and the eye takes the place the pencil had. */

.dtm-toolbar-tools-customizing .dtm-chip-wrap[b-vw3vn4b1wl] {
	cursor: grab;
}

.dtm-toolbar-tools-customizing .dtm-config-chip[b-vw3vn4b1wl] {
	pointer-events: none;
}

/* A tool that has been put away. Shown only while arranging, faded, so the row reads
   as "these are the ones you have" with the dropped ones clearly out of play. */
.dtm-chip-wrap.dtm-chip-wrap-hidden[b-vw3vn4b1wl] {
	opacity: 0.45;
	border-style: dashed;
}

/* The eye is the only control on the chip while arranging, so it does not hide. */
.dtm-chip-visibility[b-vw3vn4b1wl] {
	opacity: 1;
}

/* The classes wm.sortable.js configures, shared with the route builders. */
.dtm-chip-wrap.rlp-drag-ghost[b-vw3vn4b1wl] {
	opacity: 0.35;
}

.dtm-chip-wrap.rlp-drag-chosen[b-vw3vn4b1wl] {
	cursor: grabbing;
}

/* ── Add / edit tool popover ─────────────────────────────────────────────── */

.dtm-tool-form[b-vw3vn4b1wl] {
	display: flex;
	flex-direction: column;
	gap: 12px;
	width: 320px;
	padding: 16px;
	background: #FFFFFF;
	border-radius: 12px;
	box-shadow: 0 8px 24px rgba(30,41,59,0.16);
}

.dtm-tool-form-title[b-vw3vn4b1wl] {
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.6px;
	text-transform: uppercase;
	color: #5F6E85;
}

.dtm-tool-input[b-vw3vn4b1wl] {
	height: 40px;
	padding: 0 12px;
	border-radius: 8px;
	border: 1.5px solid #5263FF;
	font-size: 14px;
	color: #1E293B;
	outline: none;
}

.dtm-tool-textarea[b-vw3vn4b1wl] {
    resize: vertical;
    min-height: 64px;
    line-height: 18px;
}

.dtm-tool-hint[b-vw3vn4b1wl] {
    margin-top: 4px;
    font-size: 11px;
    color: #64748B;
}

.dtm-tool-form-row[b-vw3vn4b1wl] {
	display: flex;
	align-items: center;
	gap: 10px;
}

.dtm-type-segmented[b-vw3vn4b1wl] {
	display: flex;
	flex: 1;
	padding: 3px;
	gap: 2px;
	border-radius: 8px;
	border: 1px solid #E2E8F0;
	background: #F8FAFC;
}

.dtm-type-option[b-vw3vn4b1wl] {
	flex: 1;
	padding: 6px 4px;
	border: none;
	border-radius: 6px;
	background: transparent;
	font-size: 13px;
	font-weight: 600;
	color: #5F6E85;
	cursor: pointer;
	transition: background .15s, color .15s;
}

	.dtm-type-option:hover[b-vw3vn4b1wl] {
		color: #1E293B;
	}

	.dtm-type-option.dtm-type-option-active[b-vw3vn4b1wl] {
		background: #FFFFFF;
		color: #363AF5;
		box-shadow: 0 1px 2px rgba(30,41,59,0.10);
	}

.dtm-tool-form-actions[b-vw3vn4b1wl] {
	display: flex;
	justify-content: flex-end;
	gap: 8px;
}

.dtm-tool-delete[b-vw3vn4b1wl] {
	margin-right: auto;
}

/* ── Autosave status chip (popup header) ─────────────────────────────────── */

.dtm-autosave-chip[b-vw3vn4b1wl] {
	display: flex;
	align-items: center;
	gap: 6px;
	padding: 5px 10px;
	margin-right: 12px;
	border-radius: 8px;
	font-size: 12px;
	font-weight: 600;
	white-space: nowrap;
}

.dtm-autosave-saving[b-vw3vn4b1wl] {
	background: #F1F5F9;
	color: #475569;
}

.dtm-autosave-saved[b-vw3vn4b1wl] {
	background: #ECFDF5;
	color: #047857;
}

.dtm-autosave-failed[b-vw3vn4b1wl] {
	background: #FEF2F2;
	color: #B91C1C;
}

/* ── Read-only legend chips ──────────────────────────────────────────────── */

.dtm-legend-chip[b-vw3vn4b1wl] {
	display: flex;
	align-items: center;
	gap: 6px;
	padding: 4px 10px;
	border-radius: 20px;
	background: #F8FAFC;
	border: 1px solid #E2E8F0;
	font-size: 13px;
	color: #1E293B;
	font-weight: 500;
}

.dtm-legend-dot[b-vw3vn4b1wl] {
	width: 16px;
	height: 16px;
	border-radius: 50%;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	color: #fff;
	font-size: 9px;
	line-height: 1;
	flex-shrink: 0;
}

.dtm-legend-label[b-vw3vn4b1wl] {
	white-space: nowrap;
}

.dtm-hint[b-vw3vn4b1wl] {
	display: flex;
	align-items: center;
	gap: 6px;
	font-size: 13px;
	color: #3B82F6;
	font-weight: 500;
	white-space: nowrap;
	flex-shrink: 0;
}

/* ── Footer ──────────────────────────────────────────────────────────────── */

.dtm-footer[b-vw3vn4b1wl] {
	display: flex;
	justify-content: center;
	gap: 16px;
	padding-top: 16px;
	padding-left: 20px;
	padding-right: 20px;
	padding-bottom: 16px;
}

.dtm-stats[b-vw3vn4b1wl] {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 16px;
	align-items: center;
}

.dtm-stat-item[b-vw3vn4b1wl] {
	display: flex;
	align-items: center;
	gap: 4px;
	border-radius: 8px;
	font-size: 14px;
	color: #475569;
	background: #F1F5F9CC;
	border: 1px solid #1E293B08;
	padding: 6px 10px;
	line-height: 20px;
	letter-spacing: -0.02px;
	border: 1px solid #1E293B08;
	height: 32px;
}

.dtm-stat-dot[b-vw3vn4b1wl] {
	width: 16px;
	height: 16px;
	border-radius: 50%;
	flex-shrink: 0;
}

/* A row that belongs to a tool is two controls in a chip, so the chip loses its own padding
   and the buttons carry it — otherwise the hit targets stop short of the edges they look
   like they reach. */
.dtm-stat-item-live[b-vw3vn4b1wl] {
	padding: 0;
	overflow: hidden;
}

.dtm-stat-swatch[b-vw3vn4b1wl],
.dtm-stat-zoom[b-vw3vn4b1wl] {
	display: flex;
	align-items: center;
	height: 100%;
	border: none;
	background: transparent;
	font: inherit;
	letter-spacing: inherit;
	cursor: pointer;
	transition: background .12s;
}

.dtm-stat-swatch[b-vw3vn4b1wl] {
	padding: 0 6px 0 10px;
}

.dtm-stat-zoom[b-vw3vn4b1wl] {
	gap: 4px;
	padding: 0 10px 0 4px;
}

	.dtm-stat-swatch:hover[b-vw3vn4b1wl],
	.dtm-stat-zoom:hover[b-vw3vn4b1wl] {
		background: #E2E8F0;
	}

/* Painted out: the row stays legible, because it is also the way back. */
.dtm-stat-item-off[b-vw3vn4b1wl] {
	opacity: 0.45;
}

	.dtm-stat-item-off .dtm-stat-name[b-vw3vn4b1wl],
	.dtm-stat-item-off .dtm-stat-value[b-vw3vn4b1wl] {
		text-decoration: line-through;
	}

.dtm-stat-name[b-vw3vn4b1wl] {
	font-weight: 600;
	color: #1E293B;
}

.dtm-stat-value[b-vw3vn4b1wl] {
	font-weight: 500;
	color: #5F6E85;
}


/* ── Hide GL Draw's own toolbar (we replace it with dtm-draw-controls) ───── */

[b-vw3vn4b1wl] .mapboxgl-ctrl-top-left .mapboxgl-ctrl-group {
	display: none;
}


.dtm-info-overlay[b-vw3vn4b1wl] {
	position: absolute;
	z-index: 4;
	top: 10px;
	right: 10px;
}

.dtm-info-banner[b-vw3vn4b1wl] {
	display: flex;
	align-items: center;
	gap: 6px;
	background: #FFFFFF;
	border-radius: 12px;
	padding: 6px 10px;
	height: 36px;
	font-size: 13px;
	color: #363AF5;
	line-height: 24px;
	letter-spacing: -0.2px;
	white-space: nowrap;
	border-radius: 12px;
	border: 1px solid #1E293B17;
	box-shadow: 0px 56px 56px -28px #1E293B08;
	box-shadow: 0px 32px 32px -16px #1E293B08;
	box-shadow: 0px 20px 20px -12px #1E293B08;
	box-shadow: 0px 3px 3px -1.5px #1E293B08;
	box-shadow: 0px 1px 1px -0.5px #1E293B08;
	box-shadow: 0px 72px 72px -36px #1E293B08;
}
/* ── Toolbar visibility toggle, inside the edit form ─────────────────────── */

.dtm-tool-visibility[b-vw3vn4b1wl] {
	display: flex;
	align-items: center;
	gap: 8px;
	align-self: flex-start;
	padding: 6px 10px;
	border: 1px solid #1E293B1F;
	border-radius: 8px;
	background: #F8FAFC;
	font-size: 13px;
	font-weight: 500;
	color: #475569;
	cursor: pointer;
}

	.dtm-tool-visibility:hover[b-vw3vn4b1wl] {
		background: #F1F5F9;
		color: #1E293B;
	}

	/* Already put away — say so plainly, rather than leaving the row looking like the
	   button that would put it away. */
	.dtm-tool-visibility.dtm-tool-visibility-off[b-vw3vn4b1wl] {
		background: #FEF3C7;
		border-color: #FCD34D;
		color: #92400E;
	}

/* ── The measurements, as a grid you can select ──────────────────────────── */
/* Everything else in this modal is chrome and deliberately unselectable; this table is the
   one thing on the screen whose whole purpose is to be selected and copied. */

.dtm-export-table-scroll[b-vw3vn4b1wl] {
	overflow-x: auto;
	border: 1px solid #E2E8F0;
	border-radius: 8px;
	background: #fff;
}

.dtm-export-table[b-vw3vn4b1wl] {
	border-collapse: collapse;
	font-size: 12px;
	user-select: text;
	cursor: text;
	white-space: nowrap;
}

	.dtm-export-table th[b-vw3vn4b1wl],
	.dtm-export-table td[b-vw3vn4b1wl] {
		padding: 6px 10px;
		text-align: right;
		border-right: 1px solid #E2E8F0;
	}

		.dtm-export-table th:last-child[b-vw3vn4b1wl],
		.dtm-export-table td:last-child[b-vw3vn4b1wl] {
			border-right: none;
		}

	.dtm-export-table th[b-vw3vn4b1wl] {
		background: #F8FAFC;
		border-bottom: 1px solid #E2E8F0;
		font-weight: 600;
		color: #475569;
	}

	.dtm-export-table td[b-vw3vn4b1wl] {
		color: #0F172A;
		font-variant-numeric: tabular-nums;
	}

.dtm-export-hint[b-vw3vn4b1wl] {
	font-size: 11px;
	color: #94A3B8;
}

/* The brand mark in the header. Sized to the title beside it, not to itself. */
.dtm-header-logo[b-vw3vn4b1wl] {
	height: 26px;
	width: auto;
	display: block;
}

/* ── Saved against unsaved, when a draft turns up ────────────────────────── */

.dtm-draft-diff[b-vw3vn4b1wl] {
	width: 100%;
	border-collapse: collapse;
	font-size: 13px;
}

	.dtm-draft-diff th[b-vw3vn4b1wl],
	.dtm-draft-diff td[b-vw3vn4b1wl] {
		padding: 6px 8px;
		text-align: right;
		border-bottom: 1px solid #F1F5F9;
	}

	.dtm-draft-diff th[b-vw3vn4b1wl] {
		font-size: 11px;
		font-weight: 600;
		text-transform: uppercase;
		letter-spacing: .04em;
		color: #94A3B8;
	}

.dtm-draft-diff-tool[b-vw3vn4b1wl] {
	display: flex;
	align-items: center;
	gap: 8px;
	text-align: left !important;
	color: #1E293B;
	font-weight: 500;
}

/* The rows that actually differ are the reason the table is here. */
.dtm-draft-diff-changed td[b-vw3vn4b1wl] {
	background: #FEF3C7;
	font-weight: 600;
	color: #92400E;
}
/* /Pages/Locations/Components/ExportLocationsPopup.razor.rz.scp.css */
.export-locations-popup[b-8mqslbqxw8] {
    background: #f8fafc;
    padding: 24px;
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.export-loading[b-8mqslbqxw8] {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 280px;
    color: var(--purple);
}

.export-field[b-8mqslbqxw8] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.export-field label[b-8mqslbqxw8] {
    color: #475569;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.2;
}

/* Dropdown styling overrides using ::deep to propagate inside child component */
[b-8mqslbqxw8] .export-popup .custom-select-button {
    width: 100% !important;
    height: 48px !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 14px !important;
    box-shadow: none !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    color: #0f172a !important;
    background-color: #ffffff !important;
    padding: 0 16px !important;
}

[b-8mqslbqxw8] .export-popup .custom-select-button.chips-mode {
    height: auto !important;
    min-height: 48px !important;
    padding-top: 10px !important;
    padding-bottom: 10px !important;
}

[b-8mqslbqxw8] .export-popup .custom-select-button-text {
    color: #0f172a !important;
    font-weight: 500 !important;
}

[b-8mqslbqxw8] .export-popup .custom-select-button-label {
    max-width: 90% !important;
}

[b-8mqslbqxw8] .export-popup .custom-select-button.chips-mode .custom-select-button-label {
    gap: 8px !important;
    row-gap: 8px !important;
}

[b-8mqslbqxw8] .export-popup .custom-select-selected-chip {
    padding: 6px 12px !important;
    border-radius: 10px !important;
    background: #eef0ff !important;
    color: var(--purple-2) !important;
    font-size: 13px !important;
    font-weight: 600 !important;
}

[b-8mqslbqxw8] .export-popup .custom-select-button .bi {
    color: #5F6E85 !important;
    font-size: 14px !important;
}

/* WMPopup structural overrides to remove padding/borders and style backgrounds */
[b-8mqslbqxw8] .export-popup .wm-popup-modal-content {
    padding: 0 !important;
    border-radius: 24px !important;
    background: #ffffff;
    overflow: hidden;
}

[b-8mqslbqxw8] .export-popup .modal-header {
    padding: 24px 24px 16px !important;
    background: #ffffff !important;
    border-bottom: none !important;
}

[b-8mqslbqxw8] .export-popup .modal-header h5.modal-title {
    font-size: 20px !important;
    font-weight: 700 !important;
    color: #0f172a !important;
    letter-spacing: -0.02em !important;
}

[b-8mqslbqxw8] .export-popup .modal-header button.btn-close {
    margin: 0 !important;
}

[b-8mqslbqxw8] .export-popup .modal-body {
    background: #f8fafc !important;
    border-top: none !important;
    padding: 0 !important;
    max-height: none !important;
    overflow-y: visible !important;
}

[b-8mqslbqxw8] .export-popup .wm-popup-modal-footer {
    background: #ffffff !important;
    border-top: none !important;
    padding: 16px 24px 24px !important;
}

/* Status selection pills styling */
.export-status-options[b-8mqslbqxw8] {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}

.status-pill[b-8mqslbqxw8] {
    border: 1px solid #f1f5f9;
    border-radius: 999px;
    background: #ffffff;
    color: #0f172a;
    padding: 12px 24px;
    font-size: 14px;
    font-weight: 600;
    line-height: 1;
    box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.02);
    transition: all 0.2s ease;
    cursor: pointer;
}

.status-pill:hover:not(:disabled)[b-8mqslbqxw8] {
    background: #f8fafc;
    border-color: #cbd5e1;
}

.status-pill.active[b-8mqslbqxw8] {
    border-color: #e0e7ff;
    background: #e0e7ff;
    color: var(--purple-2) !important;
}

/* Footer buttons styling */
.export-btn[b-8mqslbqxw8] {
    flex: 1;
    min-height: 48px;
    border-radius: 14px !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    border: none !important;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s ease;
}

.export-btn-secondary[b-8mqslbqxw8] {
    background: #f1f5f9 !important;
    color: #0f172a !important;
}

.export-btn-secondary:hover:not(:disabled)[b-8mqslbqxw8] {
    background: #e2e8f0 !important;
}

.export-btn-primary[b-8mqslbqxw8] {
    background: var(--purple) !important;
    color: #ffffff !important;
}

.export-btn-primary:hover:not(:disabled)[b-8mqslbqxw8] {
    opacity: 0.9 !important;
}
/* /Pages/Locations/Components/ImportSourceViewer.razor.rz.scp.css */
/* ── Layout ──────────────────────────────────────────────────────────────── */

.isv-root[b-ugb76ry88c] {
	display: flex;
	flex-direction: column;
	height: 100%;
	min-height: 0;
	background: #0F172A;
}

/* ── Toolbar ─────────────────────────────────────────────────────────────── */

.isv-toolbar[b-ugb76ry88c] {
	display: flex;
	align-items: center;
	gap: 6px;
	flex-shrink: 0;
	padding: 6px 10px;
	background: #FFFFFF;
	border-bottom: 1px solid #1E293B17;
}

.isv-btn[b-ugb76ry88c] {
	display: flex;
	align-items: center;
	justify-content: center;
	min-width: 32px;
	height: 32px;
	padding: 0 8px;
	flex-shrink: 0;
	border-radius: 8px;
	background: transparent;
	border: 1px solid transparent;
	color: #475569;
	cursor: pointer;
	transition: background .15s, border-color .15s, color .15s;
}

	.isv-btn:hover:not(:disabled)[b-ugb76ry88c] {
		background: #F1F5F9;
		border-color: #E2E8F0;
	}

	.isv-btn:disabled[b-ugb76ry88c] {
		color: #CBD5E1;
		cursor: not-allowed;
	}

.isv-btn-text[b-ugb76ry88c] {
	font-size: 13px;
	font-weight: 600;
	letter-spacing: -0.2px;
}

.isv-zoom[b-ugb76ry88c] {
	min-width: 48px;
	text-align: center;
	font-size: 12px;
	font-weight: 600;
	color: #5F6E85;
	font-variant-numeric: tabular-nums;
}

/* ── Viewport ────────────────────────────────────────────────────────────── */

.isv-viewport[b-ugb76ry88c] {
	position: relative;
	flex: 1;
	min-height: 0;
	overflow: hidden;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: grab;
	/* The drag pans the image; letting the browser start a text/image selection
	   instead leaves a blue smear over the page and stops the pan halfway. */
	user-select: none;
}

	.isv-viewport.isv-viewport-panning[b-ugb76ry88c] {
		cursor: grabbing;
	}

.isv-stage[b-ugb76ry88c] {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
	transform-origin: center center;
	will-change: transform;
}

.isv-img[b-ugb76ry88c] {
	max-width: 100%;
	max-height: 100%;
	object-fit: contain;
	pointer-events: none;
	/* Above 100% the reviewer is looking for the drawn line, not a smooth blur. */
	image-rendering: -webkit-optimize-contrast;
}

.isv-centered[b-ugb76ry88c] {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #0D6EFD;
}

.isv-empty[b-ugb76ry88c] {
	font-size: 13px;
	color: #94A3B8;
}
/* /Pages/Locations/Components/LocationContactEmailLog.razor.rz.scp.css */
/* Scoped styles do not cross a component boundary, so the section header repeats the
   contacts-tab wording rather than borrowing LocationDetailsModal's rules. */

.contact-email-log[b-tq9uxxjwu7] {
  margin-top: 28px;
}

.cel-header[b-tq9uxxjwu7] {
  margin-bottom: 16px;
}

.cel-title[b-tq9uxxjwu7] {
  font-size: 18px;
  font-weight: 800;
  line-height: 26px;
  letter-spacing: -0.3px;
  color: var(--dark-txt);
  margin: 0 0 4px;
}

.cel-desc[b-tq9uxxjwu7] {
  font-size: 13px;
  font-weight: 500;
  color: var(--gray-txt-2);
  line-height: 1.5;
  margin: 0;
}

.cel-empty[b-tq9uxxjwu7] {
  font-size: 13px;
  font-weight: 500;
  color: var(--gray-txt-2);
  padding: 8px 0;
  margin: 0;
}

.cel-loading[b-tq9uxxjwu7] {
  display: flex;
  justify-content: center;
  padding: 16px 0;
}

/* The table scrolls inside its own box: the modal must never scroll sideways. */
.cel-table-scroll[b-tq9uxxjwu7] {
  overflow-x: auto;
  border: 1px solid var(--border-clr, #e2e8f0);
  border-radius: 8px;
}

.cel-table[b-tq9uxxjwu7] {
  width: 100%;
  min-width: 720px;
  border-collapse: collapse;
  font-size: 13px;
}

.cel-table thead th[b-tq9uxxjwu7] {
  text-align: left;
  font-weight: 700;
  color: var(--gray-txt-2);
  background: var(--light-bg, #f8fafc);
  padding: 10px 12px;
  white-space: nowrap;
  border-bottom: 1px solid var(--border-clr, #e2e8f0);
}

.cel-table tbody td[b-tq9uxxjwu7] {
  padding: 10px 12px;
  color: var(--dark-txt);
  vertical-align: top;
  border-bottom: 1px solid var(--border-clr, #eef2f7);
}

.cel-table tbody tr:last-child td[b-tq9uxxjwu7] {
  border-bottom: none;
}

.cel-when[b-tq9uxxjwu7] {
  white-space: nowrap;
}

.cel-address[b-tq9uxxjwu7],
.cel-subject[b-tq9uxxjwu7],
.cel-location[b-tq9uxxjwu7] {
  max-width: 220px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.cel-status[b-tq9uxxjwu7] {
  display: inline-block;
  padding: 2px 10px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 700;
  white-space: nowrap;
}

.cel-status.sent[b-tq9uxxjwu7] {
  background: #ecfdf5;
  color: #047857;
}

.cel-status.failed[b-tq9uxxjwu7] {
  background: #fef2f2;
  color: #b91c1c;
}

.cel-error[b-tq9uxxjwu7] {
  display: block;
  max-width: 220px;
  margin-top: 4px;
  font-size: 12px;
  color: var(--gray-txt-2);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.cel-pagination[b-tq9uxxjwu7] {
  margin-top: 12px;
}
/* /Pages/Locations/Components/LocationDetailsModal.razor.rz.scp.css */
.z-index-lower[b-2ur6pjxfog] {
  z-index: 1049 !important;
}

/* ── Location operations ───────────────────────────────────────────────── */
.location-operations-loading[b-2ur6pjxfog] {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 360px;
  color: var(--purple);
}

.location-operations-section[b-2ur6pjxfog],
.location-dispatch-history[b-2ur6pjxfog] {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.location-dispatch-history[b-2ur6pjxfog] {
  margin-top: 28px;
}

.location-operations-heading[b-2ur6pjxfog],
.location-dispatch-history-header[b-2ur6pjxfog] {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.location-operations-heading h6[b-2ur6pjxfog],
.location-dispatch-history-header h6[b-2ur6pjxfog] {
  margin: 0;
  color: var(--dark-txt);
  font-size: 18px;
  font-weight: 800;
  line-height: 24px;
}

.location-operations-date[b-2ur6pjxfog] {
  width: min(520px, 100%);
}

.location-dispatch-export img[b-2ur6pjxfog] {
  width: 16px;
  height: 16px;
}

.location-operations-cards[b-2ur6pjxfog] {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

.location-operations-card[b-2ur6pjxfog],
.location-operations-chart[b-2ur6pjxfog] {
  padding: 16px;
  background: #f8fafc;
  border: 1px solid #1e293b08;
  border-radius: 20px;
}

.location-operations-card-label[b-2ur6pjxfog],
.location-operations-chart-title[b-2ur6pjxfog] {
  display: flex;
  align-items: center;
  gap: 8px;
  color: var(--gray-txt);
  font-size: 15px;
  font-weight: 600;
}

.location-operations-icon[b-2ur6pjxfog] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 8px;
}

.location-operations-icon img[b-2ur6pjxfog] { width: 22px; height: 22px; }
.location-operations-icon.cost[b-2ur6pjxfog] { background: #ffc30a33; }
.location-operations-icon.revenue[b-2ur6pjxfog] { background: #409b3f33; }
.location-operations-icon.chart[b-2ur6pjxfog] { background: var(--l-sky); }

.location-operations-card p[b-2ur6pjxfog] {
  margin: 20px 0 2px;
  color: var(--dark-txt);
  font-size: 25px;
  font-weight: 700;
  line-height: 32px;
}

.location-operations-card small[b-2ur6pjxfog] {
  color: var(--gray-txt);
  font-size: 13px;
  font-weight: 600;
}

.location-operations-work-types[b-2ur6pjxfog],
.location-dispatch-history-table-wrap[b-2ur6pjxfog] {
  overflow: hidden;
  border: 1px solid #1e293b0f;
  border-radius: 16px;
}

.location-operations-work-type-row[b-2ur6pjxfog] {
  display: grid;
  grid-template-columns: 1fr 1fr;
  padding: 8px 16px;
  color: var(--dark-txt);
  font-size: 13px;
  font-weight: 600;
}

.location-operations-work-type-row:nth-child(odd)[b-2ur6pjxfog] { background: #f8fafc; }
.location-operations-work-type-row.header[b-2ur6pjxfog] {
  padding: 12px 16px;
  background: #f1f5f9;
  font-weight: 700;
}
.location-operations-work-type-row.empty[b-2ur6pjxfog] { color: var(--gray-txt); }

.location-operations-chart-canvas[b-2ur6pjxfog] {
  position: relative;
  height: 300px;
  margin-top: 14px;
}

.location-operations-chart-canvas canvas[b-2ur6pjxfog] {
  width: 100% !important;
  height: 100% !important;
}

.location-dispatch-export[b-2ur6pjxfog] {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 10px;
  color: var(--dark-txt);
  font-size: 12px;
  font-weight: 600;
  background: #f1f5f9cc;
  border: 1px solid #1e293b0f;
  border-radius: 8px;
}

.location-dispatch-export:disabled[b-2ur6pjxfog] { cursor: not-allowed; opacity: .55; }

.location-dispatch-history-table[b-2ur6pjxfog] {
  width: 100%;
  border-collapse: collapse;
}

.location-dispatch-history-table th[b-2ur6pjxfog],
.location-dispatch-history-table td[b-2ur6pjxfog] {
  padding: 10px 14px;
  color: var(--dark-txt);
  font-size: 12px;
  font-weight: 600;
  text-align: left;
  border-right: 1px solid #1e293b0f;
  vertical-align: middle;
}

.location-dispatch-history-table th[b-2ur6pjxfog] {
  background: #f1f5f9;
  font-size: 13px;
  font-weight: 700;
}

.location-dispatch-history-table td:last-child[b-2ur6pjxfog],
.location-dispatch-history-table th:last-child[b-2ur6pjxfog] { border-right: 0; }
.location-dispatch-history-table tbody tr:nth-child(even)[b-2ur6pjxfog] { background: #f8fafc; }
.location-dispatch-history-row[b-2ur6pjxfog] { cursor: pointer; }
.location-dispatch-history-row:hover[b-2ur6pjxfog] { background: #eef2ff !important; }

/* Indicator icons sit under the status pill's height, so the row stays as tall as it was. */
.location-dispatch-indicators[b-2ur6pjxfog] {
  display: flex;
  align-items: center;
  gap: 6px;
  min-height: 16px;
  line-height: 0;
}

.location-dispatch-indicators img[b-2ur6pjxfog] {
  width: 16px;
  height: 16px;
  display: block;
}

.location-dispatch-history-empty[b-2ur6pjxfog] {
  padding: 24px !important;
  color: var(--gray-txt) !important;
  font-weight: 500 !important;
  text-align: center !important;
}

.location-dispatch-status[b-2ur6pjxfog] {
  display: inline-flex;
  padding: 3px 7px;
  border-radius: 7px;
  font-size: 11px;
  font-weight: 700;
  white-space: nowrap;
}
.location-dispatch-manual-tag[b-2ur6pjxfog] {
  display: inline-flex;
  margin-left: 6px;
  padding: 2px 7px;
  border-radius: 7px;
  font-size: 11px;
  font-weight: 600;
  white-space: nowrap;
  color: #6d28d9;
  background: #ede9fe;
}
.location-dispatch-status.completed[b-2ur6pjxfog] { color: #296C28; background: #dff4df; }
.location-dispatch-status.in-progress[b-2ur6pjxfog] { color: #363af5; background: #eaecff; }
.location-dispatch-status.planned[b-2ur6pjxfog] { color: #a16207; background: #fef3c7; }
.location-dispatch-status.cancelled[b-2ur6pjxfog] { color: #475569; background: #e2e8f0; }

@media (max-width: 600px) {
  .location-operations-heading[b-2ur6pjxfog],
  .location-dispatch-history-header[b-2ur6pjxfog] { align-items: flex-start; flex-direction: column; }
  .location-operations-date[b-2ur6pjxfog] { width: 100%; }
  .location-operations-cards[b-2ur6pjxfog] { grid-template-columns: 1fr; }
  .location-dispatch-history-table-wrap[b-2ur6pjxfog] { overflow-x: auto; }
  .location-dispatch-history-table[b-2ur6pjxfog] { min-width: 650px; }
}

/* ── Carousel work type badges ───────────────────────────────────────────── */
.map-badges[b-2ur6pjxfog] {
    position: absolute;
    top: 12px;
    left: 12px;
    z-index: 5;
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.map-badge[b-2ur6pjxfog] {
    background: var(--white);
    border: 1px solid #E2E8F0;
    border-radius: 6px;
    padding: 4px 8px;
    font-size: 12px;
    font-weight: 600;
    color: var(--dark-txt);
    box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.05);
}

/* ── Drawing stats bar + button ──────────────────────────────────────────── */

.ldm-drawing-bar[b-2ur6pjxfog] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 12px;
    padding: 6px 0;
    min-height: 40px;
}

/* The download sits at the end of the areas row and never shrinks out of it. The wrapper
   carries the tooltip, because a disabled button raises no pointer events of its own. */
.ldm-drawing-download-wrap[b-2ur6pjxfog] {
    display: inline-flex;
    flex-shrink: 0;
}

.ldm-drawing-download[b-2ur6pjxfog] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    height: 32px;
    margin: 0;
    padding: 0 10px;
    font-size: 12px;
    font-weight: 600;
    white-space: nowrap;
}

    .ldm-drawing-download:disabled[b-2ur6pjxfog] {
        cursor: not-allowed;
        opacity: 0.55;
    }

.ldm-drawing-stats[b-2ur6pjxfog] {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    gap: 6px;
    overflow-x: auto;
    -ms-overflow-style: none;
    flex: 1;
    min-width: 0;
}

    .ldm-drawing-stats[b-2ur6pjxfog]::-webkit-scrollbar {
        display: none;
    }

.ldm-drawing-stat-chip[b-2ur6pjxfog] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 4px 6px;
    background: #F1F5F9CC;
    border-radius: 8px;
    box-shadow: 0px 1px 2px 0px #1E293B08;
    white-space: nowrap;
    flex-shrink: 0;
    border: 1px solid #1E293B08;
    height: 24px;
}

.ldm-drawing-stat-dot[b-2ur6pjxfog] {
    width: 14px;
    height: 14px;
    border-radius: 50%;
    flex-shrink: 0;
}

.ldm-drawing-stat-name[b-2ur6pjxfog] {
    font-size: 12px;
    font-weight: 600;
    color: #1E293B;
    letter-spacing: -0.2px;
    line-height: 16px;
}

.ldm-drawing-stat-value[b-2ur6pjxfog] {
    font-size: 12px;
    font-weight: 500;
    color: #5F6E85;
    letter-spacing: -0.2px;
    line-height: 16px;
}

.ldm-drawing-btn[b-2ur6pjxfog] {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    border: none;
    border-radius: 10px;
    background: #5263FF;
    color: #FFFFFF;
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
    white-space: nowrap;
    flex-shrink: 0;
    transition: background .15s;
}

    .ldm-drawing-btn:hover[b-2ur6pjxfog] {
        background: #4152EE;
    }

    .ldm-drawing-btn img[b-2ur6pjxfog] {
        filter: brightness(0) invert(1);
    }

.address-nickname-popup .modal-header button.discard-btn[b-2ur6pjxfog] {
  gap: 2px;
  padding: 8px 10px;
  border: 1px solid #1e293b0f;
  /* border: none; */
  border-radius: 10px;
  outline: none;
  height: 40px;
  background: #f1f5f9cc;
  backdrop-filter: blur(24px);
  box-shadow:
    0px 1px 1px -0.5px #1e293b08,
    0px 3px 3px 0px #ffffff1f inset;
}

.address-nickname-popup .modal-header button.discard-btn:hover[b-2ur6pjxfog] {
  opacity: 0.8;
}
.address-nickname-popup .modal-header button.discard-btn img[b-2ur6pjxfog] {
  height: 18px;
}

.address-nickname-popup .modal-header button.discard-btn p[b-2ur6pjxfog] {
  font-size: 13px;
  font-weight: 600;
  line-height: 24px;
  letter-spacing: -0.2px;
  color: var(--dark-txt);
  padding: 0 4px;
}

/* ── 2-column grid (mirrors existing 50% flex layout but as a proper grid) ── */
.address-nickname-popup .modal-body .details-tab .det-edit-2col[b-2ur6pjxfog] {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px 24px;
}

/* ── Shared field wrapper ── */
.address-nickname-popup .modal-body .details-tab .det-edit-field[b-2ur6pjxfog] {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

/* ── Label ── */
.address-nickname-popup .modal-body .details-tab .det-edit-label[b-2ur6pjxfog] {
  font-size: 13px;
  font-weight: 700;
  color: var(--gray-txt);
  letter-spacing: -0.1px;
  margin: 0;
}

.address-nickname-popup .modal-body .details-tab .det-edit-required[b-2ur6pjxfog] {
  color: var(--orange);
}

/* ── Validation message ── */
.address-nickname-popup .modal-body .details-tab .det-edit-validation[b-2ur6pjxfog] {
  font-size: 12px;
  font-weight: 600;
  color: var(--orange);
  margin-top: -2px;
}

/* ── Text / number input ── */
.address-nickname-popup .modal-body .details-tab .det-edit-input[b-2ur6pjxfog] {
  width: 100%;
  padding: 8px 12px;
  background-color: var(--white);
  border: 1px solid #1e293b1f;
  border-radius: 10px;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.04);
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: 13px;
  font-weight: 600;
  color: var(--dark-txt);
  outline: none;
  transition:
    border-color 0.15s,
    box-shadow 0.15s;
}

.address-nickname-popup .modal-body .details-tab .det-edit-input:focus[b-2ur6pjxfog] {
  border-color: var(--purple);
  box-shadow: 0 0 0 3px #5263ff22;
}

.address-nickname-popup .modal-body .details-tab .det-edit-input[b-2ur6pjxfog]::placeholder {
  color: #cbd5e1;
  font-weight: 500;
}

/* hide number spinners */
.address-nickname-popup
  .modal-body
  .details-tab
  .det-edit-input[type="number"][b-2ur6pjxfog]::-webkit-outer-spin-button,
.address-nickname-popup
  .modal-body
  .details-tab
  .det-edit-input[type="number"][b-2ur6pjxfog]::-webkit-inner-spin-button {
  -webkit-appearance: none;
}

/* ── Select ── */
.address-nickname-popup .modal-body .details-tab .det-edit-select[b-2ur6pjxfog] {
  width: 100%;
  padding: 8px 28px 8px 12px;
  background-color: var(--white);
  border: 1px solid #1e293b1f;
  border-radius: 10px;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.04);
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: 13px;
  font-weight: 600;
  color: var(--dark-txt);
  outline: none;
  appearance: none;
  -webkit-appearance: none;
  background-image: url("../img/icons/gray-arrow.png");
  background-repeat: no-repeat;
  background-position: right 10px center;
  background-size: 16px;
  cursor: pointer;
  transition:
    border-color 0.15s,
    box-shadow 0.15s;
}

.address-nickname-popup .modal-body .details-tab .det-edit-select:focus[b-2ur6pjxfog] {
  border-color: var(--purple);
  box-shadow: 0 0 0 3px #5263ff22;
}

/* ── Textarea ── */
.address-nickname-popup .modal-body .details-tab .det-edit-textarea[b-2ur6pjxfog] {
  width: 100%;
  padding: 8px 12px;
  background-color: var(--white);
  border: 1px solid #1e293b1f;
  border-radius: 10px;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.04);
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: 13px;
  font-weight: 600;
  color: var(--dark-txt);
  outline: none;
  resize: vertical;
  transition:
    border-color 0.15s,
    box-shadow 0.15s;
}

.address-nickname-popup .modal-body .details-tab .det-edit-textarea:focus[b-2ur6pjxfog] {
  border-color: var(--purple);
  box-shadow: 0 0 0 3px #5263ff22;
}

/* ── Section divider ── */
.address-nickname-popup .modal-body .details-tab .det-edit-divider[b-2ur6pjxfog] {
  border: 1px solid #1e293b17;
  margin: 20px 0;
}

/* ── Contractor row ── */
.address-nickname-popup .modal-body .details-tab .det-edit-contractor-row[b-2ur6pjxfog] {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.address-nickname-popup .modal-body .details-tab .det-edit-contractor-name[b-2ur6pjxfog] {
  font-size: 13px;
  font-weight: 700;
  color: var(--dark-txt);
}

.address-nickname-popup .modal-body .details-tab .det-edit-badge[b-2ur6pjxfog] {
  padding: 2px 8px;
  border-radius: 8px;
  font-size: 11px;
  font-weight: 700;
  line-height: 18px;
}

.address-nickname-popup .modal-body .details-tab .det-edit-badge-blue[b-2ur6pjxfog] {
  background-color: #eaecff;
  color: var(--purple-2);
}

.address-nickname-popup
  .modal-body
  .details-tab
  .det-edit-contractor-change-btn[b-2ur6pjxfog] {
  margin-left: auto;
  background: transparent;
  border: 1px solid #1e293b1f;
  border-radius: 8px;
  padding: 4px 12px;
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: 12px;
  font-weight: 700;
  color: var(--gray-txt);
  cursor: pointer;
  transition: background-color 0.15s;
}

.address-nickname-popup
  .modal-body
  .details-tab
  .det-edit-contractor-change-btn:hover[b-2ur6pjxfog] {
  background-color: #f1f5f9;
}

/* Assign contractor button (when no contractor set) */
.address-nickname-popup .modal-body .details-tab .det-edit-assign-btn[b-2ur6pjxfog] {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  background: transparent;
  border: 1px dashed #5263ff66;
  border-radius: 10px;
  padding: 8px 14px;
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: 13px;
  font-weight: 700;
  color: var(--purple);
  cursor: pointer;
  transition: background-color 0.15s;
}

.address-nickname-popup .modal-body .details-tab .det-edit-assign-btn:hover[b-2ur6pjxfog] {
  background-color: var(--l-purple);
}

/* ── Link-style button (e.g. Create new customer) ── */
.address-nickname-popup .modal-body .details-tab .det-edit-link-btn[b-2ur6pjxfog] {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  background: transparent;
  border: none;
  padding: 0;
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: 12px;
  font-weight: 700;
  color: var(--purple);
  cursor: pointer;
  text-decoration: none;
  transition: opacity 0.15s;
  width: fit-content;
}

.address-nickname-popup .modal-body .details-tab .det-edit-link-btn:hover[b-2ur6pjxfog] {
  opacity: 0.75;
}

/* ── Activation toggle row ── */
.address-nickname-popup .modal-body .details-tab .det-edit-activation-row[b-2ur6pjxfog] {
  display: flex;
  align-items: flex-end;
  gap: 16px;
  flex-wrap: wrap;
}

.address-nickname-popup .modal-body .details-tab .det-edit-toggle-row[b-2ur6pjxfog] {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 2px;
}

.address-nickname-popup .modal-body .details-tab .det-edit-toggle-switch[b-2ur6pjxfog] {
  position: relative;
  display: inline-block;
  width: 40px;
  height: 22px;
  flex-shrink: 0;
  margin: 0;
  cursor: pointer;
}

.address-nickname-popup .modal-body .details-tab .det-edit-toggle-switch input[b-2ur6pjxfog] {
  opacity: 0;
  width: 0;
  height: 0;
  position: absolute;
}

.address-nickname-popup .modal-body .details-tab .det-edit-toggle-slider[b-2ur6pjxfog] {
  position: absolute;
  inset: 0;
  background-color: #cbd5e1;
  border-radius: 22px;
  transition: background-color 0.2s;
}

.address-nickname-popup
  .modal-body
  .details-tab
  .det-edit-toggle-slider[b-2ur6pjxfog]::before {
  content: "";
  position: absolute;
  width: 16px;
  height: 16px;
  left: 3px;
  top: 3px;
  background-color: var(--white);
  border-radius: 50%;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.18);
  transition: transform 0.2s;
}

.address-nickname-popup
  .modal-body
  .details-tab
  .det-edit-toggle-switch
  input:checked
  + .det-edit-toggle-slider[b-2ur6pjxfog] {
  background-color: var(--green-2);
}

.address-nickname-popup
  .modal-body
  .details-tab
  .det-edit-toggle-switch
  input:checked
  + .det-edit-toggle-slider[b-2ur6pjxfog]::before {
  transform: translateX(18px);
}

.address-nickname-popup .modal-body .details-tab .det-edit-toggle-label[b-2ur6pjxfog] {
  font-size: 13px;
  font-weight: 600;
  color: var(--dark-txt);
}

/* Make inactive button */
.address-nickname-popup .modal-body .details-tab .det-edit-make-inactive-btn[b-2ur6pjxfog] {
  padding: 8px 16px;
  background-color: var(--l-orange);
  border: 1px solid #ed403033;
  border-radius: 10px;
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: 13px;
  font-weight: 700;
  color: var(--orange);
  cursor: pointer;
  transition: background-color 0.15s;
  white-space: nowrap;
  flex-shrink: 0;
}

.address-nickname-popup
  .modal-body
  .details-tab
  .det-edit-make-inactive-btn:hover[b-2ur6pjxfog] {
  background-color: #ed403044;
}

/* ── Date picker wrap ── */
.address-nickname-popup .modal-body .details-tab .det-datepicker-wrap[b-2ur6pjxfog],
.det-datepicker-wrap[b-2ur6pjxfog] {
  display: flex;
  align-items: center;
  gap: 10px;
  background-color: var(--white);
  border: 1px solid #1e293b1f;
  border-radius: 10px;
  padding: 0 12px;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.04);
  transition:
    border-color 0.15s,
    box-shadow 0.15s;
}

.address-nickname-popup
  .modal-body
  .details-tab
  .det-datepicker-wrap:focus-within[b-2ur6pjxfog],
.det-datepicker-wrap:focus-within[b-2ur6pjxfog] {
  box-shadow: 0 0 0 3px #5263ff22;
}

.address-nickname-popup .modal-body .details-tab .det-datepicker-icon[b-2ur6pjxfog] {
  flex-shrink: 0;
}

.address-nickname-popup .modal-body .details-tab .det-datepicker-input[b-2ur6pjxfog],
.det-datepicker-input[b-2ur6pjxfog] {
  border: none !important;
  box-shadow: none !important;
  padding-left: 0 !important;
  background: transparent;
}

/* ════════════════════════════════════════════
   SUB-MODALS (Make inactive + Agreement)
   These float over the main modal
════════════════════════════════════════════ */

.det-submodal-backdrop[b-2ur6pjxfog] {
  position: absolute;
  inset: 0;
  background-color: rgba(15, 23, 42, 0.35);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1100;
  border-radius: inherit;
}

.det-submodal[b-2ur6pjxfog] {
  background-color: var(--white);
  border-radius: 20px;
  width: 100%;
  max-width: 520px;
  overflow: hidden;
  box-shadow: 0 24px 48px rgba(0, 0, 0, 0.16);
  animation: submodalIn-b-2ur6pjxfog 0.22s cubic-bezier(0.22, 1, 0.36, 1) both;
}

@keyframes submodalIn-b-2ur6pjxfog {
  from {
    transform: scale(0.94) translateY(12px);
    opacity: 0;
  }
  to {
    transform: scale(1) translateY(0);
    opacity: 1;
  }
}

/* ── Sub-modal header ── */
.det-submodal-header[b-2ur6pjxfog] {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  padding: 24px 24px 16px;
  gap: 12px;
}

.det-submodal-title[b-2ur6pjxfog] {
  font-size: 18px;
  font-weight: 800;
  color: var(--dark-txt);
  letter-spacing: -0.3px;
  margin: 0 0 6px;
  line-height: 1.3;
}

.det-submodal-subtitle[b-2ur6pjxfog] {
  font-size: 13px;
  font-weight: 500;
  color: var(--gray-txt-2);
  line-height: 1.5;
  margin: 0 0 6px;
}

.det-submodal-warning[b-2ur6pjxfog] {
  font-size: 13px;
  font-weight: 700;
  color: var(--yellow);
  line-height: 1.5;
  margin: 0;
}

.det-submodal-close[b-2ur6pjxfog] {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  min-width: 36px;
  background-color: #f1f5f9;
  border: 1px solid #1e293b1f;
  border-radius: 10px;
  cursor: pointer;
  transition: background-color 0.15s;
}

.det-submodal-close:hover[b-2ur6pjxfog] {
  background-color: #e2e8f0;
}

.det-submodal-close img[b-2ur6pjxfog] {
  height: 14px;
}

/* ── Sub-modal body ── */
.det-submodal-body[b-2ur6pjxfog] {
  /* padding: 0 24px 8px; */
  background-color: #f1f5f9cc;
}

/* reuse det-edit-field / det-edit-label / det-edit-input / det-edit-textarea inside sub-modal body */
.det-submodal-body .det-edit-field[b-2ur6pjxfog] {
  padding-top: 16px;
  padding-bottom: 4px;
}

/* ── Sub-modal divider (agreement modal) ── */
.det-submodal-divider[b-2ur6pjxfog] {
  border: 1px solid #1e293b17;
  margin: 0;
}

/* ── Sub-modal footer ── */
.det-submodal-footer[b-2ur6pjxfog] {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 16px 24px;
}

.det-submodal-footer-agreement[b-2ur6pjxfog] {
  background-color: var(--white);
}

/* Cancel / secondary button */
.det-submodal-cancel-btn[b-2ur6pjxfog] {
  flex: 1;
  padding: 12px;
  background-color: #f1f5f9cc;
  border: 1px solid #1e293b17;
  border-radius: 14px;
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: 14px;
  font-weight: 700;
  color: var(--dark-txt);
  cursor: pointer;
  transition: background-color 0.15s;
}

.det-submodal-cancel-btn:hover[b-2ur6pjxfog] {
  background-color: #e2e8f0;
}

/* Assign now button (agreement modal — ghost purple) */
.det-submodal-assign-btn[b-2ur6pjxfog] {
  flex: 1;
  padding: 12px;
  background-color: var(--l-purple);
  border: 1px solid #5263ff22;
  border-radius: 14px;
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: 14px;
  font-weight: 700;
  color: var(--purple-2);
  cursor: pointer;
  transition: background-color 0.15s;
}

.det-submodal-assign-btn:hover[b-2ur6pjxfog] {
  background-color: #dce0ff;
}

/* Confirm / Invite button (solid purple) */
.det-submodal-confirm-btn[b-2ur6pjxfog] {
  flex: 1;
  padding: 12px;
  background:
    linear-gradient(var(--purple), var(--purple)) padding-box,
    linear-gradient(90deg, #1e293b17, #1e293b2e) border-box;
  border: 1px solid transparent;
  border-radius: 14px;
  backdrop-filter: blur(24px);
  box-shadow:
    0px 1px 1px -0.5px #1e293b08,
    0px 3px 3px 0px #ffffff1f inset;
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: 14px;
  font-weight: 700;
  color: var(--white);
  cursor: pointer;
  transition: opacity 0.15s;
}

.det-submodal-confirm-btn:hover[b-2ur6pjxfog] {
  opacity: 0.88;
}

/* ── Shared section wrapper ── */
.address-nickname-popup .modal-body .prices-tab .prices-section[b-2ur6pjxfog] {
  margin-top: 24px;
}

.address-nickname-popup .modal-body .prices-tab .prices-section:first-child[b-2ur6pjxfog] {
  margin-top: 0;
}

/* ── Section header row ── */
.address-nickname-popup .modal-body .prices-tab .prices-section-header[b-2ur6pjxfog] {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 12px;
}

.address-nickname-popup .modal-body .prices-tab .prices-section-title[b-2ur6pjxfog] {
  font-size: 18px;
  font-weight: 800;
  line-height: 24px;
  letter-spacing: -0.3px;
  color: var(--dark-txt);
  margin: 0;
}

.address-nickname-popup .modal-body .prices-tab .prices-section-subtitle[b-2ur6pjxfog] {
  font-size: 13px;
  font-weight: 700;
  color: #475569;
}

/* ── Info icon circle ── */
.address-nickname-popup .modal-body .prices-tab .prices-info-icon[b-2ur6pjxfog] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  border: 1.5px solid #94a3b8;
  color: #94a3b8;
  font-size: 9px;
  font-weight: 700;
  font-style: normal;
  cursor: pointer;
  flex-shrink: 0;
  transition:
    border-color 0.15s,
    color 0.15s;
}

.address-nickname-popup .modal-body .prices-tab .prices-info-icon:hover[b-2ur6pjxfog] {
  border-color: var(--gray-txt);
  color: var(--gray-txt);
}

.address-nickname-popup .modal-body .prices-tab .prices-info-icon-sm[b-2ur6pjxfog] {
  width: 14px;
  height: 14px;
  font-size: 8px;
}

/* ── View-mode table wrapper ── */
.address-nickname-popup .modal-body .prices-tab .prices-table-wrap[b-2ur6pjxfog] {
  border: 1px solid #1e293b0f;
  box-shadow:
    0px 20px 20px -12px #1e293b08,
    0px 3px 3px -1.5px #1e293b08,
    0px 1px 1px -0.5px #1e293b08;
  border-radius: 16px;
  overflow: hidden;
}

/* ── View-mode table ── */
.address-nickname-popup .modal-body .prices-tab .prices-table[b-2ur6pjxfog] {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
}

.address-nickname-popup .modal-body .prices-tab .prices-table thead tr[b-2ur6pjxfog] {
  background-color: #f1f5f9;
  /* border-bottom: 1px solid #1e293b1a; */
  border-bottom: none;
}

.address-nickname-popup .modal-body .prices-tab .prices-table th[b-2ur6pjxfog] {
  padding: 11px 14px;
  text-align: left;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: -0.1px;
  color: var(--gray-txt);
  white-space: nowrap;
  /* border-right: 1px solid #1e293b0f; */
  border-right: none;
}

.address-nickname-popup .modal-body .prices-tab .prices-table th:last-child[b-2ur6pjxfog] {
  border-right: none;
}

.address-nickname-popup .modal-body .prices-tab .prices-table .th-with-info[b-2ur6pjxfog] {
  display: inline-flex;
  align-items: center;
  gap: 5px;
}

.address-nickname-popup .modal-body .prices-tab .prices-table td[b-2ur6pjxfog] {
  padding: 11px 14px;
  color: var(--dark-txt);
  font-size: 13px;
  font-weight: 500;
  /* border-bottom: 1px solid #1e293b0f;
  border-right: 1px solid #1e293b0f; */
  border-bottom: none;
  border-right: none;
  vertical-align: middle;
}

.address-nickname-popup .modal-body .prices-tab .prices-table td:last-child[b-2ur6pjxfog] {
  border-right: none;
}

.address-nickname-popup
  .modal-body
  .prices-tab
  .prices-table
  tbody
  tr:last-child
  td[b-2ur6pjxfog] {
  border-bottom: none;
}

.address-nickname-popup .modal-body .prices-tab .prices-table tbody tr[b-2ur6pjxfog] {
  transition: background-color 0.12s;
}

.address-nickname-popup .modal-body .prices-tab .prices-table tbody tr:hover[b-2ur6pjxfog] {
  background-color: #f8faff;
}

.address-nickname-popup
  .modal-body
  .prices-tab
  .prices-table
  tbody
  tr:nth-child(even)[b-2ur6pjxfog] {
  background-color: #f8fafc;
}

/* Price value in green */
.address-nickname-popup .modal-body .prices-tab .price-value[b-2ur6pjxfog] {
  color: var(--green-2);
  font-weight: 700;
}

/* Rule name link */
.address-nickname-popup .modal-body .prices-tab .prices-rule-link[b-2ur6pjxfog] {
  color: var(--purple-2);
  font-weight: 600;
  cursor: pointer;
}

.address-nickname-popup .modal-body .prices-tab .prices-rule-link:hover[b-2ur6pjxfog] {
  text-decoration: underline;
}

/* Days cell multi-line */
.address-nickname-popup .modal-body .prices-tab .prices-day-line[b-2ur6pjxfog] {
  display: block;
  line-height: 1.5;
  font-weight: 500;
  color: var(--dark-txt);
}

.address-nickname-popup .modal-body .prices-tab .prices-day-sub[b-2ur6pjxfog] {
  display: block;
  font-size: 12px;
  font-weight: 500;
  color: var(--gray-txt-2);
  margin-top: 1px;
}

/* Empty state row */
.address-nickname-popup .modal-body .prices-tab .prices-empty-row[b-2ur6pjxfog] {
  text-align: center;
  color: var(--gray-txt-2);
  font-size: 13px;
  font-weight: 500;
  padding: 20px 14px !important;
}

/* ── Edit mode: outer card ── */
.address-nickname-popup .modal-body .prices-tab .prices-edit-card[b-2ur6pjxfog] {
  background-color: #ffffff;
  border: 1px solid #1e293b17;
  border-radius: 24px;
  overflow: hidden;
  box-shadow:
    0px 20px 20px -12px #1e293b08,
    0px 3px 3px -1.5px #1e293b08,
    0px 1px 1px -0.5px #1e293b08;
}

.address-nickname-popup .modal-body .prices-tab .prices-edit-card-inner[b-2ur6pjxfog] {
  padding: 16px;
}

/* The pricing type and the per-work-type switch are one question asked twice ("how is this
   address priced — or does each work type decide?"), so they share a line. The switch aligns
   with the dropdown rather than the label above it, and drops below on a narrow panel. */
.address-nickname-popup .modal-body .prices-tab .prices-type-row[b-2ur6pjxfog] {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px 24px;
  flex-wrap: wrap;
}

.address-nickname-popup .modal-body .prices-tab .prices-type-field[b-2ur6pjxfog] {
  min-width: 200px;
}

.address-nickname-popup .modal-body .prices-tab .prices-type-toggle[b-2ur6pjxfog] {
  /* The label above the dropdown is 13px/700 plus its 6px margin: this drops the switch past it
     so it lines up with the control, not the heading. */
  margin-top: 25px;
}

.address-nickname-popup .modal-body .prices-tab .prices-edit-label[b-2ur6pjxfog] {
  display: block;
  font-size: 13px;
  font-weight: 700;
  color: var(--gray-txt);
  margin-bottom: 6px;
  letter-spacing: -0.1px;
}

/* ── Select wrapper (custom arrow) ── */
.address-nickname-popup .modal-body .prices-tab .prices-select-wrap[b-2ur6pjxfog] {
  position: relative;
}

.address-nickname-popup .modal-body .prices-tab .prices-select[b-2ur6pjxfog] {
  width: 100%;
  padding: 7px 28px 7px 10px;
  background-color: var(--white);
  border: 1px solid #1e293b1f;
  border-radius: 10px;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.04);
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: 13px;
  font-weight: 600;
  color: var(--dark-txt);
  outline: none;
  appearance: none;
  -webkit-appearance: none;
  background-image: url("../img/icons/gray-arrow.png");
  background-repeat: no-repeat;
  background-position: right 8px center;
  background-size: 16px;
  cursor: pointer;
  transition:
    border-color 0.15s,
    box-shadow 0.15s;
}

.address-nickname-popup .modal-body .prices-tab .prices-select:focus[b-2ur6pjxfog] {
  border-color: var(--purple);
  box-shadow: 0 0 0 3px #5263ff22;
}

/* ── Edit grid: column layout ── */
.address-nickname-popup .modal-body .prices-tab .prices-edit-grid-header[b-2ur6pjxfog],
.address-nickname-popup .modal-body .prices-tab .prices-edit-grid-row[b-2ur6pjxfog] {
  display: grid;
  /* Work type, price, cost, material, position, service description, delete. The last of the
     three opt-in columns holds prose rather than a code, so it gets the room a name needs. */
  grid-template-columns: minmax(120px, 1fr) 88px 88px 76px 76px minmax(120px, 1.2fr) 36px;
  gap: 8px;
  padding: 10px 16px;
  align-items: center;
}

/* Material-ID, Positions-ID and the service description are opt-in per business, so the grid
   has to work with and without them, and with or without the per-work-type price type on top. */
/* The two amount columns are wider than the rest: their headings name a party now ("Customer
   pays", "Nord Snow is paid") rather than reading "Price" and "Cost", and at 88px those wrapped
   after the first word. The work type column is the 1fr, so the room comes out of a column that
   has it to spare. */
.address-nickname-popup .modal-body .prices-tab .prices-edit-grid-header.no-material-position[b-2ur6pjxfog],
.address-nickname-popup .modal-body .prices-tab .prices-edit-grid-row.no-material-position[b-2ur6pjxfog] {
  grid-template-columns: 1fr 116px 116px 36px;
}

.address-nickname-popup .modal-body .prices-tab .prices-edit-grid-header.with-price-type.no-material-position[b-2ur6pjxfog],
.address-nickname-popup .modal-body .prices-tab .prices-edit-grid-row.with-price-type.no-material-position[b-2ur6pjxfog] {
  grid-template-columns: minmax(120px, 1fr) 132px 112px 112px 36px;
}

/* With a per-work-type price type, each row carries its own type dropdown between the work
   type and the amounts. The extra column does not fit the panel at the default widths, so the
   amounts give up a little room and the work type falls back to a minimum rather than 1fr —
   otherwise Position and the delete button are pushed outside the card. */
.address-nickname-popup .modal-body .prices-tab .prices-edit-grid-header.with-price-type[b-2ur6pjxfog],
.address-nickname-popup .modal-body .prices-tab .prices-edit-grid-row.with-price-type[b-2ur6pjxfog] {
  grid-template-columns: minmax(100px, 1fr) 100px 92px 92px 60px 60px minmax(90px, 1fr) 36px;
  gap: 6px;
}

/* Grid items default to min-width:auto and so refuse to shrink below their content, which is
   what let the dropdowns spill across the columns beside them. The dropdowns themselves are
   switched to width:100% in the markup — their width is set inline, out of reach from here. */
.address-nickname-popup .modal-body .prices-tab .prices-edit-grid-row.with-price-type > *[b-2ur6pjxfog] {
  min-width: 0;
}

/* The headers carry an info tooltip next to the label; in the narrower columns the pair has to
   be allowed to wrap instead of running into the next heading. */
.address-nickname-popup .modal-body .prices-tab .prices-edit-grid-header.with-price-type > span[b-2ur6pjxfog] {
  min-width: 0;
  font-size: 11px;
  flex-wrap: wrap;
  row-gap: 0;
}

.address-nickname-popup .modal-body .prices-tab .prices-edit-grid-header[b-2ur6pjxfog] {
  background-color: #f1f5f9;
  /* border-top: 1px solid #1e293b1a; */
  border-top: none;
  border-bottom: 1px solid #1e293b1a;
  border-bottom: none;
}

.address-nickname-popup .modal-body .prices-tab .prices-edit-grid-header span[b-2ur6pjxfog] {
  font-size: 12px;
  font-weight: 700;
  color: var(--gray-txt);
  display: flex;
  align-items: center;
  gap: 4px;
  letter-spacing: -0.1px;
}

.address-nickname-popup .modal-body .prices-tab .prices-edit-grid-row[b-2ur6pjxfog] {
  background-color: var(--white);
  /* border-bottom: 1px solid #1e293b0a; */
  border-bottom: none;
}
.address-nickname-popup .modal-body .prices-tab .prices-edit-grid-row.alt-row[b-2ur6pjxfog] {
  background-color: #f8fafc;
}
/* Seasonal pricing columns */
.address-nickname-popup .modal-body .prices-tab .prices-seasonal-cols[b-2ur6pjxfog] {
  grid-template-columns: 202px 202px 202px;
}
/* Seasonal per-work-type columns: work type, season price, per-task cost, installments, delete.
   A blank work type is the address-wide seasonal row. */
.address-nickname-popup .modal-body .prices-tab .prices-seasonal-wt-cols[b-2ur6pjxfog] {
  grid-template-columns: minmax(140px, 1fr) 132px 132px 100px 36px;
}
.address-nickname-popup .modal-body .prices-tab .prices-edit-grid-row.prices-seasonal-wt-cols > *[b-2ur6pjxfog] {
  min-width: 0;
}
/* Extra fees columns */
.address-nickname-popup .modal-body .prices-tab .prices-fees-cols[b-2ur6pjxfog] {
  grid-template-columns: 209px 176px 176px 36px;
}

/* ── A depth-priced row's price cell: the amounts are in the snow depth panel ── */
.address-nickname-popup .modal-body .prices-tab .prices-depth-dash[b-2ur6pjxfog] {
  color: var(--gray-txt);
  text-align: center;
}

/* ── Divider before fees sub-section ── */
.address-nickname-popup .modal-body .prices-tab .prices-edit-fees-divider[b-2ur6pjxfog] {
  /* border-top: 2px solid #1e293b1a; */
  border-top: none;
}

/* ── Text / number input inside edit grid ── */
.address-nickname-popup .modal-body .prices-tab .prices-input[b-2ur6pjxfog] {
  width: 100%;
  height: 40px;
  margin-bottom: auto;
  padding: 6px 8px;
  background-color: var(--white);
  border: 1px solid #1e293b1f;
  border-radius: 10px;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: 13px;
  font-weight: 600;
  color: var(--dark-txt);
  outline: none;
  transition:
    border-color 0.15s,
    box-shadow 0.15s;
}

.address-nickname-popup .modal-body .prices-tab .prices-input:focus[b-2ur6pjxfog] {
  box-shadow: 0 0 0 0.2rem #dce0ff;
}

.address-nickname-popup .modal-body .prices-tab .prices-input[b-2ur6pjxfog]::placeholder {
  color: #5F6E85;
}

/* Hide number spinners */
.address-nickname-popup
  .modal-body
  .prices-tab
  .prices-input[type="number"][b-2ur6pjxfog]::-webkit-outer-spin-button,
.address-nickname-popup
  .modal-body
  .prices-tab
  .prices-input[type="number"][b-2ur6pjxfog]::-webkit-inner-spin-button {
  -webkit-appearance: none;
}

/* ── Delete row button ── */
.address-nickname-popup .modal-body .prices-tab .prices-row-delete[b-2ur6pjxfog] {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  background: transparent;
  border: none;
  border-radius: 8px;
  cursor: pointer;
  transition: background-color 0.12s;
  padding: 0;
}

.address-nickname-popup .modal-body .prices-tab .prices-row-delete img[b-2ur6pjxfog] {
  height: 18px;
  margin-left: 1px;
}

.address-nickname-popup .modal-body .prices-tab .prices-row-delete:hover[b-2ur6pjxfog] {
  background-color: #fef2f2;
}

/* ── Add row button ── */
.address-nickname-popup .modal-body .prices-tab .prices-add-row-btn[b-2ur6pjxfog] {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 6.5px 16px;
  font-size: 13px;
  font-weight: 700;
  color: var(--purple);
  background-color: #eaecff;
  cursor: pointer;
  user-select: none;
  transition: background-color 0.15s;
  /* border-top: 1px solid #5263ff22; */
  border-top: none;
}

.address-nickname-popup .modal-body .prices-tab .prices-add-row-btn:hover[b-2ur6pjxfog] {
  background-color: #dce0ff;
}

/* ── New rule button ── */
.address-nickname-popup .modal-body .prices-tab .prices-new-rule-btn[b-2ur6pjxfog] {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 14px;
  background:
    linear-gradient(var(--purple), var(--purple)) padding-box,
    linear-gradient(90deg, #1e293b17, #1e293b2e) border-box;
  border: 1px solid transparent;
  border-radius: 10px;
  backdrop-filter: blur(24px);
  box-shadow:
    0px 1px 1px -0.5px #1e293b08,
    0px 3px 3px 0px #ffffff1f inset;
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: 13px;
  font-weight: 700;
  color: var(--white);
  cursor: pointer;
  transition: opacity 0.15s;
}

.address-nickname-popup .modal-body .prices-tab .prices-new-rule-btn:hover[b-2ur6pjxfog] {
  opacity: 0.88;
}

/* ── Actions column (edit rules) ── */
.address-nickname-popup .modal-body .prices-tab .prices-action-icons[b-2ur6pjxfog] {
  display: flex;
  align-items: center;
  gap: 8px;
}

.address-nickname-popup .modal-body .prices-tab .prices-action-btn[b-2ur6pjxfog] {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  background: transparent;
  border: none;
  border-radius: 6px;
  cursor: pointer;
  transition: background-color 0.12s;
  padding: 0;
}

.address-nickname-popup .modal-body .prices-tab .prices-action-btn img[b-2ur6pjxfog] {
  height: 15px;
}

.address-nickname-popup .modal-body .prices-tab .prices-action-edit:hover[b-2ur6pjxfog] {
  background-color: #eaecff;
}

.address-nickname-popup .modal-body .prices-tab .prices-action-delete:hover[b-2ur6pjxfog] {
  background-color: #fef2f2;
}

/* ── Section wrapper ── */
.address-nickname-popup .modal-body .contacts-tab .contacts-section[b-2ur6pjxfog] {
  margin-top: 28px;
}

.address-nickname-popup
  .modal-body
  .contacts-tab
  .contacts-section:first-child[b-2ur6pjxfog] {
  margin-top: 0;
}

/* ── Section header ── */
.address-nickname-popup .modal-body .contacts-tab .contacts-section-header[b-2ur6pjxfog] {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  margin-bottom: 16px;
  gap: 12px;
}

.address-nickname-popup .modal-body .contacts-tab .contacts-section-title[b-2ur6pjxfog] {
  font-size: 18px;
  font-weight: 800;
  line-height: 26px;
  letter-spacing: -0.3px;
  color: var(--dark-txt);
  margin: 0 0 4px;
}

.address-nickname-popup .modal-body .contacts-tab .contacts-section-desc[b-2ur6pjxfog] {
  font-size: 13px;
  font-weight: 500;
  color: var(--gray-txt-2);
  line-height: 1.5;
  margin: 0;
}

/* ── Empty state ── */
.address-nickname-popup .modal-body .contacts-tab .contacts-empty[b-2ur6pjxfog] {
  font-size: 13px;
  font-weight: 500;
  color: var(--gray-txt-2);
  padding: 8px 0;
}

/* ── VIEW: contact cards grid ── */
.address-nickname-popup .modal-body .contacts-tab .contacts-cards-grid[b-2ur6pjxfog] {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}

/* ── VIEW: single contact card ── */
.address-nickname-popup .modal-body .contacts-tab .contacts-card[b-2ur6pjxfog] {
  background-color: #f1f5f9;
  border: none;
  border-radius: 16px;
  padding: 8px;
}

.address-nickname-popup .modal-body .contacts-tab .contacts-card-name[b-2ur6pjxfog] {
  font-size: 14px;
  font-weight: 700;
  color: var(--dark-txt);
  letter-spacing: -0.2px;
  margin-bottom: 6px;
  margin-left: 5px;
}

/* inner mini table */
.address-nickname-popup .modal-body .contacts-tab .contacts-card-table[b-2ur6pjxfog] {
  background-color: #ffffff;
  border: 1px solid #1e293b0f;
  border-radius: 12px;
  overflow: hidden;
}

.address-nickname-popup .modal-body .contacts-tab .contacts-card-row[b-2ur6pjxfog] {
  display: flex;
  align-items: center;
  padding: 9px 14px;
  border-bottom: 1px solid #1e293b0f;
  gap: 12px;
}

.address-nickname-popup
  .modal-body
  .contacts-tab
  .contacts-card-row:last-child[b-2ur6pjxfog] {
  border-bottom: none;
}

.address-nickname-popup .modal-body .contacts-tab .contacts-card-label[b-2ur6pjxfog] {
  font-size: 13px;
  font-weight: 600;
  color: var(--gray-txt-2);
  min-width: 52px;
  flex-shrink: 0;
}

.address-nickname-popup .modal-body .contacts-tab .contacts-card-value[b-2ur6pjxfog] {
  font-size: 13px;
  font-weight: 600;
  color: var(--dark-txt);
  word-break: break-all;
}

/* ── VIEW: notification email chips ── */
.address-nickname-popup .modal-body .contacts-tab .contacts-email-chips[b-2ur6pjxfog] {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.address-nickname-popup .modal-body .contacts-tab .contacts-email-chip[b-2ur6pjxfog] {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 5px 7px;
  background-color: #5263ff1f;
  /* border: 1px solid #5263FF33; */
  border: none;
  border-radius: 8px;
  font-size: 13px;
  font-weight: 600;
  color: #363af5;
  line-height: 1;
}

.address-nickname-popup .modal-body .contacts-tab .contacts-email-chip svg[b-2ur6pjxfog] {
  flex-shrink: 0;
  color: #363af5;
}

/* ── EDIT: new contact button ── */
.address-nickname-popup .modal-body .contacts-tab .contacts-new-btn[b-2ur6pjxfog] {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 14px;
  background:
    linear-gradient(var(--purple), var(--purple)) padding-box,
    linear-gradient(90deg, #1e293b17, #1e293b2e) border-box;
  border: 1px solid transparent;
  border-radius: 10px;
  backdrop-filter: blur(24px);
  box-shadow:
    0px 1px 1px -0.5px #1e293b08,
    0px 3px 3px 0px #ffffff1f inset;
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: 13px;
  font-weight: 700;
  color: var(--white);
  cursor: pointer;
  white-space: nowrap;
  transition: opacity 0.15s;
  flex-shrink: 0;
}

.address-nickname-popup .modal-body .contacts-tab .contacts-new-btn:hover[b-2ur6pjxfog] {
  opacity: 0.88;
}

/* ── EDIT: contact card (edit state) ── */
.address-nickname-popup .modal-body .contacts-tab .contacts-edit-card[b-2ur6pjxfog] {
  background-color: var(--white);
  border: 1px solid #1e293b1a;
  border-radius: 16px;
  padding: 16px;
  display: flex;
  flex-direction: column;
  gap: 16px;
  box-shadow:
    0px 20px 20px -12px #1e293b08,
    0px 3px 3px -1.5px #1e293b08,
    0px 1px 1px -0.5px #1e293b08;
}

.address-nickname-popup .modal-body .contacts-tab .contacts-edit-card-error[b-2ur6pjxfog] {
  border-color: #ed403066;
  background-color: #fff5f5;
}

.address-nickname-popup .modal-body .contacts-tab .contacts-edit-card-top[b-2ur6pjxfog] {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 0;
}

/* ── EDIT: shared label ── */
.address-nickname-popup .modal-body .contacts-tab .contacts-edit-label[b-2ur6pjxfog] {
  font-size: 13px;
  font-weight: 700;
  color: var(--gray-txt);
  letter-spacing: -0.1px;
  margin-bottom: 0;
}

/* ── EDIT: shared input ── */
.address-nickname-popup .modal-body .contacts-tab .contacts-edit-input[b-2ur6pjxfog] {
  width: 100%;
  height: 40px;
  margin-bottom: auto;
  padding: 6px 8px;
  background-color: var(--white);
  border: 1px solid #1e293b1f;
  border-radius: 10px;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: 13px;
  font-weight: 600;
  color: var(--dark-txt);
  outline: none;
  transition:
    border-color 0.15s,
    box-shadow 0.15s;
}

.address-nickname-popup .modal-body .contacts-tab .contacts-edit-input:focus[b-2ur6pjxfog] {
  box-shadow: 0 0 0 0.2rem #dce0ff;
}

.address-nickname-popup
  .modal-body
  .contacts-tab
  .contacts-edit-input[b-2ur6pjxfog]::placeholder {
  color: #5F6E85;
}

/* invalid state (red border) */
.address-nickname-popup .modal-body .contacts-tab .contacts-input-invalid[b-2ur6pjxfog] {
  border-color: #ed4030 !important;
  box-shadow: 0 0 0 3px #ed403022 !important;
}

/* ── EDIT: delete button (card top-right) ── */
.address-nickname-popup .modal-body .contacts-tab .contacts-card-delete[b-2ur6pjxfog] {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  background: transparent;
  border: none;
  border-radius: 8px;
  cursor: pointer;
  padding: 0;
  transition: background-color 0.12s;
  flex-shrink: 0;
}

.address-nickname-popup .modal-body .contacts-tab .contacts-card-delete img[b-2ur6pjxfog] {
  height: 16px;
}

.address-nickname-popup .modal-body .contacts-tab .contacts-card-delete:hover[b-2ur6pjxfog] {
  background-color: #fef2f2;
}

/* ── EDIT: toggle switch ── */
.address-nickname-popup .modal-body .contacts-tab .contacts-toggle-row[b-2ur6pjxfog] {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 4px;
}

.address-nickname-popup .modal-body .contacts-tab .contacts-toggle-switch[b-2ur6pjxfog] {
  position: relative;
  display: inline-block;
  width: 46px;
  height: 28px;
  background: linear-gradient(
    180deg,
    rgba(226, 232, 240, 1) 0%,
    rgba(248, 250, 252, 1) 100%
  );
  border-radius: 50px;
  padding: 3px;
  flex-shrink: 0;
}

.address-nickname-popup
  .modal-body
  .contacts-tab
  .contacts-toggle-switch
  input[b-2ur6pjxfog] {
  opacity: 0;
  width: 0;
  height: 0;
}

.address-nickname-popup .modal-body .contacts-tab .contacts-toggle-slider[b-2ur6pjxfog] {
  position: absolute;
  cursor: pointer;
  border-radius: 30px;
  background-color: #d3dde8;
  transition: 0.3s;
  height: 22px;
  width: 40px;
}

.address-nickname-popup
  .modal-body
  .contacts-tab
  .contacts-toggle-slider[b-2ur6pjxfog]::before {
  content: "";
  position: absolute;
  height: 18px;
  width: 18px;
  left: 2px;
  top: 2px;
  border-radius: 1000px;
  background: linear-gradient(180deg, #e2e8f0 0%, #ffffff 100%);
  border: 3.5px solid #f9fbfc;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.15);
  transition: 0.3s;
}

.address-nickname-popup
  .modal-body
  .contacts-tab
  .contacts-toggle-switch
  input:checked
  + .contacts-toggle-slider[b-2ur6pjxfog] {
  background: linear-gradient(135deg, #5b67f6, #4c57e0);
}

.address-nickname-popup
  .modal-body
  .contacts-tab
  .contacts-toggle-switch
  input:checked
  + .contacts-toggle-slider[b-2ur6pjxfog]::before {
  transform: translateX(18px);
  background: #fff;
}

.address-nickname-popup
  .modal-body
  .contacts-tab
  .contacts-toggle-switch
  input:checked
  + .contacts-toggle-slider[b-2ur6pjxfog]::after {
  content: "";
  position: absolute;
  right: 5px;
  top: 7.5px;
  width: 11px;
  height: 11px;
  background-image: url("../img/icons/toggle-check-icon.svg");
  background-size: contain;
  background-repeat: no-repeat;
}

.address-nickname-popup .modal-body .contacts-tab .contacts-toggle-label[b-2ur6pjxfog] {
  font-size: 13px;
  font-weight: 600;
  color: var(--dark-txt);
}

/* ── EDIT: notification email input row ── */
.address-nickname-popup .modal-body .contacts-tab .contacts-email-input-row[b-2ur6pjxfog] {
  display: flex;
  align-items: center;
  gap: 0;
  background-color: var(--white);
  border: 1px solid #1e293b1f;
  border-radius: 12px;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.04);
  overflow: hidden;
  margin-top: 6px;
  padding: 2px 4px;
}

.address-nickname-popup .modal-body .contacts-tab .contacts-email-add-input[b-2ur6pjxfog] {
  flex: 1;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  background: transparent;
}

.address-nickname-popup
  .modal-body
  .contacts-tab
  .contacts-email-input-row:focus-within[b-2ur6pjxfog] {
  box-shadow: 0 0 0 0.2rem #dce0ff;
}

.address-nickname-popup .modal-body .contacts-tab .contacts-add-email-btn[b-2ur6pjxfog] {
  padding: 8px 16px;
  border-radius: 10px;
  background-color: #5263ff1f;
  border: none;
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: 13px;
  font-weight: 700;
  color: #363af5;
  cursor: pointer;
  white-space: nowrap;
  transition: opacity 0.15s;
  flex-shrink: 0;
}

.address-nickname-popup
  .modal-body
  .contacts-tab
  .contacts-add-email-btn:hover[b-2ur6pjxfog] {
  opacity: 0.88;
}

/* ── EDIT: added emails card ── */
.address-nickname-popup .modal-body .contacts-tab .contacts-added-emails-card[b-2ur6pjxfog] {
  background-color: var(--white);
  border: 1px solid #1e293b1a;
  border-radius: 16px;
  overflow: hidden;
  margin-top: 12px;
  box-shadow:
    0px 20px 20px -12px #1e293b08,
    0px 3px 3px -1.5px #1e293b08,
    0px 1px 1px -0.5px #1e293b08;
}

.address-nickname-popup
  .modal-body
  .contacts-tab
  .contacts-added-emails-header[b-2ur6pjxfog] {
  padding: 10px 16px;
  font-size: 12px;
  font-weight: 700;
  color: var(--gray-txt);
  letter-spacing: -0.1px;
  background-color: #f8fafc;
  border-bottom: 1px solid #1e293b1a;
}

.address-nickname-popup .modal-body .contacts-tab .contacts-added-email-row[b-2ur6pjxfog] {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 16px;
  border-bottom: 1px solid #1e293b0f;
  font-size: 13px;
  font-weight: 600;
  color: var(--dark-txt);
  transition: background-color 0.12s;
}

.address-nickname-popup
  .modal-body
  .contacts-tab
  .contacts-added-email-row:last-child[b-2ur6pjxfog] {
  border-bottom: none;
}

.address-nickname-popup
  .modal-body
  .contacts-tab
  .contacts-added-email-row:hover[b-2ur6pjxfog] {
  background-color: #f8fafc;
}

/* ── Section wrapper ── */
.address-nickname-popup .modal-body .details-tab .det-section[b-2ur6pjxfog] {
  margin-top: 24px;
}
.address-nickname-popup .modal-body .details-tab .det-section:first-child[b-2ur6pjxfog] {
  margin-top: 0;
}
.address-nickname-popup .modal-body .details-tab .det-section-title[b-2ur6pjxfog] {
  font-size: 18px;
  font-weight: 800;
  color: var(--dark-txt);
  letter-spacing: -0.3px;
  margin: 0 0 10px;
}

/* ── White card ── */
.address-nickname-popup .modal-body .details-tab .det-card[b-2ur6pjxfog] {
  background-color: var(--white);
  border: 1px solid #1e293b17;
  border-radius: 24px;
  padding: 16px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  box-shadow:
    0px 20px 20px -12px #1e293b08,
    0px 3px 3px -1.5px #1e293b08,
    0px 1px 1px -0.5px #1e293b08;
}

/* ── Field ── */
.address-nickname-popup .modal-body .details-tab .det-field[b-2ur6pjxfog],
.det-field[b-2ur6pjxfog] {
  display: flex;
  flex-direction: column;
  gap: 5px;
}
.address-nickname-popup .modal-body .details-tab .det-label[b-2ur6pjxfog],
.det-label[b-2ur6pjxfog] {
  font-size: 13px;
  font-weight: 600;
  color: var(--gray-txt);
  letter-spacing: -0.1px;
  margin: 0;
}
/* The line under a toggle that says what the setting falls back to. */
.address-nickname-popup .modal-body .details-tab .det-hint[b-2ur6pjxfog],
.det-hint[b-2ur6pjxfog] {
  font-size: 12px;
  font-weight: 400;
  color: var(--gray-txt);
  opacity: 0.75;
  letter-spacing: -0.1px;
  margin: 4px 0 0;
}
.address-nickname-popup .modal-body .details-tab .det-label-with-info[b-2ur6pjxfog] {
  display: flex;
  align-items: center;
  gap: 5px;
}
.address-nickname-popup .modal-body .details-tab .det-required[b-2ur6pjxfog] {
  color: var(--orange);
}
.address-nickname-popup .modal-body .details-tab .det-validation[b-2ur6pjxfog] {
  font-size: 12px;
  font-weight: 600;
  color: var(--orange);
}

/* ── 2-col grid ── */
.address-nickname-popup .modal-body .details-tab .det-2col[b-2ur6pjxfog] {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px 16px;
}

/* ── Shared input ── */
.address-nickname-popup .modal-body .details-tab .det-input[b-2ur6pjxfog],
.det-input[b-2ur6pjxfog] {
  width: 100%;
  padding: 8px 12px;
  background-color: var(--white);
  border: 1px solid #1e293b1f;
  border-radius: 10px;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: 13px;
  font-weight: 600;
  color: var(--dark-txt);
  outline: none;
  transition:
    border-color 0.15s,
    box-shadow 0.15s;
}
.address-nickname-popup .modal-body .details-tab .det-input:focus[b-2ur6pjxfog],
.det-input:focus[b-2ur6pjxfog] {
  box-shadow: 0 0 0 0.2rem #dce0ff;
}
.address-nickname-popup .modal-body .details-tab .det-input[b-2ur6pjxfog]::placeholder,
.det-input[b-2ur6pjxfog]::placeholder {
  color: #5F6E85;
}
.address-nickname-popup
  .modal-body
  .details-tab
  .det-input[type="number"][b-2ur6pjxfog]::-webkit-outer-spin-button,
.address-nickname-popup
  .modal-body
  .details-tab
  .det-input[type="number"][b-2ur6pjxfog]::-webkit-inner-spin-button {
  -webkit-appearance: none;
}

/* ── Yearly regulation date: a day and a month side by side, one field ── */
.det-daymonth[b-2ur6pjxfog] {
  display: flex;
  gap: 8px;
}
.det-daymonth .det-input[b-2ur6pjxfog] {
  cursor: pointer;
}
.det-daymonth-day[b-2ur6pjxfog] {
  flex: 0 0 84px;
}
.det-daymonth-month[b-2ur6pjxfog] {
  flex: 1 1 auto;
  min-width: 0;
}

/* ── Textarea ── */
.address-nickname-popup .modal-body .details-tab .det-textarea[b-2ur6pjxfog],
.det-textarea[b-2ur6pjxfog] {
  width: 100%;
  padding: 8px 12px;
  background-color: var(--white);
  border: 1px solid #1e293b1f;
  border-radius: 10px;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: 13px;
  font-weight: 600;
  color: var(--dark-txt);
  outline: none;
  resize: vertical;
  transition:
    border-color 0.15s,
    box-shadow 0.15s;
}
.address-nickname-popup .modal-body .details-tab .det-textarea:focus[b-2ur6pjxfog],
.det-textarea:focus[b-2ur6pjxfog] {
  box-shadow: 0 0 0 0.2rem #dce0ff;
}

/* ── Select ── */
.address-nickname-popup .modal-body .details-tab .det-select[b-2ur6pjxfog] {
  width: 100%;
  padding: 8px 28px 8px 12px;
  background-color: var(--white);
  border: 1px solid #1e293b1f;
  border-radius: 10px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: 13px;
  font-weight: 600;
  color: var(--dark-txt);
  outline: none;
  appearance: none;
  -webkit-appearance: none;
  background-image: url("../img/icons/gray-arrow.png");
  background-repeat: no-repeat;
  background-position: right 10px center;
  background-size: 16px;
  cursor: pointer;
  transition:
    border-color 0.15s,
    box-shadow 0.15s;
}
.address-nickname-popup .modal-body .details-tab .det-select:focus[b-2ur6pjxfog] {
  border-color: var(--purple);
  box-shadow: 0 0 0 3px #5263ff22;
}

/* ── Info icon ── */
.address-nickname-popup .modal-body .details-tab .det-info-icon[b-2ur6pjxfog] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 15px;
  height: 15px;
  border-radius: 50%;
  border: 1.5px solid #94a3b8;
  color: #94a3b8;
  font-size: 9px;
  font-weight: 700;
  font-style: normal;
  cursor: pointer;
  transition:
    border-color 0.15s,
    color 0.15s;
}
.address-nickname-popup .modal-body .details-tab .det-info-icon:hover[b-2ur6pjxfog] {
  border-color: var(--gray-txt);
  color: var(--gray-txt);
}

/* ── Customer row ── */
.address-nickname-popup .modal-body .details-tab .det-customer-row[b-2ur6pjxfog] {
  display: flex;
  align-items: center;
  gap: 10px;
}
.address-nickname-popup .modal-body .details-tab .det-icon-dropdown-wrap[b-2ur6pjxfog] {
  flex: 1;
  display: flex;
  align-items: center;
  gap: 0;
  background-color: var(--white);
  border: 1px solid #1e293b1f;
  border-radius: 10px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
  padding: 0 12px;
  overflow: hidden;
}
.address-nickname-popup .modal-body .details-tab .det-icon-dropdown-icon[b-2ur6pjxfog] {
  width: 16px;
  height: 16px;
  flex-shrink: 0;
  margin-right: 8px;
}
.address-nickname-popup .modal-body .details-tab .det-dropdown-full[b-2ur6pjxfog] {
  flex: 1;
  border: none !important;
  box-shadow: none !important;
  background: transparent;
  padding-left: 0;
}
.address-nickname-popup .modal-body .details-tab .det-create-new-btn[b-2ur6pjxfog],
.address-nickname-popup .modal-body .details-tab .det-create-new-btn-hollow[b-2ur6pjxfog] {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 8px 14px;
  background:
    linear-gradient(var(--purple), var(--purple)) padding-box,
    linear-gradient(90deg, #1e293b17, #1e293b2e) border-box;
  border: 1px solid transparent;
  border-radius: 10px;
  backdrop-filter: blur(24px);
  box-shadow:
    0px 1px 1px -0.5px #1e293b08,
    0px 3px 3px 0px #ffffff1f inset;
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: 13px;
  font-weight: 700;
  color: var(--white);
  cursor: pointer;
  white-space: nowrap;
  transition: opacity 0.15s;
  flex-shrink: 0;
}
.address-nickname-popup .modal-body .details-tab .det-create-new-btn-hollow[b-2ur6pjxfog] {
  background: #d1d8fa;
  color: #363af5;
}
.address-nickname-popup .modal-body .details-tab .det-create-new-btn:hover[b-2ur6pjxfog],
.address-nickname-popup
  .modal-body
  .details-tab
  .det-create-new-btn-hollow:hover[b-2ur6pjxfog] {
  opacity: 0.88;
}

/* ── Search input ── */
.address-nickname-popup .modal-body .details-tab .det-search-wrap[b-2ur6pjxfog] {
  display: flex;
  align-items: center;
  gap: 8px;
  background-color: var(--white);
  border: 1px solid #1e293b1f;
  border-radius: 10px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
  padding: 0 12px;
}
.address-nickname-popup .modal-body .details-tab .det-search-wrap:focus-within[b-2ur6pjxfog] {
  border-color: var(--purple);
  box-shadow: 0 0 0 3px #5263ff22;
}
.address-nickname-popup .modal-body .details-tab .det-search-input[b-2ur6pjxfog] {
  border: none !important;
  box-shadow: none !important;
  padding-left: 0 !important;
  background: transparent;
}
.address-nickname-popup .modal-body .details-tab .det-or-manual[b-2ur6pjxfog] {
  font-size: 12px;
  font-weight: 600;
  color: var(--gray-txt-2);
  text-align: center;
  margin-top: -2px;
}

/* ── Country select with flag ── */
.address-nickname-popup .modal-body .details-tab .det-country-wrap[b-2ur6pjxfog] {
  position: relative;
  display: flex;
  align-items: center;
}
.address-nickname-popup .modal-body .details-tab .det-country-flag[b-2ur6pjxfog] {
  position: absolute;
  left: 10px;
  width: 18px;
  height: 13px;
  object-fit: cover;
  border-radius: 2px;
  pointer-events: none;
  z-index: 1;
}
.address-nickname-popup .modal-body .details-tab .det-select.has-flag[b-2ur6pjxfog] {
  padding-left: 36px;
}

/* ── Tag input (required equipment) ── */
.address-nickname-popup .modal-body .details-tab .det-tag-input-wrap[b-2ur6pjxfog] {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  background-color: var(--white);
  border: 1px solid #1e293b1f;
  border-radius: 10px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
  padding: 6px 10px;
  min-height: 42px;
}
.address-nickname-popup
  .modal-body
  .details-tab
  .det-tag-input-wrap:focus-within[b-2ur6pjxfog] {
  border-color: var(--purple);
  box-shadow: 0 0 0 3px #5263ff22;
}
.address-nickname-popup .modal-body .details-tab .det-tag[b-2ur6pjxfog] {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  background-color: #eaecff;
  border-radius: 6px;
  padding: 2px 8px;
  font-size: 12px;
  font-weight: 700;
  color: var(--purple-2);
}
.address-nickname-popup .modal-body .details-tab .det-tag-remove[b-2ur6pjxfog] {
  background: none;
  border: none;
  cursor: pointer;
  color: var(--purple-2);
  font-size: 14px;
  line-height: 1;
  padding: 0;
  display: flex;
  align-items: center;
  transition: opacity 0.15s;
}
.address-nickname-popup .modal-body .details-tab .det-tag-remove:hover[b-2ur6pjxfog] {
  opacity: 0.7;
}
.address-nickname-popup .modal-body .details-tab .det-tag-dropdown-inner[b-2ur6pjxfog] {
  border: none !important;
  box-shadow: none !important;
  background: transparent;
  min-width: 100px;
  flex: 1;
}

/* ── Collapsed rarely-used fields ── */
.address-nickname-popup .modal-body .details-tab .det-collapsible[b-2ur6pjxfog] {
  border-top: 1px solid #1e293b17;
  margin-top: 4px;
  padding-top: 10px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.address-nickname-popup .modal-body .details-tab .det-collapsible-toggle[b-2ur6pjxfog] {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  background: none;
  border: none;
  padding: 4px 0;
  font-size: 13px;
  font-weight: 700;
  color: var(--gray-txt);
  cursor: pointer;
}
.address-nickname-popup .modal-body .details-tab .det-collapsible-chevron[b-2ur6pjxfog] {
  width: 16px;
  height: auto;
  transition: transform 0.2s ease;
}
.address-nickname-popup .modal-body .details-tab .det-collapsible-chevron.open[b-2ur6pjxfog] {
  transform: rotate(180deg);
}
.address-nickname-popup .modal-body .details-tab .det-collapsible-body[b-2ur6pjxfog] {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

/* ── Toggles row ── */
.address-nickname-popup .modal-body .details-tab .det-toggles-row[b-2ur6pjxfog] {
  display: flex;
  align-items: center;
  gap: 28px;
  flex-wrap: wrap;
}
/* The switch is the details tab's, but the prices tab uses it too (pricing type per work
   type). These rules named .details-tab alone, so that one rendered as a bare checkbox
   next to an inert span — the markup was right, the styling simply never reached it. */
.address-nickname-popup .modal-body :is(.details-tab, .prices-tab) .det-toggle-item[b-2ur6pjxfog] {
  display: flex;
  align-items: center;
  gap: 10px;
}
.address-nickname-popup .modal-body :is(.details-tab, .prices-tab) .det-toggle-switch[b-2ur6pjxfog] {
  position: relative;
  display: inline-block;
  width: 46px;
  height: 28px;
  background: linear-gradient(
    180deg,
    rgba(226, 232, 240, 1) 0%,
    rgba(248, 250, 252, 1) 100%
  );
  border-radius: 50px;
  padding: 3px;
  flex-shrink: 0;
}
.address-nickname-popup .modal-body :is(.details-tab, .prices-tab) .det-toggle-switch input[b-2ur6pjxfog] {
  opacity: 0;
  width: 0;
  height: 0;
}
.address-nickname-popup .modal-body :is(.details-tab, .prices-tab) .det-toggle-slider[b-2ur6pjxfog] {
  position: absolute;
  cursor: pointer;
  border-radius: 30px;
  background-color: #d3dde8;
  transition: 0.3s;
  height: 22px;
  width: 40px;
}
.address-nickname-popup .modal-body :is(.details-tab, .prices-tab) .det-toggle-slider[b-2ur6pjxfog]:before {
  content: "";
  position: absolute;
  height: 18px;
  width: 18px;
  left: 2px;
  top: 2px;
  border-radius: 1000px;
  background: linear-gradient(180deg, #e2e8f0 0%, #ffffff 100%);
  border: 3.5px solid #f9fbfc;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.15);
  transition: 0.3s;
}
.address-nickname-popup
  .modal-body
  :is(.details-tab, .prices-tab)
  .det-toggle-switch
  input:checked
  + .det-toggle-slider[b-2ur6pjxfog] {
  background: linear-gradient(135deg, #5b67f6, #4c57e0);
}
.address-nickname-popup
  .modal-body
  :is(.details-tab, .prices-tab)
  .det-toggle-switch
  input:checked
  + .det-toggle-slider[b-2ur6pjxfog]:before {
  transform: translateX(18px);
  background: #fff;
}
.address-nickname-popup
  .modal-body
  :is(.details-tab, .prices-tab)
  .det-toggle-switch
  input:checked
  + .det-toggle-slider[b-2ur6pjxfog]:after {
  content: "";
  position: absolute;
  right: 5px;
  top: 7.5px;
  width: 11px;
  height: 11px;
  background-image: url("../img/icons/toggle-check-icon.svg");
  background-size: contain;
  background-repeat: no-repeat;
}
.address-nickname-popup .modal-body :is(.details-tab, .prices-tab) .det-toggle-label[b-2ur6pjxfog] {
  font-size: 13px;
  font-weight: 600;
  color: var(--dark-txt);
}

/* ── Dashed upload button ── */
.address-nickname-popup .modal-body .details-tab .det-dashed-btn[b-2ur6pjxfog] {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  padding: 13px;
  background-color: var(--l-purple);
  border: 1.5px dashed #5263ff55;
  border-radius: 12px;
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: 13px;
  font-weight: 700;
  color: var(--purple);
  cursor: pointer;
  transition: background-color 0.15s;
}
.address-nickname-popup .modal-body .details-tab .det-dashed-btn:hover[b-2ur6pjxfog] {
  background-color: #dce0ff;
}
.address-nickname-popup .modal-body .details-tab .det-dashed-btn-sm[b-2ur6pjxfog] {
  padding: 9px 13px;
  width: auto;
  flex: 1;
}
.address-nickname-popup .modal-body .details-tab .det-upload-hint[b-2ur6pjxfog] {
    font-size: 11.5px;
    font-weight: 500;
    color: var(--gray-txt-2);
    text-align: center;
    width: 100%;
    /* padding-left: 15px; */
}

/* ── Image strip ── */
.address-nickname-popup .modal-body .details-tab .det-img-strip-outer[b-2ur6pjxfog] {
  display: flex;
  align-items: center;
  gap: 8px;
  overflow: hidden;
}
.address-nickname-popup .modal-body .details-tab .det-img-strip[b-2ur6pjxfog] {
  display: flex;
  gap: 8px;
  overflow-x: auto;
  flex: 1;
  scroll-behavior: smooth;
  scrollbar-width: none;
  scroll-snap-type: x mandatory;
}
.address-nickname-popup
  .modal-body
  .details-tab
  .det-img-strip[b-2ur6pjxfog]::-webkit-scrollbar {
  display: none;
}
.address-nickname-popup .modal-body .details-tab .det-img-thumb[b-2ur6pjxfog] {
  position: relative;
  flex-shrink: 0;
  width: 100px;
  height: 100px;
  border-radius: 8px;
  overflow: hidden;
  border: 2px solid transparent;
  cursor: pointer;
  transition: border-color 0.15s;
  scroll-snap-align: start;
}
.address-nickname-popup .modal-body .details-tab .det-img-thumb.active[b-2ur6pjxfog] {
  border-color: var(--purple);
}
.address-nickname-popup .modal-body .details-tab .det-img-thumb img[b-2ur6pjxfog] {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.address-nickname-popup .modal-body .details-tab .det-img-thumb-delete[b-2ur6pjxfog] {
  position: absolute;
  top: 4px;
  right: 4px;
  width: 24px;
  height: 24px;
  background-color: #B82213;
  border: none;
  border-radius: 6px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background-color 0.12s;
}
.address-nickname-popup .modal-body .details-tab .det-img-thumb-delete:hover[b-2ur6pjxfog] {
  background-color: #f54a3b;
}
.address-nickname-popup .modal-body .details-tab .det-img-thumb-delete img[b-2ur6pjxfog] {
  height: 15px;
  width: 15px;
}
.address-nickname-popup .modal-body .details-tab .det-img-nav[b-2ur6pjxfog] {
  flex-shrink: 0;
  width: 28px;
  height: stretch;
  background-color: #f1f5f9cc;
  border: 1px solid #1e293b17;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  font-weight: 700;
  color: var(--dark-txt);
  cursor: pointer;
  transition: background-color 0.12s;
  line-height: 1;
}
.address-nickname-popup .modal-body .details-tab .det-img-nav:hover[b-2ur6pjxfog] {
  background-color: #e2e8f0;
}

/* ── Drawings toolbar ── */
.address-nickname-popup .modal-body .details-tab .det-drawings-toolbar[b-2ur6pjxfog] {
  display: flex;
  align-items: center;
  gap: 8px;
}
.address-nickname-popup .modal-body .details-tab .det-settings-btn[b-2ur6pjxfog] {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  background-color: #f1f5f9;
  border: 1px solid #1e293b1a;
  border-radius: 8px;
  cursor: pointer;
  transition: background-color 0.12s;
  flex-shrink: 0;
}
.address-nickname-popup .modal-body .details-tab .det-settings-btn img[b-2ur6pjxfog] {
  height: 15px;
}
.address-nickname-popup .modal-body .details-tab .det-settings-btn:hover[b-2ur6pjxfog] {
  background-color: #e2e8f0;
}

/* ── Drawings table ── */
.address-nickname-popup .modal-body .details-tab .det-drawings-table-wrap[b-2ur6pjxfog] {
  border: 1px solid #1e293b0f;
  box-shadow:
    0px 20px 20px -12px #1e293b08,
    0px 3px 3px -1.5px #1e293b08,
    0px 1px 1px -0.5px #1e293b08;
  border-radius: 10px;
  overflow: hidden;
}
.address-nickname-popup .modal-body .details-tab .det-drawings-table[b-2ur6pjxfog] {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
}
.address-nickname-popup .modal-body .details-tab .det-drawings-table thead tr[b-2ur6pjxfog] {
  background-color: #f8fafc;
  border-bottom: 1px solid #1e293b1a;
}
.address-nickname-popup .modal-body .details-tab .det-drawings-table th[b-2ur6pjxfog] {
  padding: 10px 14px;
  font-size: 12px;
  font-weight: 700;
  color: var(--gray-txt);
  text-align: left;
  border-right: 1px solid #1e293b0a;
}
.address-nickname-popup
  .modal-body
  .details-tab
  .det-drawings-table
  th:last-child[b-2ur6pjxfog],
.address-nickname-popup
  .modal-body
  .details-tab
  .det-drawings-table
  td:last-child[b-2ur6pjxfog] {
  border-right: none;
}
.address-nickname-popup .modal-body .details-tab .det-drawings-table td[b-2ur6pjxfog] {
  padding: 10px 14px;
  font-weight: 600;
  color: var(--dark-txt);
  border-bottom: 1px solid #1e293b0a;
  border-right: 1px solid #1e293b0a;
  vertical-align: middle;
}
.address-nickname-popup
  .modal-body
  .details-tab
  .det-drawings-table
  tbody
  tr:last-child
  td[b-2ur6pjxfog] {
  border-bottom: none;
}
.address-nickname-popup .modal-body .details-tab .det-drawings-table tbody tr[b-2ur6pjxfog] {
  transition: background-color 0.12s;
}
.address-nickname-popup
  .modal-body
  .details-tab
  .det-drawings-table
  tbody
  tr:hover[b-2ur6pjxfog] {
  background-color: #f8faff;
}
.address-nickname-popup .modal-body .details-tab .col-check[b-2ur6pjxfog] {
  width: 40px;
  text-align: center;
}
.address-nickname-popup .modal-body .details-tab .det-checkbox[b-2ur6pjxfog] {
  width: 16px;
  height: 16px;
  accent-color: var(--purple);
  cursor: pointer;
}
.address-nickname-popup .modal-body .details-tab .det-row-actions[b-2ur6pjxfog] {
  display: flex;
  align-items: center;
  gap: 6px;
}
.address-nickname-popup .modal-body .details-tab .det-row-action-btn[b-2ur6pjxfog] {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  background: transparent;
  border: none;
  border-radius: 6px;
  cursor: pointer;
  transition: background-color 0.12s;
}
.address-nickname-popup .modal-body .details-tab .det-row-action-btn img[b-2ur6pjxfog] {
  height: 14px;
}
.address-nickname-popup .modal-body .details-tab .det-row-action-btn:hover[b-2ur6pjxfog] {
  background-color: #f1f5f9;
}

/* ── Uploaded files list ── */
.address-nickname-popup .modal-body .details-tab .det-files-list[b-2ur6pjxfog] {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.address-nickname-popup .modal-body .details-tab .det-file-item[b-2ur6pjxfog] {
  display: inline-flex;
  align-items: center;
  gap: 5px;
}
.address-nickname-popup .modal-body .details-tab .det-file-remove[b-2ur6pjxfog] {
  background: none;
  border: none;
  cursor: pointer;
  color: var(--orange);
  font-size: 15px;
  font-weight: 700;
  line-height: 1;
  padding: 0;
  transition: opacity 0.15s;
}
.address-nickname-popup .modal-body .details-tab .det-file-remove:hover[b-2ur6pjxfog] {
  opacity: 0.7;
}
.address-nickname-popup .modal-body .details-tab .det-file-name[b-2ur6pjxfog] {
  font-size: 13px;
  font-weight: 600;
  color: var(--purple);
  text-decoration: underline;
  cursor: pointer;
}

/* ── Actions row ── */
.address-nickname-popup .modal-body .details-tab .det-actions-row[b-2ur6pjxfog] {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}
.address-nickname-popup .modal-body .details-tab .det-make-inactive-btn[b-2ur6pjxfog] {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 9px 16px;
  background-color: #ed40301f;
  /* border: 1px solid #ed403044; */
  border: none;
  border-radius: 10px;
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: 13px;
  font-weight: 700;
  color: var(--orange);
  cursor: pointer;
  transition: background-color 0.15s;
  backdrop-filter: blur(24px);
  box-shadow:
    0px 1px 1px -0.5px #1e293b08,
    0px 3px 3px 0px #ffffff1f inset;
}
.address-nickname-popup .modal-body .details-tab .det-make-inactive-btn:hover[b-2ur6pjxfog] {
  background-color: #ed403022;
}
.address-nickname-popup .modal-body .details-tab .det-delete-btn[b-2ur6pjxfog],
.address-nickname-popup .modal-body .details-tab .det-success-btn[b-2ur6pjxfog] {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 9px 16px;
  background-color: #B82213;
  border: none;
  border-radius: 10px;
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: 13px;
  font-weight: 700;
  color: var(--white);
  cursor: pointer;
  transition: opacity 0.15s;
  backdrop-filter: blur(24px);
  box-shadow:
    0px 1px 1px -0.5px #1e293b08,
    0px 3px 3px 0px #ffffff1f inset;
}
.address-nickname-popup .modal-body .details-tab .det-success-btn[b-2ur6pjxfog] {
  background-color: #296C28;
}
.address-nickname-popup .modal-body .details-tab .det-delete-btn:hover[b-2ur6pjxfog],
.address-nickname-popup .modal-body .details-tab .det-success-btn:hover[b-2ur6pjxfog] {
  opacity: 0.88;
}
/* The wrap carries the tooltip for a disabled delete (a dispatched address): the
   button itself gets no pointer events once disabled, so the title lives one level up. */
.address-nickname-popup .modal-body .details-tab .det-delete-wrap[b-2ur6pjxfog] {
  display: inline-flex;
}
.address-nickname-popup .modal-body .details-tab .det-delete-btn:disabled[b-2ur6pjxfog] {
  opacity: 0.45;
  cursor: not-allowed;
  pointer-events: none;
}

/* ── Date picker ── */
.address-nickname-popup .modal-body .details-tab .det-datepicker-wrap[b-2ur6pjxfog],
.det-datepicker-wrap[b-2ur6pjxfog] {
  display: flex;
  align-items: center;
  gap: 10px;
  background-color: var(--white);
  border: 1px solid #1e293b1f;
  border-radius: 10px;
  padding: 0 12px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
  transition:
    border-color 0.15s,
    box-shadow 0.15s;
}
.address-nickname-popup
  .modal-body
  .details-tab
  .det-datepicker-wrap:focus-within[b-2ur6pjxfog],
.det-datepicker-wrap:focus-within[b-2ur6pjxfog] {
  box-shadow: 0 0 0 3px #5263ff22;
}
.address-nickname-popup .modal-body .details-tab .det-datepicker-input[b-2ur6pjxfog],
.det-datepicker-input[b-2ur6pjxfog] {
  border: none !important;
  box-shadow: none !important;
  padding-left: 0 !important;
  background: transparent;
}

/* ════════════════════════════
   SUB-MODALS
════════════════════════════ */
.det-submodal-backdrop[b-2ur6pjxfog] {
  position: absolute;
  inset: 0;
  background-color: rgba(15, 23, 42, 0.35);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1100;
  border-radius: inherit;
}
.det-submodal[b-2ur6pjxfog] {
  background-color: var(--white);
  border-radius: 20px;
  width: 100%;
  max-width: 520px;
  overflow: hidden;
  box-shadow: 0 24px 48px rgba(0, 0, 0, 0.16);
  animation: submodalIn-b-2ur6pjxfog 0.22s cubic-bezier(0.22, 1, 0.36, 1) both;
}
@keyframes submodalIn-b-2ur6pjxfog {
  from {
    transform: scale(0.94) translateY(12px);
    opacity: 0;
  }
  to {
    transform: scale(1) translateY(0);
    opacity: 1;
  }
}
.det-submodal-header[b-2ur6pjxfog] {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  padding: 24px 24px 16px;
  gap: 12px;
}
.det-submodal-title[b-2ur6pjxfog] {
  font-size: 18px;
  font-weight: 800;
  color: var(--dark-txt);
  letter-spacing: -0.3px;
  margin: 0 0 6px;
  line-height: 1.3;
}
.det-submodal-subtitle[b-2ur6pjxfog] {
  font-size: 13px;
  font-weight: 500;
  color: var(--gray-txt-2);
  line-height: 1.5;
  margin: 0 0 6px;
}
.det-submodal-warning[b-2ur6pjxfog] {
  font-size: 13px;
  font-weight: 700;
  color: var(--yellow);
  line-height: 1.5;
  margin: 0;
}
.det-submodal-close[b-2ur6pjxfog] {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  min-width: 36px;
  background-color: #f1f5f9;
  border: 1px solid #1e293b1f;
  border-radius: 10px;
  cursor: pointer;
  transition: background-color 0.15s;
}
.det-submodal-close:hover[b-2ur6pjxfog] {
  background-color: #e2e8f0;
}
.det-submodal-close img[b-2ur6pjxfog] {
  height: 14px;
}
.det-submodal-body[b-2ur6pjxfog] {
  /* padding: 0 24px; */
  background-color: #f1f5f9cc;
}
.det-submodal-divider[b-2ur6pjxfog] {
  border: 1px solid #1e293b17;
  margin: 0;
}
.det-submodal-footer[b-2ur6pjxfog] {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 16px 24px;
}
.det-submodal-cancel-btn[b-2ur6pjxfog] {
  flex: 1;
  padding: 12px;
  background-color: #f1f5f9cc;
  border: 1px solid #1e293b17;
  border-radius: 14px;
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: 14px;
  font-weight: 700;
  color: var(--dark-txt);
  cursor: pointer;
  transition: background-color 0.15s;
}
.det-submodal-cancel-btn:hover[b-2ur6pjxfog] {
  background-color: #e2e8f0;
}
.det-submodal-assign-btn[b-2ur6pjxfog] {
  flex: 1;
  padding: 12px;
  background-color: var(--l-purple);
  border: 1px solid #5263ff22;
  border-radius: 14px;
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: 14px;
  font-weight: 700;
  color: var(--purple-2);
  cursor: pointer;
  transition: background-color 0.15s;
}
.det-submodal-assign-btn:hover[b-2ur6pjxfog] {
  background-color: #dce0ff;
}
.det-submodal-confirm-btn[b-2ur6pjxfog] {
  flex: 1;
  padding: 12px;
  background:
    linear-gradient(var(--purple), var(--purple)) padding-box,
    linear-gradient(90deg, #1e293b17, #1e293b2e) border-box;
  border: 1px solid transparent;
  border-radius: 14px;
  backdrop-filter: blur(24px);
  box-shadow:
    0px 1px 1px -0.5px #1e293b08,
    0px 3px 3px 0px #ffffff1f inset;
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: 14px;
  font-weight: 700;
  color: var(--white);
  cursor: pointer;
  transition: opacity 0.15s;
}
.det-submodal-confirm-btn:hover[b-2ur6pjxfog] {
  opacity: 0.88;
}

.rule-action-btn[b-2ur6pjxfog] {
  background: none;
  border: none;
  cursor: pointer;
  padding: 4px;
  border-radius: 6px;
  transition: background 0.15s;
}

.rule-action-btn:hover[b-2ur6pjxfog] {
  background: #f1f5f9;
}

.rule-header[b-2ur6pjxfog] {
  display: flex !important;
  align-items: center !important;
  margin-bottom: 12px !important;
  gap: 5px;
}

/*subcontractor proce command costs edit*/
.sub-edit .prices-section[b-2ur6pjxfog] {
  margin-top: 24px;
}

.sub-edit .prices-section:first-child[b-2ur6pjxfog] {
  margin-top: 0;
}

.sub-edit .prices-section-header[b-2ur6pjxfog] {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 12px;
}

.sub-edit .prices-section-title[b-2ur6pjxfog] {
  font-size: 18px;
  font-weight: 800;
  line-height: 24px;
  letter-spacing: -0.3px;
  color: var(--dark-txt);
  margin: 0;
}

.sub-edit .prices-section-subtitle[b-2ur6pjxfog] {
  font-size: 13px;
  font-weight: 700;
  color: #475569;
}

.sub-edit .prices-edit-card[b-2ur6pjxfog] {
  background-color: #ffffff;
  border: 1px solid #1e293b17;
  border-radius: 24px;
  overflow: hidden;
  box-shadow:
    0px 20px 20px -12px #1e293b08,
    0px 3px 3px -1.5px #1e293b08,
    0px 1px 1px -0.5px #1e293b08;
}

.sub-edit .prices-edit-card-inner[b-2ur6pjxfog] {
  padding: 16px;
}

.sub-edit .prices-edit-grid-header[b-2ur6pjxfog],
.sub-edit .prices-edit-grid-row[b-2ur6pjxfog] {
  display: grid;
  grid-template-columns: 1fr 160px 160px;
  gap: 16px;
  padding: 10px 16px;
  align-items: center;
}

/*For per season table columns*/
.sub-edit .prices-edit-grid-header.cols-3-equal[b-2ur6pjxfog],
.sub-edit .prices-edit-grid-row.cols-3-equal[b-2ur6pjxfog] {
  grid-template-columns: 1fr 1fr 1fr;
}
.sub-edit .prices-edit-grid-header.cols-4-equal[b-2ur6pjxfog],
.sub-edit .prices-edit-grid-row.cols-4-equal[b-2ur6pjxfog] {
  grid-template-columns: 1fr 1fr 1fr 1fr;
}

.sub-edit .prices-edit-grid-header[b-2ur6pjxfog] {
  background-color: #f1f5f9;
  border-top: none;
  border-bottom: none;
}

.sub-edit .prices-edit-grid-header span[b-2ur6pjxfog] {
  font-size: 12px;
  font-weight: 700;
  color: var(--gray-txt);
  display: flex;
  align-items: center;
  gap: 4px;
  letter-spacing: -0.1px;
}

.sub-edit .prices-edit-grid-row[b-2ur6pjxfog] {
  background-color: var(--white);
  border-bottom: none;
}

.sub-edit .prices-edit-grid-row.alt-row[b-2ur6pjxfog] {
  background-color: #f8fafc;
}

.sub-edit .prices-select-wrap[b-2ur6pjxfog] {
  position: relative;
}

.sub-edit .prices-input[b-2ur6pjxfog] {
  width: 100%;
  height: 40px;
  margin-bottom: auto;
  padding: 6px 8px;
  background-color: var(--white);
  border: 1px solid #1e293b1f;
  border-radius: 10px;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: 13px;
  font-weight: 600;
  color: var(--dark-txt);
  outline: none;
  transition:
    border-color 0.15s,
    box-shadow 0.15s;
}

.sub-edit .prices-input:focus[b-2ur6pjxfog] {
  box-shadow: 0 0 0 0.2rem #dce0ff;
}

.sub-edit .prices-input[b-2ur6pjxfog]::placeholder {
  color: #5F6E85;
}

.sub-edit .prices-input[type="number"][b-2ur6pjxfog]::-webkit-outer-spin-button,
.sub-edit .prices-input[type="number"][b-2ur6pjxfog]::-webkit-inner-spin-button {
  -webkit-appearance: none;
}

.empty-text-primary[b-2ur6pjxfog] {
  color: var(--gray-txt);
  font-size: 18px;
  font-weight: 800;
}
.customer-share-toggle[b-2ur6pjxfog]{position:absolute;left:5px;bottom:5px;border:0;border-radius:10px;background:#182033d9;color:#fff;padding:3px 6px;font-size:9px;z-index:2}.customer-share-toggle.file[b-2ur6pjxfog]{position:static;margin-left:auto;white-space:nowrap;background:#eef0ff;color:#5362de}.driver-share-toggle[b-2ur6pjxfog]{border:0;border-radius:10px;background:#182033d9;color:#fff;padding:3px 6px;font-size:9px;z-index:2}.driver-share-toggle.file[b-2ur6pjxfog]{position:static;margin-left:6px;white-space:nowrap;background:#eaf6ee;color:#2f7d4f}.det-img-thumb[b-2ur6pjxfog]{position:relative}

/* ── Retroactive billing pending hint (SM-73) ── */
.retro-pending-banner[b-2ur6pjxfog] {
    align-items: center;
    background: #eef0ff;
    border: 1px solid #dbe0ff;
    border-radius: 10px;
    color: #334155;
    display: flex;
    font-size: 13px;
    font-weight: 500;
    gap: 12px;
    justify-content: space-between;
    margin-bottom: 16px;
    padding: 10px 14px;
}

.retro-pending-open[b-2ur6pjxfog] {
    background: #5263ff;
    border: 0;
    border-radius: 8px;
    color: #ffffff;
    font-size: 13px;
    font-weight: 600;
    min-height: 34px;
    padding: 6px 14px;
    white-space: nowrap;
}

.retro-pending-open:hover[b-2ur6pjxfog] {
    background: #4353e8;
    color: #ffffff;
}

/* ── The live map at the top of the Details tab ───────────────────────────── */
/* It replaced a carousel of drawing screenshots, and keeps its 16px corners. */

.ldm-header-map[b-2ur6pjxfog] {
    position: relative;
    width: 100%;
    height: 260px;
    border-radius: 16px;
    overflow: hidden;
    border: 1px solid #1E293B14;
}

/* Fullscreen is the whole point of the button, and the map inside is sized in px.
   ::deep reaches past the component boundary into WMMap's own container. */
.ldm-header-map:fullscreen[b-2ur6pjxfog] {
    height: 100%;
    border-radius: 0;
    border: none;
}

    .ldm-header-map:fullscreen[b-2ur6pjxfog]  .wm-map-wrapper,
    .ldm-header-map:fullscreen[b-2ur6pjxfog]  .wm-map-wrapper > div,
    .ldm-header-map:fullscreen[b-2ur6pjxfog]  .wm-map-container {
        height: 100% !important;
    }

.ldm-header-map-loading[b-2ur6pjxfog] {
    position: absolute;
    inset: 0;
    z-index: 5;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #F8FAFC;
    color: #0D6EFD;
}

.ldm-header-map-hint[b-2ur6pjxfog] {
    margin: -4px 0 12px;
    font-size: 12px;
    font-weight: 500;
    color: var(--gray-txt);
    letter-spacing: -0.1px;
}

/* ── Uploaded photos, under the map ──────────────────────────────────────── */

.ldm-photo-strip[b-2ur6pjxfog] {
    display: flex;
    gap: 8px;
    overflow-x: auto;
    -ms-overflow-style: none;
    scrollbar-width: thin;
}

.ldm-photo-thumb[b-2ur6pjxfog] {
    flex: 0 0 auto;
    width: 72px;
    height: 56px;
    padding: 0;
    border: 1px solid #1E293B14;
    border-radius: 10px;
    overflow: hidden;
    background: none;
    cursor: pointer;
}

    .ldm-photo-thumb img[b-2ur6pjxfog] {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

/* ── Registration ────────────────────────────────────────────────────────── */

.ldm-geofence[b-2ur6pjxfog] {
    margin-bottom: 16px;
}

.ldm-geofence-title[b-2ur6pjxfog] {
    font-size: 14px;
    font-weight: 800;
    color: var(--dark-txt);
    letter-spacing: -0.2px;
    margin: 0 0 8px;
}

.ldm-geofence-grid[b-2ur6pjxfog] {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}

.ldm-geofence-item[b-2ur6pjxfog] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: calc(50% - 0.75rem);
}

.ldm-geofence-label[b-2ur6pjxfog] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 12px;
    font-weight: 600;
    color: var(--gray-txt);
    letter-spacing: -0.1px;
}

.ldm-geofence-value[b-2ur6pjxfog] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
    font-weight: 700;
    color: var(--dark-txt);
    letter-spacing: -0.1px;
}

/* The owner's inline editor: the same row as the read-only value, with an input where the
   number was. Sized to the number it holds rather than the column, so the Default chip still
   sits beside it. */
.ldm-geofence-edit[b-2ur6pjxfog] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.ldm-geofence-input[b-2ur6pjxfog] {
    width: 84px;
    padding: 5px 8px;
    font-size: 13px;
    font-weight: 700;
    color: var(--dark-txt);
    letter-spacing: -0.1px;
    background: #FFFFFF;
    border: 1px solid #E2E8F0;
    border-radius: 8px;
    outline: none;
}

.ldm-geofence-input:focus[b-2ur6pjxfog] {
    border-color: #363AF5;
}

.ldm-geofence-input:disabled[b-2ur6pjxfog] {
    background: #F1F5F9;
    color: var(--gray-txt);
}

.ldm-geofence-actions[b-2ur6pjxfog] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: 10px;
}

.ldm-geofence-hint[b-2ur6pjxfog] {
    font-size: 11px;
    font-weight: 500;
    color: var(--gray-txt);
    letter-spacing: -0.1px;
}

.ldm-geofence-save[b-2ur6pjxfog] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-width: 72px;
    min-height: 30px;
    padding: 5px 14px;
    font-size: 12px;
    font-weight: 700;
    color: #FFFFFF;
    letter-spacing: -0.1px;
    background: #363AF5;
    border: none;
    border-radius: 8px;
    cursor: pointer;
}

.ldm-geofence-save:disabled[b-2ur6pjxfog] {
    background: #CBD5E1;
    cursor: default;
}

.ldm-geofence-error[b-2ur6pjxfog] {
    margin: 8px 0 0;
    font-size: 12px;
    font-weight: 600;
    color: #ED4030;
    letter-spacing: -0.1px;
}

.ldm-geofence-default[b-2ur6pjxfog] {
    font-size: 11px;
    font-weight: 600;
    color: var(--gray-txt);
    background: #F1F5F9CC;
    border: 1px solid #1E293B08;
    border-radius: 6px;
    padding: 1px 6px;
}

/* A heading for a group of fields inside an edit section, one step below det-section-title. */
.address-nickname-popup .modal-body .details-tab .det-group-title[b-2ur6pjxfog] {
    font-size: 14px;
    font-weight: 800;
    color: var(--dark-txt);
    letter-spacing: -0.2px;
    margin: 4px 0 8px;
}

/* == VIEW: attached files (read-only Details) == */
.address-nickname-popup .modal-body .details-tab .ldm-files-block[b-2ur6pjxfog] {
  margin-top: 24px;
}
.address-nickname-popup .modal-body .details-tab .ldm-file-list[b-2ur6pjxfog] {
  display: flex;
  flex-direction: column;
  gap: 4px;
  margin-top: 12px;
}
.address-nickname-popup .modal-body .details-tab .ldm-file-row[b-2ur6pjxfog] {
  align-items: center;
  border-radius: 8px;
  display: flex;
  gap: 8px;
  padding: 6px 8px;
  text-decoration: none;
  transition: background-color 0.12s;
}
.address-nickname-popup .modal-body .details-tab .ldm-file-row:hover[b-2ur6pjxfog] {
  background-color: #f1f5f9;
}
.address-nickname-popup .modal-body .details-tab .ldm-file-icon[b-2ur6pjxfog] {
  flex: 0 0 auto;
  height: 16px;
  width: 16px;
}
.address-nickname-popup .modal-body .details-tab .ldm-file-name[b-2ur6pjxfog] {
  color: var(--purple);
  flex: 1 1 auto;
  font-size: 13px;
  font-weight: 600;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.address-nickname-popup .modal-body .details-tab .ldm-file-row:hover .ldm-file-name[b-2ur6pjxfog] {
  text-decoration: underline;
}
.address-nickname-popup .modal-body .details-tab .ldm-file-type[b-2ur6pjxfog] {
  background: #eef0ff;
  border-radius: 10px;
  color: #5362de;
  flex: 0 0 auto;
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.02em;
  padding: 3px 7px;
  text-transform: uppercase;
  white-space: nowrap;
}
.address-nickname-popup .modal-body .details-tab .ldm-file-empty[b-2ur6pjxfog] {
  color: var(--gray-txt-2);
  font-size: 13px;
  font-weight: 500;
  margin: 0;
  padding: 8px 0;
}

/* What another business pays us: shown, never typed in. */
.prices-input-readonly[b-2ur6pjxfog] {
    background: #F1F5F9;
    color: #475569;
    cursor: default;
}

/* "Cannot find coordinates for this address", under the address in the header. The amber of
   the list's scheduled chip, one line high, so the header keeps its height on a healthy address
   and grows by a single compact row on this one. */
.modal-header .header-txt p.header-coordinates-warning[b-2ur6pjxfog] {
    align-items: center;
    background: #fef3c7;
    border-radius: 8px;
    color: #92400e;
    display: inline-flex;
    font-size: 12px;
    font-weight: 600;
    gap: 6px;
    line-height: 16px;
    margin-top: 4px;
    padding: 2px 8px;
    width: fit-content;
}

/* SM-443: the word under a cost box saying what the number in it means. A link, not a
   control that shouts - most rows follow the customer and never need touching. */
.cost-model-toggle[b-2ur6pjxfog] {
  background: none;
  border: none;
  color: #5263ff;
  cursor: pointer;
  font-size: 11px;
  font-weight: 600;
  line-height: 1;
  padding: 2px 0 0;
  text-align: left;
}

.cost-model-toggle:hover[b-2ur6pjxfog] {
  text-decoration: underline;
}
/* /Pages/Locations/Components/LocationDetailsModalChangelogView.razor.rz.scp.css */
/* Changelogs START */

/* 2. Outer container */
.changelog-container[b-ro2ik2s449] {
  padding-top: 4px;
}

/* 3. Pills row */
.changelog-tabs[b-ro2ik2s449] {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 6px !important;
  margin-bottom: 20px !important;
}

/* 4. Each pill button — every property needs !important to
      override Bootstrap's btn reset AND the div reset above */
button.changelog-tab[b-ro2ik2s449] {
  display: inline-flex !important;
  align-items: center !important;
  padding: 5px 14px !important;
  border-radius: 999px !important;
  border: none !important;
  background-color: #f4f7fa !important;
  background-image: none !important;
  color: #475569 !important;
  font-family: "Plus Jakarta Sans", sans-serif !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  letter-spacing: -0.1px !important;
  line-height: 1.5 !important;
  cursor: pointer !important;
  box-shadow: none !important;
  text-decoration: none !important;
  white-space: nowrap !important;
  transition:
    background-color 0.15s,
    color 0.15s,
    border-color 0.15s !important;
}

button.changelog-tab:hover[b-ro2ik2s449],
button.changelog-tab:focus[b-ro2ik2s449] {
  background-color: #eaecff !important;
  color: #1e293b !important;
  border-color: none !important;
  outline: none !important;
  box-shadow: none !important;
}

/* Active pill — dark navy background, white text */
button.changelog-tab.active[b-ro2ik2s449] {
  background-color: #eaecff !important;
  color: #363af5 !important;
  border-color: transparent !important;
  font-weight: 700 !important;
}

button.changelog-tab.active:hover[b-ro2ik2s449] {
  cursor: default !important;
}

/* 5. Entry list */
.changelog-list[b-ro2ik2s449] {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
  display: flex !important;
  flex-direction: column !important;
}

.changelog-item[b-ro2ik2s449] {
  display: flex !important;
  gap: 12px !important;
  padding: 13px 0 !important;
  border-bottom: 1px solid #f1f5f9 !important;
  align-items: flex-start !important;
}

.changelog-item:last-child[b-ro2ik2s449] {
  border-bottom: none !important;
}

/* 6. Timeline dot */
.changelog-dot[b-ro2ik2s449] {
  margin-top: 5px !important;
  width: 10px !important;
  height: 10px !important;
  min-width: 10px !important;
  border-radius: 50% !important;
  background-color: #dce0ff !important;
  flex-shrink: 0 !important;
  display: inline-block !important;
}

/* 7. Text block */
.changelog-content[b-ro2ik2s449] {
  display: flex !important;
  flex-direction: column !important;
  gap: 3px !important;
  flex: 1 !important;
  min-width: 0 !important;
}

.changelog-text[b-ro2ik2s449] {
  margin: 0 !important;
  font-family: "Plus Jakarta Sans", sans-serif !important;
  font-size: 13.5px !important;
  font-weight: 500 !important;
  color: #1e293b !important;
  line-height: 1.55 !important;
  word-break: break-word !important;
}

.changelog-author[b-ro2ik2s449] {
  font-weight: 700 !important;
  color: #1e293b !important;
  margin-right: 2px !important;
}

.changelog-text b[b-ro2ik2s449],
.changelog-text strong[b-ro2ik2s449] {
  font-weight: 700 !important;
  color: #1e293b !important;
}

/* 8. Date */
.changelog-date[b-ro2ik2s449] {
  display: block !important;
  font-family: "Plus Jakarta Sans", sans-serif !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  color: #5F6E85 !important;
  letter-spacing: -0.1px !important;
  line-height: 1.4 !important;
}

/* 9. Loading / empty */
.changelog-loading[b-ro2ik2s449],
.changelog-empty[b-ro2ik2s449] {
  font-family: "Plus Jakarta Sans", sans-serif !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  color: #5F6E85 !important;
  padding: 16px 0 !important;
  margin: 0 !important;
}

/* Changelog END */
/* /Pages/Locations/Components/LocationDrawingsModal.razor.rz.scp.css */
/* ── Modal body ──────────────────────────────────────────────────────────── */
.z-index-lower[b-eo703oj4qk] {
	z-index: 1050 !important;
}

.ldm-body[b-eo703oj4qk] {
	display: flex;
	flex-direction: column;
	gap: 0;
	min-height: 500px;
	max-height: 500px;
}

/* ── Toolbar ─────────────────────────────────────────────────────────────── */

.ldm-toolbar[b-eo703oj4qk] {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 8px;
	padding: 8px 20px;
	border-bottom: 1px solid #F1F5F9;
}

.ldm-filters[b-eo703oj4qk] {
	display: flex;
	align-items: center;
	gap: 8px;
	flex: 1;
	min-width: 0;
}

.ldm-toolbar-actions[b-eo703oj4qk] {
	display: flex;
	align-items: center;
	gap: 8px;
	flex-shrink: 0;
}

/* ── Gear / settings button ──────────────────────────────────────────────── */

.ldm-gear-btn[b-eo703oj4qk] {
	width: 36px;
	height: 36px;
	border: 1px solid #E2E8F0;
	border-radius: 10px;
	background: #F8FAFC;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: background .15s, border-color .15s;
}

	.ldm-gear-btn:hover[b-eo703oj4qk] {
		background: #F1F5F9;
		border-color: #CBD5E1;
	}

/* ── Warning banner ──────────────────────────────────────────────────────── */

.ldm-warning-banner[b-eo703oj4qk] {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 10px 24px;
	background: #FFFBEB;
	border-bottom: 1px solid #FDE68A;
	font-size: 13px;
	color: #92400E;
}

.ldm-warning-link[b-eo703oj4qk] {
	background: none;
	border: none;
	color: #D97706;
	font-size: 13px;
	font-weight: 600;
	cursor: pointer;
	padding: 0;
	text-decoration: underline;
}

/* ── Table wrapper ───────────────────────────────────────────────────────── */

.ldm-table-wrap[b-eo703oj4qk] {
	overflow-x: auto;
	flex: 1;
	background-color: #F1F5F9;
	height: 100%;
	overflow-y: auto;
	scrollbar-width: none;
}

.ldm-table[b-eo703oj4qk] {
	width: 100%;
	border-collapse: collapse;
	background-color: #F8FAFC;
	border: 1px solid #1E293B0F;
}

	.ldm-table thead th[b-eo703oj4qk] {
		padding: 12px 16px;
		font-size: 13px;
		font-weight: 700;
		color: #1E293B;
		background: #F1F5F9;
		white-space: nowrap;
		text-align: left;
		letter-spacing: -0.2px;
		line-height: 20px;
		border-right: 1px solid #1E293B0F;
		position: sticky;
		top: 1px;
		z-index: 1066;
	}

	.ldm-table tbody td[b-eo703oj4qk] {
		padding: 8px 16px;
		font-size: 13px;
		color: #1E293B;
		font-weight: 600;
		vertical-align: middle;
		gap: 10px;
		border-right: 1px solid #1E293B0F;
		justify-content: start;
		letter-spacing: -0.02px;
		line-height: 20px;
	}

	.ldm-table tbody tr:last-child td[b-eo703oj4qk] {
		border-bottom: none;
	}

	.ldm-table tbody tr:hover td[b-eo703oj4qk] {
		background: #FAFAFA;
	}

	.ldm-table tbody tr.ldm-row-selected td[b-eo703oj4qk] {
		background: #EFF6FF;
	}

	/* ── Column widths ───────────────────────────────────────────────────────── */

	.ldm-table .col-check[b-eo703oj4qk] {
		width: 44px;
		/*padding-left: 16px;
		padding-right: 4px;*/
	}

.ldm-cell-created-by[b-eo703oj4qk] {
	white-space: nowrap;
	min-width: 110px;
}

.ldm-cell-type[b-eo703oj4qk] {
	min-width: 130px;
}

.ldm-cell-date[b-eo703oj4qk] {
	white-space: nowrap;
	min-width: 150px;
	color: #5F6E85;
	font-size: 12px;
}

.ldm-cell-worktype[b-eo703oj4qk] {
	min-width: 200px;
	max-width: 300px;
}

.ldm-cell-actions[b-eo703oj4qk] {
	width: 96px;
}

.ldm-table-row--odd[b-eo703oj4qk] {
	background-color: #FFFFFF;
}

.ldm-table-row--even[b-eo703oj4qk] {
	background-color: #F8FAFC;
}

/* ── Checkbox ────────────────────────────────────────────────────────────── */

.ldm-custom-checkbox[b-eo703oj4qk] {
	width: 18px;
	height: 18px;
	border-radius: 6px;
	padding: 2px;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: all 0.2s;
	background: linear-gradient(180deg, #f1f5f9 0%, #ffffff 100%);
	border: 2.5px solid #d9dee3;
	backdrop-filter: blur(24px);
	box-shadow: 0px 1px 1px -0.5px #1e293b08, 0px 3px 3px 0px #ffffff1f inset;
	flex-shrink: 0;
	cursor: pointer;
}

	.ldm-custom-checkbox.ldm-custom-checkbox--checked[b-eo703oj4qk] {
		background: linear-gradient(180deg, #5263ff 0%, #5263ff 100%);
		color: white;
		backdrop-filter: blur(24px);
		box-shadow: 0px 1px 1px -0.5px #1e293b08, 0px 3px 3px 0px #ffffff1f inset;
		border: none;
	}

	/* Partial/indeterminate state: light blue background, dash icon in brand color */
	.ldm-custom-checkbox.ldm-custom-checkbox--partial[b-eo703oj4qk] {
		background: #D1D8FA;
		color: #5263FF;
		backdrop-filter: blur(24px);
		box-shadow: 0px 1px 1px -0.5px #1e293b08, 0px 3px 3px 0px #ffffff1f inset;
		border: none;
	}

/* ── Type cell ───────────────────────────────────────────────────────────── */

.ldm-type-cell[b-eo703oj4qk] {
	display: flex;
	align-items: center;
	gap: 6px;
	flex-wrap: wrap;
}

.ldm-color-dot[b-eo703oj4qk] {
	width: 10px;
	height: 10px;
	border-radius: 50%;
	flex-shrink: 0;
}

.ldm-type-badge-sm[b-eo703oj4qk] {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	padding: 2px 8px;
	border-radius: 8px;
	background: #5263FF1F;
	color: #363AF5;
	font-size: 11px;
	font-weight: 600;
	white-space: nowrap;
}

.ldm-type-dot[b-eo703oj4qk] {
	width: 11px;
	height: 11px;
	border-radius: 50%;
	flex-shrink: 0;
}

/* ── Row actions ─────────────────────────────────────────────────────────── */

.ldm-row-actions[b-eo703oj4qk] {
	display: flex;
	align-items: center;
	gap: 10px;
}

.ldm-action-btn[b-eo703oj4qk] {
	width: 20px;
	height: 20px;
	border: none;
	border-radius: 7px;
	background: none;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0;
	transition: background .15s, border-color .15s;
}

	.ldm-action-btn:hover[b-eo703oj4qk] {
		background: #F1F5F9;
		border-color: #CBD5E1;
	}

	.ldm-action-btn.ldm-action-btn-danger:hover[b-eo703oj4qk] {
		background: #FEF2F2;
		border-color: #FECACA;
	}

/* ── Bulk action bar ─────────────────────────────────────────────────────── */

.ldm-bulk-bar[b-eo703oj4qk] {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 10px 24px;
	background: #F8FAFC;
	border-top: 1px solid #E2E8F0;
	gap: 12px;
	flex-shrink: 0;
}

.ldm-bulk-clear[b-eo703oj4qk] {
	display: flex;
	align-items: center;
	gap: 6px;
	background: none;
	border: none;
	cursor: pointer;
	font-size: 13px;
	font-weight: 500;
	color: #5F6E85;
	padding: 0;
	text-transform: lowercase;
}

.ldm-bulk-actions[b-eo703oj4qk] {
	display: flex;
	align-items: center;
	gap: 8px;
}
/* /Pages/Locations/Components/LocationFilterPopover.razor.rz.scp.css */
/* ─────────────────── Outer panel ─────────────────────────────────────────────────────────── */
.lf-panel[b-a5vlxhf076] {
  width: 360px;
  max-width: 360px;
  background-color: #fff;
  border: 1px solid #ebeced;
  border-radius: 20px;
  box-shadow:
    0 10px 25px -5px rgba(0, 0, 0, 0.1),
    0 8px 10px -6px rgba(0, 0, 0, 0.1);
  display: flex;
  flex-direction: column;
}

/* ─────────────────── Header --------------------------------------------─────────────────── */
.lf-header[b-a5vlxhf076] {
  padding: 8px 16px;
  border-bottom: 1px #1e293b17 solid;
  flex-shrink: 0;
}

.lf-header h6[b-a5vlxhf076] {
  font-size: 15px;
  font-weight: 700;
  line-height: 24px;
  letter-spacing: -0.2px;
  color: var(--dark-txt);
  margin: 0;
}

/* ─────────────────── Scrollable body ────────────────────────────────────────────────────── */
.lf-body[b-a5vlxhf076] {
  padding: 0 16px 16px;
  max-height: min(400px, 40vh);
  overflow-y: auto;
  scrollbar-width: thin;
  flex: 1 1 auto;
}

/* ─────────────────── Labels --------------------------------------------------------------- */
.lf-body .dispatch-by label[b-a5vlxhf076],
.lf-body .errors label[b-a5vlxhf076] {
  font-size: 12px;
  font-weight: 600;
  line-height: 16px;
  letter-spacing: -0.2px;
  color: var(--gray-txt);
}

/* ─────────────────── Errors --------------------------------------------------------------- */

.lf-body .errors .selected[b-a5vlxhf076] {
  background-color: #5263ff1f;
  padding: 8px;
  gap: 2px;
  font-size: 12px;
  font-weight: 600;
  line-height: 16px;
  letter-spacing: -0.2px;
  color: var(--purple-2);
  border-radius: 8px;
}

.lf-body .errors .selected.not[b-a5vlxhf076] {
  background-color: #f1f5f9cc;
  color: var(--dark-txt);
}

/* ─────────────────── Clear buttons inside .assigned ─────────────────────────────────────── */
.lf-body .assigned button[b-a5vlxhf076] {
  font-size: 12px;
  font-weight: 600;
  line-height: 16px;
  letter-spacing: -0.2px;
  color: var(--dark-txt);
  padding: 8px 12px;
  background-color: #f1f5f9cc;
  border: 1px #1e293b17 solid;
  border-radius: 8px;
  outline: none;
}

/* ─────────────────── Status pills ---------------------------------------------------------- */
.lf-body .lf-status label[b-a5vlxhf076] {
  font-size: 12px;
  font-weight: 600;
  line-height: 16px;
  letter-spacing: -0.2px;
  color: var(--gray-txt);
}

.lf-body .lf-status-options[b-a5vlxhf076] {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.lf-body .lf-status-pill[b-a5vlxhf076] {
  flex: 1 1 0;
  border: 1px #1e293b17 solid;
  border-radius: 8px;
  background-color: #f1f5f9cc;
  color: var(--dark-txt);
  padding: 8px 12px;
  font-size: 12px;
  font-weight: 600;
  line-height: 16px;
  letter-spacing: -0.2px;
  cursor: pointer;
  transition: all 0.2s ease;
}

.lf-body .lf-status-pill:hover:not(:disabled)[b-a5vlxhf076] {
  background-color: #e2e8f0;
}

.lf-body .lf-status-pill.selected[b-a5vlxhf076] {
  background-color: #5263ff1f;
  border-color: #5263ff33;
  color: var(--purple-2);
}

.lf-body .lf-status-pill:disabled[b-a5vlxhf076] {
  opacity: 0.6;
  cursor: not-allowed;
}

/* ─────────────────── Toggle labels --------------------------------------------------------- */
.lf-body .manual-only h6[b-a5vlxhf076] {
  font-size: 13px;
  font-weight: 600;
  line-height: 20px;
  letter-spacing: -0.2px;
  color: var(--dark-txt);
}

.lf-body .manual-only .toggle-switch[b-a5vlxhf076] {
  position: relative;
  display: inline-block;
  width: 46px;
  height: 28px;
  background: linear-gradient(
    180deg,
    rgba(226, 232, 240, 1) 0%,
    rgba(248, 250, 252, 1) 100%
  );
  border-radius: 50px;
  padding: 3px;
  flex-shrink: 0;
}

.lf-body .manual-only .toggle-switch input[b-a5vlxhf076] {
  opacity: 0;
  width: 0;
  height: 0;
}

.lf-body .manual-only .slider[b-a5vlxhf076] {
  position: absolute;
  cursor: pointer;
  border-radius: 30px;
  background-color: #d3dde8;
  transition: 0.3s;
  height: 22px;
  width: 40px;
}

.lf-body .manual-only .slider[b-a5vlxhf076]:before {
  content: "";
  position: absolute;
  height: 18px;
  width: 18px;
  left: 2px;
  top: 2px;
  border-radius: 1000px;
  background: linear-gradient(180deg, #e2e8f0 0%, #ffffff 100%);
  border: 3.5px solid #f9fbfc;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.15);
  transition: 0.3s;
}

.lf-body .manual-only .toggle-switch input:checked + .slider[b-a5vlxhf076] {
  background: linear-gradient(135deg, #5b67f6, #4c57e0);
}

.lf-body .manual-only .toggle-switch input:checked + .slider[b-a5vlxhf076]:before {
  transform: translateX(18px);
  background: #fff;
}

.lf-body .manual-only .toggle-switch input:checked + .slider[b-a5vlxhf076]:after {
  content: "";
  position: absolute;
  right: 5px;
  top: 7.5px;
  width: 11px;
  height: 11px;
  background-image: url("../img/icons/toggle-check-icon.svg");
  background-size: contain;
  background-repeat: no-repeat;
}

/* ─────────────────── Footer -----------------------------------------------─────────────────── */
.lf-footer[b-a5vlxhf076] {
  padding: 12px 16px;
  border-top: 1px #1e293b17 solid;
  flex-shrink: 0;
}

.lf-footer button[b-a5vlxhf076] {
  white-space: nowrap;
  font-size: 12px;
  font-weight: 600;
  line-height: 16px;
  letter-spacing: -0.2px;
  border-radius: 8px;
  border: 1px transparent solid;
  padding: 8px 12px;
  backdrop-filter: blur(24px);
  box-shadow:
    0px 1px 1px -0.5px #1e293b08,
    0px 3px 3px 0px #ffffff1f inset;
  cursor: pointer;
  background: none;
}

.lf-footer button.reset-btn[b-a5vlxhf076] {
  color: var(--gray-txt);
  border: none;
  font-size: 14px;
}

.lf-footer button.cancel-btn[b-a5vlxhf076] {
  background-color: #f1f5f9cc;
  border-color: #1e293b17;
  color: var(--dark-txt);
}

.lf-footer button.apply-btn[b-a5vlxhf076] {
  background-color: var(--purple);
  color: var(--white);
}
/* /Pages/Locations/Components/LocationGroupLocationPicker.razor.rz.scp.css */
/* ── Body ────────────────────────────────────────────────────────────────── */
.lgp-body[b-po2wom5ix2] {
  background: #f1f5f9;
  padding: 0 !important;
  margin: 0 -1.5rem 0;
}

/* ── Search band (white, full width, above the list) ─────────────────────── */
/* .lgp-body already cancels the wrapper's 24px padding, so no negative margin here. */
.lgp-search-section[b-po2wom5ix2] {
  background: #fff;
  padding: 16px 20px;
  border-bottom: 1px solid #f1f5f9;
}

/* ── Section header (label + count) ─────────────────────────────────────── */
.lgp-section-header[b-po2wom5ix2] {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 14px 16px 10px;
}

.lgp-list-label[b-po2wom5ix2] {
  font-size: 13px;
  font-weight: 500;
  color: #475559;
}

.lgp-selected-count[b-po2wom5ix2] {
  font-size: 13px;
  font-weight: 500;
  color: #475559;
}

.lgp-section-actions[b-po2wom5ix2] {
  display: flex;
  align-items: center;
  gap: 12px;
}

/* Select all / deselect all: a checkbox and a word, sitting on the list it acts on. */
.lgp-select-all[b-po2wom5ix2] {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 0;
  border: none;
  background: none;
  font-size: 13px;
  font-weight: 600;
  color: #5263ff;
  cursor: pointer;
}

.lgp-select-all:disabled[b-po2wom5ix2] {
  opacity: 0.6;
  cursor: not-allowed;
}

/* ── Scrollable card list ────────────────────────────────────────────────── */
.lgp-list-scroll[b-po2wom5ix2] {
  display: flex;
  flex-direction: column;
  gap: 10px;
  /* Tall enough to scan a long list, still short enough that the footer stays
     on screen on a laptop. */
  max-height: min(52vh, 520px);
  overflow-y: auto;
  padding: 0 16px 16px;
  scrollbar-width: none;
  -ms-overflow-style: none;
}

.lgp-list-scroll[b-po2wom5ix2]::-webkit-scrollbar {
  display: none;
}

.lgp-list-loading[b-po2wom5ix2] {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100px;
  color: #0d6efd;
}

/* ── Load more ───────────────────────────────────────────────────────────── */
.lgp-load-more[b-po2wom5ix2] {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 12px 16px;
  border: 3px dashed #1e293b17;
  border-radius: 16px;
  background: #fff;
  font-size: 13px;
  font-weight: 600;
  color: #5263ff;
  cursor: pointer;
  transition: border-color 0.12s;
}

.lgp-load-more:hover:not(:disabled)[b-po2wom5ix2] {
  border-color: #c7d2fe;
}

.lgp-load-more:disabled[b-po2wom5ix2] {
  opacity: 0.6;
  cursor: not-allowed;
}

.lgp-list-empty[b-po2wom5ix2] {
  padding: 10px 24px;
  font-size: 15px;
  font-weight: 500;
  color: #5F6E85;
  text-align: center;
  height: 100px;
  align-content: center;
  vertical-align: middle;
}

/* ── Location card ───────────────────────────────────────────────────────── */
.lgp-list-item[b-po2wom5ix2] {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px 16px;
  border: 3px solid #1e293b17;
  border-radius: 16px;
  cursor: pointer;
  background: #fff;
  transition:
    border-color 0.12s,
    background 0.12s;
  margin: 0;
}

.lgp-list-item:hover[b-po2wom5ix2] {
  border-color: #c7d2fe;
}

.lgp-list-item--checked[b-po2wom5ix2] {
  border-width: 3px;
  border-color: #5263ff66 !important;
}

/* ── Checkbox ────────────────────────────────────────────────────────────── */
.lgp-checkbox[b-po2wom5ix2] {
  width: 18px !important;
  height: 18px !important;
  border-radius: 6px !important;
  padding: 2px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  transition: all 0.2s !important;
  background: linear-gradient(180deg, #f1f5f9 0%, #ffffff 100%) !important;
  border: 2.5px solid #d9dee3 !important;
  backdrop-filter: blur(24px) !important;
  box-shadow:
    0px 1px 1px -0.5px #1e293b08,
    0px 3px 3px 0px #ffffff1f inset !important;
  flex-shrink: 0 !important;
}

.lgp-checkbox.checked[b-po2wom5ix2] {
  background: linear-gradient(180deg, #5263ff 0%, #5263ff 100%) !important;
  color: white !important;
  backdrop-filter: blur(24px) !important;
  box-shadow:
    0px 1px 1px -0.5px #1e293b08,
    0px 3px 3px 0px #ffffff1f inset !important;
  border: none !important;
}

.lgp-checkbox-icon[b-po2wom5ix2] {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
}

/* ── Location details ────────────────────────────────────────────────────── */
.lgp-loc-detail[b-po2wom5ix2] {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 3px;
}

.lgp-loc-top[b-po2wom5ix2] {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: nowrap;
  overflow: hidden;
}

.lgp-loc-name[b-po2wom5ix2] {
  font-size: 14px;
  font-weight: 700;
  color: #1e293b;
  flex-shrink: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.lgp-customer-badge[b-po2wom5ix2] {
  display: inline-block;
  padding: 2px 10px;
  font-size: 12px;
  font-weight: 500;
  color: #5263ff;
  background: #eaecff;
  border-radius: 8px;
  white-space: nowrap;
  flex-shrink: 0;
}

.lgp-loc-addr[b-po2wom5ix2] {
  font-size: 12px;
  color: #5F6E85;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
/* /Pages/Locations/Components/LocationGroupSliderExpandedDetails.razor.rz.scp.css */
/* ── Container ───────────────────────────────────────────────────────────── */
.lged-locations-list[b-9fmd7v7dna] {
    border-top: 1px solid #F1F5F9;
}

/* ── Empty / loading states ──────────────────────────────────────────────── */
.lged-no-locs[b-9fmd7v7dna] {
    padding: 14px 16px;
    font-size: 13px;
    color: #94A3B8;
    text-align: center;
    height: 150px;
    vertical-align: middle;
    align-content: center;
}

/* ── Location row ────────────────────────────────────────────────────────── */
.lged-loc-row[b-9fmd7v7dna] {
    display: flex;
    align-items: center;
    padding: 11px 16px;
    border-bottom: 1px solid #F8FAFC;
    transition: background 0.12s;
}

.lged-loc-row:last-child[b-9fmd7v7dna] {
    border-bottom: none;
}

.lged-loc-row:hover[b-9fmd7v7dna] {
    background: #F8FAFC;
}

/* ── Icon wrappers ───────────────────────────────────────────────────────── */
.lged-loc-icon[b-9fmd7v7dna] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border-radius: 7px;
    flex-shrink: 0;
}

/* ── Text block ──────────────────────────────────────────────────────────── */
.lged-loc-text[b-9fmd7v7dna] {
    flex: 1;
    min-width: 0;
}

.lged-loc-name[b-9fmd7v7dna] {
    font-size: 13px;
    font-weight: 600;
    color: #1E293B;
    margin: 0 0 2px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.lged-loc-addr[b-9fmd7v7dna] {
    font-size: 11px;
    color: #5F6E85;
    margin: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* ── Remove button ───────────────────────────────────────────────────────── */
.lged-btn-remove-loc[b-9fmd7v7dna] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border: none;
    border-radius: 6px;
    background: transparent;
    cursor: pointer;
    flex-shrink: 0;
    transition: background 0.12s;
}

.lged-btn-remove-loc:hover[b-9fmd7v7dna] {
    background: #FFF5F5;
}

/* /Pages/Locations/Components/LocationGroupsSlider.razor.rz.scp.css */
.z-index-lower[b-t0isc3jnb9] {
  z-index: 1049 !important;
}

/* ── Location groups slider ──────────────────────────────────────────────── */
.locationGroupsSlider.right .modal-dialog[b-t0isc3jnb9] {
  position: fixed;
  margin: 0;
  right: 0;
  top: 0;
  height: 100%;
  max-width: 740px;
  width: 100%;
}

.locationGroupsSlider.right .modal-content[b-t0isc3jnb9] {
  height: 100vh;
  border-radius: 0;
  display: flex;
  flex-direction: column;
  border: none;
}

.locationGroupsSlider.right.fade .modal-dialog[b-t0isc3jnb9] {
  transform: translateX(100%);
  transition: transform 0.3s ease-out;
}

.locationGroupsSlider.right.show .modal-dialog[b-t0isc3jnb9] {
  transform: translateX(0);
}
/* ── End location groups slider ──────────────────────────────────────────── */

.locationGroupsSlider .lgs-header-right button.edit-btn[b-t0isc3jnb9] {
  gap: 2px;
  padding: 8px 10px;
  /* border: 1px #1E293B17 solid; */
  border: none;
  border-radius: 10px;
  outline: none;
  height: 40px;
  background:
    linear-gradient(var(--purple), var(--purple)) padding-box,
    linear-gradient(90deg, #1e293b17, #1e293b2e) border-box;
  backdrop-filter: blur(24px);
  box-shadow:
    0px 1px 1px -0.5px #1e293b08,
    0px 3px 3px 0px #ffffff1f inset;
}

.locationGroupsSlider .lgs-header-right button.edit-btn p[b-t0isc3jnb9] {
  font-size: 13px;
  font-weight: 600;
  line-height: 24px;
  letter-spacing: -0.2px;
  color: var(--white);
  padding: 0 4px;
}

/* ── Shell ───────────────────────────────────────────────────────────────── */
.lgs-shell[b-t0isc3jnb9] {
  display: flex;
  flex-direction: column;
  height: 100vh;
  background: #f8fafc;
}

/* ── Header ──────────────────────────────────────────────────────────────── */
.lgs-header[b-t0isc3jnb9] {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 18px 20px;
  background: #fff;
  border-bottom: 1px solid #f1f5f9;
  flex-shrink: 0;
  flex-wrap: wrap;
}

.lgs-header-left[b-t0isc3jnb9] {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
}

.lgs-header-icon[b-t0isc3jnb9] {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  background: #eef0ff;
  border-radius: 10px;
  flex-shrink: 0;
}

.lgs-header-text[b-t0isc3jnb9] {
  min-width: 0;
}

.lgs-title[b-t0isc3jnb9] {
  font-size: 18px;
  font-weight: 800;
  color: #1e293b;
  margin: 0 0 2px;
}

.lgs-subtitle[b-t0isc3jnb9] {
  font-size: 15px;
  font-weight: 600;
  color: #475569;
  margin: 0;
}

.lgs-header-right[b-t0isc3jnb9] {
  display: flex;
  align-items: center;
  gap: 1rem;
  flex-shrink: 0;
}

.lgs-btn-new[b-t0isc3jnb9] {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 14px;
  font-size: 13px;
  font-weight: 600;
  color: #fff;
  background: #5263ff;
  border: none;
  border-radius: 8px;
  cursor: pointer;
  white-space: nowrap;
  transition: background 0.15s;
}

.lgs-btn-new:hover[b-t0isc3jnb9] {
  background: #4250e0;
}

.lgs-btn-close[b-t0isc3jnb9] {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  border-radius: 8px;
  border: 1px solid #e2e8f0;
  background: #fff;
  cursor: pointer;
  transition: background 0.15s;
}

.lgs-btn-close:hover[b-t0isc3jnb9] {
  background: #f1f5f9;
}

/* ── Body ────────────────────────────────────────────────────────────────── */
.lgs-body[b-t0isc3jnb9] {
  flex: 1;
  overflow-y: auto;
  scrollbar-width: thin;
  display: flex;
  flex-direction: column;
}

/* ── Center state (loading / empty) ─────────────────────────────────────── */
.lgs-center-state[b-t0isc3jnb9] {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  flex: 1;
  gap: 10px;
  min-height: 260px;
  text-align: center;
}

.lgs-empty-title[b-t0isc3jnb9] {
  font-size: 14px;
  font-weight: 600;
  color: #1e293b;
  margin: 0;
}

.lgs-empty-sub[b-t0isc3jnb9] {
  font-size: 13px;
  color: #94a3b8;
  margin: 0;
}

/* ── Group card ──────────────────────────────────────────────────────────── */
.lgs-group[b-t0isc3jnb9] {
  background: #fff;
  border: 1px solid #f1f5f9;
  overflow: visible;
}

/* .lgs-group--open {
    border-color: #E2E8F0;
} */

/* ── Group row ───────────────────────────────────────────────────────────── */
.lgs-group-row[b-t0isc3jnb9] {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 14px 16px;
}

.lgs-group-info[b-t0isc3jnb9] {
  display: flex;
  flex-direction: column;
  gap: 3px;
  min-width: 0;
}

.lgs-group-name-row[b-t0isc3jnb9] {
  display: flex;
  align-items: center;
  gap: 6px;
}

.lgs-group-external-id[b-t0isc3jnb9] {
  flex: none;
  font-size: 11px;
  font-weight: 600;
  color: #475569;
  background: #f1f5f9;
  border-radius: 4px;
  padding: 1px 6px;
  white-space: nowrap;
}

.lgs-group-name[b-t0isc3jnb9] {
  font-size: 15px;
  font-weight: 700;
  color: #1e293b;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.lgs-group-count[b-t0isc3jnb9] {
  font-size: 13px;
  color: #475569;
  font-weight: 500;
}

.lgs-group-actions[b-t0isc3jnb9] {
  display: flex;
  align-items: center;
  gap: 4px;
  flex-shrink: 0;
}

/* ── Icon buttons ────────────────────────────────────────────────────────── */
.lgs-btn-icon[b-t0isc3jnb9] {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border: none;
  border-radius: 6px;
  background: transparent;
  cursor: pointer;
  transition:
    background 0.12s,
    transform 0.2s;
  flex-shrink: 0;
}

.lgs-btn-icon:hover[b-t0isc3jnb9] {
  background: #f1f5f9;
}

.lgs-btn-chevron[b-t0isc3jnb9] {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border: none;
  border-radius: 6px;
  background: transparent;
  cursor: pointer;
  transition:
    background 0.12s,
    transform 0.2s;
}

.lgs-btn-chevron:hover[b-t0isc3jnb9] {
  background: #f1f5f9;
}

.lgs-btn-chevron--up svg[b-t0isc3jnb9] {
  transform: rotate(180deg);
}

/* ── 3-dot dropdown ──────────────────────────────────────────────────────── */
.lgs-menu-wrap[b-t0isc3jnb9] {
  position: relative;
}

.lgs-menu-backdrop[b-t0isc3jnb9] {
  position: fixed;
  inset: 0;
  z-index: 10;
}

.lgs-dropdown-menu[b-t0isc3jnb9] {
  /* position: absolute; */
  /* top: 100%; */
  /* right: 0; */
  /* z-index: 20; */
  min-width: 160px;
  /* background: #fff; */
  /* border: 1px solid #E2E8F0; */
  /* border-radius: 10px; */
  /* box-shadow: 0 4px 16px rgba(0, 0, 0, 0.10); */
  padding: 8px;
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.lgs-menu-item[b-t0isc3jnb9] {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px;
  font-size: 13px;
  font-weight: 500;
  border: none;
  border-radius: 16px;
  background: transparent;
  cursor: pointer;
  text-align: left;
  transition: background 0.12s;
  white-space: nowrap;
}

.lgs-menu-item--blue[b-t0isc3jnb9] {
  color: #5263ff;
}

.lgs-menu-item--blue:hover[b-t0isc3jnb9] {
  background: #eef0ff;
}

.lgs-menu-item--red[b-t0isc3jnb9] {
  color: #ef4444;
}

.lgs-menu-item--red:hover[b-t0isc3jnb9] {
  background: #fff5f5;
}
/* /Pages/Locations/Components/LocationImportGrid.razor.rz.scp.css */
.import-grid-wrapper[b-hmua4v1jff] {
    overflow-x: auto;
    /* The grid scrolls inside its own box so the validation results and the Create button
       stay reachable under even an 800-row file. */
    overflow-y: auto;
    max-height: 45vh;
    width: 100%;
    scrollbar-width: thin;
    scrollbar-color: #1E293B1F transparent;
}

    .import-grid-wrapper[b-hmua4v1jff]::-webkit-scrollbar {
        width: 4px;
    }

    .import-grid-wrapper[b-hmua4v1jff]::-webkit-scrollbar-thumb {
        background: #1E293B1F;
        border-radius: 4px;
    }

.import-grid-wrapper table[b-hmua4v1jff] {
    border: 1px #1E293B0F solid;
    border-radius: 16px;
    border-collapse: separate;
    width: 100%;
    table-layout: fixed;
}

    .import-grid-wrapper table th[b-hmua4v1jff] {
        /* The header rides along when the grid scrolls vertically. */
        position: sticky;
        top: 0;
        z-index: 1;
        padding: 12px 16px;
        background-color: #F1F5F9;
        font-size: 13px;
        font-weight: 700;
        line-height: 20px;
        letter-spacing: -0.2px;
        color: var(--dark-txt);
        border-right: 1px solid #1E293B0F;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .import-grid-wrapper table th:last-child[b-hmua4v1jff] {
        border-right: none;
    }

    .import-grid-wrapper table td[b-hmua4v1jff] {
        background-color: var(--white);
        padding: 18px 16px;
        font-size: 13px;
        font-weight: 600;
        line-height: 20px;
        letter-spacing: -0.2px;
        color: var(--dark-txt);
        cursor: pointer;
        position: relative;
        border-right: 1px solid #1E293B0F;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

        .import-grid-wrapper table td:last-child[b-hmua4v1jff] {
            border-right: none;
        }


    .import-grid-wrapper table td:hover[b-hmua4v1jff] {
        background-color: #5263FF1F;
    }

    .import-grid-wrapper table td img[b-hmua4v1jff] {
        height: 24px;
    }

.import-grid-wrapper table tr:last-child td:first-child[b-hmua4v1jff] {
    border-radius: 0 0 0 16px;
}

.import-grid-wrapper table tr:last-child td:last-child[b-hmua4v1jff] {
    border-radius: 0 0 16px 0;
}


.import-grid-wrapper table tr.row-error td:first-child[b-hmua4v1jff] {
    border-left: 3px var(--badge-orange) solid;
}

.import-grid-wrapper table tr.row-ok td:first-child[b-hmua4v1jff] {
    border-left: 2px transparent solid;
}

/*Edit*/
.import-grid-wrapper .edit-btn[b-hmua4v1jff] {
    position: absolute;
    top: 4px;
    right: 4px;
    background: none;
    border: none;
    cursor: pointer;
    padding: 2px;
    opacity: 0;
    transition: opacity 0.15s;
    line-height: 1;
}

.import-grid-wrapper .edit-btn img[b-hmua4v1jff] {
    height: 16px !important;
    width: 16px;
}

.import-grid-wrapper table td:hover .edit-btn[b-hmua4v1jff] {
    opacity: 1 !important;
}

.import-grid-wrapper .cell-input[b-hmua4v1jff] {
    padding: 8px 10px;
    background-color: var(--white);
    border: 1px #1E293B0F solid;
    border-radius: 10px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
    outline: none;
    font-size: 13px;
    font-weight: 600;
    line-height: 24px;
    letter-spacing: -0.2px;
    color: var(--dark-txt);
    width: 100%;
}
/* /Pages/Locations/Components/LocationInvitesPopup.razor.rz.scp.css */
.location-invites-popup[b-h4axadhfof] {
    background: #ffffff;
    /* padding: 24px; */
    display: flex;
    flex-direction: column;
    /* gap: 20px; */
}

.location-invites-toolbar[b-h4axadhfof] {
    display: grid;
    grid-template-columns: 1fr 80px 140px 220px;
    gap: 16px;
    align-items: end;
    padding: 16px 20px;
}

.location-invites-search[b-h4axadhfof],
.location-invites-filter[b-h4axadhfof] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.location-invites-search label[b-h4axadhfof],
.location-invites-filter label[b-h4axadhfof] {
    color: #475569;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.2;
}

.location-invites-search-box[b-h4axadhfof] {
    display: flex;
    align-items: center;
    gap: 8px;
    min-height: 48px;
    height: 48px;
    border: 1px solid #e2e8f0;
    border-radius: 999px;
    background: #ffffff;
    padding: 0 16px;
}

.location-invites-search-box img[b-h4axadhfof] {
    width: 16px;
    height: 16px;
}

.location-invites-search-box input[b-h4axadhfof] {
    flex: 1;
    border: 0;
    outline: none;
    background: transparent;
    font-size: 14px;
    color: #0f172a;
}

.location-invites-status-filter[b-h4axadhfof],
.location-invites-sent-to-filter[b-h4axadhfof] {
    min-width: 0;
}

.location-invites-status-filter[b-h4axadhfof] {
    width: 140px;
}

.location-invites-sent-to-filter[b-h4axadhfof] {
    width: 220px;
}

/* .location-invites-filter ::deep .custom-select-button {
    height: 48px !important;
    min-height: 48px !important;
    border-radius: 14px !important;
    padding: 0 16px !important;
    border: 1px solid #e2e8f0 !important;
    box-shadow: none !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    color: #0f172a !important;
    background-color: #ffffff !important;
}

.location-invites-filter ::deep .custom-select-button-label {
    min-width: 0 !important;
    max-width: calc(100% - 18px) !important;
}

.location-invites-filter ::deep .custom-select-button-text {
    display: block !important;
    max-width: 100% !important;
    color: #0f172a !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

.location-invites-status-filter ::deep .custom-select-button-text {
    max-width: 80px !important;
}

.location-invites-sent-to-filter ::deep .custom-select-button-text {
    max-width: 146px !important;
}

.location-invites-filter ::deep .dropdown-menu {
    border-radius: 18px !important;
    padding: 10px !important;
    border-color: #e4e5e7 !important;
}

.location-invites-status-filter ::deep .dropdown-menu {
    width: 180px !important;
    max-width: 180px !important;
}

.location-invites-sent-to-filter ::deep .dropdown-menu {
    width: 320px !important;
    max-width: min(320px, calc(100vw - 24px)) !important;
}

.location-invites-filter ::deep .search-input-box {
    margin-bottom: 8px !important;
    border-radius: 14px !important;
}

.location-invites-filter ::deep .custom-dropdown-list {
    max-height: min(300px, 42vh) !important;
}

.location-invites-filter ::deep .dropdown-list-item {
    min-height: 40px !important;
    border-radius: 10px !important;
}

.location-invites-filter ::deep .item-name {
    font-size: 14px !important;
} */

.location-invites-load-more:disabled[b-h4axadhfof] {
    opacity: 0.6;
    cursor: not-allowed;
}

.location-invites-table-shell[b-h4axadhfof] {
    border-top: 1px solid #e2e8f0;
    border-bottom: 1px solid #e2e8f0;
    /* border-radius: 16px; */
    overflow: hidden;
    background: #ffffff;
    box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.02);
}

.location-invites-table-scroll[b-h4axadhfof] {
    max-height: min(500px, calc(100vh - 420px));
    overflow-y: auto;
}

.location-invites-table[b-h4axadhfof] {
    width: 100%;
    border-collapse: collapse;
    table-layout: fixed;
}

.location-invites-table thead th[b-h4axadhfof] {
    position: sticky;
    top: 0;
    z-index: 1;
    background: #F1F5F9;
    color: #475569;
    font-size: 13px;
    font-weight: 700;
    text-transform: none; /* removed uppercase */
    text-align: left;
    padding: 16px 20px;
    border-bottom: 1px solid #e2e8f0;
}

.location-invites-table tbody td[b-h4axadhfof] {
    padding: 16px 20px;
    border-bottom: 1px solid #f1f5f9;
    color: #334155;
    font-size: 13px;
    font-weight: 500;
    vertical-align: middle;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.location-invites-table tbody tr:nth-child(even)[b-h4axadhfof] {
    background: #F8FAFC;
}

.location-invites-table tbody tr:last-child td[b-h4axadhfof] {
    border-bottom: 0;
}

/* Actions column. Answered invitations leave the cell empty, so it is sized for the button
   rather than for the row, and right-aligned to keep the ragged edge off the data. */
.location-invites-table tbody td.location-invites-actions[b-h4axadhfof] {
    padding: 8px 20px;
    text-align: right;
    overflow: visible;
}

.location-invites-cancel-button[b-h4axadhfof] {
    margin: 0;
    padding: 6px 12px;
    font-size: 12px;
    font-weight: 600;
    white-space: nowrap;
}

.location-name[b-h4axadhfof] {
    font-weight: 500;
    color: #0f172a;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.invite-status-badge[b-h4axadhfof] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 26px;
    border-radius: 8px;
    padding: 4px 12px;
    font-size: 12px;
    font-weight: 600;
    line-height: 1;
}

.invite-status-sent[b-h4axadhfof] {
    background: #5263FF1F;
    color: #363AF5;
}

.invite-status-accepted[b-h4axadhfof] {
    background: #409B3F1F;
    color: #296C28;
}

.invite-status-declined[b-h4axadhfof] {
    background: #ED40301F;
    color: #B82213;
}

.invite-status-neutral[b-h4axadhfof] {
    background: #f1f5f9;
    color: #475569;
}

.location-invites-loading[b-h4axadhfof],
.location-invites-empty[b-h4axadhfof] {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 571.98px;
    color: #475569;
    font-size: 15px;
}

.location-invites-footer[b-h4axadhfof] {
    display: flex;
    justify-content: flex-start;
    /* padding: 8px 0; */
    padding: 16px 20px;
    background: #F0F4F8;
}

.location-invites-load-more[b-h4axadhfof] {
    min-height: 40px;
    border: none;
    border-radius: 10px;
    background: #eef2ff;
    color: #363af5;
    font-size: 13px;
    font-weight: 600;
    padding: 0 16px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    transition: background-color 0.2s ease;
}

.location-invites-load-more:hover:not(:disabled)[b-h4axadhfof] {
    background: #e0e7ff;
}

/* WMPopup structural overrides to remove padding/borders and style backgrounds */
[b-h4axadhfof] .location-invites-popup-container .wm-popup-modal-content {
    padding: 0 !important;
    border-radius: 24px !important;
    background: #ffffff;
    overflow: hidden;
}

[b-h4axadhfof] .location-invites-popup-container .modal-header {
    padding: 24px 24px 16px !important;
    background: #ffffff !important;
    border-bottom: none !important;
}

[b-h4axadhfof] .location-invites-popup-container .modal-header h5.modal-title {
    font-size: 20px !important;
    font-weight: 700 !important;
    color: #0f172a !important;
    letter-spacing: -0.02em !important;
}

[b-h4axadhfof] .location-invites-popup-container .modal-header button.btn-close {
    margin: 0 !important;
}

[b-h4axadhfof] .location-invites-popup-container .modal-body {
    background: #f8fafc !important;
    border-top: none !important;
    padding: 0 !important;
    max-height: none !important;
    overflow-y: visible !important;
}

@media (max-width: 900px) {
    .location-invites-popup[b-h4axadhfof] {
        padding-inline: 16px;
    }

    .location-invites-toolbar[b-h4axadhfof] {
        grid-template-columns: 1fr;
        align-items: stretch;
    }

    .location-invites-status-filter[b-h4axadhfof],
    .location-invites-sent-to-filter[b-h4axadhfof] {
        width: 100%;
    }

    /* .location-invites-sent-to-filter ::deep .custom-select-button-text {
        max-width: calc(100vw - 150px) !important;
    } */
}
/* /Pages/Locations/Components/LocationRulesHoverCard.razor.rz.scp.css */
/* Same card language as the dispatch list's .dispatch-item-popover (slate title, muted
   body, hairline dividers), sized a step smaller because a card can carry several rules.
   The frame (white, radius, shadow) comes from the shared WMPopover wrapper. */
.rule-card[b-lv1d21d6pq] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 280px;
    max-width: 360px;
    /* An address with many rules scrolls inside the card rather than past the viewport. */
    max-height: calc(100vh - 40px);
    overflow-y: auto;
    padding: 18px 20px;
    color: #5F6E85;
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;
    white-space: normal;
}

.rule-card-title[b-lv1d21d6pq] {
    margin-bottom: 4px;
    color: #1E293B;
    font-size: 16px;
    font-weight: 800;
    line-height: 22px;
}

.rule-card-rule[b-lv1d21d6pq] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding: 8px 0;
    border-top: 1px solid #E2E8F0;
}

.rule-card-title + .rule-card-rule[b-lv1d21d6pq] {
    border-top: none;
}

.rule-card-rule:last-child[b-lv1d21d6pq] {
    padding-bottom: 0;
}

.rule-card-head[b-lv1d21d6pq] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.rule-card-name[b-lv1d21d6pq] {
    color: #1E293B;
    font-weight: 700;
    overflow-wrap: anywhere;
}

.rule-card-line[b-lv1d21d6pq] {
    overflow-wrap: anywhere;
}

.rule-card-sub[b-lv1d21d6pq] {
    padding-left: 12px;
}

.rule-card-label[b-lv1d21d6pq] {
    color: #94A3B8;
    font-weight: 600;
}

.rule-card-muted[b-lv1d21d6pq] {
    color: #94A3B8;
}

/* Marker chips share the list's chip shapes: sky for a frequency limit (the Rules chip
   itself), amber for an exclusion (the worktype-mix minority tone), slate for an inclusion. */
.rule-tag[b-lv1d21d6pq] {
    flex-shrink: 0;
    padding: 1px 7px;
    border-radius: 8px;
    font-size: 11px;
    font-weight: 700;
    line-height: 16px;
    white-space: nowrap;
}

.rule-tag-include[b-lv1d21d6pq] {
    background: #1E293B14;
    color: #1E293B;
}

.rule-tag-exclude[b-lv1d21d6pq] {
    background: #F59E0B29;
    color: #B45309;
}

.rule-tag-limit[b-lv1d21d6pq] {
    background: #06B1F11F;
    color: var(--sky);
}
/* /Pages/Locations/Components/NewLocationGroupPopup.razor.rz.scp.css */
/* ── Modal shell ─────────────────────────────────────────────────────────── */
.lgp-modal-content[b-y6thcie5zt] {
  border-radius: 16px;
  overflow: hidden;
  border: none;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.12);
}

/* ── Header ──────────────────────────────────────────────────────────────── */
.lgp-modal-header[b-y6thcie5zt] {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 20px 20px 16px;
  background: #fff;
  border-bottom: 1px solid #f1f5f9;
}

.lgp-modal-title[b-y6thcie5zt] {
  font-size: 18px;
  font-weight: 700;
  color: #1e293b;
  margin: 0;
}

.lgp-close-btn[b-y6thcie5zt] {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  border-radius: 8px;
  border: 1px solid #e2e8f0;
  background: #fff;
  cursor: pointer;
  transition: background 0.15s;
  flex-shrink: 0;
}

.lgp-close-btn:hover[b-y6thcie5zt] {
  background: #f1f5f9;
}

.lgp-loading-state[b-y6thcie5zt] {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 220px;
}

/* ── Group name section (white band, full width) ─────────────────────────── */
.lgp-name-section[b-y6thcie5zt] {
  background: #fff;
  padding: 16px 20px 20px;
  border-bottom: 1px solid #f1f5f9;
  margin: 0 -1.5rem;
}

.lgp-field-label[b-y6thcie5zt] {
  display: block;
  font-size: 12px;
  font-weight: 600;
  color: #475569;
  margin-bottom: 6px;
}

.lgp-field-hint[b-y6thcie5zt] {
  display: block;
  font-size: 11px;
  color: #64748b;
  margin-top: -4px;
}

.lgp-name-input[b-y6thcie5zt] {
  width: 100%;
  padding: 8px 10px;
  background-color: var(--white);
  border: 1px #1e293b1f solid;
  border-radius: 10px;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
  outline: none;
  font-size: 13px;
  font-weight: 600;
  line-height: 24px;
  letter-spacing: -0.2px;
  color: var(--dark-txt);
}

.lgp-name-input:focus[b-y6thcie5zt] {
  box-shadow: 0 0 0 0.2rem #dce0ff;
}

.lgp-name-input[b-y6thcie5zt]::placeholder {
  color: #5F6E85;
}

/* ── Footer ──────────────────────────────────────────────────────────────── */
.lgp-modal-footer[b-y6thcie5zt] {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 14px 20px;
  background: #fff;
  border-top: 1px solid #f1f5f9;
}

.lgp-btn-cancel[b-y6thcie5zt] {
  background-color: #f1f5f9cc !important;
  border-color: #1e293b17 !important;
  color: var(--dark-txt) !important;
}

.lgp-btn-action[b-y6thcie5zt] {
  background-color: var(--purple);
  border-color: #1e293b17;
  color: var(--white);
  backdrop-filter: blur(24px);
  box-shadow:
    0px 1px 1px -0.5px #1e293b08,
    0px 3px 3px 0px #ffffff1f inset;
}

.lgp-btn-action:disabled[b-y6thcie5zt] {
  opacity: 0.6;
  cursor: not-allowed;
}
/* /Pages/Locations/Components/PriceRegulationPopup.razor.rz.scp.css */
.price-regulation-popup[b-1mps5phsmz] {
    display: grid;
    grid-template-rows: auto auto auto minmax(0, 1fr) auto;
    width: 100%;
    height: 100%;
    min-height: 0;
    margin: 0;
    overflow: hidden;
    color: #1e293b;
    background: #ffffff;
    border-radius: 24px;
}

.pr-header[b-1mps5phsmz] {
    grid-row: 1;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;
    padding: 24px 24px 16px;
    border-bottom: 1px solid #f1f5f9;
}

.pr-header h2[b-1mps5phsmz] {
    margin: 0 0 4px;
    color: #0f172a;
    font-size: 20px;
    font-weight: 700;
    line-height: 1.15;
}

.pr-header p[b-1mps5phsmz] {
    margin: 0;
    color: #52627a;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.4;
}

.pr-close[b-1mps5phsmz] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: 38px;
    height: 38px;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    background: #f1f5f9cc;
    color: #0f172a;
    font-size: 16px;
    transition: all 0.2s ease;
}

.pr-close:hover[b-1mps5phsmz] {
    background: #e2e8f0;
}

.pr-filters[b-1mps5phsmz] {
    grid-row: 2;
    display: grid;
    grid-template-columns: 280px 280px auto minmax(0, 1fr) minmax(0, 1fr);
    gap: 16px;
    align-items: end;
    padding: 16px 24px;
    border-bottom: 1px solid #f1f5f9;
}

.pr-field[b-1mps5phsmz] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    min-width: 0;
}

.pr-field label[b-1mps5phsmz],
.pr-percent-field span[b-1mps5phsmz] {
    color: #475569;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.15;
}

/* .pr-field ::deep .custom-select-button {
    min-height: 48px !important;
    height: 48px !important;
    border-radius: 14px !important;
    border-color: #e2e8f0 !important;
    box-shadow: none !important;
    color: #0f172a !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    padding: 0 16px !important;
}

.pr-subcontractor-field ::deep .custom-select-button.chips-mode {
    height: auto !important;
    min-height: 48px !important;
    padding-block: 8px !important;
}

.pr-field ::deep .dropdown-menu {
    border-radius: 18px !important;
    max-width: min(420px, calc(100vw - 28px)) !important;
}

.pr-subcontractor-field ::deep .dropdown-menu {
    width: 420px !important;
} */

.pr-date-box[b-1mps5phsmz] {
    display: flex;
    align-items: center;
    gap: 8px;
    min-height: 42px;
    height: 42px;
    padding: 0 4px 0 16px;
    background: #ffffff;
    border: 1px solid #1E293B1F !important;
    border-radius: 10px !important;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05) !important;
    transition: all 0.2s ease-in-out !important;
    outline: none !important;
}

.pr-date-box input[b-1mps5phsmz] {
    flex: 1;
    min-width: 0;
    border: 0;
    outline: none;
    color: #0f172a;
    font-size: 14px;
    font-weight: 500;
}

.pr-info[b-1mps5phsmz] {
    grid-row: 3;
    display: flex;
    justify-content: start;
    align-items: center;
    gap: 10px;
    padding: 12px 16px;
    background: #fffbeb;
}

.pr-info-icon[b-1mps5phsmz] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 18px;
    height: 18px;
    margin-top: 1px;
    border-radius: 50%;
    background: #FFC30A1F;
    color: #ffffff;
    font-size: 11px;
    font-weight: 800;
    line-height: 1;
}

.pr-info-text[b-1mps5phsmz] {
    margin: 0;
    color: #9D6600;
    font-size: 13px;
    font-weight: 700;
    line-height: 20px;
    letter-spacing: -0.2px;
}

.pr-content[b-1mps5phsmz] {
    grid-row: 4;
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    min-height: 0;
    background: #ffffff;
    margin-inline: 0;
    overflow: hidden;
}

.pr-content.with-side-panel[b-1mps5phsmz] {
    grid-template-columns: minmax(0, 1fr) 310px;
}

.pr-table-shell[b-1mps5phsmz] {
    /* max-height: min(450px, calc(100vh - 380px)); */
    max-height: 100%;
    min-width: 0;
    min-height: 0;
    overflow-y: auto;
    background: #F8FAFC;
    border-bottom: 1px solid #f1f5f9;
}

.pr-table[b-1mps5phsmz] {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    table-layout: fixed;
}

.pr-content.with-side-panel .pr-table[b-1mps5phsmz] {
    min-width: 840px;
}

.pr-table thead th[b-1mps5phsmz] {
    position: sticky;
    top: 0;
    z-index: 2;
    height: 52px;
    padding: 0 20px;
    border-right: none !important;
    border-bottom: 1px solid #e2e8f0;
    background: #F1F5F9;
    color: var(--dark-text);
    font-size: 13px;
    font-weight: 700;
    text-align: left;
}

.pr-table thead th:first-child[b-1mps5phsmz],
.pr-table tbody td:first-child[b-1mps5phsmz] {
    padding-inline: 16px;
    text-align: center;
    width: 60px;
}

.pr-table tbody td[b-1mps5phsmz] {
    padding: 16px 20px;
    border-right: none !important;
    border-bottom: 1px solid #f1f5f9;
    color: var(--dark-text);
    font-size: 14px;
    font-weight: 600;
    vertical-align: top;
    background: #ffffff !important;
}

.pr-table tbody tr:nth-child(even) td[b-1mps5phsmz] {
    background: #F8FAFC !important;
}

.pr-checkbox[b-1mps5phsmz] {
    width: 20px !important;
    height: 20px !important;
    border-radius: 6px !important;
    padding: 2px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    transition: all 0.2s !important;
    background: linear-gradient(180deg, #f1f5f9 0%, #ffffff 100%) !important;
    border: 2.5px solid #d9dee3 !important;
    backdrop-filter: blur(24px) !important;
    box-shadow:
        0px 1px 1px -0.5px #1e293b08,
        0px 3px 3px 0px #ffffff1f inset !important;
    flex-shrink: 0 !important;
}

.pr-checkbox.checked[b-1mps5phsmz],
.pr-checkbox.mixed[b-1mps5phsmz] {
    background: linear-gradient(180deg, #5263ff 0%, #5263ff 100%) !important;
    color: white !important;
    backdrop-filter: blur(24px) !important;
    box-shadow:
        0px 1px 1px -0.5px #1e293b08,
        0px 3px 3px 0px #ffffff1f inset !important;
    border: none !important;
}

.pr-checkbox.mixed[b-1mps5phsmz] {
    background: #D1D8FA !important;
    color: #5263FF !important;
}

.pr-checkbox-icon[b-1mps5phsmz] {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
}

.pr-checkbox:disabled[b-1mps5phsmz],
.pr-checkbox.disabled[b-1mps5phsmz] {
    opacity: 0.6;
    cursor: not-allowed;
}

.pr-location-cell[b-1mps5phsmz],
.pr-stack[b-1mps5phsmz] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    min-width: 0;
}

.pr-location-cell strong[b-1mps5phsmz] {
    font-weight: 700;
    color: var(--dark-text);
}

.pr-location-cell span[b-1mps5phsmz] {
    color: var(--dark-text);
    font-size: 13px;
}

.pr-stack span[b-1mps5phsmz] {
    color: #334155;
}

.pr-location-cell strong[b-1mps5phsmz],
.pr-location-cell span[b-1mps5phsmz],
.pr-stack span[b-1mps5phsmz] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.pr-empty-state[b-1mps5phsmz] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    height: 100%;
    min-height: 360px;
    color: #475569;
    font-size: 16px;
    font-weight: 600;
}

.pr-sqm-panel[b-1mps5phsmz] {
    display: flex;
    flex-direction: column;
    min-height: 0;
    border-left: 1px solid #dfe5ec;
    background: #eef3f8;
    box-shadow: -12px 0 26px rgba(15, 23, 42, 0.06);
}

.pr-sqm-intro[b-1mps5phsmz] {
    padding: 28px 26px 22px;
    border-bottom: 1px solid #dfe5ec;
    background: #ffffff;
}

.pr-sqm-intro h3[b-1mps5phsmz] {
    margin: 0 0 16px;
    color: var(--dark-text);
    font-size: 18px;
    font-weight: 700;
    line-height: 1.35;
}

.pr-sqm-intro p[b-1mps5phsmz] {
    margin: 0;
    color: #5F6E85;
    font-size: 15px;
    line-height: 1.45;
}

.pr-sqm-list[b-1mps5phsmz] {
    display: flex;
    flex-direction: column;
    gap: 16px;
    flex: 1 1 auto;
    min-height: 0;
    padding: 24px 26px;
    overflow-y: auto;
    scrollbar-width: thin;
}

.pr-sqm-row[b-1mps5phsmz] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    color: #475569;
    font-size: 13px;
    font-weight: 600;
}

.pr-sqm-row div[b-1mps5phsmz] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 12px;
    align-items: center;
}

.pr-sqm-row input[b-1mps5phsmz] {
    height: 42px;
    border: 1px #1E293B1F solid;
    border-radius: 10px;
    background: #ffffff;
    color: #0f172a;
    font-size: 14px;
    font-weight: 600;
    outline: none;
    padding: 8px 10px;
    line-height: 24px;
	letter-spacing: -0.2px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05) !important;
}

.pr-sqm-row input[b-1mps5phsmz]::placeholder {
    color: #5F6E85;
}

.pr-sqm-row input:focus[b-1mps5phsmz] {
    box-shadow: 0 0 0 0.2rem #dce0ff !important;
}

.pr-sqm-row input:disabled[b-1mps5phsmz] {
    background: transparent;
	box-shadow: initial;
	cursor: not-allowed;
}

.pr-sqm-row input[b-1mps5phsmz]::-webkit-outer-spin-button,
.pr-sqm-row input[b-1mps5phsmz]::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.pr-sqm-row strong[b-1mps5phsmz] {
    color: var(--dark-text);
    font-size: 13px;
    font-weight: 600;
}

.pr-footer[b-1mps5phsmz] {
    grid-row: 5;
    position: relative;
    z-index: 4;
    display: flex;
    flex-direction: column;
    border-top: 1px solid #f1f5f9;
    background: #ffffff;
}

.pr-error[b-1mps5phsmz] {
    display: flex;
    justify-content: start;
    align-items: center;
    gap: 10px;
    padding: 12px 16px;
    background: #fef2f2;
}

.pr-error-text[b-1mps5phsmz] {
    margin: 0;
    color: #dc2626;
    font-size: 13px;
    font-weight: 700;
    line-height: 20px;
    letter-spacing: -0.2px;
}

.pr-negative[b-1mps5phsmz] {
    color: #dc2626 !important;
}

.pr-footer-row[b-1mps5phsmz] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    padding: 16px 20px;
}

.pr-total[b-1mps5phsmz] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    color: #0f172a;
}

.pr-total strong[b-1mps5phsmz] {
    font-size: 15px;
    font-weight: 700;
}

.pr-total span[b-1mps5phsmz] {
    color: #5F6E85;
    font-size: 14px;
    font-weight: 500;
}

.pr-actions[b-1mps5phsmz] {
    display: flex;
    align-items: end;
    justify-content: flex-end;
    gap: 16px;
    min-width: min(520px, 100%);
}

.pr-percent-field[b-1mps5phsmz] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    min-width: 220px;
}

/* Sits under the percent box when what is typed is not a number in the tenant's separator;
   the gap above is the field's own, so it needs no margin of its own. */
.pr-percent-hint[b-1mps5phsmz] {
    color: #dc2626;
    font-size: 12px;
    font-weight: 500;
    line-height: 1.3;
}

.pr-percent-field input[b-1mps5phsmz] {
    height: 42px;
    border: 1px #1E293B1F solid;
    border-radius: 10px;
    background: #ffffff;
    color: #0f172a;
    font-size: 14px;
    font-weight: 600;
    outline: none;
    padding: 8px 10px;
    line-height: 24px;
	letter-spacing: -0.2px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05) !important;
}

.pr-percent-field input[b-1mps5phsmz]::placeholder {
    color: #5F6E85;
}

.pr-percent-field input:focus[b-1mps5phsmz] {
    box-shadow: 0 0 0 0.2rem #dce0ff !important;
}

.pr-percent-field input:disabled[b-1mps5phsmz] {
    background: transparent;
	box-shadow: initial;
	cursor: not-allowed;
}

.pr-percent-field input[b-1mps5phsmz]::-webkit-outer-spin-button,
.pr-percent-field input[b-1mps5phsmz]::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.pr-confirm[b-1mps5phsmz] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-width: 220px;
    height: 48px;
    border: none !important;
    border-radius: 14px !important;
    background: var(--purple) !important;
    color: #ffffff !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    box-shadow: none !important;
    transition: all 0.2s ease;
}

.pr-confirm:disabled[b-1mps5phsmz] {
    background: #cbd5e1 !important;
    color: #94a3b8 !important;
    cursor: not-allowed !important;
    box-shadow: none !important;
}

/* WMPopup overrides for clean border layouts */
[b-1mps5phsmz] .price-regulation-modal .wm-popup-modal-content {
    padding: 0 !important;
    border-radius: 24px !important;
    background: #ffffff;
    overflow: hidden;
}

[b-1mps5phsmz] .price-regulation-modal .modal-body {
    background: #ffffff !important;
    border-top: none !important;
    padding: 0 !important;
    max-height: none !important;
    overflow-y: visible !important;
}

@media (max-width: 1100px) {
    .pr-filters[b-1mps5phsmz] {
        grid-template-columns: 1fr 1fr;
    }

    .pr-group-field[b-1mps5phsmz],
    .pr-subcontractor-field[b-1mps5phsmz] {
        grid-column: 1 / -1;
    }

    .pr-content.with-side-panel[b-1mps5phsmz] {
        grid-template-columns: minmax(0, 1fr);
    }

    .pr-sqm-panel[b-1mps5phsmz] {
        max-height: 360px;
        border-left: 0;
        border-top: 1px solid #dfe5ec;
    }
}

/* Overdue-regulations filter: a checkbox aligned with the other filter inputs. */
.pr-overdue-toggle[b-1mps5phsmz] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    height: 42px;
    padding: 0 14px;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    background: #ffffff;
    cursor: pointer;
    user-select: none;
}

.pr-overdue-toggle input[b-1mps5phsmz] {
    width: 16px;
    height: 16px;
    accent-color: #5263ff;
    cursor: pointer;
}

.pr-overdue-toggle span[b-1mps5phsmz] {
    color: #1e293b;
    font-size: 14px;
    font-weight: 500;
}

/* The location's next scheduled regulation, shown under its address. The cell's other
   lines truncate with an ellipsis; this one wraps instead, or the overdue chip at its end
   is the part that gets cut off. */
.pr-location-cell .pr-next-reg[b-1mps5phsmz] {
    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
    color: #64748b;
    font-size: 12px;
    white-space: normal;
    overflow: visible;
}

.pr-overdue-chip[b-1mps5phsmz] {
    display: inline-flex;
    align-items: center;
    padding: 1px 8px;
    border-radius: 999px;
    background: #fee2e2;
    color: #b91c1c;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.02em;
}

/* Which percent the regulation will apply to this address, and where it came from. */
.pr-pct-cell[b-1mps5phsmz] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
}

.pr-pct-badge[b-1mps5phsmz] {
    display: inline-flex;
    align-items: center;
    padding: 1px 8px;
    border-radius: 999px;
    background: #e0e7ff;
    color: #3730a3;
    font-size: 11px;
    font-weight: 600;
}
/* /Pages/Locations/Components/RenameLocationGroupPopup.razor.rz.scp.css */
/* ── Modal shell ─────────────────────────────────────────────────────────── */
.rgp-modal-content[b-mllmezmt77] {
  border-radius: 16px;
  overflow: hidden;
  border: none;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.12);
}

/* ── Header ──────────────────────────────────────────────────────────────── */
.rgp-modal-header[b-mllmezmt77] {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 20px 20px 16px;
  background: #fff;
  border-bottom: 1px solid #f1f5f9;
}

.rgp-modal-title[b-mllmezmt77] {
  font-size: 18px;
  font-weight: 700;
  color: #1e293b;
  margin: 0;
}

.rgp-close-btn[b-mllmezmt77] {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  border-radius: 8px;
  border: 1px solid #e2e8f0;
  background: #fff;
  cursor: pointer;
  transition: background 0.15s;
  flex-shrink: 0;
}

.rgp-close-btn:hover[b-mllmezmt77] {
  background: #f1f5f9;
}

/* ── Body ────────────────────────────────────────────────────────────────── */
.rgp-body[b-mllmezmt77] {
  background: #fff;
  padding: 20px !important;
}

.rgp-field-label[b-mllmezmt77] {
  display: block;
  font-size: 12px;
  font-weight: 600;
  color: #475569;
  margin-bottom: 6px;
}

.rgp-field-hint[b-mllmezmt77] {
  display: block;
  font-size: 11px;
  color: #64748b;
  margin-top: -4px;
}

.rgp-name-input[b-mllmezmt77] {
  width: 100%;
  padding: 8px 10px;
  background-color: var(--white);
  border: 1px #1e293b1f solid;
  border-radius: 10px;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
  outline: none;
  font-size: 13px;
  font-weight: 600;
  line-height: 24px;
  letter-spacing: -0.2px;
  color: var(--dark-txt);
}

.rgp-name-input:focus[b-mllmezmt77] {
  box-shadow: 0 0 0 0.2rem #dce0ff;
}

.rgp-name-input[b-mllmezmt77]::placeholder {
  color: #5F6E85;
}

/* ── Footer ──────────────────────────────────────────────────────────────── */
.rgp-modal-footer[b-mllmezmt77] {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 14px 20px;
  background: #fff;
  border-top: 1px solid #f1f5f9;
}

.rgp-btn-cancel[b-mllmezmt77] {
  background-color: #f1f5f9cc !important;
  border-color: #1e293b17 !important;
  color: var(--dark-txt) !important;
}

.rgp-btn-save[b-mllmezmt77] {
  background-color: var(--purple);
  border-color: #1e293b17;
  color: var(--white);
  backdrop-filter: blur(24px);
  box-shadow:
    0px 1px 1px -0.5px #1e293b08,
    0px 3px 3px 0px #ffffff1f inset;
}

.rgp-btn-save:disabled[b-mllmezmt77] {
  opacity: 0.6;
  cursor: not-allowed;
}
/* /Pages/Locations/Components/RetroBillingPopup.razor.rz.scp.css */
/* Mirrors the seasonal/fee invoice modal's visual language (CustomerInvoiceSeasonalFeeModal). */

/* The offer opens on top of the location sidebar, which is itself a modal (z-index ~1100):
   both the dialog and its backdrop must stack above it so the sidebar darkens too. */
.invoice-wide-modal[b-dd42e14rip] {
    z-index: 2001;
}

.modal-backdrop[b-dd42e14rip] {
    z-index: 2000;
}

.invoice-wide-modal .modal-dialog[b-dd42e14rip] {
    max-width: 1000px;
    width: calc(100% - 32px);
}

.invoice-wide-modal .modal-content[b-dd42e14rip] {
    border: 0;
    border-radius: 16px;
    overflow: hidden;
}

.invoice-wide-modal .modal-header[b-dd42e14rip] {
    align-items: flex-start;
    padding: 24px 76px 16px 24px;
    position: relative;
}

.invoice-wide-modal .modal-header h5[b-dd42e14rip] {
    color: #1e293b;
    font-size: 20px;
    font-weight: 700;
    margin: 0;
}

.invoice-wide-modal .modal-header p[b-dd42e14rip] {
    color: #5F6E85;
    font-size: 13px;
    margin: 6px 0 0;
}

.invoice-wide-modal .modal-header .btn-close[b-dd42e14rip] {
    background-color: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    height: 36px;
    margin: 0;
    opacity: 1;
    padding: 0;
    position: absolute;
    right: 24px;
    top: 24px;
    width: 36px;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23334155'%3e%3cpath d='M.293.293a1 1 0 0 1 1.414 0L8 6.586 14.293.293a1 1 0 1 1 1.414 1.414L9.414 8l6.293 6.293a1 1 0 0 1-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 0 1-1.414-1.414L6.586 8 .293 1.707a1 1 0 0 1 0-1.414z'/%3e%3c/svg%3e");
    background-position: center;
    background-repeat: no-repeat;
    background-size: 12px;
}

.invoice-wide-modal .modal-body[b-dd42e14rip] {
    padding: 0 24px;
}

.invoice-modal-table-scroll[b-dd42e14rip] {
    margin: 0 -24px;
    max-height: 56vh;
    overflow: auto;
}

.retro-section-title[b-dd42e14rip] {
    color: #1e293b;
    font-size: 14px;
    font-weight: 700;
    padding: 16px 24px 8px;
}

.invoice-table[b-dd42e14rip] {
    border-collapse: collapse;
    width: 100%;
}

.invoice-table thead th[b-dd42e14rip] {
    background: #f8fafc;
    border-bottom: 1px solid #e2e8f0;
    color: #5F6E85;
    font-size: 12px;
    font-weight: 600;
    padding: 12px 16px;
    position: sticky;
    text-align: left;
    top: 0;
    white-space: nowrap;
    z-index: 1;
}

.invoice-table thead th + th[b-dd42e14rip] {
    border-left: 1px solid #e2e8f0;
}

.invoice-table tbody td[b-dd42e14rip] {
    border-bottom: 1px solid #f1f5f9;
    color: #334155;
    font-size: 13px;
    padding: 14px 16px;
    vertical-align: middle;
}

.invoice-table tbody td + td[b-dd42e14rip] {
    border-left: 1px solid #f1f5f9;
}

.invoice-table tbody tr:nth-child(even) td[b-dd42e14rip] {
    background: #f8fafc;
}

.invoice-table tbody tr[b-dd42e14rip] {
    cursor: pointer;
}

.invoice-table tbody tr:hover td[b-dd42e14rip] {
    background: #f4f7ff;
}

.invoice-empty-row td[b-dd42e14rip] {
    color: #94a3b8;
    cursor: default;
}

.invoice-check-col[b-dd42e14rip] {
    width: 48px;
}

.invoice-check[b-dd42e14rip] {
    align-items: center;
    background: #ffffff;
    border: 1px solid #cbd5e1;
    border-radius: 5px;
    display: inline-flex;
    height: 18px;
    justify-content: center;
    padding: 0;
    width: 18px;
}

.invoice-check:disabled[b-dd42e14rip] {
    background: #f1f5f9;
    cursor: not-allowed;
}

.invoice-check.checked[b-dd42e14rip] {
    background: #5263ff;
    border-color: #5263ff;
}

.invoice-check.checked[b-dd42e14rip]::after {
    border: solid #ffffff;
    border-width: 0 2px 2px 0;
    content: "";
    height: 10px;
    margin-top: -2px;
    transform: rotate(45deg);
    width: 5px;
}

.invoice-check.indeterminate[b-dd42e14rip] {
    background: #5263ff;
    border-color: #5263ff;
}

.invoice-check.indeterminate[b-dd42e14rip]::after {
    background: #ffffff;
    border-radius: 1px;
    content: "";
    height: 2px;
    width: 10px;
}

.invoice-wide-modal .modal-footer[b-dd42e14rip] {
    border-top: 1px solid #eef2f7;
    gap: 16px;
    padding: 16px 24px;
}

.invoice-modal-hint[b-dd42e14rip] {
    color: #334155;
    font-size: 14px;
    font-weight: 500;
    margin-right: auto;
}

.invoice-wide-modal .skip-btn[b-dd42e14rip] {
    background: #ffffff;
    border: 1px solid #dbe3ef;
    border-radius: 10px;
    color: #334155;
    font-size: 14px;
    font-weight: 600;
    margin: 0;
    min-height: 40px;
    padding: 8px 20px;
}

.invoice-wide-modal .apply-btn[b-dd42e14rip] {
    background: #5263ff;
    border: 0;
    border-radius: 10px;
    color: #ffffff;
    font-size: 14px;
    font-weight: 600;
    margin: 0;
    min-height: 40px;
    padding: 8px 20px;
}

.invoice-wide-modal .apply-btn:hover:not(:disabled)[b-dd42e14rip] {
    background: #4353e8;
    color: #ffffff;
}

.invoice-wide-modal .apply-btn:disabled[b-dd42e14rip] {
    background: #aab4f5;
    color: #ffffff;
    cursor: not-allowed;
    opacity: 1;
}

@media (max-width: 900px) {
    .invoice-table[b-dd42e14rip] {
        min-width: 860px;
    }
}
/* /Pages/Locations/Components/RuleDetailsPopup.razor.rz.scp.css */
/* Start rule-info-body */

.rule-info-body .modal-dialog[b-43unc6be2b] {
    min-width: 560px;
}

.rule-info-body[b-43unc6be2b] {
    padding: 16px 20px !important;
    background-color: #F1F5F9 !important;
    max-height: 600px;
    overflow-y: scroll;
    scrollbar-width: none;
}

    .rule-info-body .box[b-43unc6be2b] {
        background-color: var(--white);
        border: none;
        box-shadow: 
            0px 20px 20px -12px #1E293B08,
            0px 3px 3px -1.5px #1E293B08,
            0px 1px 1px -0.5px #1E293B08;
        border-radius: 16px;
        padding: 20px;
    }

        .rule-info-body .box h6[b-43unc6be2b] {
            font-size: 15px;
            font-weight: 700;
            line-height: 24px;
            letter-spacing: -0.2px;
            color: var(--dark-txt);
        }

        .rule-info-body .box span[b-43unc6be2b] {
            font-size: 15px;
            font-weight: 600;
            line-height: 24px;
            letter-spacing: -0.2px;
            color: var(--gray-txt);
        }

        .rule-info-body .box table[b-43unc6be2b] {
            border: 1px solid #1E293B0F;
            box-shadow: 
                0px 20px 20px -12px #1E293B08,
                0px 3px 3px -1.5px #1E293B08,
                0px 1px 1px -0.5px #1E293B08;
            border-radius: 16px;
            /* border-collapse: separate; */
            overflow: hidden;
        }

            .rule-info-body .box table thead tr[b-43unc6be2b] {
                background: #F1F5F9 !important;
            }

            .rule-info-body .box table tr th[b-43unc6be2b] {
                padding: 12px 16px;
                font-size: 13px;
                font-weight: 700;
                line-height: 20px;
                letter-spacing: -0.2px;
                color: var(--dark-txt);
            }

            .rule-info-body .box table tr.title[b-43unc6be2b] {
                background-color: #F1F5F9 !important;
            }

            .rule-info-body .box table tr td[b-43unc6be2b] {
                padding: 8px 16px;
                font-size: 13px;
                font-weight: 600;
                line-height: 20px;
                letter-spacing: -0.2px;
                color: var(--dark-txt);
            }

                .rule-info-body .box table tr td.green[b-43unc6be2b] {
                    color: var(--green);
                }

            .rule-info-body .box table tr:nth-child(even)[b-43unc6be2b] {
                background-color: #F8FAFC;
            }

            .rule-info-body .box table tr th:first-child[b-43unc6be2b] {
                border-radius: 16px 0 0 0;
            }

            .rule-info-body .box table tr th:last-child[b-43unc6be2b] {
                border-radius: 0 16px 0 0;
            }

            .rule-info-body .box table tr td span[b-43unc6be2b] {
                color: var(--gray-txt-2);
            }

    .rule-info-body .carousel .carousel-inner[b-43unc6be2b] {
        border-radius: 16px;
        position: relative;
        height: 346px;
    }

    .rule-info-body .carousel .carousel-control-prev[b-43unc6be2b],
    .rule-info-body .carousel .carousel-control-next[b-43unc6be2b] {
        height: fit-content;
        width: fit-content;
        top: 50%;
        transform: translate(0%, -50%);
        opacity: 1;
    }

    .rule-info-body .carousel .carousel-control-prev[b-43unc6be2b] {
        left: 8px;
    }

    .rule-info-body .carousel .carousel-control-next[b-43unc6be2b] {
        right: 8px;
    }

    .rule-info-body .carousel .carousel-control-prev-icon[b-43unc6be2b] {
        background-color: #F1F5F9CC;
        border: 1px #1E293B08 solid;
        border-radius: 8px;
        background-image: url(../img/icons/left-slider-blue-arrow.png) !important;
        background-size: 20px;
    }

    .rule-info-body .carousel .carousel-control-next-icon[b-43unc6be2b] {
        background-color: #F1F5F9CC;
        border: 1px #1E293B08 solid;
        border-radius: 8px;
        background-image: url(../img/icons/right-slider-blue-arrow.png) !important;
        background-size: 20px;
    }

    .rule-info-body .carousel .carousel-indicators button[b-43unc6be2b] {
        margin: 0 !important;
        border: none !important;
        min-height: 8px !important;
        min-width: 8px !important;
        max-height: 8px !important;
        max-width: 8px !important;
        background-color: #FFFFFF !important;
        opacity: 0.5 !important;
        border-radius: 50px !important;
        z-index: 9999 !important;
    }

        .rule-info-body .carousel .carousel-indicators button.active[b-43unc6be2b] {
            opacity: 1 !important;
        }

    .rule-info-body .carousel .carousel-inner .full-icon[b-43unc6be2b] {
        position: absolute;
        bottom: 8px;
        right: 8px;
        z-index: 9999;
        background-color: #F1F5F9CC;
        padding: 7px;
        height: 32px;
        width: 32px;
        border: 1px #1E293B08 solid;
        border-radius: 8px;
        cursor: pointer;
    }

        .rule-info-body .carousel .carousel-inner .full-icon img[b-43unc6be2b] {
            height: 18px;
        }


@media (max-width:767px) {
    .rule-info-body .modal-dialog[b-43unc6be2b] {
        min-width: 95%;
    }
}

/* End rule-info-body */
/* /Pages/Locations/Components/SnowDepthRulesPanel.razor.rz.scp.css */
/* The snow depth rules panel of the address's Prices tab. Scoped CSS does not cross
   components, so the toggle, the inputs and the add/remove buttons repeat the look of the
   price grid around it (LocationDetailsModal.razor.css) rather than borrowing its classes. */

.sdr-panel[b-crd2uc3l2d] {
  border: 2px solid #1e293b0f;
  border-radius: 16px;
  margin: 0 16px 16px 16px;
  overflow: hidden;
  background-color: var(--white);
}

.sdr-panel.sdr-readonly[b-crd2uc3l2d] {
  margin: 0;
  border: none;
  border-radius: 0;
}

.sdr-header[b-crd2uc3l2d] {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 16px;
  background-color: #f8fafc;
  border-bottom: 1px solid #1e293b0f;
}

.sdr-readonly .sdr-header[b-crd2uc3l2d] {
  background-color: transparent;
  padding: 0 0 8px 0;
  border-bottom: none;
}

.sdr-title[b-crd2uc3l2d] {
  font-size: 13px;
  font-weight: 700;
  color: var(--dark-txt);
}

/* ── Toggle ── */
.sdr-toggle[b-crd2uc3l2d] {
  position: relative;
  display: inline-block;
  width: 46px;
  height: 28px;
  margin: 0 0 0 auto;
  background: linear-gradient(180deg, rgba(226, 232, 240, 1) 0%, rgba(248, 250, 252, 1) 100%);
  border-radius: 50px;
  padding: 3px;
  flex-shrink: 0;
}

.sdr-toggle input[b-crd2uc3l2d] {
  opacity: 0;
  width: 0;
  height: 0;
}

.sdr-toggle-slider[b-crd2uc3l2d] {
  position: absolute;
  cursor: pointer;
  border-radius: 30px;
  background-color: #d3dde8;
  transition: 0.3s;
  height: 22px;
  width: 40px;
}

.sdr-toggle-slider[b-crd2uc3l2d]:before {
  content: "";
  position: absolute;
  height: 18px;
  width: 18px;
  left: 2px;
  top: 2px;
  border-radius: 1000px;
  background: linear-gradient(180deg, #e2e8f0 0%, #ffffff 100%);
  border: 3.5px solid #f9fbfc;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.15);
  transition: 0.3s;
}

.sdr-toggle input:checked + .sdr-toggle-slider[b-crd2uc3l2d] {
  background: linear-gradient(135deg, #5b67f6, #4c57e0);
}

.sdr-toggle input:checked + .sdr-toggle-slider[b-crd2uc3l2d]:before {
  transform: translateX(18px);
}

/* ── Minimum depth line ── */
.sdr-min[b-crd2uc3l2d] {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  padding: 12px 16px;
}

.sdr-readonly .sdr-min[b-crd2uc3l2d] {
  padding: 4px 0 8px 0;
}

.sdr-min-label[b-crd2uc3l2d],
.sdr-min-value[b-crd2uc3l2d],
.sdr-unit[b-crd2uc3l2d] {
  font-size: 13px;
  font-weight: 600;
  color: var(--dark-txt);
}

.sdr-unit[b-crd2uc3l2d] {
  color: var(--gray-txt);
}

.sdr-badge[b-crd2uc3l2d] {
  display: inline-flex;
  align-items: center;
  padding: 3px 10px;
  border-radius: 999px;
  background-color: #dcfce7;
  color: #15803d;
  font-size: 12px;
  font-weight: 700;
}

.sdr-hint[b-crd2uc3l2d] {
  margin: 0;
  padding: 0 16px 12px 16px;
  font-size: 12px;
  color: var(--gray-txt);
}

/* ── Inputs ── */
.sdr-input[b-crd2uc3l2d] {
  height: 36px;
  padding: 6px 8px;
  background-color: var(--white);
  border: 1px solid #1e293b1f;
  border-radius: 10px;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: 13px;
  font-weight: 600;
  color: var(--dark-txt);
  outline: none;
  transition: border-color 0.15s, box-shadow 0.15s;
}

.sdr-input:focus[b-crd2uc3l2d] {
  box-shadow: 0 0 0 0.2rem #dce0ff;
}

.sdr-input[type="number"][b-crd2uc3l2d]::-webkit-outer-spin-button,
.sdr-input[type="number"][b-crd2uc3l2d]::-webkit-inner-spin-button {
  -webkit-appearance: none;
}

.sdr-input-depth[b-crd2uc3l2d],
.sdr-input-cut[b-crd2uc3l2d] {
  width: 72px;
}

.sdr-input-price[b-crd2uc3l2d] {
  width: 100px;
}

/* ── Matrix ── */
.sdr-matrix-wrap[b-crd2uc3l2d] {
  overflow-x: auto;
}

.sdr-matrix[b-crd2uc3l2d] {
  width: 100%;
  border-collapse: collapse;
}

.sdr-matrix th[b-crd2uc3l2d],
.sdr-matrix td[b-crd2uc3l2d] {
  padding: 8px 12px;
  text-align: left;
  white-space: nowrap;
  vertical-align: middle;
  border-top: 1px solid #1e293b0f;
}

.sdr-matrix thead th[b-crd2uc3l2d] {
  border-top: none;
  background-color: #f8fafc;
  font-size: 12px;
  font-weight: 700;
  color: var(--gray-txt);
}

.sdr-readonly .sdr-matrix thead th[b-crd2uc3l2d] {
  background-color: transparent;
}

.sdr-col-worktype[b-crd2uc3l2d] {
  min-width: 160px;
  font-size: 13px;
  font-weight: 600;
  color: var(--dark-txt);
}

.sdr-col-add[b-crd2uc3l2d] {
  width: 1%;
}

.sdr-band-head[b-crd2uc3l2d] {
  display: flex;
  align-items: center;
  gap: 6px;
}

.sdr-band-from[b-crd2uc3l2d],
.sdr-band-to[b-crd2uc3l2d],
.sdr-band-open[b-crd2uc3l2d],
.sdr-band-range[b-crd2uc3l2d] {
  font-size: 12px;
  font-weight: 700;
  color: var(--gray-txt);
}

.sdr-band-range[b-crd2uc3l2d] {
  color: var(--dark-txt);
}

.sdr-band-remove[b-crd2uc3l2d] {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 26px;
  background: transparent;
  border: none;
  border-radius: 8px;
  cursor: pointer;
  padding: 0;
}

.sdr-band-remove img[b-crd2uc3l2d] {
  height: 15px;
}

.sdr-band-remove:hover[b-crd2uc3l2d] {
  background-color: #fef2f2;
}

.sdr-add-band[b-crd2uc3l2d] {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 12px;
  border: none;
  border-radius: 10px;
  font-size: 12px;
  font-weight: 700;
  color: var(--purple);
  background-color: #eaecff;
  cursor: pointer;
  white-space: nowrap;
}

.sdr-add-band:hover[b-crd2uc3l2d] {
  background-color: #dce0ff;
}

.sdr-cell[b-crd2uc3l2d] {
  display: flex;
  align-items: center;
  gap: 6px;
}

.sdr-currency[b-crd2uc3l2d] {
  font-size: 12px;
  font-weight: 600;
  color: var(--gray-txt);
}

.sdr-price[b-crd2uc3l2d] {
  font-size: 13px;
  font-weight: 600;
  color: var(--dark-txt);
}

.sdr-dash[b-crd2uc3l2d] {
  color: var(--gray-txt);
}

.sdr-fault[b-crd2uc3l2d] {
  color: #dc2626;
  font-size: 12px;
  padding: 6px 16px 12px 16px;
}
/* /Pages/Locations/CustomerDashboardLauncher.razor.rz.scp.css */
/* The page uses the shared main-title-bar / main-table layout (css/style.css);
   only the per-row "open dashboard" action button is styled here. */

.action-cell[b-wp53mhfvwg] {
    text-align: right !important;
    width: 190px;
}

.open-dashboard-button[b-wp53mhfvwg] {
    align-items: center;
    background: #eef0ff;
    border: 1px solid transparent;
    border-radius: 9px;
    color: #4657eb;
    display: inline-flex;
    font-size: 13px;
    font-weight: 700;
    gap: 9px;
    justify-content: center;
    min-height: 36px;
    min-width: 128px;
    padding: 8px 12px;
    transition: background-color .15s ease, border-color .15s ease, transform .15s ease;
    white-space: nowrap;
}

.open-dashboard-button:hover:not(:disabled)[b-wp53mhfvwg] {
    background: #5263ff;
    border-color: #5263ff;
    color: #ffffff;
    transform: translateY(-1px);
}

.open-dashboard-button:focus-visible[b-wp53mhfvwg] {
    box-shadow: 0 0 0 3px rgba(82, 99, 255, .22);
    outline: none;
}

.open-dashboard-button:disabled[b-wp53mhfvwg] {
    cursor: wait;
    opacity: .65;
}

.open-arrow[b-wp53mhfvwg] {
    font-size: 17px;
    line-height: 1;
}

.context-secondary[b-wp53mhfvwg] {
    color: #6b7280;
    display: block;
    font-size: 12px;
}
/* /Pages/Locations/DrawingImportMatches.razor.rz.scp.css */
/* ── Shell ───────────────────────────────────────────────────────────────────
   Same standing as the review page: over the app shell at 1030, which clears the
   sidebar and the mobile chrome while staying under Bootstrap's modal backdrop
   (1050), so the lightbox still opens on top of this. */

.dim-shell[b-p4b7dfbgp3] {
	position: fixed;
	inset: 0;
	z-index: 1030;
	display: flex;
	flex-direction: column;
	background: #F8FAFC;
	outline: none;
}

.dim-centered[b-p4b7dfbgp3] {
	flex: 1;
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 0;
	color: #0D6EFD;
}

.dim-summary[b-p4b7dfbgp3] {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 12px;
	max-width: 460px;
	padding: 28px 32px;
	text-align: center;
	background: #FFFFFF;
	border: 1px solid #1E293B17;
	border-radius: 14px;
}

.dim-summary-title[b-p4b7dfbgp3] {
	font-size: 18px;
	font-weight: 700;
	color: #1E293B;
}

.dim-summary-text[b-p4b7dfbgp3] {
	font-size: 14px;
	color: #5F6E85;
}

.dim-summary-actions[b-p4b7dfbgp3] {
	display: flex;
	align-items: center;
	gap: 10px;
}

/* ── Header ──────────────────────────────────────────────────────────────── */

.dim-header[b-p4b7dfbgp3] {
	display: flex;
	align-items: center;
	gap: 16px;
	flex-shrink: 0;
	padding: 10px 16px;
	background: #FFFFFF;
	border-bottom: 1px solid #1E293B17;
}

.dim-back[b-p4b7dfbgp3] {
	display: flex;
	align-items: center;
	gap: 6px;
	flex-shrink: 0;
	padding: 6px 10px;
	border: 1px solid #E2E8F0;
	border-radius: 8px;
	background: #FFFFFF;
	font-size: 13px;
	font-weight: 600;
	color: #475569;
	cursor: pointer;
	white-space: nowrap;
	transition: background .15s, color .15s;
}

	.dim-back:hover[b-p4b7dfbgp3] {
		background: #F1F5F9;
		color: #1E293B;
	}

.dim-batch[b-p4b7dfbgp3] {
	display: flex;
	flex-direction: column;
	gap: 4px;
	min-width: 180px;
	max-width: 260px;
}

.dim-batch-name[b-p4b7dfbgp3] {
	font-size: 14px;
	font-weight: 600;
	color: #1E293B;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.dim-progress-row[b-p4b7dfbgp3] {
	display: flex;
	align-items: center;
	gap: 8px;
}

.dim-progress-bar[b-p4b7dfbgp3] {
	flex: 1;
	height: 4px;
	border-radius: 2px;
	background: #E2E8F0;
	overflow: hidden;
}

.dim-progress-fill[b-p4b7dfbgp3] {
	height: 100%;
	border-radius: 2px;
	background: #363AF5;
	transition: width .25s ease;
}

.dim-progress-text[b-p4b7dfbgp3] {
	font-size: 12px;
	font-weight: 500;
	color: #5F6E85;
	white-space: nowrap;
	font-variant-numeric: tabular-nums;
}

.dim-title[b-p4b7dfbgp3] {
	display: flex;
	flex-direction: column;
	margin-left: auto;
	min-width: 0;
	text-align: right;
}

.dim-title-text[b-p4b7dfbgp3] {
	font-size: 14px;
	font-weight: 700;
	color: #1E293B;
}

.dim-title-sub[b-p4b7dfbgp3] {
	font-size: 12px;
	color: #5F6E85;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

/* ── Toolbar ─────────────────────────────────────────────────────────────── */

.dim-toolbar[b-p4b7dfbgp3] {
	display: flex;
	align-items: center;
	gap: 10px;
	flex-wrap: wrap;
	flex-shrink: 0;
	padding: 10px 16px;
	background: #FFFFFF;
	border-bottom: 1px solid #1E293B0F;
}

.dim-toolbar-btn[b-p4b7dfbgp3] {
	height: 34px;
	padding: 0 14px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: 13px;
	white-space: nowrap;
	margin: 0;
}

.dim-toolbar-btn-end[b-p4b7dfbgp3] {
	margin-left: 0;
}

.dim-filter[b-p4b7dfbgp3] {
	display: flex;
	align-items: center;
	gap: 6px;
	margin: 0;
	font-size: 13px;
	font-weight: 500;
	color: #475569;
	cursor: pointer;
	user-select: none;
}

	.dim-filter input[b-p4b7dfbgp3] {
		width: 15px;
		height: 15px;
		accent-color: #5263FF;
		cursor: pointer;
	}

.dim-toolbar-counts[b-p4b7dfbgp3] {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-left: auto;
}

.dim-count[b-p4b7dfbgp3] {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 3px 10px;
	border: 1px solid #E2E8F0;
	border-radius: 8px;
	background: #FFFFFF;
	font-size: 12px;
	font-weight: 600;
	color: #475569;
	font-variant-numeric: tabular-nums;
}

.dim-count-dot[b-p4b7dfbgp3] {
	width: 8px;
	height: 8px;
	border-radius: 50%;
	flex-shrink: 0;
}

.dim-count-dot-waiting[b-p4b7dfbgp3] {
	background: #F59E0B;
}

.dim-count-dot-needs[b-p4b7dfbgp3] {
	background: #B45309;
}

.dim-count-dot-working[b-p4b7dfbgp3] {
	background: #6366F1;
}

/* ── List ────────────────────────────────────────────────────────────────── */

.dim-list[b-p4b7dfbgp3] {
	flex: 1;
	min-height: 0;
	overflow-y: auto;
	padding: 12px 16px 24px;
}

.dim-list-head[b-p4b7dfbgp3],
.dim-row[b-p4b7dfbgp3] {
	display: grid;
	grid-template-columns: 28px 84px minmax(140px, 1.1fr) minmax(120px, 1.1fr) minmax(180px, 1.6fr) 150px 230px;
	align-items: center;
	gap: 12px;
}

.dim-list-head[b-p4b7dfbgp3] {
	position: sticky;
	top: 0;
	z-index: 3;
	padding: 8px 12px;
	background: #F8FAFC;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.4px;
	text-transform: uppercase;
	color: #94A3B8;
}

.dim-row[b-p4b7dfbgp3] {
	position: relative;
	padding: 10px 12px;
	margin-bottom: 8px;
	background: #FFFFFF;
	border: 1px solid #1E293B17;
	border-radius: 12px;
	transition: border-color .15s, box-shadow .15s;
}

	.dim-row:hover[b-p4b7dfbgp3] {
		border-color: #C7CBFF;
	}

/* A page that has already moved on is still listed, so the batch reads as one
   thing, but it is plainly not what the screen is asking about. */
.dim-row-closed[b-p4b7dfbgp3] {
	background: #FBFCFE;
	opacity: .62;
}

.dim-row-picking[b-p4b7dfbgp3] {
	border-color: #5263FF;
	box-shadow: 0 2px 10px rgba(82,99,255,0.12);
	z-index: 4;
}

.dim-check[b-p4b7dfbgp3] {
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 0;
	min-height: 18px;
}

	.dim-check input[b-p4b7dfbgp3] {
		width: 16px;
		height: 16px;
		accent-color: #5263FF;
		cursor: pointer;
	}

/* ── Thumbnail ───────────────────────────────────────────────────────────── */

.dim-thumb[b-p4b7dfbgp3] {
	width: 84px;
	height: 60px;
	padding: 0;
	border: 1px solid #E2E8F0;
	border-radius: 8px;
	background: #F1F5F9;
	overflow: hidden;
	cursor: zoom-in;
	display: flex;
	align-items: center;
	justify-content: center;
}

	.dim-thumb img[b-p4b7dfbgp3] {
		width: 100%;
		height: 100%;
		object-fit: cover;
	}

/* The placeholder is deliberately quiet: on a batch of hundreds most of these
   are below the fold and will never be fetched at all. */
.dim-thumb-placeholder[b-p4b7dfbgp3] {
	width: 100%;
	height: 100%;
	background: linear-gradient(90deg, #F1F5F9 0%, #E7EDF5 50%, #F1F5F9 100%);
}

.dim-thumb-empty[b-p4b7dfbgp3] {
	padding: 0 6px;
	font-size: 10px;
	line-height: 1.2;
	color: #94A3B8;
	text-align: center;
}

/* ── Page, readout, match ────────────────────────────────────────────────── */

.dim-page[b-p4b7dfbgp3] {
	display: flex;
	flex-direction: column;
	min-width: 0;
}

.dim-page-file[b-p4b7dfbgp3] {
	font-size: 13px;
	font-weight: 600;
	color: #1E293B;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.dim-page-number[b-p4b7dfbgp3] {
	font-size: 12px;
	color: #5F6E85;
}

.dim-read[b-p4b7dfbgp3] {
	min-width: 0;
	font-size: 12px;
	color: #475569;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.dim-muted[b-p4b7dfbgp3] {
	color: #94A3B8;
	font-style: italic;
}

.dim-match[b-p4b7dfbgp3] {
	display: flex;
	align-items: center;
	gap: 8px;
	flex-wrap: wrap;
	min-width: 0;
}

.dim-match-name[b-p4b7dfbgp3] {
	font-size: 13px;
	font-weight: 600;
	color: #1E293B;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	max-width: 100%;
}

.dim-match-address[b-p4b7dfbgp3] {
	font-size: 12px;
	color: #5F6E85;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	max-width: 100%;
}

.dim-needs[b-p4b7dfbgp3] {
	font-size: 13px;
	font-weight: 600;
	color: #B45309;
}

.dim-pill[b-p4b7dfbgp3] {
	display: inline-flex;
	align-items: center;
	padding: 3px 8px;
	border-radius: 20px;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: -0.1px;
	white-space: nowrap;
}

.dim-pill-good[b-p4b7dfbgp3] {
	background: #ECFDF5;
	color: #047857;
}

.dim-pill-fair[b-p4b7dfbgp3] {
	background: #FFFBEB;
	color: #B45309;
}

.dim-pill-poor[b-p4b7dfbgp3] {
	background: #FEF2F2;
	color: #B91C1C;
}

/* ── Status ──────────────────────────────────────────────────────────────── */

.dim-status-cell[b-p4b7dfbgp3] {
	display: flex;
	flex-direction: column;
	gap: 4px;
	min-width: 0;
}

.dim-status[b-p4b7dfbgp3] {
	display: inline-flex;
	align-items: center;
	align-self: flex-start;
	padding: 3px 10px;
	border-radius: 999px;
	font-size: 11px;
	font-weight: 700;
	white-space: nowrap;
}

.dim-status-waiting[b-p4b7dfbgp3] {
	background: #FEF3C7;
	color: #92400E;
}

.dim-status-needs[b-p4b7dfbgp3] {
	background: #FFEDD5;
	color: #9A3412;
}

.dim-status-working[b-p4b7dfbgp3] {
	background: #E0E7FF;
	color: #3730A3;
}

.dim-status-ready[b-p4b7dfbgp3] {
	background: #DBEAFE;
	color: #1D4ED8;
}

.dim-status-done[b-p4b7dfbgp3] {
	background: #DCFCE7;
	color: #166534;
}

.dim-status-failed[b-p4b7dfbgp3] {
	background: #FEE2E2;
	color: #B91C1C;
}

.dim-status-muted[b-p4b7dfbgp3] {
	background: #F1F5F9;
	color: #64748B;
}

.dim-row-error[b-p4b7dfbgp3] {
	font-size: 11px;
	color: #B91C1C;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

/* ── Actions ─────────────────────────────────────────────────────────────── */

.dim-actions[b-p4b7dfbgp3] {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 6px;
}

.dim-row-btn[b-p4b7dfbgp3] {
	height: 30px;
	padding: 0 12px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: 12px;
	white-space: nowrap;
	margin: 0;
}

.dim-link-btn[b-p4b7dfbgp3] {
	padding: 5px 8px;
	border: 1px solid #C7CBFF;
	border-radius: 8px;
	background: #5263FF1F;
	font-size: 12px;
	font-weight: 600;
	color: #363AF5;
	cursor: pointer;
	white-space: nowrap;
}

	.dim-link-btn:disabled[b-p4b7dfbgp3] {
		opacity: .5;
		cursor: not-allowed;
	}

/* ── Inline address picker ───────────────────────────────────────────────── */

.dim-picker[b-p4b7dfbgp3] {
	grid-column: 1 / -1;
	margin-top: 10px;
	padding: 10px;
	background: #FFFFFF;
	border: 1px solid #1E293B17;
	border-radius: 12px;
	box-shadow: 0 8px 24px rgba(30,41,59,0.10);
}

.dim-picker-input[b-p4b7dfbgp3] {
	width: 100%;
	height: 38px;
	padding: 0 12px;
	margin-bottom: 8px;
	border-radius: 8px;
	border: 1.5px solid #5263FF;
	font-size: 14px;
	color: #1E293B;
	outline: none;
}

.dim-picker-list[b-p4b7dfbgp3] {
	max-height: 280px;
	overflow-y: auto;
}

.dim-picker-group[b-p4b7dfbgp3] {
	padding: 6px 6px 4px;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.5px;
	text-transform: uppercase;
	color: #94A3B8;
}

.dim-picker-row[b-p4b7dfbgp3] {
	display: flex;
	align-items: center;
	gap: 8px;
	width: 100%;
	padding: 7px 8px;
	border: none;
	border-radius: 8px;
	background: transparent;
	text-align: left;
	cursor: pointer;
	transition: background .12s;
}

	.dim-picker-row:hover:not(:disabled)[b-p4b7dfbgp3] {
		background: #F1F5F9;
	}

	.dim-picker-row:disabled[b-p4b7dfbgp3] {
		opacity: .5;
		cursor: not-allowed;
	}

.dim-picker-name[b-p4b7dfbgp3] {
	font-size: 13px;
	font-weight: 600;
	color: #1E293B;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.dim-picker-meta[b-p4b7dfbgp3] {
	margin-left: auto;
	font-size: 12px;
	color: #5F6E85;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.dim-picker-empty[b-p4b7dfbgp3] {
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 12px 8px;
	font-size: 13px;
	color: #94A3B8;
}

/* ── Lightbox ────────────────────────────────────────────────────────────── */

/* The viewer sizes itself to its host, so the popup body has to say how tall the
   page is allowed to be or the image collapses to nothing. */
.dim-lightbox[b-p4b7dfbgp3] {
	height: 70vh;
	min-height: 320px;
}

/* ── Narrow screens ──────────────────────────────────────────────────────── */

@media (max-width: 1200px) {
	.dim-list-head[b-p4b7dfbgp3] {
		display: none;
	}

	.dim-row[b-p4b7dfbgp3] {
		grid-template-columns: 28px 84px minmax(0, 1fr) 140px;
		row-gap: 8px;
	}

	.dim-read[b-p4b7dfbgp3],
	.dim-match[b-p4b7dfbgp3] {
		grid-column: 3 / -1;
	}

	.dim-actions[b-p4b7dfbgp3] {
		grid-column: 1 / -1;
		justify-content: flex-start;
	}
}
/* /Pages/Locations/DrawingImportReview.razor.rz.scp.css */
/* ── Shell ───────────────────────────────────────────────────────────────────
   The page covers the app shell rather than sitting inside it. 1030 clears the
   sidebar and the mobile chrome while staying under Bootstrap's modal backdrop
   (1050), so the retrace popup still opens on top of this. */

.dir-shell[b-ywzq98llk9] {
	position: fixed;
	inset: 0;
	z-index: 1030;
	display: flex;
	flex-direction: column;
	background: #F8FAFC;
	outline: none;
}

.dir-centered[b-ywzq98llk9] {
	flex: 1;
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 0;
	color: #0D6EFD;
}

/* ── Header ──────────────────────────────────────────────────────────────── */

.dir-header[b-ywzq98llk9] {
	display: flex;
	align-items: center;
	gap: 16px;
	flex-shrink: 0;
	padding: 10px 16px;
	background: #FFFFFF;
	border-bottom: 1px solid #1E293B17;
}

.dir-back[b-ywzq98llk9] {
	display: flex;
	align-items: center;
	gap: 6px;
	flex-shrink: 0;
	padding: 6px 10px;
	border: 1px solid #E2E8F0;
	border-radius: 8px;
	background: #FFFFFF;
	font-size: 13px;
	font-weight: 600;
	color: #475569;
	cursor: pointer;
	white-space: nowrap;
	transition: background .15s, color .15s;
}

	.dir-back:hover[b-ywzq98llk9] {
		background: #F1F5F9;
		color: #1E293B;
	}

.dir-batch[b-ywzq98llk9] {
	display: flex;
	flex-direction: column;
	gap: 4px;
	min-width: 180px;
	max-width: 260px;
}

.dir-batch-name[b-ywzq98llk9] {
	font-size: 14px;
	font-weight: 600;
	color: #1E293B;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.dir-progress-row[b-ywzq98llk9] {
	display: flex;
	align-items: center;
	gap: 8px;
}

.dir-progress-bar[b-ywzq98llk9] {
	flex: 1;
	height: 4px;
	border-radius: 2px;
	background: #E2E8F0;
	overflow: hidden;
}

.dir-progress-fill[b-ywzq98llk9] {
	height: 100%;
	border-radius: 2px;
	background: #363AF5;
	transition: width .25s ease;
}

.dir-progress-text[b-ywzq98llk9] {
	font-size: 12px;
	font-weight: 500;
	color: #5F6E85;
	white-space: nowrap;
	font-variant-numeric: tabular-nums;
}

.dir-file[b-ywzq98llk9] {
	display: flex;
	flex-direction: column;
	min-width: 0;
	max-width: 220px;
}

.dir-file-name[b-ywzq98llk9] {
	font-size: 13px;
	font-weight: 600;
	color: #1E293B;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.dir-file-page[b-ywzq98llk9] {
	font-size: 12px;
	color: #5F6E85;
}

/* ── Match block ─────────────────────────────────────────────────────────── */

.dir-match[b-ywzq98llk9] {
	position: relative;
	display: flex;
	align-items: center;
	gap: 10px;
	margin-left: auto;
	padding: 6px 10px;
	border-radius: 10px;
	background: #F8FAFC;
	border: 1px solid #1E293B17;
}

.dir-match-text[b-ywzq98llk9] {
	display: flex;
	flex-direction: column;
	min-width: 0;
	max-width: 260px;
}

.dir-match-name[b-ywzq98llk9] {
	font-size: 13px;
	font-weight: 600;
	color: #1E293B;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.dir-match-address[b-ywzq98llk9] {
	font-size: 12px;
	color: #5F6E85;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.dir-pill[b-ywzq98llk9] {
	display: inline-flex;
	align-items: center;
	padding: 3px 8px;
	border-radius: 20px;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: -0.1px;
	white-space: nowrap;
}

.dir-pill-good[b-ywzq98llk9] {
	background: #ECFDF5;
	color: #047857;
}

.dir-pill-fair[b-ywzq98llk9] {
	background: #FFFBEB;
	color: #B45309;
}

.dir-pill-poor[b-ywzq98llk9] {
	background: #FEF2F2;
	color: #B91C1C;
}

.dir-pill-muted[b-ywzq98llk9] {
	background: #F1F5F9;
	color: #64748B;
}

.dir-change[b-ywzq98llk9] {
	flex-shrink: 0;
	padding: 5px 10px;
	border: 1px solid #C7CBFF;
	border-radius: 8px;
	background: #5263FF1F;
	font-size: 12px;
	font-weight: 600;
	color: #363AF5;
	cursor: pointer;
}

	.dir-change:disabled[b-ywzq98llk9] {
		opacity: .5;
		cursor: not-allowed;
	}

/* A page converted from a file on the address: the address is a fact, not a proposal. */
.dir-locked[b-ywzq98llk9] {
	flex-shrink: 1;
	max-width: 320px;
	font-size: 12px;
	color: var(--gray-txt-2);
}

/* ── Location picker ─────────────────────────────────────────────────────── */

.dir-picker[b-ywzq98llk9] {
	position: absolute;
	top: calc(100% + 8px);
	right: 0;
	z-index: 6;
	width: 360px;
	padding: 10px;
	background: #FFFFFF;
	border: 1px solid #1E293B17;
	border-radius: 12px;
	box-shadow: 0 8px 24px rgba(30,41,59,0.16);
}

.dir-picker-input[b-ywzq98llk9] {
	width: 100%;
	height: 38px;
	padding: 0 12px;
	margin-bottom: 8px;
	border-radius: 8px;
	border: 1.5px solid #5263FF;
	font-size: 14px;
	color: #1E293B;
	outline: none;
}

.dir-picker-list[b-ywzq98llk9] {
	max-height: 320px;
	overflow-y: auto;
}

.dir-picker-group[b-ywzq98llk9] {
	padding: 6px 6px 4px;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.5px;
	text-transform: uppercase;
	color: #94A3B8;
}

.dir-picker-row[b-ywzq98llk9] {
	display: flex;
	align-items: center;
	gap: 8px;
	width: 100%;
	padding: 7px 8px;
	border: none;
	border-radius: 8px;
	background: transparent;
	text-align: left;
	cursor: pointer;
	transition: background .12s;
}

	.dir-picker-row:hover:not(:disabled)[b-ywzq98llk9] {
		background: #F1F5F9;
	}

	.dir-picker-row:disabled[b-ywzq98llk9] {
		opacity: .5;
		cursor: not-allowed;
	}

.dir-picker-name[b-ywzq98llk9] {
	font-size: 13px;
	font-weight: 600;
	color: #1E293B;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.dir-picker-meta[b-ywzq98llk9] {
	margin-left: auto;
	font-size: 12px;
	color: #5F6E85;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.dir-picker-empty[b-ywzq98llk9] {
	padding: 12px 8px;
	font-size: 13px;
	color: #94A3B8;
}

/* ── Read-off-the-drawing line ───────────────────────────────────────────── */

.dir-readout[b-ywzq98llk9] {
	display: flex;
	align-items: center;
	gap: 6px;
	flex-shrink: 0;
	padding: 6px 16px;
	background: #FFFFFF;
	border-bottom: 1px solid #1E293B0F;
	font-size: 12px;
	color: #5F6E85;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

	.dir-readout span[b-ywzq98llk9] {
		overflow: hidden;
		text-overflow: ellipsis;
	}

/* ── Body: two panes ─────────────────────────────────────────────────────── */

.dir-body[b-ywzq98llk9] {
	display: flex;
	flex: 1;
	min-height: 0;
}

.dir-pane[b-ywzq98llk9] {
	flex: 1 1 50%;
	min-width: 0;
	min-height: 0;
	display: flex;
	flex-direction: column;
}

.dir-divider[b-ywzq98llk9] {
	width: 1px;
	flex-shrink: 0;
	background: #1E293B17;
}

.dir-map-area[b-ywzq98llk9] {
	position: relative;
	flex: 1;
	min-height: 0;
}

	/* Cascade full height into the WMMap wrapper chain, as DrawingToolModal does. */
	.dir-map-area[b-ywzq98llk9]  .wm-map-wrapper,
	.dir-map-area[b-ywzq98llk9]  .wm-map-wrapper > div {
		height: 100%;
	}

.dir-map-overlay[b-ywzq98llk9] {
	position: absolute;
	inset: 0;
	z-index: 5;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 10px;
	background: rgba(255,255,255,0.75);
	color: #0D6EFD;
}

.dir-map-overlay-text[b-ywzq98llk9] {
	font-size: 13px;
	font-weight: 600;
	color: #475569;
}

/* ── Draw toolbar, over the map ──────────────────────────────────────────── */

.dir-toolbar-wrap[b-ywzq98llk9] {
	position: absolute;
	top: 10px;
	left: 10px;
	right: 56px;
	z-index: 4;
	display: flex;
	flex-direction: column;
	gap: 6px;
	align-items: flex-start;
	pointer-events: none;
}

	.dir-toolbar-wrap > *[b-ywzq98llk9] {
		pointer-events: auto;
	}

.dir-toolbar[b-ywzq98llk9] {
	display: flex;
	flex-wrap: nowrap;
	padding: 6px;
	background: #FFFFFF;
	border-radius: 12px;
	max-width: 100%;
	gap: 6px;
	align-items: center;
	border: 1px solid #1E293B17;
	box-shadow: 0 1px 4px rgba(30,41,59,0.10);
}

.dir-toolbar-tools[b-ywzq98llk9] {
	display: flex;
	flex-wrap: nowrap;
	gap: 6px;
	align-items: center;
	min-width: 0;
	overflow-x: auto;
	scrollbar-width: thin;
}

	.dir-toolbar-tools[b-ywzq98llk9]::-webkit-scrollbar {
		display: none;
	}

.dir-tool-btn[b-ywzq98llk9] {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 34px;
	height: 34px;
	flex-shrink: 0;
	border-radius: 8px;
	background: transparent;
	border: 1px solid transparent;
	color: #475569;
	cursor: pointer;
	transition: background .15s, border-color .15s, box-shadow .15s, color .15s;
}

	.dir-tool-btn:hover:not(:disabled)[b-ywzq98llk9] {
		background: #F1F5F9;
		border-color: #E2E8F0;
	}

	.dir-tool-btn:disabled[b-ywzq98llk9] {
		color: #CBD5E1;
		cursor: not-allowed;
	}

	.dir-tool-btn.dir-tool-btn-active[b-ywzq98llk9] {
		background: #5263FF1F;
		box-shadow: 0 0 0 3px rgba(59,130,246,0.15);
		color: #363AF5;
		border-color: #C7CBFF;
	}

.dir-tool-btn-add[b-ywzq98llk9] {
	color: #363AF5;
}

.dir-tool-btn-delete:not(:disabled):hover[b-ywzq98llk9] {
	background: #FEF2F2;
	color: #B91C1C;
}

.dir-toolbar-divider[b-ywzq98llk9] {
	width: 1px;
	height: 22px;
	flex-shrink: 0;
	background: #E2E8F0;
}

/* Chip + pencil, the pair the drawing tool's own toolbar uses (dtm-chip-wrap). */
.dir-chip-wrap[b-ywzq98llk9] {
	display: flex;
	align-items: center;
	flex-shrink: 0;
	border-radius: 8px;
	background: #F1F5F9CC;
	border: 1px solid #1E293B14;
	transition: background .15s, box-shadow .15s;
}

	.dir-chip-wrap:hover[b-ywzq98llk9] {
		background: #F1F5F9;
	}

	.dir-chip-wrap.dir-chip-wrap-active[b-ywzq98llk9] {
		background: #5263FF1F;
		box-shadow: 0 0 0 3px rgba(59,130,246,0.15);
		border-color: #C7CBFF;
	}

	.dir-chip-wrap.dir-chip-wrap-active .dir-config-chip[b-ywzq98llk9] {
		color: #363AF5;
	}

.dir-config-chip[b-ywzq98llk9] {
	display: flex;
	align-items: center;
	gap: 6px;
	padding: 7px 6px 7px 10px;
	border: none;
	background: transparent;
	border-radius: 8px 0 0 8px;
	font-size: 13px;
	font-weight: 600;
	color: #1E293B;
	letter-spacing: -0.2px;
	line-height: 18px;
	cursor: pointer;
	user-select: none;
	white-space: nowrap;
}

/* Pencil stays out of the way until the chip is hovered, focused or armed. Hover does not
   exist on touch devices, so tapping the chip is the path that reveals it. */
.dir-chip-edit[b-ywzq98llk9] {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 24px;
	height: 32px;
	padding: 0 8px 0 2px;
	border: none;
	background: transparent;
	border-radius: 0 8px 8px 0;
	color: #94A3B8;
	cursor: pointer;
	opacity: 0;
	transition: opacity .15s, color .15s;
}

.dir-chip-wrap:hover .dir-chip-edit[b-ywzq98llk9],
.dir-chip-wrap.dir-chip-wrap-active .dir-chip-edit[b-ywzq98llk9],
.dir-chip-edit:focus-visible[b-ywzq98llk9] {
	opacity: 1;
}

	.dir-chip-edit:hover[b-ywzq98llk9] {
		color: #1E293B;
	}

.dir-chip-dot[b-ywzq98llk9] {
	width: 16px;
	height: 16px;
	border-radius: 50%;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	color: #fff;
	font-size: 9px;
	line-height: 1;
	flex-shrink: 0;
}

.dir-chip-label[b-ywzq98llk9] {
	max-width: 160px;
	overflow: hidden;
	text-overflow: ellipsis;
}

/* The model asked for this tool; it does not exist until the page is confirmed. */
.dir-chip-new[b-ywzq98llk9] {
	padding: 1px 6px;
	border-radius: 20px;
	background: #EEF2FF;
	color: #4338CA;
	font-size: 10px;
	font-weight: 700;
	letter-spacing: 0.2px;
	text-transform: uppercase;
}

/* ── Map hint ────────────────────────────────────────────────────────────── */

.dir-map-hint[b-ywzq98llk9] {
	position: absolute;
	left: 50%;
	bottom: 18px;
	transform: translateX(-50%);
	z-index: 4;
	max-width: 80%;
	padding: 8px 14px;
	border-radius: 10px;
	background: rgba(255,255,255,0.92);
	border: 1px solid #1E293B17;
	box-shadow: 0 8px 24px rgba(30,41,59,0.16);
	font-size: 13px;
	color: #475569;
	text-align: center;
	pointer-events: none;
}

/* ── Footer ──────────────────────────────────────────────────────────────── */

.dir-footer[b-ywzq98llk9] {
	display: flex;
	align-items: center;
	gap: 16px;
	flex-shrink: 0;
	padding: 10px 16px;
	background: #FFFFFF;
	border-top: 1px solid #1E293B17;
}

.dir-footer-status[b-ywzq98llk9] {
	display: flex;
	align-items: center;
	gap: 10px;
	min-width: 0;
}

.dir-status-pill[b-ywzq98llk9] {
	padding: 3px 10px;
	border-radius: 20px;
	background: #F1F5F9;
	font-size: 12px;
	font-weight: 600;
	color: #475569;
	white-space: nowrap;
}

.dir-status-error[b-ywzq98llk9] {
	font-size: 12px;
	color: #B91C1C;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.dir-status-remaining[b-ywzq98llk9] {
	font-size: 12px;
	color: #5F6E85;
	white-space: nowrap;
}

.dir-footer-actions[b-ywzq98llk9] {
	display: flex;
	align-items: center;
	gap: 8px;
	margin-left: auto;
}

/* ── Summary card ────────────────────────────────────────────────────────── */

.dir-summary[b-ywzq98llk9] {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 12px;
	padding: 32px 40px;
	background: #FFFFFF;
	border: 1px solid #1E293B17;
	border-radius: 16px;
	box-shadow: 0 8px 24px rgba(30,41,59,0.08);
	text-align: center;
}

.dir-summary-title[b-ywzq98llk9] {
	font-size: 18px;
	font-weight: 700;
	color: #1E293B;
}

.dir-summary-text[b-ywzq98llk9] {
	font-size: 13px;
	color: #5F6E85;
	max-width: 380px;
}

.dir-summary-counts[b-ywzq98llk9] {
	display: flex;
	gap: 24px;
	margin: 8px 0 4px;
}

.dir-summary-count[b-ywzq98llk9] {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 2px;
}

.dir-summary-number[b-ywzq98llk9] {
	font-size: 22px;
	font-weight: 700;
	color: #1E293B;
	font-variant-numeric: tabular-nums;
}

.dir-summary-label[b-ywzq98llk9] {
	font-size: 12px;
	color: #5F6E85;
}

/* ── Retrace hint ────────────────────────────────────────────────────────── */

.dir-retrace-input[b-ywzq98llk9] {
	width: 100%;
	padding: 10px 12px;
	border-radius: 8px;
	border: 1px solid #E2E8F0;
	font-size: 14px;
	color: #1E293B;
	resize: vertical;
	outline: none;
}

	.dir-retrace-input:focus[b-ywzq98llk9] {
		border-color: #5263FF;
	}

/* ── Narrow screens: stack the panes ─────────────────────────────────────── */

@media (max-width: 1100px) {
	.dir-body[b-ywzq98llk9] {
		flex-direction: column;
	}

	.dir-divider[b-ywzq98llk9] {
		width: auto;
		height: 1px;
	}

	.dir-header[b-ywzq98llk9] {
		flex-wrap: wrap;
	}

	.dir-match[b-ywzq98llk9] {
		margin-left: 0;
	}
}

/* ── Add / edit tool popover and caption editor ──
   The drawing tool's own form (dtm-tool-form), rule for rule: the review is the same toolbar in
   a different frame, and scoped CSS does not cross components. ── */
.dir-tool-form[b-ywzq98llk9] {
	display: flex;
	flex-direction: column;
	gap: 12px;
	width: 320px;
	padding: 16px;
	background: #FFFFFF;
	border-radius: 12px;
	box-shadow: 0 8px 24px rgba(30,41,59,0.16);
}

.dir-tool-form-title[b-ywzq98llk9] {
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.6px;
	text-transform: uppercase;
	color: #5F6E85;
}

/* The tenant's other tools, above the form. Scrolls on its own so the colour and icon pickers
   below it are never inside an overflow box that would clip their popovers. */
.dir-tool-existing[b-ywzq98llk9] {
	max-height: 148px;
	overflow-y: auto;
	margin: -4px 0 4px;
	border-bottom: 1px solid #E2E8F0;
	padding-bottom: 8px;
}

.dir-tool-input[b-ywzq98llk9] {
	height: 40px;
	padding: 0 12px;
	border-radius: 8px;
	border: 1.5px solid #5263FF;
	font-size: 14px;
	color: #1E293B;
	outline: none;
}

.dir-tool-textarea[b-ywzq98llk9] {
	resize: vertical;
	min-height: 64px;
	line-height: 18px;
	padding: 8px 12px;
	height: auto;
}

.dir-tool-hint[b-ywzq98llk9] {
	margin-top: -8px;
	font-size: 11px;
	color: #64748B;
}

.dir-tool-form-row[b-ywzq98llk9] {
	display: flex;
	align-items: center;
	gap: 10px;
}

.dir-type-segmented[b-ywzq98llk9] {
	display: flex;
	flex: 1;
	padding: 3px;
	gap: 2px;
	border-radius: 8px;
	border: 1px solid #E2E8F0;
	background: #F8FAFC;
}

.dir-type-option[b-ywzq98llk9] {
	flex: 1;
	padding: 6px 4px;
	border: none;
	border-radius: 6px;
	background: transparent;
	font-size: 13px;
	font-weight: 600;
	color: #5F6E85;
	cursor: pointer;
	transition: background .15s, color .15s;
}

	.dir-type-option:hover[b-ywzq98llk9] {
		color: #1E293B;
	}

	.dir-type-option.dir-type-option-active[b-ywzq98llk9] {
		background: #FFFFFF;
		color: #363AF5;
		box-shadow: 0 1px 2px rgba(30,41,59,0.10);
	}

.dir-tool-form-actions[b-ywzq98llk9] {
	display: flex;
	justify-content: flex-end;
	gap: 8px;
}

/* Delete sits away from Cancel and Save: it is not the same kind of answer. */
.dir-tool-delete[b-ywzq98llk9] {
	margin-right: auto;
}
/* /Pages/Locations/LocationDrawingEditor.razor.rz.scp.css */
/* The page is the editor; there is nothing else on it. */
.lde-message[b-tbg32510nq] {
	position: fixed;
	inset: 0;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 16px;
	color: #0D6EFD;
	background: #ffffff;
}
/* /Pages/Locations/Locations.razor.rz.scp.css */
.locations-secondary-button[b-85aj0n1k0h] {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    text-align: center !important;
    gap: 2px !important;
    padding: 8px 10px !important;
    /* border: 1px #1E293B17 solid !important; */
    border: none !important;
    border-radius: 10px !important;
    outline: none !important;
    height: 40px !important;
    width: max-content !important;
    background: linear-gradient(var(--purple), var(--purple)) padding-box, linear-gradient(90deg, #1E293B17, #1E293B2E) border-box !important;
    backdrop-filter: blur(24px) !important;
    box-shadow: 0px 1px 1px -0.5px #1E293B08, 0px 3px 3px 0px #FFFFFF1F inset !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    line-height: 24px !important;
    letter-spacing: -0.2px !important;
}

.locations-secondary-button[b-85aj0n1k0h] {
    border: 1px solid #1E293B0F !important;
    background: #F1F5F9CC !important;
    color: var(--dark-txt) !important;
}

    .locations-secondary-button img[b-85aj0n1k0h] {
        height: 18px !important;
    }

    .locations-secondary-button p[b-85aj0n1k0h],
    .locations-secondary-button text[b-85aj0n1k0h] {
        font-size: 13px !important;
        font-weight: 600 !important;
        line-height: 24px !important;
        letter-spacing: -0.2px !important;
        color: var(--dark-txt) !important;
        padding: 0 4px !important;
    }

    .locations-secondary-button:hover[b-85aj0n1k0h]{
        opacity: 0.8 !important;
    }

    .locations-secondary-button:disabled[b-85aj0n1k0h] {
        opacity: 0.6 !important;
        cursor: not-allowed !important;
    }

.baggee.grey-rounded[b-85aj0n1k0h] {
    padding: 4px 8px;
    background-color: #F1F5F9CC;
    border-radius: 8px;
    font-size: 13px;
    font-weight: 600;
    line-height: 20px;
    letter-spacing: -0.2px;
    color: var(--gray-txt);
}

.missing-cost[b-85aj0n1k0h],
.missing-contractor[b-85aj0n1k0h] {
    font-size: 13px;
    font-weight: 600;
    line-height: 20px;
    letter-spacing: -0.2px;
    color: #B82213;
}

.contractor-text[b-85aj0n1k0h] {
    font-size: 13px;
    font-weight: 800;
    line-height: 20px;
    letter-spacing: -0.2px;
    color: var(--dark-txt);
}

.locations-table td[b-85aj0n1k0h] {
    overflow-wrap: anywhere;
    word-break: normal;
}
/* The Filters button sits outside .main-title, so the shared title-bar button rule
   does not reach it. Match that scale (32px / 12px / 8px radius) explicitly. */
#location-filter-btn[b-85aj0n1k0h] {
    height: 32px;
    padding: 4px 8px;
    border-radius: 8px;
    font-size: 12px;
    line-height: 16px;
}

.loc-state-chip[b-85aj0n1k0h] {
    border-radius: 8px;
    display: inline-flex;
    font-size: 11px;
    font-weight: 700;
    line-height: 16px;
    margin-left: 6px;
    padding: 1px 7px;
    vertical-align: middle;
    white-space: nowrap;
}

.loc-state-chip.inactive[b-85aj0n1k0h] {
    background: #fee2e2;
    color: #b91c1c;
}

.loc-state-chip.scheduled[b-85aj0n1k0h] {
    background: #fef3c7;
    color: #92400e;
}

/* Small marker in the price column for addresses that carry rules. Same chip
   language as .loc-state-chip / .baggee, sky-toned so it stays quieter than
   the green price chips beside it. */
.rule-chip-row[b-85aj0n1k0h] {
    padding-bottom: 5px;
}

.rule-chip[b-85aj0n1k0h] {
    background: #06B1F11F;
    color: var(--sky);
    border-radius: 8px;
    display: inline-flex;
    font-size: 11px;
    font-weight: 700;
    line-height: 16px;
    padding: 1px 7px;
    white-space: nowrap;
    cursor: help;
    outline: none;
}

/* The chip is focusable so the hover card is reachable by keyboard; the ring is the only
   visible change, the card itself opens beside it. */
.rule-chip:focus-visible[b-85aj0n1k0h] {
    box-shadow: 0 0 0 2px #06B1F166;
}

/* The daily map lookup gave up on this address: amber like the "scheduled" chip, icon only,
   the sentence is its tooltip. */
.loc-coordinates-warning[b-85aj0n1k0h] {
    color: #b45309;
    cursor: help;
    display: inline-flex;
    font-size: 13px;
    line-height: 16px;
    margin-left: 6px;
    vertical-align: middle;
}
/* /Pages/Locations/StreetRunScrubber.razor.rz.scp.css */
/* In the slider: a panel under the passes table. Docked: a floating bar along the bottom of
   the map, the live map's shape, so the run stays scrubbable once the answer is put away. */
.srs[b-nwnumhnw4e] {
    padding: 10px 12px;
    border: 1px solid #E2E8F0;
    border-radius: 8px;
    background: #F8FAFC;
}

.srs-docked[b-nwnumhnw4e] {
    position: absolute;
    left: 16px;
    right: 16px;
    bottom: 16px;
    z-index: 3;
    border-color: #CBD5E1;
    background: rgba(255, 255, 255, 0.96);
    box-shadow: 0 6px 20px rgba(15, 23, 42, 0.18);
}

.srs-driver[b-nwnumhnw4e] {
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
    font-size: 13px;
    font-weight: 600;
    color: #1E293B;
}

.srs-swatch[b-nwnumhnw4e] {
    flex-shrink: 0;
    width: 8px;
    height: 8px;
    border-radius: 3px;
    background: #2563EB;
}

.srs-name[b-nwnumhnw4e] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.srs-span[b-nwnumhnw4e] {
    margin-left: auto;
    white-space: nowrap;
    font-size: 12px;
    font-weight: 400;
    color: #5F6E85;
    font-variant-numeric: tabular-nums;
}

.srs-short[b-nwnumhnw4e] {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-top: 6px;
    font-size: 12px;
    color: #B45309;
}

.srs-row[b-nwnumhnw4e] {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 8px;
    /* The support widget floats over the bottom right corner of the viewport, which is where
       this row ends in both homes. The clock is what has to stay readable while dragging. */
    padding-right: 44px;
}

.srs-track[b-nwnumhnw4e] {
    flex: 1;
    display: flex;
    min-width: 0;
}

.srs-slider[b-nwnumhnw4e] {
    flex: 1;
    min-width: 0;
    height: 4px;
    margin: 0;
    cursor: pointer;
    accent-color: #2563EB;
}

.srs-end[b-nwnumhnw4e] {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    border: none;
    border-radius: 99px;
    padding: 3px 8px;
    background: #F1F5F9;
    color: #475569;
    font-size: 12px;
    cursor: pointer;
}

.srs-end:hover[b-nwnumhnw4e] {
    background: #E2E8F0;
}

.srs-time[b-nwnumhnw4e] {
    flex-shrink: 0;
    min-width: 62px;
    text-align: right;
    font-size: 12px;
    font-weight: 600;
    color: #1E293B;
    font-variant-numeric: tabular-nums;
}
/* /Pages/Locations/Streets.razor.rz.scp.css */
/* Street history: the map IS the page. It fills everything under the title bar and carries
   nothing but the search box; the question and the answer arrive together, in a panel that
   floats in from the right over the passes it describes. */

.street-history .main-content[b-zqkzzfer8p] {
    display: flex;
    flex-direction: column;
    min-height: 0;
}

.sh-intro[b-zqkzzfer8p] {
    margin: 4px 0 0;
    font-size: 13px;
    color: #6B7280;
    max-width: 720px;
}

/* The stage the map fills and everything else floats over. `.wm-fixed-page .main-content > *`
   pins every direct child to its natural height, so this one says otherwise loudly enough. */
.street-history .main-content .sh-stage[b-zqkzzfer8p] {
    position: relative;
    flex: 1 1 auto;
    min-height: 0;
    margin-top: 12px;
    border-radius: 12px;
    border: 1px solid #E5E7EB;
    overflow: hidden;
}

.sh-map[b-zqkzzfer8p] {
    position: absolute;
    inset: 0;
    overflow: hidden;
}

/* WMMap's wrapper chain is height:auto by default and its container asks for 100% of it, so
   without this the map measures zero, mapbox keeps its 400x300 fallback canvas and the page
   shows an empty grey box with the controls floating at the top of it. Every full-height map
   in the app hands the height down the same way (.zm-map-area, .rrb-map-area). */
.sh-map[b-zqkzzfer8p]  .wm-map-wrapper,
.sh-map[b-zqkzzfer8p]  .wm-map-wrapper > div {
    height: 100%;
}

.sh-map[b-zqkzzfer8p]  .wm-map-container {
    border-radius: 0;
}

/* The search box sits clear of the zoom controls, top-left like the route builder's. */
[b-zqkzzfer8p] .sh-map-search {
    position: absolute;
    top: 12px;
    left: 12px;
    z-index: 5;
    width: min(320px, calc(100% - 24px));
}

/* ── The question's fields, stacked in the slider ─────────────────────────── */

.sh-fields[b-zqkzzfer8p] {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.sh-field[b-zqkzzfer8p] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.sh-label[b-zqkzzfer8p] {
    font-size: 11px;
    font-weight: 600;
    color: #374151;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 6px;
}

.sh-label i[b-zqkzzfer8p] {
    color: #9CA3AF;
    font-size: 11px;
}

.sh-incident[b-zqkzzfer8p] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.sh-date[b-zqkzzfer8p] {
    flex: 1 1 auto;
    min-width: 0;
    height: 38px;
    border: 1px solid #D1D5DB;
    border-radius: 8px;
    padding: 0 10px;
    font-size: 13px;
}

.sh-clear[b-zqkzzfer8p] {
    border: none;
    background: transparent;
    color: #6B7280;
    padding: 4px;
    line-height: 1;
    cursor: pointer;
}

/* ── Map overlays ─────────────────────────────────────────────────────────── */

/* Top-right, clear of the map's own control column. */
.sh-load-roads[b-zqkzzfer8p] {
    position: absolute;
    top: 12px;
    right: 68px;
    z-index: 5;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    height: 38px;
    padding: 0 12px;
    border-radius: 10px;
    border: 1px solid #E2E8F0;
    background: rgba(255, 255, 255, 0.96);
    backdrop-filter: blur(8px);
    box-shadow: 0 2px 8px rgba(30, 41, 59, 0.08);
    font-size: 13px;
    font-weight: 600;
    color: #1E293B;
    white-space: nowrap;
    cursor: pointer;
}

.sh-load-roads:disabled[b-zqkzzfer8p] {
    opacity: 0.6;
    cursor: default;
}

/* The one instruction the page has, centred along the bottom so it never lands on mapbox's
   own corners: the scale bar and the logo on the left, the attribution on the right. */
.sh-hint[b-zqkzzfer8p] {
    position: absolute;
    bottom: 12px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 5;
    display: flex;
    align-items: center;
    gap: 8px;
    background: rgba(17, 24, 39, 0.82);
    color: #FFF;
    border-radius: 999px;
    padding: 6px 14px;
    font-size: 12px;
}

/* ── The answer: a slider over the map ───────────────────────────────────── */

/* Same shape as the dispatch and route detail sliders (in from the right, its own header),
   but floating ON the map rather than docked into the page: it takes no width from the map,
   which keeps its full size and stays live underneath, so the passes are visible behind it
   and another street can be picked with it open. */
.sh-slider[b-zqkzzfer8p] {
    position: absolute;
    top: 12px;
    right: 12px;
    bottom: 12px;
    z-index: 20;
    width: min(620px, calc(100% - 24px));
    display: flex;
    flex-direction: column;
    background: #FFF;
    border: 1px solid #E5E7EB;
    border-radius: 16px;
    box-shadow: 0 18px 48px rgba(15, 23, 42, 0.18);
    overflow: hidden;
    transform: translateX(calc(100% + 24px));
    transition: transform 0.3s ease-out;
    visibility: hidden;
}

.sh-slider-open[b-zqkzzfer8p] {
    transform: translateX(0);
    visibility: visible;
}

.sh-slider-header[b-zqkzzfer8p] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    padding: 14px 16px;
    border-bottom: 1px solid #F1F5F9;
    flex-shrink: 0;
}

.sh-slider-heading[b-zqkzzfer8p] {
    min-width: 0;
}

.sh-street-name[b-zqkzzfer8p] {
    font-size: 18px;
    font-weight: 800;
    color: #1E293B;
    letter-spacing: -0.2px;
    word-break: break-word;
}

.sh-street-meta[b-zqkzzfer8p] {
    font-size: 12px;
    color: #6B7280;
    margin-top: 2px;
}

.sh-slider-actions[b-zqkzzfer8p] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}

.sh-export[b-zqkzzfer8p] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    white-space: nowrap;
}

.sh-slider-close[b-zqkzzfer8p] {
    width: 36px;
    height: 36px;
    border-radius: 8px;
    border: 1px solid #E2E8F0;
    background: #F8FAFC;
    color: #475569;
    cursor: pointer;
}

.sh-slider-body[b-zqkzzfer8p] {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    padding: 12px 16px 20px;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.sh-loading[b-zqkzzfer8p] {
    display: flex;
    justify-content: center;
    padding: 24px 0;
}

.sh-headline[b-zqkzzfer8p] {
    border: 1px solid #E5E7EB;
    border-radius: 12px;
    padding: 12px 14px;
}

.sh-headline-main[b-zqkzzfer8p] {
    font-size: 14px;
}

.sh-headline-sub[b-zqkzzfer8p] {
    font-size: 12px;
    color: #6B7280;
    margin-top: 4px;
}

.sh-empty[b-zqkzzfer8p] {
    border: 1px dashed #D1D5DB;
    border-radius: 12px;
    padding: 20px 14px;
    text-align: center;
    font-size: 13px;
    color: #6B7280;
}

.sh-table-wrap[b-zqkzzfer8p] {
    overflow-x: auto;
    border: 1px solid #E5E7EB;
    border-radius: 12px;
}

.sh-table[b-zqkzzfer8p] {
    width: 100%;
    border-collapse: collapse;
    font-size: 12px;
    white-space: nowrap;
}

.sh-table th[b-zqkzzfer8p] {
    text-align: left;
    font-weight: 600;
    color: #374151;
    background: #F9FAFB;
    padding: 8px 10px;
    border-bottom: 1px solid #E5E7EB;
}

.sh-table td[b-zqkzzfer8p] {
    padding: 8px 10px;
    border-bottom: 1px solid #F3F4F6;
}

.sh-table tbody tr[b-zqkzzfer8p] {
    cursor: pointer;
}

.sh-table tbody tr:hover[b-zqkzzfer8p] {
    background: #F9FAFB;
}

.sh-withheld[b-zqkzzfer8p] {
    font-style: italic;
    color: #6B7280;
}

.sh-chip[b-zqkzzfer8p] {
    display: inline-block;
    border-radius: 999px;
    padding: 1px 8px;
    font-size: 10px;
    font-weight: 600;
    margin-right: 4px;
}

.sh-chip-inferred[b-zqkzzfer8p] {
    background: #EEF2FF;
    color: #4338CA;
}

/* The row whose driver's run is drawn on the map. Stronger than the hover it replaces, so
   it is obvious which of several passes the faint blue line behind belongs to. */
.sh-table tbody tr.sh-row-open td[b-zqkzzfer8p] {
    background: #EFF6FF;
    font-weight: 600;
    color: #1E3A8A;
}

.sh-table tbody tr.sh-row-open td:first-child[b-zqkzzfer8p] {
    box-shadow: inset 3px 0 0 #1D4ED8;
}


/* The run that outlived its street: a tag over the map naming the evening it belongs to. */
.sh-run-tag[b-zqkzzfer8p] {
    position: absolute;
    top: 16px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 3;
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 6px 8px 6px 12px;
    border: 1px solid #CBD5E1;
    border-radius: 99px;
    background: rgba(255, 255, 255, 0.96);
    box-shadow: 0 6px 20px rgba(15, 23, 42, 0.18);
    font-size: 13px;
    font-weight: 600;
    color: #1E293B;
    white-space: nowrap;
}

.sh-run-swatch[b-zqkzzfer8p] {
    width: 8px;
    height: 8px;
    border-radius: 3px;
    background: #2563EB;
}

.sh-run-clear[b-zqkzzfer8p] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    border: none;
    border-radius: 50%;
    background: #F1F5F9;
    color: #475569;
    font-size: 11px;
    cursor: pointer;
}

.sh-run-clear:hover[b-zqkzzfer8p] {
    background: #E2E8F0;
}
/* /Pages/Messages/Components/ChatSidebar.razor.rz.scp.css */
.chat-sidebar[b-jzq95fvmzo] {
    width: 350px;
    min-width: 310px;
    border-right: 1px solid #1E293B0F;
    display: flex;
    flex-direction: column;
    background-color: var(--white);
}

.chat-search-bar-wrapper[b-jzq95fvmzo] {
    display: flex;
    gap: 12px;
    align-items: center;
    padding: 16px;
    height: 72px;
    box-sizing: border-box;
    border-bottom: 1px solid #1E293B0F;
}

.chat-compose-btn[b-jzq95fvmzo] {
    width: 36px;
    height: 36px;
    border-radius: 10px;
    border: 1px solid #1E293B17;
    background: #F1F5F9CC;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.2s ease;
    flex-shrink: 0;
    box-shadow: 0 1.5px 2px 0.5px rgba(0, 0, 0, 0.06);
}

.chat-compose-btn:hover[b-jzq95fvmzo] {
    background: var(--l-purple);
    border-color: var(--purple);
}

.chat-compose-btn:active[b-jzq95fvmzo] {
    transform: scale(0.96);
}

.chat-search-input-container[b-jzq95fvmzo] {
    flex: 1;
    min-width: 0;
}

.chat-rooms-list[b-jzq95fvmzo] {
    flex: 1;
    overflow-y: auto;
}

.chat-room-item[b-jzq95fvmzo] {
    height: 68px;
    display: flex;
    gap: 12px;
    padding: 12px 16px;
    border-bottom: 1px solid #1E293B0F;
    cursor: pointer;
    transition: background-color 0.15s ease;
}

.chat-room-item:hover[b-jzq95fvmzo] {
    background-color: #5263FF1F;
}

.chat-room-item.active[b-jzq95fvmzo] {
    background-color: #F1F5F9CC;
}

.room-avatar-container[b-jzq95fvmzo] {
    display: flex;
    align-items: center;
}

.room-avatar[b-jzq95fvmzo] {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background-color: #F1F5F9;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #1E293B0F;
    flex-shrink: 0;
}

.room-avatar img[b-jzq95fvmzo] {
    height: 20px;
    width: 20px;
}

.room-details[b-jzq95fvmzo] {
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 2px;
    min-width: 0;
}

.room-header-row[b-jzq95fvmzo] {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 8px;
}

.room-name[b-jzq95fvmzo] {
    font-size: 13px;
    font-weight: 800;
    line-height: 20px;
    letter-spacing: -0.2px;
    color: var(--dark-txt);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.room-time[b-jzq95fvmzo] {
    font-size: 12px;
    font-weight: 600;
    line-height: 16px;
    letter-spacing: -0.2px;
    color: var(--gray-txt-2);
    flex-shrink: 0;
}

.room-message-row[b-jzq95fvmzo] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 8px;
}

.room-last-msg[b-jzq95fvmzo] {
    font-size: 12px;
    font-weight: 600;
    line-height: 16px;
    letter-spacing: -0.2px;
    color: var(--gray-txt);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.room-badge[b-jzq95fvmzo] {
    background-color: var(--badge-orange);
    color: var(--white);
    font-size: 10px;
    font-weight: 600;
    line-height: 16px;
    letter-spacing: -0.2px;
    border-radius: 50px;
    min-width: 18px;
    height: 18px;
    padding: 0 5px;
    flex-shrink: 0;
}
/* /Pages/Messages/Components/ChatWindow.razor.rz.scp.css */
.chat-window[b-s71retcyey] {
    flex: 1;
    display: flex;
    flex-direction: column;
    background-color: #F8FAFC;
    overflow: hidden;
    position: relative;
}

.chat-window-header[b-s71retcyey] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 16px 20px;
    height: 72px;
    box-sizing: border-box;
    background-color: var(--white);
    border-bottom: 1px solid #1E293B0F;
}

.active-room-info[b-s71retcyey] {
    display: flex;
    align-items: center;
    gap: 12px;
}

/* Back button: only shown in the mobile full-page-swap layout. */
.chat-back-btn[b-s71retcyey] {
    display: none;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border: none;
    border-radius: 8px;
    background: transparent;
    color: var(--dark-txt);
    cursor: pointer;
    flex-shrink: 0;
    transition: background 0.12s;
}

.chat-back-btn:hover[b-s71retcyey] {
    background: #f1f5f9;
}

.chat-back-btn:active[b-s71retcyey] {
    transform: scale(0.94);
}

.active-room-avatar[b-s71retcyey] {
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background-color: #F1F5F9;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #1E293B0F;
}

.active-room-avatar img[b-s71retcyey] {
    height: 20px;
    width: 20px;
}

.active-room-name[b-s71retcyey] {
    font-size: 15px;
    font-weight: 600;
    line-height: 24px;
    letter-spacing: -0.2px;
    color: var(--dark-txt);
}

.chat-options-btn[b-s71retcyey] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border: none;
    border-radius: 6px;
    background: transparent;
    cursor: pointer;
    transition: background 0.12s, transform 0.2s;
    flex-shrink: 0;
}

.chat-options-btn:hover[b-s71retcyey] {
    background: #f1f5f9;
}

.chat-messages-container[b-s71retcyey] {
    flex: 1;
    overflow-y: auto;
    padding: 24px;
    display: flex;
    flex-direction: column;
    gap: 16px;
    -ms-overflow-style: none;  /* IE and Edge */
    scrollbar-width: none;  /* Firefox */
}

.chat-messages-container[b-s71retcyey]::-webkit-scrollbar {
    display: none; /* Chrome, Safari and Opera */
}

.message-bubble-row[b-s71retcyey] {
    display: flex;
    flex-direction: column;
    max-width: 500px;
}

.message-bubble-row.outgoing[b-s71retcyey] {
    align-self: flex-end;
    align-items: flex-end;
}

.message-bubble-row.incoming[b-s71retcyey] {
    align-self: flex-start;
    align-items: flex-start;
}

.message-bubble[b-s71retcyey] {
    padding: 16px;
    border-radius: 20px;
    box-shadow:
        0px 20px 20px -12px #1E293B08,
        0px 3px 3px -1.5px #1E293B08;
}

.message-bubble-row.outgoing .message-bubble[b-s71retcyey] {
    background-color: #5263FF;
    color: var(--white);
    border-bottom-right-radius: 0;
}

.message-bubble-row.incoming .message-bubble[b-s71retcyey] {
    background-color: #FFFFFF;
    color: var(--dark-txt);
    border: 1px solid #1E293B0F;
    border-bottom-left-radius: 0;
}

.message-text[b-s71retcyey] {
    font-size: 13px;
    font-weight: 600;
    line-height: 20px;
    letter-spacing: -0.2px;
    white-space: pre-wrap;
    word-break: break-word;
}

.message-meta[b-s71retcyey] {
    font-size: 12px;
    font-weight: 600;
    line-height: 16px;
    letter-spacing: -0.2px;
    color: var(--gray-txt-2);
    margin-top: 4px;
}

.chat-new-divider[b-s71retcyey] {
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 8px 0;
    position: relative;
}

.chat-new-divider[b-s71retcyey]::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 50%;
    height: 1px;
    background-color: #ED40301F;
}

.divider-text[b-s71retcyey] {
    background-color: #F8FAFC;
    padding: 0 12px;
    position: relative;
    z-index: 2;
    font-size: 12px;
    font-weight: 600;
    line-height: 16px;
    letter-spacing: -0.2px;
    color: var(--orange);
}

.chat-input-bar[b-s71retcyey] {
    min-height: 80px;
    height: auto;
    padding: 16px 20px;
    background-color: var(--white);
    border-top: 1px solid #1E293B0F;
}

.chat-input-wrapper[b-s71retcyey] {
    display: flex;
    align-items: flex-end;
    gap: 8px;
    background-color: var(--white);
    border: 1px solid #1E293B1F;
    border-radius: 12px;
    padding: 4px 4px 4px 16px;
    box-shadow:
        0px 3px 3px -1.5px #1E293B08,
        0px 1px 1px -0.5px #1E293B08;
    transition: all 0.2s ease;
}

.chat-input-wrapper:focus-within[b-s71retcyey] {
    box-shadow: 0 0 0 0.2rem #dce0ff;
}

.grow-wrap[b-s71retcyey] {
    display: grid;
    flex: 1;
}

.grow-wrap .mirror-text[b-s71retcyey],
.grow-wrap textarea[b-s71retcyey] {
    grid-area: 1 / 1 / 2 / 2;
    font-size: 13px;
    font-weight: 600;
    line-height: 18px;
    letter-spacing: -0.2px;
    padding: 11px 0;
    font-family: inherit;
    box-sizing: border-box;
    word-break: break-word;
    white-space: pre-wrap;
}

.grow-wrap .mirror-text[b-s71retcyey] {
    visibility: hidden;
    min-height: 40px;
    max-height: 120px;
    overflow: hidden;
}

.grow-wrap textarea[b-s71retcyey] {
    border: none;
    background: transparent;
    outline: none;
    color: var(--gray-txt);
    resize: none;
    min-height: 40px;
    max-height: 120px;
    overflow-y: auto;
    -ms-overflow-style: none;  /* IE and Edge */
    scrollbar-width: none;  /* Firefox */
}

.grow-wrap textarea[b-s71retcyey]::-webkit-scrollbar {
    display: none; /* Chrome, Safari and Opera */
}

.chat-input-wrapper textarea[b-s71retcyey]::placeholder {
    color: #5F6E85;
    font-weight: 600;
}

.btn-wm-secondary[b-s71retcyey] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    height: 40px;
    padding: 8px 14px;
    min-width: 81px;
    background: linear-gradient(var(--purple), var(--purple)) padding-box,
        linear-gradient(180deg, rgba(30, 41, 59, 0.09), rgba(30, 41, 59, 0.18)) border-box;
    border: 1px transparent solid;
    border-radius: 10px;
    color: var(--white);
    font-size: 13px;
    font-weight: 600;
    line-height: 24px;
    letter-spacing: -0.2px;
    cursor: pointer;
    transition: all 0.2s ease;
    box-shadow:
        0px 1px 1px -0.5px rgba(30, 41, 59, 0.03),
        0px 3px 3px 0px rgba(255, 255, 255, 0.12) inset;
}

.btn-wm-secondary svg path[b-s71retcyey] {
    fill: var(--white);
}

.btn-wm-secondary:disabled[b-s71retcyey],
.btn-wm-secondary.disabled[b-s71retcyey] {
    background: linear-gradient(#94A3BB, #94A3BB) padding-box,
        linear-gradient(180deg, rgba(30, 41, 59, 0.09), rgba(30, 41, 59, 0.18)) border-box !important;
    color: var(--white) !important;
    opacity: 1 !important;
    cursor: not-allowed;
    box-shadow: none;
}

.btn-wm-secondary:not(:disabled):not(.disabled):hover[b-s71retcyey] {
    opacity: 0.9;
    background: linear-gradient(var(--purple), var(--purple)) padding-box,
        linear-gradient(180deg, rgba(30, 41, 59, 0.09), rgba(30, 41, 59, 0.18)) border-box !important;
    color: var(--white) !important;
}

.no-chat-selected[b-s71retcyey] {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 40px;
    text-align: center;
}

.no-chat-selected p[b-s71retcyey] {
    font-size: 13px;
    font-weight: 600;
    line-height: 18px;
    letter-spacing: -0.2px;
    color: var(--gray-txt-2);
    margin-top: 8px;
}

@media (max-width: 768px) {
    .chat-back-btn[b-s71retcyey] {
        display: flex;
    }

    .chat-messages-container[b-s71retcyey] {
        padding: 16px;
    }
}

.chat-day-divider[b-s71retcyey] {
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 16px 0;
}

.day-divider-text[b-s71retcyey] {
    background-color: #E2E8F0;
    color: #475569;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 11px;
    font-weight: 600;
    line-height: 14px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
}

.floating-chat-date-header[b-s71retcyey] {
    position: absolute;
    top: 80px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 100;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.5s ease-out, visibility 0.5s ease-out;
    pointer-events: none;
}

.floating-chat-date-header.visible[b-s71retcyey] {
    opacity: 1;
    visibility: visible;
    transition: opacity 0.15s ease-in, visibility 0.15s ease-in;
}

.floating-chat-date-header span[b-s71retcyey] {
    background-color: #E2E8F0;
    color: #475569;
    padding: 6px 12px;
    border-radius: 8px;
    font-size: 11px;
    font-weight: 600;
    line-height: 14px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.08);
    display: inline-block;
}
/* /Pages/Messages/Components/NewChatPopup.razor.rz.scp.css */
.new-chat-popup-body[b-3gac26r70y] {
    display: flex;
    flex-direction: column;
}

.toggle-row[b-3gac26r70y] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 12px 20px 12px 20px;
    border-bottom: 1px solid #E8EDF5;
}

    .toggle-row:last-of-type[b-3gac26r70y] {
        margin-bottom: 4px;
    }

.toggle-info[b-3gac26r70y] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    flex: 1;
}

.toggle-label[b-3gac26r70y] {
    font-size: 14px;
    font-weight: 600;
    line-height: 18px;
    color: var(--dark-txt);
}

.toggle-description[b-3gac26r70y] {
    font-size: 12px;
    font-weight: 500;
    line-height: 16px;
    color: var(--gray-txt-2);
}

[b-3gac26r70y] .wm-search-input {
    max-width: 100% !important;
    margin-top: 0;
}

.user-list-container[b-3gac26r70y] {
    display: flex;
    flex-direction: column;
    max-height: 280px;
    overflow-y: auto;
    background: #FFFFFF;
    padding: 0;
    scrollbar-width: thin;
}

.new-chat-user-item[b-3gac26r70y] {
    display: flex;
    align-items: center;
    min-height: 60px;
    padding: 12px 20px 12px 20px;
    cursor: pointer;
    background: #FFFFFF;
    transition: background .15s ease;
    user-select: none;
    border-bottom: 1px solid #EEF2F7;
    background: #F1F5F9;
}

    .new-chat-user-item:last-child[b-3gac26r70y] {
        border-bottom: none;
    }

    .new-chat-user-item:hover[b-3gac26r70y] {
        background: #5263FF1F;
    }

    .new-chat-user-item.selected[b-3gac26r70y] {
        background: #5263FF1F;
    }

    .new-chat-user-item.disabled[b-3gac26r70y] {
        cursor: not-allowed !important;
        opacity: 0.7;
    }

        .new-chat-user-item.disabled:hover[b-3gac26r70y] {
            background: #F1F5F9 !important;
        }

        .new-chat-user-item.disabled.selected:hover[b-3gac26r70y] {
            background: #5263FF1F !important;
        }

.user-avatar-container[b-3gac26r70y] {
    flex-shrink: 0;
}

.user-avatar[b-3gac26r70y] {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: #FFFFFF;
    border: 1px solid #DCE3EE;
    display: flex;
    align-items: center;
    justify-content: center;
}

.user-name[b-3gac26r70y] {
    flex: 1;
    margin-left: 14px;
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;
    color: #1F2A44;
}

.user-list-container[b-3gac26r70y]::-webkit-scrollbar {
    width: 6px;
}

.user-list-container[b-3gac26r70y]::-webkit-scrollbar-track {
    background: transparent;
}

.user-list-container[b-3gac26r70y]::-webkit-scrollbar-thumb {
    background: #CDD5DF;
    border-radius: 20px;
}

.cu-contractors-checkbox[b-3gac26r70y] {
    width: 20px !important;
    height: 20px !important;
    border-radius: 6px !important;
    padding: 2px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    transition: all 0.2s !important;
    background: linear-gradient(180deg, #f1f5f9 0%, #ffffff 100%) !important;
    border: 2.5px solid #d9dee3 !important;
    backdrop-filter: blur(24px) !important;
    box-shadow: 0px 1px 1px -0.5px #1e293b08, 0px 3px 3px 0px #ffffff1f inset !important;
    flex-shrink: 0 !important;
    cursor: pointer;
}

    .cu-contractors-checkbox.checked[b-3gac26r70y] {
        background: linear-gradient(180deg, #5263ff 0%, #5263ff 100%) !important;
        color: white !important;
        backdrop-filter: blur(24px) !important;
        box-shadow: 0px 1px 1px -0.5px #1e293b08, 0px 3px 3px 0px #ffffff1f inset !important;
        border: none !important;
    }

    .cu-contractors-checkbox:disabled[b-3gac26r70y],
    .cu-contractors-checkbox.disabled[b-3gac26r70y] {
        opacity: 0.6;
        cursor: not-allowed;
    }

/* Group Name styling */
.group-name-section[b-3gac26r70y] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 12px 20px 16px 20px;
    border-top: 1px solid #E8EDF5;
    background: #FFFFFF;
}

.group-name-header[b-3gac26r70y] {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.group-name-label[b-3gac26r70y] {
    font-size: 14px;
    font-weight: 600;
    color: var(--dark-txt);
}

.group-name-counter[b-3gac26r70y] {
    font-size: 12px;
    font-weight: 500;
    color: #5F6E85;
}

.group-name-input[b-3gac26r70y] {
    width: 100%;
    padding: 8px 10px;
    background-color: var(--white);
    border: 1px #1E293B1F solid;
    border-radius: 10px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
    outline: none;
    font-size: 13px;
    font-weight: 600;
    line-height: 24px;
    letter-spacing: -0.2px;
    color: var(--dark-txt);
    transition: box-shadow 0.2s ease;
}

    .group-name-input:focus[b-3gac26r70y] {
        box-shadow: 0 0 0 0.2rem #dce0ff;
    }

/* ── Toggle Switch Styling ── */
.toggle-switch[b-3gac26r70y] {
    position: relative;
    display: inline-block;
    width: 46px;
    height: 28px;
    background: linear-gradient(180deg, rgba(226, 232, 240, 1) 0%, rgba(248, 250, 252, 1) 100%);
    border-radius: 50px;
    padding: 3px;
    flex-shrink: 0;
    cursor: pointer;
}

    .toggle-switch input[b-3gac26r70y] {
        opacity: 0;
        width: 0;
        height: 0;
    }

.slider[b-3gac26r70y] {
    position: absolute;
    cursor: pointer;
    border-radius: 30px;
    background-color: #d3dde8;
    transition: 0.3s;
    height: 22px;
    width: 40px;
    top: 3px;
    left: 3px;
}

    .slider[b-3gac26r70y]:before {
        content: "";
        position: absolute;
        height: 18px;
        width: 18px;
        left: 2px;
        top: 2px;
        border-radius: 1000px;
        background: linear-gradient(180deg, #e2e8f0 0%, #ffffff 100%);
        border: 3.5px solid #f9fbfc;
        box-shadow: 0 2px 4px rgba(0, 0, 0, 0.15);
        transition: 0.3s;
    }

.toggle-switch input:checked + .slider[b-3gac26r70y] {
    background: linear-gradient(135deg, #5b67f6, #4c57e0);
}

    .toggle-switch input:checked + .slider[b-3gac26r70y]:before {
        transform: translateX(18px);
        background: #fff;
    }

    .toggle-switch input:checked + .slider[b-3gac26r70y]:after {
        content: "";
        position: absolute;
        right: 5px;
        top: 7.5px;
        width: 11px;
        height: 11px;
        background-image: url("/img/icons/toggle-check-icon.svg");
        background-size: contain;
        background-repeat: no-repeat;
    }
/* /Pages/Messages/Messages.razor.rz.scp.css */
/* Same horizontal inset and max-width as `.main-content .data-left-right`, so
   the chat lines up with the heading above it and with every other page.
   Vertical stays symmetric — this page fills the viewport rather than
   scrolling, so it has no 40px bottom gutter to sit above. */
.chat-page-content[b-9ofig1l85o] {
    width: 100%;
    max-width: 1680px;
    margin: 0 auto;
    padding: 24px var(--wm-page-inset);
    height: calc(100vh - var(--wm-titlebar-min-height));
    box-sizing: border-box;
    display: flex;
}

.chat-container[b-9ofig1l85o] {
    display: flex;
    flex: 1;
    background-color: var(--white);
    border: 1px solid #1E293B0F;
    border-radius: 20px;
    overflow: hidden;
    box-shadow:
        0px 20px 20px -12px #1E293B08,
        0px 3px 3px -1.5px #1E293B08,
        0px 1px 1px -0.5px #1E293B08;
}

/* ── Responsive: full-page swap on small screens ─────────────────────────
   Below the breakpoint each pane fills the full width and only one shows at
   a time: the list by default, the open chat once a room is tapped
   (.mobile-chat-open). Above the breakpoint both panes stay side-by-side. */
@media (max-width: 768px) {
    .chat-page-content[b-9ofig1l85o] {
        padding: 12px var(--wm-page-inset);
    }

    .chat-container[b-9ofig1l85o]  .chat-sidebar {
        width: 100%;
        min-width: 0;
        border-right: none;
    }

    .chat-container[b-9ofig1l85o]  .chat-window {
        display: none;
        width: 100%;
    }

    .chat-container.mobile-chat-open[b-9ofig1l85o]  .chat-sidebar {
        display: none;
    }

    .chat-container.mobile-chat-open[b-9ofig1l85o]  .chat-window {
        display: flex;
    }
}
/* /Pages/Offers/Components/ChooseCustomerForOfferPopup.razor.rz.scp.css */
.tabs-nav-container[b-7xjcqmdrwb] {
    gap: 6px;
    background-color: #ffffff;
    padding: 4px;
    border-radius: 16px;
    display: flex;
    width: 100%;
}

/* Switch tab item button styling */
.tab-item-btn[b-7xjcqmdrwb] {
    flex: 1;
    background-color: transparent;
    border: 1px transparent solid;
    border-radius: 10px;
    font-size: 13px;
    font-weight: 500;
    line-height: 24px;
    letter-spacing: -0.2px;
    color: #5F6E85;
    padding: 6px 10px;
    text-align: center;
    cursor: pointer;
    transition: all 0.2s ease-in-out;
}

    .tab-item-btn:hover[b-7xjcqmdrwb] {
        color: #1e293b;
    }

    .tab-item-btn.active[b-7xjcqmdrwb] {
        background-color: #5263FF1F;
        color: #363AF5;
    }

/* cu-body-wrap styles aligned with Shift Popup details */
.cu-body-wrap[b-7xjcqmdrwb] {
    padding: 20px;
    background: #f1f5f9;
}

.red[b-7xjcqmdrwb] {
    font-size: 13px;
    font-weight: 600;
    line-height: 20px;
    letter-spacing: -0.2px;
    color: var(--orange);
}

.cu-body-wrap label[b-7xjcqmdrwb] {
    font-size: 13px;
    font-weight: 600;
    line-height: 20px;
    letter-spacing: -0.2px;
    color: var(--gray-txt);
    margin-bottom: 4px;
    display: block;
}

    .cu-body-wrap label span[b-7xjcqmdrwb] {
        font-size: 12px;
        font-weight: 500;
        line-height: 16px;
        letter-spacing: -0.2px;
        color: var(--gray-txt-2);
    }

.cu-body-wrap input[b-7xjcqmdrwb], .cu-body-wrap select[b-7xjcqmdrwb] {
    padding: 8px 10px;
    background-color: var(--white);
    border: 1px #1E293B1F solid;
    border-radius: 10px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
    outline: none;
    font-size: 13px;
    font-weight: 600;
    line-height: 24px;
    letter-spacing: -0.2px;
    color: var(--dark-txt);
    width: 100%;
    height: 40px;
    transition: all 0.2s ease;
}

    .cu-body-wrap input:focus[b-7xjcqmdrwb], .cu-body-wrap select:focus[b-7xjcqmdrwb] {
        box-shadow: 0 0 0 0.2rem #dce0ff !important;
    }

/* Custom select dropdown styling with arrow */
.select-field-wrapper[b-7xjcqmdrwb] {
    position: relative;
    width: 100%;
}

.select-field[b-7xjcqmdrwb] {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    padding-right: 40px; /* space for arrow icon */
}

.select-arrow-icon[b-7xjcqmdrwb] {
    position: absolute;
    right: 16px;
    top: 50%;
    transform: translateY(-50%);
    pointer-events: none;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Tax ID CVR wrapper with absolute Find button */
.tax-id-wrapper[b-7xjcqmdrwb] {
    position: relative;
}

    .tax-id-wrapper .find-btn[b-7xjcqmdrwb] {
        position: absolute;
        top: 50%;
        right: 4px;
        transform: translateY(-50%);
        min-width: 56px;
        height: 32px;
        padding: 0 12px;
        font-size: 12px;
        border-radius: 6px;
        font-weight: 700;
        display: inline-flex;
        align-items: center;
        justify-content: center;
    }

/* Align footer gap */
.gap-12[b-7xjcqmdrwb] {
    gap: 12px;
}

/* Phone input group styles from user profile and subcontractor forms */
.phone-group[b-7xjcqmdrwb] {
    width: 100% !important;
    height: fit-content !important;
    display: flex !important;
    align-items: stretch !important;
    border: 1px solid #1E293B1F !important;
    border-radius: 10px !important;
    background: #fff !important;
    background-color: var(--white) !important;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05) !important;
    overflow: hidden !important;
}

    .phone-group:focus[b-7xjcqmdrwb],
    .phone-group:focus-within[b-7xjcqmdrwb] {
        box-shadow: 0 0 0 0.2rem #dce0ff !important;
    }

    .phone-group input:focus[b-7xjcqmdrwb],
    .phone-group input:focus-within[b-7xjcqmdrwb] {
        box-shadow: none !important;
    }

    .phone-group:hover:not(.disabled)[b-7xjcqmdrwb] {
        border-color: #eaecff !important;
    }

    .phone-group.disabled[b-7xjcqmdrwb] {
        background: transparent !important;
        box-shadow: initial !important;
        cursor: not-allowed !important;
    }

.phone-group-divider[b-7xjcqmdrwb] {
    width: 1px !important;
    height: 40px !important;
    background-color: #1E293B1F;
    flex-shrink: 0 !important;
}

.phone-input[b-7xjcqmdrwb] {
    flex: 1 !important;
    height: 40px !important;
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
    background: transparent !important;
    padding: 0 12px !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    color: #212529 !important;
    min-width: 0 !important;
    border-radius: 0px !important;
}

    .phone-input[b-7xjcqmdrwb]::placeholder {
        color: #5F6E85;
    }

[b-7xjcqmdrwb] .dropdown:has(> .user-phone-code) {
    width: fit-content !important;
    height: 40px !important;
    display: flex !important;
    align-items: stretch !important;
}

[b-7xjcqmdrwb] .user-phone-code {
    box-shadow: none !important;
    border-radius: 0 !important;
    height: 40px !important;
    width: 100px !important;
    white-space: nowrap;
    border: none !important;
}

    [b-7xjcqmdrwb] .user-phone-code:focus {
        box-shadow: none !important;
    }
/* /Pages/Offers/Components/LocationDetailsOffer.razor.rz.scp.css */
.z-index-lower[b-4gftjconwj] {
    z-index: 1049 !important;
}

/* ── Location operations ───────────────────────────────────────────────── */
.location-operations-loading[b-4gftjconwj] {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 360px;
    color: var(--purple);
}

.location-operations-section[b-4gftjconwj],
.location-dispatch-history[b-4gftjconwj] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.location-dispatch-history[b-4gftjconwj] {
    margin-top: 28px;
}

.location-operations-heading[b-4gftjconwj],
.location-dispatch-history-header[b-4gftjconwj] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

    .location-operations-heading h6[b-4gftjconwj],
    .location-dispatch-history-header h6[b-4gftjconwj] {
        margin: 0;
        color: var(--dark-txt);
        font-size: 18px;
        font-weight: 800;
        line-height: 24px;
    }

.location-operations-date[b-4gftjconwj] {
    width: min(520px, 100%);
}

.location-dispatch-export img[b-4gftjconwj] {
    width: 16px;
    height: 16px;
}

.location-operations-cards[b-4gftjconwj] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

.location-operations-card[b-4gftjconwj],
.location-operations-chart[b-4gftjconwj] {
    padding: 16px;
    background: #f8fafc;
    border: 1px solid #1e293b08;
    border-radius: 20px;
}

.location-operations-card-label[b-4gftjconwj],
.location-operations-chart-title[b-4gftjconwj] {
    display: flex;
    align-items: center;
    gap: 8px;
    color: var(--gray-txt);
    font-size: 15px;
    font-weight: 600;
}

.location-operations-icon[b-4gftjconwj] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 8px;
}

    .location-operations-icon img[b-4gftjconwj] {
        width: 22px;
        height: 22px;
    }

    .location-operations-icon.cost[b-4gftjconwj] {
        background: #ffc30a33;
    }

    .location-operations-icon.revenue[b-4gftjconwj] {
        background: #409b3f33;
    }

    .location-operations-icon.chart[b-4gftjconwj] {
        background: var(--l-sky);
    }

.location-operations-card p[b-4gftjconwj] {
    margin: 20px 0 2px;
    color: var(--dark-txt);
    font-size: 25px;
    font-weight: 700;
    line-height: 32px;
}

.location-operations-card small[b-4gftjconwj] {
    color: var(--gray-txt);
    font-size: 13px;
    font-weight: 600;
}

.location-operations-work-types[b-4gftjconwj],
.location-dispatch-history-table-wrap[b-4gftjconwj] {
    overflow: hidden;
    border: 1px solid #1e293b0f;
    border-radius: 16px;
}

.location-operations-work-type-row[b-4gftjconwj] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    padding: 8px 16px;
    color: var(--dark-txt);
    font-size: 13px;
    font-weight: 600;
}

    .location-operations-work-type-row:nth-child(odd)[b-4gftjconwj] {
        background: #f8fafc;
    }

    .location-operations-work-type-row.header[b-4gftjconwj] {
        padding: 12px 16px;
        background: #f1f5f9;
        font-weight: 700;
    }

    .location-operations-work-type-row.empty[b-4gftjconwj] {
        color: var(--gray-txt);
    }

.location-operations-chart-canvas[b-4gftjconwj] {
    position: relative;
    height: 300px;
    margin-top: 14px;
}

    .location-operations-chart-canvas canvas[b-4gftjconwj] {
        width: 100% !important;
        height: 100% !important;
    }

.location-dispatch-export[b-4gftjconwj] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 10px;
    color: var(--dark-txt);
    font-size: 12px;
    font-weight: 600;
    background: #f1f5f9cc;
    border: 1px solid #1e293b0f;
    border-radius: 8px;
}

    .location-dispatch-export:disabled[b-4gftjconwj] {
        cursor: not-allowed;
        opacity: .55;
    }

.location-dispatch-history-table[b-4gftjconwj] {
    width: 100%;
    border-collapse: collapse;
}

    .location-dispatch-history-table th[b-4gftjconwj],
    .location-dispatch-history-table td[b-4gftjconwj] {
        padding: 10px 14px;
        color: var(--dark-txt);
        font-size: 12px;
        font-weight: 600;
        text-align: left;
        border-right: 1px solid #1e293b0f;
        vertical-align: middle;
    }

    .location-dispatch-history-table th[b-4gftjconwj] {
        background: #f1f5f9;
        font-size: 13px;
        font-weight: 700;
    }

        .location-dispatch-history-table td:last-child[b-4gftjconwj],
        .location-dispatch-history-table th:last-child[b-4gftjconwj] {
            border-right: 0;
        }

    .location-dispatch-history-table tbody tr:nth-child(even)[b-4gftjconwj] {
        background: #f8fafc;
    }

.location-dispatch-history-row[b-4gftjconwj] {
    cursor: pointer;
}

    .location-dispatch-history-row:hover[b-4gftjconwj] {
        background: #eef2ff !important;
    }

.location-dispatch-history-empty[b-4gftjconwj] {
    padding: 24px !important;
    color: var(--gray-txt) !important;
    font-weight: 500 !important;
    text-align: center !important;
}

.location-dispatch-status[b-4gftjconwj] {
    display: inline-flex;
    padding: 3px 7px;
    border-radius: 7px;
    font-size: 11px;
    font-weight: 700;
    white-space: nowrap;
}

    .location-dispatch-status.completed[b-4gftjconwj] {
        color: #296C28;
        background: #dff4df;
    }

    .location-dispatch-status.in-progress[b-4gftjconwj] {
        color: #363af5;
        background: #eaecff;
    }

    .location-dispatch-status.planned[b-4gftjconwj] {
        color: #a16207;
        background: #fef3c7;
    }

    .location-dispatch-status.dispatched[b-4gftjconwj] {
        color: #0369a1;
        background: #e0f2fe;
    }

@media (max-width: 600px) {
    .location-operations-heading[b-4gftjconwj],
    .location-dispatch-history-header[b-4gftjconwj] {
        align-items: flex-start;
        flex-direction: column;
    }

    .location-operations-date[b-4gftjconwj] {
        width: 100%;
    }

    .location-operations-cards[b-4gftjconwj] {
        grid-template-columns: 1fr;
    }

    .location-dispatch-history-table-wrap[b-4gftjconwj] {
        overflow-x: auto;
    }

    .location-dispatch-history-table[b-4gftjconwj] {
        min-width: 650px;
    }
}

/* ── Drawing stats bar + button ──────────────────────────────────────────── */

.ldm-drawing-bar[b-4gftjconwj] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 12px;
    padding: 6px 0;
    min-height: 40px;
}

.ldm-drawing-stats[b-4gftjconwj] {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    gap: 6px;
    overflow-x: auto;
    -ms-overflow-style: none;
    flex: 1;
    min-width: 0;
}

    .ldm-drawing-stats[b-4gftjconwj]::-webkit-scrollbar {
        display: none;
    }

.ldm-drawing-stat-chip[b-4gftjconwj] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 4px 6px;
    background: #F1F5F9CC;
    border-radius: 8px;
    box-shadow: 0px 1px 2px 0px #1E293B08;
    white-space: nowrap;
    flex-shrink: 0;
    border: 1px solid #1E293B08;
    height: 24px;
}

.ldm-drawing-stat-dot[b-4gftjconwj] {
    width: 14px;
    height: 14px;
    border-radius: 50%;
    flex-shrink: 0;
}

.ldm-drawing-stat-name[b-4gftjconwj] {
    font-size: 12px;
    font-weight: 600;
    color: #1E293B;
    letter-spacing: -0.2px;
    line-height: 16px;
}

.ldm-drawing-stat-value[b-4gftjconwj] {
    font-size: 12px;
    font-weight: 500;
    color: #5F6E85;
    letter-spacing: -0.2px;
    line-height: 16px;
}

.ldm-drawing-btn[b-4gftjconwj] {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    border: none;
    border-radius: 10px;
    background: #5263FF;
    color: #FFFFFF;
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
    white-space: nowrap;
    flex-shrink: 0;
    transition: background .15s;
}

    .ldm-drawing-btn:hover[b-4gftjconwj] {
        background: #4152EE;
    }

    .ldm-drawing-btn img[b-4gftjconwj] {
        filter: brightness(0) invert(1);
    }

.address-nickname-popup .modal-header button.discard-btn[b-4gftjconwj] {
    gap: 2px;
    padding: 8px 10px;
    border: 1px solid #1e293b0f;
    /* border: none; */
    border-radius: 10px;
    outline: none;
    height: 40px;
    background: #f1f5f9cc;
    backdrop-filter: blur(24px);
    box-shadow: 0px 1px 1px -0.5px #1e293b08, 0px 3px 3px 0px #ffffff1f inset;
}

    .address-nickname-popup .modal-header button.discard-btn:hover[b-4gftjconwj] {
        opacity: 0.8;
    }

    .address-nickname-popup .modal-header button.discard-btn img[b-4gftjconwj] {
        height: 18px;
    }

    .address-nickname-popup .modal-header button.discard-btn p[b-4gftjconwj] {
        font-size: 13px;
        font-weight: 600;
        line-height: 24px;
        letter-spacing: -0.2px;
        color: var(--dark-txt);
        padding: 0 4px;
    }

/* ── 2-column grid (mirrors existing 50% flex layout but as a proper grid) ── */
.address-nickname-popup .modal-body .details-tab .det-edit-2col[b-4gftjconwj] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px 24px;
}

/* ── Shared field wrapper ── */
.address-nickname-popup .modal-body .details-tab .det-edit-field[b-4gftjconwj] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

/* ── Label ── */
.address-nickname-popup .modal-body .details-tab .det-edit-label[b-4gftjconwj] {
    font-size: 13px;
    font-weight: 700;
    color: var(--gray-txt);
    letter-spacing: -0.1px;
    margin: 0;
}

.address-nickname-popup .modal-body .details-tab .det-edit-required[b-4gftjconwj] {
    color: var(--orange);
}

/* ── Validation message ── */
.address-nickname-popup .modal-body .details-tab .det-edit-validation[b-4gftjconwj] {
    font-size: 12px;
    font-weight: 600;
    color: var(--orange);
    margin-top: -2px;
}

/* ── Text / number input ── */
.address-nickname-popup .modal-body .details-tab .det-edit-input[b-4gftjconwj] {
    width: 100%;
    padding: 8px 12px;
    background-color: var(--white);
    border: 1px solid #1e293b1f;
    border-radius: 10px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.04);
    font-family: "Plus Jakarta Sans", sans-serif;
    font-size: 13px;
    font-weight: 600;
    color: var(--dark-txt);
    outline: none;
    transition: border-color 0.15s, box-shadow 0.15s;
}

    .address-nickname-popup .modal-body .details-tab .det-edit-input:focus[b-4gftjconwj] {
        border-color: var(--purple);
        box-shadow: 0 0 0 3px #5263ff22;
    }

    .address-nickname-popup .modal-body .details-tab .det-edit-input[b-4gftjconwj]::placeholder {
        color: #cbd5e1;
        font-weight: 500;
    }

    /* hide number spinners */
    .address-nickname-popup
    .modal-body
    .details-tab
    .det-edit-input[type="number"][b-4gftjconwj]::-webkit-outer-spin-button,
    .address-nickname-popup
    .modal-body
    .details-tab
    .det-edit-input[type="number"][b-4gftjconwj]::-webkit-inner-spin-button {
        -webkit-appearance: none;
    }

/* ── Select ── */
.address-nickname-popup .modal-body .details-tab .det-edit-select[b-4gftjconwj] {
    width: 100%;
    padding: 8px 28px 8px 12px;
    background-color: var(--white);
    border: 1px solid #1e293b1f;
    border-radius: 10px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.04);
    font-family: "Plus Jakarta Sans", sans-serif;
    font-size: 13px;
    font-weight: 600;
    color: var(--dark-txt);
    outline: none;
    appearance: none;
    -webkit-appearance: none;
    background-image: url("../img/icons/gray-arrow.png");
    background-repeat: no-repeat;
    background-position: right 10px center;
    background-size: 16px;
    cursor: pointer;
    transition: border-color 0.15s, box-shadow 0.15s;
}

    .address-nickname-popup .modal-body .details-tab .det-edit-select:focus[b-4gftjconwj] {
        border-color: var(--purple);
        box-shadow: 0 0 0 3px #5263ff22;
    }

/* ── Textarea ── */
.address-nickname-popup .modal-body .details-tab .det-edit-textarea[b-4gftjconwj] {
    width: 100%;
    padding: 8px 12px;
    background-color: var(--white);
    border: 1px solid #1e293b1f;
    border-radius: 10px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.04);
    font-family: "Plus Jakarta Sans", sans-serif;
    font-size: 13px;
    font-weight: 600;
    color: var(--dark-txt);
    outline: none;
    resize: vertical;
    transition: border-color 0.15s, box-shadow 0.15s;
}

    .address-nickname-popup .modal-body .details-tab .det-edit-textarea:focus[b-4gftjconwj] {
        border-color: var(--purple);
        box-shadow: 0 0 0 3px #5263ff22;
    }

/* ── Section divider ── */
.address-nickname-popup .modal-body .details-tab .det-edit-divider[b-4gftjconwj] {
    border: 1px solid #1e293b17;
    margin: 20px 0;
}

/* ── Contractor row ── */
.address-nickname-popup .modal-body .details-tab .det-edit-contractor-row[b-4gftjconwj] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.address-nickname-popup .modal-body .details-tab .det-edit-contractor-name[b-4gftjconwj] {
    font-size: 13px;
    font-weight: 700;
    color: var(--dark-txt);
}

.address-nickname-popup .modal-body .details-tab .det-edit-badge[b-4gftjconwj] {
    padding: 2px 8px;
    border-radius: 8px;
    font-size: 11px;
    font-weight: 700;
    line-height: 18px;
}

.address-nickname-popup .modal-body .details-tab .det-edit-badge-blue[b-4gftjconwj] {
    background-color: #eaecff;
    color: var(--purple-2);
}

.address-nickname-popup
.modal-body
.details-tab
.det-edit-contractor-change-btn[b-4gftjconwj] {
    margin-left: auto;
    background: transparent;
    border: 1px solid #1e293b1f;
    border-radius: 8px;
    padding: 4px 12px;
    font-family: "Plus Jakarta Sans", sans-serif;
    font-size: 12px;
    font-weight: 700;
    color: var(--gray-txt);
    cursor: pointer;
    transition: background-color 0.15s;
}

    .address-nickname-popup
    .modal-body
    .details-tab
    .det-edit-contractor-change-btn:hover[b-4gftjconwj] {
        background-color: #f1f5f9;
    }

/* Assign contractor button (when no contractor set) */
.address-nickname-popup .modal-body .details-tab .det-edit-assign-btn[b-4gftjconwj] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: transparent;
    border: 1px dashed #5263ff66;
    border-radius: 10px;
    padding: 8px 14px;
    font-family: "Plus Jakarta Sans", sans-serif;
    font-size: 13px;
    font-weight: 700;
    color: var(--purple);
    cursor: pointer;
    transition: background-color 0.15s;
}

    .address-nickname-popup .modal-body .details-tab .det-edit-assign-btn:hover[b-4gftjconwj] {
        background-color: var(--l-purple);
    }

/* ── Link-style button (e.g. Create new customer) ── */
.address-nickname-popup .modal-body .details-tab .det-edit-link-btn[b-4gftjconwj] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: transparent;
    border: none;
    padding: 0;
    font-family: "Plus Jakarta Sans", sans-serif;
    font-size: 12px;
    font-weight: 700;
    color: var(--purple);
    cursor: pointer;
    text-decoration: none;
    transition: opacity 0.15s;
    width: fit-content;
}

    .address-nickname-popup .modal-body .details-tab .det-edit-link-btn:hover[b-4gftjconwj] {
        opacity: 0.75;
    }

/* ── Activation toggle row ── */
.address-nickname-popup .modal-body .details-tab .det-edit-activation-row[b-4gftjconwj] {
    display: flex;
    align-items: flex-end;
    gap: 16px;
    flex-wrap: wrap;
}

.address-nickname-popup .modal-body .details-tab .det-edit-toggle-row[b-4gftjconwj] {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 2px;
}

.address-nickname-popup .modal-body .details-tab .det-edit-toggle-switch[b-4gftjconwj] {
    position: relative;
    display: inline-block;
    width: 40px;
    height: 22px;
    flex-shrink: 0;
    margin: 0;
    cursor: pointer;
}

    .address-nickname-popup .modal-body .details-tab .det-edit-toggle-switch input[b-4gftjconwj] {
        opacity: 0;
        width: 0;
        height: 0;
        position: absolute;
    }

.address-nickname-popup .modal-body .details-tab .det-edit-toggle-slider[b-4gftjconwj] {
    position: absolute;
    inset: 0;
    background-color: #cbd5e1;
    border-radius: 22px;
    transition: background-color 0.2s;
}

    .address-nickname-popup
    .modal-body
    .details-tab
    .det-edit-toggle-slider[b-4gftjconwj]::before {
        content: "";
        position: absolute;
        width: 16px;
        height: 16px;
        left: 3px;
        top: 3px;
        background-color: var(--white);
        border-radius: 50%;
        box-shadow: 0 1px 3px rgba(0, 0, 0, 0.18);
        transition: transform 0.2s;
    }

.address-nickname-popup
.modal-body
.details-tab
.det-edit-toggle-switch
input:checked + .det-edit-toggle-slider[b-4gftjconwj] {
    background-color: var(--green-2);
}

    .address-nickname-popup
    .modal-body
    .details-tab
    .det-edit-toggle-switch
    input:checked + .det-edit-toggle-slider[b-4gftjconwj]::before {
        transform: translateX(18px);
    }

.address-nickname-popup .modal-body .details-tab .det-edit-toggle-label[b-4gftjconwj] {
    font-size: 13px;
    font-weight: 600;
    color: var(--dark-txt);
}

/* Make inactive button */
.address-nickname-popup .modal-body .details-tab .det-edit-make-inactive-btn[b-4gftjconwj] {
    padding: 8px 16px;
    background-color: var(--l-orange);
    border: 1px solid #ed403033;
    border-radius: 10px;
    font-family: "Plus Jakarta Sans", sans-serif;
    font-size: 13px;
    font-weight: 700;
    color: var(--orange);
    cursor: pointer;
    transition: background-color 0.15s;
    white-space: nowrap;
    flex-shrink: 0;
}

    .address-nickname-popup
    .modal-body
    .details-tab
    .det-edit-make-inactive-btn:hover[b-4gftjconwj] {
        background-color: #ed403044;
    }

/* ── Date picker wrap ── */
.address-nickname-popup .modal-body .details-tab .det-datepicker-wrap[b-4gftjconwj],
.det-datepicker-wrap[b-4gftjconwj] {
    display: flex;
    align-items: center;
    gap: 10px;
    background-color: var(--white);
    border: 1px solid #1e293b1f;
    border-radius: 10px;
    padding: 0 12px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.04);
    transition: border-color 0.15s, box-shadow 0.15s;
}

    .address-nickname-popup
    .modal-body
    .details-tab
    .det-datepicker-wrap:focus-within[b-4gftjconwj],
    .det-datepicker-wrap:focus-within[b-4gftjconwj] {
        box-shadow: 0 0 0 3px #5263ff22;
    }

.address-nickname-popup .modal-body .details-tab .det-datepicker-icon[b-4gftjconwj] {
    flex-shrink: 0;
}

.address-nickname-popup .modal-body .details-tab .det-datepicker-input[b-4gftjconwj],
.det-datepicker-input[b-4gftjconwj] {
    border: none !important;
    box-shadow: none !important;
    padding-left: 0 !important;
    background: transparent;
}

/* ════════════════════════════════════════════
   SUB-MODALS (Make inactive + Agreement)
   These float over the main modal
════════════════════════════════════════════ */

.det-submodal-backdrop[b-4gftjconwj] {
    position: absolute;
    inset: 0;
    background-color: rgba(15, 23, 42, 0.35);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1100;
    border-radius: inherit;
}

.det-submodal[b-4gftjconwj] {
    background-color: var(--white);
    border-radius: 20px;
    width: 100%;
    max-width: 520px;
    overflow: hidden;
    box-shadow: 0 24px 48px rgba(0, 0, 0, 0.16);
    animation: submodalIn-b-4gftjconwj 0.22s cubic-bezier(0.22, 1, 0.36, 1) both;
}

@keyframes submodalIn-b-4gftjconwj {
    from {
        transform: scale(0.94) translateY(12px);
        opacity: 0;
    }

    to {
        transform: scale(1) translateY(0);
        opacity: 1;
    }
}

/* ── Sub-modal header ── */
.det-submodal-header[b-4gftjconwj] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    padding: 24px 24px 16px;
    gap: 12px;
}

.det-submodal-title[b-4gftjconwj] {
    font-size: 18px;
    font-weight: 800;
    color: var(--dark-txt);
    letter-spacing: -0.3px;
    margin: 0 0 6px;
    line-height: 1.3;
}

.det-submodal-subtitle[b-4gftjconwj] {
    font-size: 13px;
    font-weight: 500;
    color: var(--gray-txt-2);
    line-height: 1.5;
    margin: 0 0 6px;
}

.det-submodal-warning[b-4gftjconwj] {
    font-size: 13px;
    font-weight: 700;
    color: var(--yellow);
    line-height: 1.5;
    margin: 0;
}

.det-submodal-close[b-4gftjconwj] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    min-width: 36px;
    background-color: #f1f5f9;
    border: 1px solid #1e293b1f;
    border-radius: 10px;
    cursor: pointer;
    transition: background-color 0.15s;
}

    .det-submodal-close:hover[b-4gftjconwj] {
        background-color: #e2e8f0;
    }

    .det-submodal-close img[b-4gftjconwj] {
        height: 14px;
    }

/* ── Sub-modal body ── */
.det-submodal-body[b-4gftjconwj] {
    /* padding: 0 24px 8px; */
    background-color: #f1f5f9cc;
}

    /* reuse det-edit-field / det-edit-label / det-edit-input / det-edit-textarea inside sub-modal body */
    .det-submodal-body .det-edit-field[b-4gftjconwj] {
        padding-top: 16px;
        padding-bottom: 4px;
    }

/* ── Sub-modal divider (agreement modal) ── */
.det-submodal-divider[b-4gftjconwj] {
    border: 1px solid #1e293b17;
    margin: 0;
}

/* ── Sub-modal footer ── */
.det-submodal-footer[b-4gftjconwj] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 16px 24px;
}

.det-submodal-footer-agreement[b-4gftjconwj] {
    background-color: var(--white);
}

/* Cancel / secondary button */
.det-submodal-cancel-btn[b-4gftjconwj] {
    flex: 1;
    padding: 12px;
    background-color: #f1f5f9cc;
    border: 1px solid #1e293b17;
    border-radius: 14px;
    font-family: "Plus Jakarta Sans", sans-serif;
    font-size: 14px;
    font-weight: 700;
    color: var(--dark-txt);
    cursor: pointer;
    transition: background-color 0.15s;
}

    .det-submodal-cancel-btn:hover[b-4gftjconwj] {
        background-color: #e2e8f0;
    }

/* Assign now button (agreement modal — ghost purple) */
.det-submodal-assign-btn[b-4gftjconwj] {
    flex: 1;
    padding: 12px;
    background-color: var(--l-purple);
    border: 1px solid #5263ff22;
    border-radius: 14px;
    font-family: "Plus Jakarta Sans", sans-serif;
    font-size: 14px;
    font-weight: 700;
    color: var(--purple-2);
    cursor: pointer;
    transition: background-color 0.15s;
}

    .det-submodal-assign-btn:hover[b-4gftjconwj] {
        background-color: #dce0ff;
    }

/* Confirm / Invite button (solid purple) */
.det-submodal-confirm-btn[b-4gftjconwj] {
    flex: 1;
    padding: 12px;
    background: linear-gradient(var(--purple), var(--purple)) padding-box, linear-gradient(90deg, #1e293b17, #1e293b2e) border-box;
    border: 1px solid transparent;
    border-radius: 14px;
    backdrop-filter: blur(24px);
    box-shadow: 0px 1px 1px -0.5px #1e293b08, 0px 3px 3px 0px #ffffff1f inset;
    font-family: "Plus Jakarta Sans", sans-serif;
    font-size: 14px;
    font-weight: 700;
    color: var(--white);
    cursor: pointer;
    transition: opacity 0.15s;
}

    .det-submodal-confirm-btn:hover[b-4gftjconwj] {
        opacity: 0.88;
    }

/* ── Shared section wrapper ── */
.address-nickname-popup .modal-body .prices-tab .prices-section[b-4gftjconwj] {
    margin-top: 24px;
}

    .address-nickname-popup .modal-body .prices-tab .prices-section:first-child[b-4gftjconwj] {
        margin-top: 0;
    }

/* ── Section header row ── */
.address-nickname-popup .modal-body .prices-tab .prices-section-header[b-4gftjconwj] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 12px;
}

.address-nickname-popup .modal-body .prices-tab .prices-section-title[b-4gftjconwj] {
    font-size: 18px;
    font-weight: 800;
    line-height: 24px;
    letter-spacing: -0.3px;
    color: var(--dark-txt);
    margin: 0;
}

.address-nickname-popup .modal-body .prices-tab .prices-section-subtitle[b-4gftjconwj] {
    font-size: 13px;
    font-weight: 700;
    color: #475569;
}

/* ── Info icon circle ── */
.address-nickname-popup .modal-body .prices-tab .prices-info-icon[b-4gftjconwj] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    border: 1.5px solid #94a3b8;
    color: #94a3b8;
    font-size: 9px;
    font-weight: 700;
    font-style: normal;
    cursor: pointer;
    flex-shrink: 0;
    transition: border-color 0.15s, color 0.15s;
}

    .address-nickname-popup .modal-body .prices-tab .prices-info-icon:hover[b-4gftjconwj] {
        border-color: var(--gray-txt);
        color: var(--gray-txt);
    }

.address-nickname-popup .modal-body .prices-tab .prices-info-icon-sm[b-4gftjconwj] {
    width: 14px;
    height: 14px;
    font-size: 8px;
}

/* ── View-mode table wrapper ── */
.address-nickname-popup .modal-body .prices-tab .prices-table-wrap[b-4gftjconwj] {
    border: 1px solid #1e293b0f;
    box-shadow: 0px 20px 20px -12px #1e293b08, 0px 3px 3px -1.5px #1e293b08, 0px 1px 1px -0.5px #1e293b08;
    border-radius: 16px;
    overflow: hidden;
}

/* ── View-mode table ── */
.address-nickname-popup .modal-body .prices-tab .prices-table[b-4gftjconwj] {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}

    .address-nickname-popup .modal-body .prices-tab .prices-table thead tr[b-4gftjconwj] {
        background-color: #f1f5f9;
        /* border-bottom: 1px solid #1e293b1a; */
        border-bottom: none;
    }

    .address-nickname-popup .modal-body .prices-tab .prices-table th[b-4gftjconwj] {
        padding: 11px 14px;
        text-align: left;
        font-size: 12px;
        font-weight: 700;
        letter-spacing: -0.1px;
        color: var(--gray-txt);
        white-space: nowrap;
        /* border-right: 1px solid #1e293b0f; */
        border-right: none;
    }

        .address-nickname-popup .modal-body .prices-tab .prices-table th:last-child[b-4gftjconwj] {
            border-right: none;
        }

    .address-nickname-popup .modal-body .prices-tab .prices-table .th-with-info[b-4gftjconwj] {
        display: inline-flex;
        align-items: center;
        gap: 5px;
    }

    .address-nickname-popup .modal-body .prices-tab .prices-table td[b-4gftjconwj] {
        padding: 11px 14px;
        color: var(--dark-txt);
        font-size: 13px;
        font-weight: 500;
        /* border-bottom: 1px solid #1e293b0f;
  border-right: 1px solid #1e293b0f; */
        border-bottom: none;
        border-right: none;
        vertical-align: middle;
    }

        .address-nickname-popup .modal-body .prices-tab .prices-table td:last-child[b-4gftjconwj] {
            border-right: none;
        }

    .address-nickname-popup
    .modal-body
    .prices-tab
    .prices-table
    tbody
    tr:last-child
    td[b-4gftjconwj] {
        border-bottom: none;
    }

    .address-nickname-popup .modal-body .prices-tab .prices-table tbody tr[b-4gftjconwj] {
        transition: background-color 0.12s;
    }

        .address-nickname-popup .modal-body .prices-tab .prices-table tbody tr:hover[b-4gftjconwj] {
            background-color: #f8faff;
        }

        .address-nickname-popup
        .modal-body
        .prices-tab
        .prices-table
        tbody
        tr:nth-child(even)[b-4gftjconwj] {
            background-color: #f8fafc;
        }

/* Price value in green */
.address-nickname-popup .modal-body .prices-tab .price-value[b-4gftjconwj] {
    color: var(--green-2);
    font-weight: 700;
}

/* Rule name link */
.address-nickname-popup .modal-body .prices-tab .prices-rule-link[b-4gftjconwj] {
    color: var(--purple-2);
    font-weight: 600;
    cursor: pointer;
}

    .address-nickname-popup .modal-body .prices-tab .prices-rule-link:hover[b-4gftjconwj] {
        text-decoration: underline;
    }

/* Days cell multi-line */
.address-nickname-popup .modal-body .prices-tab .prices-day-line[b-4gftjconwj] {
    display: block;
    line-height: 1.5;
    font-weight: 500;
    color: var(--dark-txt);
}

.address-nickname-popup .modal-body .prices-tab .prices-day-sub[b-4gftjconwj] {
    display: block;
    font-size: 12px;
    font-weight: 500;
    color: var(--gray-txt-2);
    margin-top: 1px;
}

/* Empty state row */
.address-nickname-popup .modal-body .prices-tab .prices-empty-row[b-4gftjconwj] {
    text-align: center;
    color: var(--gray-txt-2);
    font-size: 13px;
    font-weight: 500;
    padding: 20px 14px !important;
}

/* ── Edit mode: outer card ── */
.address-nickname-popup .modal-body .prices-tab .prices-edit-card[b-4gftjconwj] {
    background-color: #ffffff;
    border: 1px solid #1e293b17;
    border-radius: 24px;
    overflow: hidden;
    box-shadow: 0px 20px 20px -12px #1e293b08, 0px 3px 3px -1.5px #1e293b08, 0px 1px 1px -0.5px #1e293b08;
}

.address-nickname-popup .modal-body .prices-tab .prices-edit-card-inner[b-4gftjconwj] {
    padding: 16px;
}

.address-nickname-popup .modal-body .prices-tab .prices-edit-label[b-4gftjconwj] {
    display: block;
    font-size: 13px;
    font-weight: 700;
    color: var(--gray-txt);
    margin-bottom: 6px;
    letter-spacing: -0.1px;
}

/* ── Select wrapper (custom arrow) ── */
.address-nickname-popup .modal-body .prices-tab .prices-select-wrap[b-4gftjconwj] {
    position: relative;
}

.address-nickname-popup .modal-body .prices-tab .prices-select[b-4gftjconwj] {
    width: 100%;
    padding: 7px 28px 7px 10px;
    background-color: var(--white);
    border: 1px solid #1e293b1f;
    border-radius: 10px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.04);
    font-family: "Plus Jakarta Sans", sans-serif;
    font-size: 13px;
    font-weight: 600;
    color: var(--dark-txt);
    outline: none;
    appearance: none;
    -webkit-appearance: none;
    background-image: url("../img/icons/gray-arrow.png");
    background-repeat: no-repeat;
    background-position: right 8px center;
    background-size: 16px;
    cursor: pointer;
    transition: border-color 0.15s, box-shadow 0.15s;
}

    .address-nickname-popup .modal-body .prices-tab .prices-select:focus[b-4gftjconwj] {
        border-color: var(--purple);
        box-shadow: 0 0 0 3px #5263ff22;
    }

/* ── Edit grid: column layout ── */
.address-nickname-popup .modal-body .prices-tab .prices-edit-grid-header[b-4gftjconwj],
.address-nickname-popup .modal-body .prices-tab .prices-edit-grid-row[b-4gftjconwj] {
    display: grid;
    grid-template-columns: 1fr 88px 88px 88px 88px 36px;
    gap: 8px;
    padding: 10px 16px;
    align-items: center;
}

.address-nickname-popup .modal-body .prices-tab .prices-edit-grid-header[b-4gftjconwj] {
    background-color: #f1f5f9;
    /* border-top: 1px solid #1e293b1a; */
    border-top: none;
    border-bottom: 1px solid #1e293b1a;
    border-bottom: none;
}

    .address-nickname-popup .modal-body .prices-tab .prices-edit-grid-header span[b-4gftjconwj] {
        font-size: 12px;
        font-weight: 700;
        color: var(--gray-txt);
        display: flex;
        align-items: center;
        gap: 4px;
        letter-spacing: -0.1px;
    }

.address-nickname-popup .modal-body .prices-tab .prices-edit-grid-row[b-4gftjconwj] {
    background-color: var(--white);
    /* border-bottom: 1px solid #1e293b0a; */
    border-bottom: none;
}

    .address-nickname-popup .modal-body .prices-tab .prices-edit-grid-row.alt-row[b-4gftjconwj] {
        background-color: #f8fafc;
    }
/* Seasonal pricing columns */
.address-nickname-popup .modal-body .prices-tab .prices-seasonal-cols[b-4gftjconwj] {
    grid-template-columns: 202px 202px 202px;
}
/* Extra fees columns */
.address-nickname-popup .modal-body .prices-tab .prices-fees-cols[b-4gftjconwj] {
    grid-template-columns: 209px 176px 176px 36px;
}

/* ── Divider before fees sub-section ── */
.address-nickname-popup .modal-body .prices-tab .prices-edit-fees-divider[b-4gftjconwj] {
    /* border-top: 2px solid #1e293b1a; */
    border-top: none;
}

/* ── Text / number input inside edit grid ── */
.address-nickname-popup .modal-body .prices-tab .prices-input[b-4gftjconwj] {
    width: 100%;
    height: 40px;
    margin-bottom: auto;
    padding: 6px 8px;
    background-color: var(--white);
    border: 1px solid #1e293b1f;
    border-radius: 10px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
    font-family: "Plus Jakarta Sans", sans-serif;
    font-size: 13px;
    font-weight: 600;
    color: var(--dark-txt);
    outline: none;
    transition: border-color 0.15s, box-shadow 0.15s;
}

    .address-nickname-popup .modal-body .prices-tab .prices-input:focus[b-4gftjconwj] {
        box-shadow: 0 0 0 0.2rem #dce0ff;
    }

    .address-nickname-popup .modal-body .prices-tab .prices-input[b-4gftjconwj]::placeholder {
        color: #5F6E85;
    }

    /* Hide number spinners */
    .address-nickname-popup
    .modal-body
    .prices-tab
    .prices-input[type="number"][b-4gftjconwj]::-webkit-outer-spin-button,
    .address-nickname-popup
    .modal-body
    .prices-tab
    .prices-input[type="number"][b-4gftjconwj]::-webkit-inner-spin-button {
        -webkit-appearance: none;
    }

/* ── Delete row button ── */
.address-nickname-popup .modal-body .prices-tab .prices-row-delete[b-4gftjconwj] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    background: transparent;
    border: none;
    border-radius: 8px;
    cursor: pointer;
    transition: background-color 0.12s;
    padding: 0;
}

    .address-nickname-popup .modal-body .prices-tab .prices-row-delete img[b-4gftjconwj] {
        height: 18px;
        margin-left: 1px;
    }

    .address-nickname-popup .modal-body .prices-tab .prices-row-delete:hover[b-4gftjconwj] {
        background-color: #fef2f2;
    }

/* ── Add row button ── */
.address-nickname-popup .modal-body .prices-tab .prices-add-row-btn[b-4gftjconwj] {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 6.5px 16px;
    font-size: 13px;
    font-weight: 700;
    color: var(--purple);
    background-color: #eaecff;
    cursor: pointer;
    user-select: none;
    transition: background-color 0.15s;
    /* border-top: 1px solid #5263ff22; */
    border-top: none;
}

    .address-nickname-popup .modal-body .prices-tab .prices-add-row-btn:hover[b-4gftjconwj] {
        background-color: #dce0ff;
    }

/* ── New rule button ── */
.address-nickname-popup .modal-body .prices-tab .prices-new-rule-btn[b-4gftjconwj] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 14px;
    background: linear-gradient(var(--purple), var(--purple)) padding-box, linear-gradient(90deg, #1e293b17, #1e293b2e) border-box;
    border: 1px solid transparent;
    border-radius: 10px;
    backdrop-filter: blur(24px);
    box-shadow: 0px 1px 1px -0.5px #1e293b08, 0px 3px 3px 0px #ffffff1f inset;
    font-family: "Plus Jakarta Sans", sans-serif;
    font-size: 13px;
    font-weight: 700;
    color: var(--white);
    cursor: pointer;
    transition: opacity 0.15s;
}

    .address-nickname-popup .modal-body .prices-tab .prices-new-rule-btn:hover[b-4gftjconwj] {
        opacity: 0.88;
    }

/* ── Actions column (edit rules) ── */
.address-nickname-popup .modal-body .prices-tab .prices-action-icons[b-4gftjconwj] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.address-nickname-popup .modal-body .prices-tab .prices-action-btn[b-4gftjconwj] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    background: transparent;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    transition: background-color 0.12s;
    padding: 0;
}

    .address-nickname-popup .modal-body .prices-tab .prices-action-btn img[b-4gftjconwj] {
        height: 15px;
    }

.address-nickname-popup .modal-body .prices-tab .prices-action-edit:hover[b-4gftjconwj] {
    background-color: #eaecff;
}

.address-nickname-popup .modal-body .prices-tab .prices-action-delete:hover[b-4gftjconwj] {
    background-color: #fef2f2;
}

/* ── Section wrapper ── */
.address-nickname-popup .modal-body .contacts-tab .contacts-section[b-4gftjconwj] {
    margin-top: 28px;
}

    .address-nickname-popup
    .modal-body
    .contacts-tab
    .contacts-section:first-child[b-4gftjconwj] {
        margin-top: 0;
    }

/* ── Section header ── */
.address-nickname-popup .modal-body .contacts-tab .contacts-section-header[b-4gftjconwj] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    margin-bottom: 16px;
    gap: 12px;
}

.address-nickname-popup .modal-body .contacts-tab .contacts-section-title[b-4gftjconwj] {
    font-size: 18px;
    font-weight: 800;
    line-height: 26px;
    letter-spacing: -0.3px;
    color: var(--dark-txt);
    margin: 0 0 4px;
}

.address-nickname-popup .modal-body .contacts-tab .contacts-section-desc[b-4gftjconwj] {
    font-size: 13px;
    font-weight: 500;
    color: var(--gray-txt-2);
    line-height: 1.5;
    margin: 0;
}

/* ── Empty state ── */
.address-nickname-popup .modal-body .contacts-tab .contacts-empty[b-4gftjconwj] {
    font-size: 13px;
    font-weight: 500;
    color: var(--gray-txt-2);
    padding: 8px 0;
}

/* ── VIEW: contact cards grid ── */
.address-nickname-popup .modal-body .contacts-tab .contacts-cards-grid[b-4gftjconwj] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}

/* ── VIEW: single contact card ── */
.address-nickname-popup .modal-body .contacts-tab .contacts-card[b-4gftjconwj] {
    background-color: #f1f5f9;
    border: none;
    border-radius: 16px;
    padding: 8px;
}

.address-nickname-popup .modal-body .contacts-tab .contacts-card-name[b-4gftjconwj] {
    font-size: 14px;
    font-weight: 700;
    color: var(--dark-txt);
    letter-spacing: -0.2px;
    margin-bottom: 6px;
    margin-left: 5px;
}

/* inner mini table */
.address-nickname-popup .modal-body .contacts-tab .contacts-card-table[b-4gftjconwj] {
    background-color: #ffffff;
    border: 1px solid #1e293b0f;
    border-radius: 12px;
    overflow: hidden;
}

.address-nickname-popup .modal-body .contacts-tab .contacts-card-row[b-4gftjconwj] {
    display: flex;
    align-items: center;
    padding: 9px 14px;
    border-bottom: 1px solid #1e293b0f;
    gap: 12px;
}

    .address-nickname-popup
    .modal-body
    .contacts-tab
    .contacts-card-row:last-child[b-4gftjconwj] {
        border-bottom: none;
    }

.address-nickname-popup .modal-body .contacts-tab .contacts-card-label[b-4gftjconwj] {
    font-size: 13px;
    font-weight: 600;
    color: var(--gray-txt-2);
    min-width: 52px;
    flex-shrink: 0;
}

.address-nickname-popup .modal-body .contacts-tab .contacts-card-value[b-4gftjconwj] {
    font-size: 13px;
    font-weight: 600;
    color: var(--dark-txt);
    word-break: break-all;
}

/* ── VIEW: notification email chips ── */
.address-nickname-popup .modal-body .contacts-tab .contacts-email-chips[b-4gftjconwj] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.address-nickname-popup .modal-body .contacts-tab .contacts-email-chip[b-4gftjconwj] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 5px 7px;
    background-color: #5263ff1f;
    /* border: 1px solid #5263FF33; */
    border: none;
    border-radius: 8px;
    font-size: 13px;
    font-weight: 600;
    color: #363af5;
    line-height: 1;
}

    .address-nickname-popup .modal-body .contacts-tab .contacts-email-chip svg[b-4gftjconwj] {
        flex-shrink: 0;
        color: #363af5;
    }

/* ── EDIT: new contact button ── */
.address-nickname-popup .modal-body .contacts-tab .contacts-new-btn[b-4gftjconwj] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 14px;
    background: linear-gradient(var(--purple), var(--purple)) padding-box, linear-gradient(90deg, #1e293b17, #1e293b2e) border-box;
    border: 1px solid transparent;
    border-radius: 10px;
    backdrop-filter: blur(24px);
    box-shadow: 0px 1px 1px -0.5px #1e293b08, 0px 3px 3px 0px #ffffff1f inset;
    font-family: "Plus Jakarta Sans", sans-serif;
    font-size: 13px;
    font-weight: 700;
    color: var(--white);
    cursor: pointer;
    white-space: nowrap;
    transition: opacity 0.15s;
    flex-shrink: 0;
}

    .address-nickname-popup .modal-body .contacts-tab .contacts-new-btn:hover[b-4gftjconwj] {
        opacity: 0.88;
    }

/* ── EDIT: contact card (edit state) ── */
.address-nickname-popup .modal-body .contacts-tab .contacts-edit-card[b-4gftjconwj] {
    background-color: var(--white);
    border: 1px solid #1e293b1a;
    border-radius: 16px;
    padding: 16px;
    display: flex;
    flex-direction: column;
    gap: 16px;
    box-shadow: 0px 20px 20px -12px #1e293b08, 0px 3px 3px -1.5px #1e293b08, 0px 1px 1px -0.5px #1e293b08;
}

.address-nickname-popup .modal-body .contacts-tab .contacts-edit-card-error[b-4gftjconwj] {
    border-color: #ed403066;
    background-color: #fff5f5;
}

.address-nickname-popup .modal-body .contacts-tab .contacts-edit-card-top[b-4gftjconwj] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 0;
}

/* ── EDIT: shared label ── */
.address-nickname-popup .modal-body .contacts-tab .contacts-edit-label[b-4gftjconwj] {
    font-size: 13px;
    font-weight: 700;
    color: var(--gray-txt);
    letter-spacing: -0.1px;
    margin-bottom: 0;
}

/* ── EDIT: shared input ── */
.address-nickname-popup .modal-body .contacts-tab .contacts-edit-input[b-4gftjconwj] {
    width: 100%;
    height: 40px;
    margin-bottom: auto;
    padding: 6px 8px;
    background-color: var(--white);
    border: 1px solid #1e293b1f;
    border-radius: 10px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
    font-family: "Plus Jakarta Sans", sans-serif;
    font-size: 13px;
    font-weight: 600;
    color: var(--dark-txt);
    outline: none;
    transition: border-color 0.15s, box-shadow 0.15s;
}

    .address-nickname-popup .modal-body .contacts-tab .contacts-edit-input:focus[b-4gftjconwj] {
        box-shadow: 0 0 0 0.2rem #dce0ff;
    }

    .address-nickname-popup
    .modal-body
    .contacts-tab
    .contacts-edit-input[b-4gftjconwj]::placeholder {
        color: #5F6E85;
    }

/* invalid state (red border) */
.address-nickname-popup .modal-body .contacts-tab .contacts-input-invalid[b-4gftjconwj] {
    border-color: #ed4030 !important;
    box-shadow: 0 0 0 3px #ed403022 !important;
}

/* ── EDIT: delete button (card top-right) ── */
.address-nickname-popup .modal-body .contacts-tab .contacts-card-delete[b-4gftjconwj] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    background: transparent;
    border: none;
    border-radius: 8px;
    cursor: pointer;
    padding: 0;
    transition: background-color 0.12s;
    flex-shrink: 0;
}

    .address-nickname-popup .modal-body .contacts-tab .contacts-card-delete img[b-4gftjconwj] {
        height: 16px;
    }

    .address-nickname-popup .modal-body .contacts-tab .contacts-card-delete:hover[b-4gftjconwj] {
        background-color: #fef2f2;
    }

/* ── EDIT: toggle switch ── */
.address-nickname-popup .modal-body .contacts-tab .contacts-toggle-row[b-4gftjconwj] {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 4px;
}

.address-nickname-popup .modal-body .contacts-tab .contacts-toggle-switch[b-4gftjconwj] {
    position: relative;
    display: inline-block;
    width: 46px;
    height: 28px;
    background: linear-gradient( 180deg, rgba(226, 232, 240, 1) 0%, rgba(248, 250, 252, 1) 100% );
    border-radius: 50px;
    padding: 3px;
    flex-shrink: 0;
}

    .address-nickname-popup
    .modal-body
    .contacts-tab
    .contacts-toggle-switch
    input[b-4gftjconwj] {
        opacity: 0;
        width: 0;
        height: 0;
    }

.address-nickname-popup .modal-body .contacts-tab .contacts-toggle-slider[b-4gftjconwj] {
    position: absolute;
    cursor: pointer;
    border-radius: 30px;
    background-color: #d3dde8;
    transition: 0.3s;
    height: 22px;
    width: 40px;
}

    .address-nickname-popup
    .modal-body
    .contacts-tab
    .contacts-toggle-slider[b-4gftjconwj]::before {
        content: "";
        position: absolute;
        height: 18px;
        width: 18px;
        left: 2px;
        top: 2px;
        border-radius: 1000px;
        background: linear-gradient(180deg, #e2e8f0 0%, #ffffff 100%);
        border: 3.5px solid #f9fbfc;
        box-shadow: 0 2px 4px rgba(0, 0, 0, 0.15);
        transition: 0.3s;
    }

.address-nickname-popup
.modal-body
.contacts-tab
.contacts-toggle-switch
input:checked + .contacts-toggle-slider[b-4gftjconwj] {
    background: linear-gradient(135deg, #5b67f6, #4c57e0);
}

    .address-nickname-popup
    .modal-body
    .contacts-tab
    .contacts-toggle-switch
    input:checked + .contacts-toggle-slider[b-4gftjconwj]::before {
        transform: translateX(18px);
        background: #fff;
    }

    .address-nickname-popup
    .modal-body
    .contacts-tab
    .contacts-toggle-switch
    input:checked + .contacts-toggle-slider[b-4gftjconwj]::after {
        content: "";
        position: absolute;
        right: 5px;
        top: 7.5px;
        width: 11px;
        height: 11px;
        background-image: url("../img/icons/toggle-check-icon.svg");
        background-size: contain;
        background-repeat: no-repeat;
    }

.address-nickname-popup .modal-body .contacts-tab .contacts-toggle-label[b-4gftjconwj] {
    font-size: 13px;
    font-weight: 600;
    color: var(--dark-txt);
}

/* ── EDIT: notification email input row ── */
.address-nickname-popup .modal-body .contacts-tab .contacts-email-input-row[b-4gftjconwj] {
    display: flex;
    align-items: center;
    gap: 0;
    background-color: var(--white);
    border: 1px solid #1e293b1f;
    border-radius: 12px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.04);
    overflow: hidden;
    margin-top: 6px;
    padding: 2px 4px;
}

.address-nickname-popup .modal-body .contacts-tab .contacts-email-add-input[b-4gftjconwj] {
    flex: 1;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    background: transparent;
}

.address-nickname-popup
.modal-body
.contacts-tab
.contacts-email-input-row:focus-within[b-4gftjconwj] {
    box-shadow: 0 0 0 0.2rem #dce0ff;
}

.address-nickname-popup .modal-body .contacts-tab .contacts-add-email-btn[b-4gftjconwj] {
    padding: 8px 16px;
    border-radius: 10px;
    background-color: #5263ff1f;
    border: none;
    font-family: "Plus Jakarta Sans", sans-serif;
    font-size: 13px;
    font-weight: 700;
    color: #363af5;
    cursor: pointer;
    white-space: nowrap;
    transition: opacity 0.15s;
    flex-shrink: 0;
}

    .address-nickname-popup
    .modal-body
    .contacts-tab
    .contacts-add-email-btn:hover[b-4gftjconwj] {
        opacity: 0.88;
    }

/* ── EDIT: added emails card ── */
.address-nickname-popup .modal-body .contacts-tab .contacts-added-emails-card[b-4gftjconwj] {
    background-color: var(--white);
    border: 1px solid #1e293b1a;
    border-radius: 16px;
    overflow: hidden;
    margin-top: 12px;
    box-shadow: 0px 20px 20px -12px #1e293b08, 0px 3px 3px -1.5px #1e293b08, 0px 1px 1px -0.5px #1e293b08;
}

.address-nickname-popup
.modal-body
.contacts-tab
.contacts-added-emails-header[b-4gftjconwj] {
    padding: 10px 16px;
    font-size: 12px;
    font-weight: 700;
    color: var(--gray-txt);
    letter-spacing: -0.1px;
    background-color: #f8fafc;
    border-bottom: 1px solid #1e293b1a;
}

.address-nickname-popup .modal-body .contacts-tab .contacts-added-email-row[b-4gftjconwj] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 16px;
    border-bottom: 1px solid #1e293b0f;
    font-size: 13px;
    font-weight: 600;
    color: var(--dark-txt);
    transition: background-color 0.12s;
}

    .address-nickname-popup
    .modal-body
    .contacts-tab
    .contacts-added-email-row:last-child[b-4gftjconwj] {
        border-bottom: none;
    }

    .address-nickname-popup
    .modal-body
    .contacts-tab
    .contacts-added-email-row:hover[b-4gftjconwj] {
        background-color: #f8fafc;
    }

/* ── Section wrapper ── */
.address-nickname-popup .modal-body .details-tab .det-section[b-4gftjconwj] {
    margin-top: 24px;
}

    .address-nickname-popup .modal-body .details-tab .det-section:first-child[b-4gftjconwj] {
        margin-top: 0;
    }

.address-nickname-popup .modal-body .details-tab .det-section-title[b-4gftjconwj] {
    font-size: 18px;
    font-weight: 800;
    color: var(--dark-txt);
    letter-spacing: -0.3px;
    margin: 0 0 10px;
}

/* ── White card ── */
.address-nickname-popup .modal-body .details-tab .det-card[b-4gftjconwj] {
    background-color: var(--white);
    border: 1px solid #1e293b17;
    border-radius: 24px;
    padding: 16px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    box-shadow: 0px 20px 20px -12px #1e293b08, 0px 3px 3px -1.5px #1e293b08, 0px 1px 1px -0.5px #1e293b08;
}

/* ── Field ── */
.address-nickname-popup .modal-body .details-tab .det-field[b-4gftjconwj],
.det-field[b-4gftjconwj] {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.address-nickname-popup .modal-body .details-tab .det-label[b-4gftjconwj],
.det-label[b-4gftjconwj] {
    font-size: 13px;
    font-weight: 600;
    color: var(--gray-txt);
    letter-spacing: -0.1px;
    margin: 0;
}

.address-nickname-popup .modal-body .details-tab .det-label-with-info[b-4gftjconwj] {
    display: flex;
    align-items: center;
    gap: 5px;
}

.address-nickname-popup .modal-body .details-tab .det-required[b-4gftjconwj] {
    color: var(--orange);
}

.address-nickname-popup .modal-body .details-tab .det-validation[b-4gftjconwj] {
    font-size: 12px;
    font-weight: 600;
    color: var(--orange);
}

/* ── 2-col grid ── */
.address-nickname-popup .modal-body .details-tab .det-2col[b-4gftjconwj] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px 16px;
}

/* ── Shared input ── */
.hr-lable hr[b-4gftjconwj] {
    border: 1px #1e293b17 solid;
    margin: 0;
}

.hr-lable label[b-4gftjconwj] {
    white-space: nowrap;
}

.address-nickname-popup .modal-body .details-tab .det-input[b-4gftjconwj],
.det-input[b-4gftjconwj] {
    width: 100%;
    padding: 8px 12px;
    background-color: var(--white);
    border: 1px solid #1e293b1f;
    border-radius: 10px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
    font-family: "Plus Jakarta Sans", sans-serif;
    font-size: 13px;
    font-weight: 600;
    color: var(--dark-txt);
    outline: none;
    transition: border-color 0.15s, box-shadow 0.15s;
}

    .address-nickname-popup .modal-body .details-tab .det-input:focus[b-4gftjconwj],
    .det-input:focus[b-4gftjconwj] {
        box-shadow: 0 0 0 0.2rem #dce0ff;
    }

    .address-nickname-popup .modal-body .details-tab .det-input[b-4gftjconwj]::placeholder,
    .det-input[b-4gftjconwj]::placeholder {
        color: #5F6E85;
    }

    .address-nickname-popup
    .modal-body
    .details-tab
    .det-input[type="number"][b-4gftjconwj]::-webkit-outer-spin-button,
    .address-nickname-popup
    .modal-body
    .details-tab
    .det-input[type="number"][b-4gftjconwj]::-webkit-inner-spin-button {
        -webkit-appearance: none;
    }

/* ── Textarea ── */
.address-nickname-popup .modal-body .details-tab .det-textarea[b-4gftjconwj],
.det-textarea[b-4gftjconwj] {
    width: 100%;
    padding: 8px 12px;
    background-color: var(--white);
    border: 1px solid #1e293b1f;
    border-radius: 10px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
    font-family: "Plus Jakarta Sans", sans-serif;
    font-size: 13px;
    font-weight: 600;
    color: var(--dark-txt);
    outline: none;
    resize: vertical;
    transition: border-color 0.15s, box-shadow 0.15s;
}

    .address-nickname-popup .modal-body .details-tab .det-textarea:focus[b-4gftjconwj],
    .det-textarea:focus[b-4gftjconwj] {
        box-shadow: 0 0 0 0.2rem #dce0ff;
    }

/* ── Select ── */
.address-nickname-popup .modal-body .details-tab .det-select[b-4gftjconwj] {
    width: 100%;
    padding: 8px 28px 8px 12px;
    background-color: var(--white);
    border: 1px solid #1e293b1f;
    border-radius: 10px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
    font-family: "Plus Jakarta Sans", sans-serif;
    font-size: 13px;
    font-weight: 600;
    color: var(--dark-txt);
    outline: none;
    appearance: none;
    -webkit-appearance: none;
    background-image: url("../img/icons/gray-arrow.png");
    background-repeat: no-repeat;
    background-position: right 10px center;
    background-size: 16px;
    cursor: pointer;
    transition: border-color 0.15s, box-shadow 0.15s;
}

    .address-nickname-popup .modal-body .details-tab .det-select:focus[b-4gftjconwj] {
        border-color: var(--purple);
        box-shadow: 0 0 0 3px #5263ff22;
    }

/* ── Info icon ── */
.address-nickname-popup .modal-body .details-tab .det-info-icon[b-4gftjconwj] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 15px;
    height: 15px;
    border-radius: 50%;
    border: 1.5px solid #94a3b8;
    color: #94a3b8;
    font-size: 9px;
    font-weight: 700;
    font-style: normal;
    cursor: pointer;
    transition: border-color 0.15s, color 0.15s;
}

    .address-nickname-popup .modal-body .details-tab .det-info-icon:hover[b-4gftjconwj] {
        border-color: var(--gray-txt);
        color: var(--gray-txt);
    }

/* ── Customer row ── */
.address-nickname-popup .modal-body .details-tab .det-customer-row[b-4gftjconwj] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.address-nickname-popup .modal-body .details-tab .det-icon-dropdown-wrap[b-4gftjconwj] {
    flex: 1;
    display: flex;
    align-items: center;
    gap: 0;
    background-color: var(--white);
    border: 1px solid #1e293b1f;
    border-radius: 10px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
    padding: 0 12px;
    overflow: hidden;
}

.address-nickname-popup .modal-body .details-tab .det-icon-dropdown-icon[b-4gftjconwj] {
    width: 16px;
    height: 16px;
    flex-shrink: 0;
    margin-right: 8px;
}

.address-nickname-popup .modal-body .details-tab .det-dropdown-full[b-4gftjconwj] {
    flex: 1;
    border: none !important;
    box-shadow: none !important;
    background: transparent;
    padding-left: 0;
}

.address-nickname-popup .modal-body .details-tab .det-create-new-btn[b-4gftjconwj],
.address-nickname-popup .modal-body .details-tab .det-create-new-btn-hollow[b-4gftjconwj] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 8px 14px;
    background: linear-gradient(var(--purple), var(--purple)) padding-box, linear-gradient(90deg, #1e293b17, #1e293b2e) border-box;
    border: 1px solid transparent;
    border-radius: 10px;
    backdrop-filter: blur(24px);
    box-shadow: 0px 1px 1px -0.5px #1e293b08, 0px 3px 3px 0px #ffffff1f inset;
    font-family: "Plus Jakarta Sans", sans-serif;
    font-size: 13px;
    font-weight: 700;
    color: var(--white);
    cursor: pointer;
    white-space: nowrap;
    transition: opacity 0.15s;
    flex-shrink: 0;
}

.address-nickname-popup .modal-body .details-tab .det-create-new-btn-hollow[b-4gftjconwj] {
    background: #d1d8fa;
    color: #363af5;
}

    .address-nickname-popup .modal-body .details-tab .det-create-new-btn:hover[b-4gftjconwj],
    .address-nickname-popup
    .modal-body
    .details-tab
    .det-create-new-btn-hollow:hover[b-4gftjconwj] {
        opacity: 0.88;
    }

/* ── Search input ── */
.address-nickname-popup .modal-body .details-tab .det-search-wrap[b-4gftjconwj] {
    display: flex;
    align-items: center;
    gap: 8px;
    background-color: var(--white);
    border: 1px solid #1e293b1f;
    border-radius: 10px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
    padding: 0 12px;
}

    .address-nickname-popup .modal-body .details-tab .det-search-wrap:focus-within[b-4gftjconwj] {
        border-color: var(--purple);
        box-shadow: 0 0 0 3px #5263ff22;
    }

.address-nickname-popup .modal-body .details-tab .det-search-input[b-4gftjconwj] {
    border: none !important;
    box-shadow: none !important;
    padding-left: 0 !important;
    background: transparent;
}

.address-nickname-popup .modal-body .details-tab .det-or-manual[b-4gftjconwj] {
    font-size: 12px;
    font-weight: 600;
    color: var(--gray-txt-2);
    text-align: center;
    margin-top: -2px;
}

/* ── Country select with flag ── */
.address-nickname-popup .modal-body .details-tab .det-country-wrap[b-4gftjconwj] {
    position: relative;
    display: flex;
    align-items: center;
}

.address-nickname-popup .modal-body .details-tab .det-country-flag[b-4gftjconwj] {
    position: absolute;
    left: 10px;
    width: 18px;
    height: 13px;
    object-fit: cover;
    border-radius: 2px;
    pointer-events: none;
    z-index: 1;
}

.address-nickname-popup .modal-body .details-tab .det-select.has-flag[b-4gftjconwj] {
    padding-left: 36px;
}

/* ── Tag input (required equipment) ── */
.address-nickname-popup .modal-body .details-tab .det-tag-input-wrap[b-4gftjconwj] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
    background-color: var(--white);
    border: 1px solid #1e293b1f;
    border-radius: 10px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
    padding: 6px 10px;
    min-height: 42px;
}

    .address-nickname-popup
    .modal-body
    .details-tab
    .det-tag-input-wrap:focus-within[b-4gftjconwj] {
        border-color: var(--purple);
        box-shadow: 0 0 0 3px #5263ff22;
    }

.address-nickname-popup .modal-body .details-tab .det-tag[b-4gftjconwj] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background-color: #eaecff;
    border-radius: 6px;
    padding: 2px 8px;
    font-size: 12px;
    font-weight: 700;
    color: var(--purple-2);
}

.address-nickname-popup .modal-body .details-tab .det-tag-remove[b-4gftjconwj] {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--purple-2);
    font-size: 14px;
    line-height: 1;
    padding: 0;
    display: flex;
    align-items: center;
    transition: opacity 0.15s;
}

    .address-nickname-popup .modal-body .details-tab .det-tag-remove:hover[b-4gftjconwj] {
        opacity: 0.7;
    }

.address-nickname-popup .modal-body .details-tab .det-tag-dropdown-inner[b-4gftjconwj] {
    border: none !important;
    box-shadow: none !important;
    background: transparent;
    min-width: 100px;
    flex: 1;
}

/* ── Toggles row ── */
.address-nickname-popup .modal-body .details-tab .det-toggles-row[b-4gftjconwj] {
    display: flex;
    align-items: center;
    gap: 28px;
    flex-wrap: wrap;
}

.address-nickname-popup .modal-body .details-tab .det-toggle-item[b-4gftjconwj] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.address-nickname-popup .modal-body .details-tab .det-toggle-switch[b-4gftjconwj] {
    position: relative;
    display: inline-block;
    width: 46px;
    height: 28px;
    background: linear-gradient( 180deg, rgba(226, 232, 240, 1) 0%, rgba(248, 250, 252, 1) 100% );
    border-radius: 50px;
    padding: 3px;
    flex-shrink: 0;
}

    .address-nickname-popup .modal-body .details-tab .det-toggle-switch input[b-4gftjconwj] {
        opacity: 0;
        width: 0;
        height: 0;
    }

.address-nickname-popup .modal-body .details-tab .det-toggle-slider[b-4gftjconwj] {
    position: absolute;
    cursor: pointer;
    border-radius: 30px;
    background-color: #d3dde8;
    transition: 0.3s;
    height: 22px;
    width: 40px;
}

    .address-nickname-popup .modal-body .details-tab .det-toggle-slider[b-4gftjconwj]:before {
        content: "";
        position: absolute;
        height: 18px;
        width: 18px;
        left: 2px;
        top: 2px;
        border-radius: 1000px;
        background: linear-gradient(180deg, #e2e8f0 0%, #ffffff 100%);
        border: 3.5px solid #f9fbfc;
        box-shadow: 0 2px 4px rgba(0, 0, 0, 0.15);
        transition: 0.3s;
    }

.address-nickname-popup
.modal-body
.details-tab
.det-toggle-switch
input:checked + .det-toggle-slider[b-4gftjconwj] {
    background: linear-gradient(135deg, #5b67f6, #4c57e0);
}

    .address-nickname-popup
    .modal-body
    .details-tab
    .det-toggle-switch
    input:checked + .det-toggle-slider[b-4gftjconwj]:before {
        transform: translateX(18px);
        background: #fff;
    }

    .address-nickname-popup
    .modal-body
    .details-tab
    .det-toggle-switch
    input:checked + .det-toggle-slider[b-4gftjconwj]:after {
        content: "";
        position: absolute;
        right: 5px;
        top: 7.5px;
        width: 11px;
        height: 11px;
        background-image: url("../img/icons/toggle-check-icon.svg");
        background-size: contain;
        background-repeat: no-repeat;
    }

.address-nickname-popup .modal-body .details-tab .det-toggle-label[b-4gftjconwj] {
    font-size: 13px;
    font-weight: 600;
    color: var(--dark-txt);
}

/* ── Dashed upload button ── */
.address-nickname-popup .modal-body .details-tab .det-dashed-btn[b-4gftjconwj] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 100%;
    padding: 13px;
    background-color: var(--l-purple);
    border: 1.5px dashed #5263ff55;
    border-radius: 12px;
    font-family: "Plus Jakarta Sans", sans-serif;
    font-size: 13px;
    font-weight: 700;
    color: var(--purple);
    cursor: pointer;
    transition: background-color 0.15s;
}

    .address-nickname-popup .modal-body .details-tab .det-dashed-btn:hover[b-4gftjconwj] {
        background-color: #dce0ff;
    }

.address-nickname-popup .modal-body .details-tab .det-dashed-btn-sm[b-4gftjconwj] {
    padding: 9px 13px;
    width: auto;
    flex: 1;
}

.address-nickname-popup .modal-body .details-tab .det-upload-hint[b-4gftjconwj] {
    font-size: 11.5px;
    font-weight: 500;
    color: var(--gray-txt-2);
    text-align: center;
    padding-left: 15px;
}

/* ── Image strip ── */
.address-nickname-popup .modal-body .details-tab .det-img-strip-outer[b-4gftjconwj] {
    display: flex;
    align-items: center;
    gap: 8px;
    overflow: hidden;
}

.address-nickname-popup .modal-body .details-tab .det-img-strip[b-4gftjconwj] {
    display: flex;
    gap: 8px;
    overflow-x: auto;
    flex: 1;
    scroll-behavior: smooth;
    scrollbar-width: none;
    scroll-snap-type: x mandatory;
}

    .address-nickname-popup
    .modal-body
    .details-tab
    .det-img-strip[b-4gftjconwj]::-webkit-scrollbar {
        display: none;
    }

.address-nickname-popup .modal-body .details-tab .det-img-thumb[b-4gftjconwj] {
    position: relative;
    flex-shrink: 0;
    width: 100px;
    height: 100px;
    border-radius: 8px;
    overflow: hidden;
    border: 2px solid transparent;
    cursor: pointer;
    transition: border-color 0.15s;
    scroll-snap-align: start;
}

    .address-nickname-popup .modal-body .details-tab .det-img-thumb.active[b-4gftjconwj] {
        border-color: var(--purple);
    }

    .address-nickname-popup .modal-body .details-tab .det-img-thumb img[b-4gftjconwj] {
        width: 100%;
        height: 100%;
        object-fit: cover;
        display: block;
    }

.address-nickname-popup .modal-body .details-tab .det-img-thumb-delete[b-4gftjconwj] {
    position: absolute;
    top: 4px;
    right: 4px;
    width: 24px;
    height: 24px;
    background-color: #B82213;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background-color 0.12s;
}

    .address-nickname-popup .modal-body .details-tab .det-img-thumb-delete:hover[b-4gftjconwj] {
        background-color: #f54a3b;
    }

    .address-nickname-popup .modal-body .details-tab .det-img-thumb-delete img[b-4gftjconwj] {
        height: 15px;
        width: 15px;
    }

.address-nickname-popup .modal-body .details-tab .det-img-nav[b-4gftjconwj] {
    flex-shrink: 0;
    width: 28px;
    height: stretch;
    background-color: #f1f5f9cc;
    border: 1px solid #1e293b17;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    font-weight: 700;
    color: var(--dark-txt);
    cursor: pointer;
    transition: background-color 0.12s;
    line-height: 1;
}

    .address-nickname-popup .modal-body .details-tab .det-img-nav:hover[b-4gftjconwj] {
        background-color: #e2e8f0;
    }

/* ── Drawings toolbar ── */
.address-nickname-popup .modal-body .details-tab .det-drawings-toolbar[b-4gftjconwj] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.address-nickname-popup .modal-body .details-tab .det-settings-btn[b-4gftjconwj] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    background-color: #f1f5f9;
    border: 1px solid #1e293b1a;
    border-radius: 8px;
    cursor: pointer;
    transition: background-color 0.12s;
    flex-shrink: 0;
}

    .address-nickname-popup .modal-body .details-tab .det-settings-btn img[b-4gftjconwj] {
        height: 15px;
    }

    .address-nickname-popup .modal-body .details-tab .det-settings-btn:hover[b-4gftjconwj] {
        background-color: #e2e8f0;
    }

/* ── Drawings table ── */
.address-nickname-popup .modal-body .details-tab .det-drawings-table-wrap[b-4gftjconwj] {
    border: 1px solid #1e293b0f;
    box-shadow: 0px 20px 20px -12px #1e293b08, 0px 3px 3px -1.5px #1e293b08, 0px 1px 1px -0.5px #1e293b08;
    border-radius: 10px;
    overflow: hidden;
}

.address-nickname-popup .modal-body .details-tab .det-drawings-table[b-4gftjconwj] {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}

    .address-nickname-popup .modal-body .details-tab .det-drawings-table thead tr[b-4gftjconwj] {
        background-color: #f8fafc;
        border-bottom: 1px solid #1e293b1a;
    }

    .address-nickname-popup .modal-body .details-tab .det-drawings-table th[b-4gftjconwj] {
        padding: 10px 14px;
        font-size: 12px;
        font-weight: 700;
        color: var(--gray-txt);
        text-align: left;
        border-right: 1px solid #1e293b0a;
    }

        .address-nickname-popup
        .modal-body
        .details-tab
        .det-drawings-table
        th:last-child[b-4gftjconwj],
        .address-nickname-popup
        .modal-body
        .details-tab
        .det-drawings-table
        td:last-child[b-4gftjconwj] {
            border-right: none;
        }

    .address-nickname-popup .modal-body .details-tab .det-drawings-table td[b-4gftjconwj] {
        padding: 10px 14px;
        font-weight: 600;
        color: var(--dark-txt);
        border-bottom: 1px solid #1e293b0a;
        border-right: 1px solid #1e293b0a;
        vertical-align: middle;
    }

    .address-nickname-popup
    .modal-body
    .details-tab
    .det-drawings-table
    tbody
    tr:last-child
    td[b-4gftjconwj] {
        border-bottom: none;
    }

    .address-nickname-popup .modal-body .details-tab .det-drawings-table tbody tr[b-4gftjconwj] {
        transition: background-color 0.12s;
    }

        .address-nickname-popup
        .modal-body
        .details-tab
        .det-drawings-table
        tbody
        tr:hover[b-4gftjconwj] {
            background-color: #f8faff;
        }

.address-nickname-popup .modal-body .details-tab .col-check[b-4gftjconwj] {
    width: 40px;
    text-align: center;
}

.address-nickname-popup .modal-body .details-tab .det-checkbox[b-4gftjconwj] {
    width: 16px;
    height: 16px;
    accent-color: var(--purple);
    cursor: pointer;
}

.address-nickname-popup .modal-body .details-tab .det-row-actions[b-4gftjconwj] {
    display: flex;
    align-items: center;
    gap: 6px;
}

.address-nickname-popup .modal-body .details-tab .det-row-action-btn[b-4gftjconwj] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    background: transparent;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    transition: background-color 0.12s;
}

    .address-nickname-popup .modal-body .details-tab .det-row-action-btn img[b-4gftjconwj] {
        height: 14px;
    }

    .address-nickname-popup .modal-body .details-tab .det-row-action-btn:hover[b-4gftjconwj] {
        background-color: #f1f5f9;
    }

/* ── Uploaded files list ── */
.address-nickname-popup .modal-body .details-tab .det-files-list[b-4gftjconwj] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.address-nickname-popup .modal-body .details-tab .det-file-item[b-4gftjconwj] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
}

.address-nickname-popup .modal-body .details-tab .det-file-remove[b-4gftjconwj] {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--orange);
    font-size: 15px;
    font-weight: 700;
    line-height: 1;
    padding: 0;
    transition: opacity 0.15s;
}

    .address-nickname-popup .modal-body .details-tab .det-file-remove:hover[b-4gftjconwj] {
        opacity: 0.7;
    }

.address-nickname-popup .modal-body .details-tab .det-file-name[b-4gftjconwj] {
    font-size: 13px;
    font-weight: 600;
    color: var(--purple);
    text-decoration: underline;
    cursor: pointer;
}

/* ── Actions row ── */
.address-nickname-popup .modal-body .details-tab .det-actions-row[b-4gftjconwj] {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.address-nickname-popup .modal-body .details-tab .det-make-inactive-btn[b-4gftjconwj] {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 9px 16px;
    background-color: #ed40301f;
    /* border: 1px solid #ed403044; */
    border: none;
    border-radius: 10px;
    font-family: "Plus Jakarta Sans", sans-serif;
    font-size: 13px;
    font-weight: 700;
    color: var(--orange);
    cursor: pointer;
    transition: background-color 0.15s;
    backdrop-filter: blur(24px);
    box-shadow: 0px 1px 1px -0.5px #1e293b08, 0px 3px 3px 0px #ffffff1f inset;
}

    .address-nickname-popup .modal-body .details-tab .det-make-inactive-btn:hover[b-4gftjconwj] {
        background-color: #ed403022;
    }

.address-nickname-popup .modal-body .details-tab .det-delete-btn[b-4gftjconwj],
.address-nickname-popup .modal-body .details-tab .det-success-btn[b-4gftjconwj] {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 9px 16px;
    background-color: #B82213;
    border: none;
    border-radius: 10px;
    font-family: "Plus Jakarta Sans", sans-serif;
    font-size: 13px;
    font-weight: 700;
    color: var(--white);
    cursor: pointer;
    transition: opacity 0.15s;
    backdrop-filter: blur(24px);
    box-shadow: 0px 1px 1px -0.5px #1e293b08, 0px 3px 3px 0px #ffffff1f inset;
}

.address-nickname-popup .modal-body .details-tab .det-success-btn[b-4gftjconwj] {
    background-color: #296C28;
}

    .address-nickname-popup .modal-body .details-tab .det-delete-btn:hover[b-4gftjconwj],
    .address-nickname-popup .modal-body .details-tab .det-success-btn:hover[b-4gftjconwj] {
        opacity: 0.88;
    }

/* ── Date picker ── */
.address-nickname-popup .modal-body .details-tab .det-datepicker-wrap[b-4gftjconwj],
.det-datepicker-wrap[b-4gftjconwj] {
    display: flex;
    align-items: center;
    gap: 10px;
    background-color: var(--white);
    border: 1px solid #1e293b1f;
    border-radius: 10px;
    padding: 0 12px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
    transition: border-color 0.15s, box-shadow 0.15s;
}

    .address-nickname-popup
    .modal-body
    .details-tab
    .det-datepicker-wrap:focus-within[b-4gftjconwj],
    .det-datepicker-wrap:focus-within[b-4gftjconwj] {
        box-shadow: 0 0 0 3px #5263ff22;
    }

.address-nickname-popup .modal-body .details-tab .det-datepicker-input[b-4gftjconwj],
.det-datepicker-input[b-4gftjconwj] {
    border: none !important;
    box-shadow: none !important;
    padding-left: 0 !important;
    background: transparent;
}

/* ════════════════════════════
   SUB-MODALS
════════════════════════════ */
.det-submodal-backdrop[b-4gftjconwj] {
    position: absolute;
    inset: 0;
    background-color: rgba(15, 23, 42, 0.35);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1100;
    border-radius: inherit;
}

.det-submodal[b-4gftjconwj] {
    background-color: var(--white);
    border-radius: 20px;
    width: 100%;
    max-width: 520px;
    overflow: hidden;
    box-shadow: 0 24px 48px rgba(0, 0, 0, 0.16);
    animation: submodalIn-b-4gftjconwj 0.22s cubic-bezier(0.22, 1, 0.36, 1) both;
}

@keyframes submodalIn-b-4gftjconwj {
    from {
        transform: scale(0.94) translateY(12px);
        opacity: 0;
    }

    to {
        transform: scale(1) translateY(0);
        opacity: 1;
    }
}

.det-submodal-header[b-4gftjconwj] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    padding: 24px 24px 16px;
    gap: 12px;
}

.det-submodal-title[b-4gftjconwj] {
    font-size: 18px;
    font-weight: 800;
    color: var(--dark-txt);
    letter-spacing: -0.3px;
    margin: 0 0 6px;
    line-height: 1.3;
}

.det-submodal-subtitle[b-4gftjconwj] {
    font-size: 13px;
    font-weight: 500;
    color: var(--gray-txt-2);
    line-height: 1.5;
    margin: 0 0 6px;
}

.det-submodal-warning[b-4gftjconwj] {
    font-size: 13px;
    font-weight: 700;
    color: var(--yellow);
    line-height: 1.5;
    margin: 0;
}

.det-submodal-close[b-4gftjconwj] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    min-width: 36px;
    background-color: #f1f5f9;
    border: 1px solid #1e293b1f;
    border-radius: 10px;
    cursor: pointer;
    transition: background-color 0.15s;
}

    .det-submodal-close:hover[b-4gftjconwj] {
        background-color: #e2e8f0;
    }

    .det-submodal-close img[b-4gftjconwj] {
        height: 14px;
    }

.det-submodal-body[b-4gftjconwj] {
    /* padding: 0 24px; */
    background-color: #f1f5f9cc;
}

.det-submodal-divider[b-4gftjconwj] {
    border: 1px solid #1e293b17;
    margin: 0;
}

.det-submodal-footer[b-4gftjconwj] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 16px 24px;
}

.det-submodal-cancel-btn[b-4gftjconwj] {
    flex: 1;
    padding: 12px;
    background-color: #f1f5f9cc;
    border: 1px solid #1e293b17;
    border-radius: 14px;
    font-family: "Plus Jakarta Sans", sans-serif;
    font-size: 14px;
    font-weight: 700;
    color: var(--dark-txt);
    cursor: pointer;
    transition: background-color 0.15s;
}

    .det-submodal-cancel-btn:hover[b-4gftjconwj] {
        background-color: #e2e8f0;
    }

.det-submodal-assign-btn[b-4gftjconwj] {
    flex: 1;
    padding: 12px;
    background-color: var(--l-purple);
    border: 1px solid #5263ff22;
    border-radius: 14px;
    font-family: "Plus Jakarta Sans", sans-serif;
    font-size: 14px;
    font-weight: 700;
    color: var(--purple-2);
    cursor: pointer;
    transition: background-color 0.15s;
}

    .det-submodal-assign-btn:hover[b-4gftjconwj] {
        background-color: #dce0ff;
    }

.det-submodal-confirm-btn[b-4gftjconwj] {
    flex: 1;
    padding: 12px;
    background: linear-gradient(var(--purple), var(--purple)) padding-box, linear-gradient(90deg, #1e293b17, #1e293b2e) border-box;
    border: 1px solid transparent;
    border-radius: 14px;
    backdrop-filter: blur(24px);
    box-shadow: 0px 1px 1px -0.5px #1e293b08, 0px 3px 3px 0px #ffffff1f inset;
    font-family: "Plus Jakarta Sans", sans-serif;
    font-size: 14px;
    font-weight: 700;
    color: var(--white);
    cursor: pointer;
    transition: opacity 0.15s;
}

    .det-submodal-confirm-btn:hover[b-4gftjconwj] {
        opacity: 0.88;
    }

.rule-action-btn[b-4gftjconwj] {
    background: none;
    border: none;
    cursor: pointer;
    padding: 4px;
    border-radius: 6px;
    transition: background 0.15s;
}

    .rule-action-btn:hover[b-4gftjconwj] {
        background: #f1f5f9;
    }

.rule-header[b-4gftjconwj] {
    display: flex !important;
    align-items: center !important;
    margin-bottom: 12px !important;
    gap: 5px;
}

/*subcontractor proce command costs edit*/
.sub-edit .prices-section[b-4gftjconwj] {
    margin-top: 24px;
}

    .sub-edit .prices-section:first-child[b-4gftjconwj] {
        margin-top: 0;
    }

.sub-edit .prices-section-header[b-4gftjconwj] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 12px;
}

.sub-edit .prices-section-title[b-4gftjconwj] {
    font-size: 18px;
    font-weight: 800;
    line-height: 24px;
    letter-spacing: -0.3px;
    color: var(--dark-txt);
    margin: 0;
}

.sub-edit .prices-section-subtitle[b-4gftjconwj] {
    font-size: 13px;
    font-weight: 700;
    color: #475569;
}

.sub-edit .prices-edit-card[b-4gftjconwj] {
    background-color: #ffffff;
    border: 1px solid #1e293b17;
    border-radius: 24px;
    overflow: hidden;
    box-shadow: 0px 20px 20px -12px #1e293b08, 0px 3px 3px -1.5px #1e293b08, 0px 1px 1px -0.5px #1e293b08;
}

.sub-edit .prices-edit-card-inner[b-4gftjconwj] {
    padding: 16px;
}

.sub-edit .prices-edit-grid-header[b-4gftjconwj],
.sub-edit .prices-edit-grid-row[b-4gftjconwj] {
    display: grid;
    grid-template-columns: 1fr 160px 160px;
    gap: 16px;
    padding: 10px 16px;
    align-items: center;
}

    /*For per season table columns*/
    .sub-edit .prices-edit-grid-header.cols-3-equal[b-4gftjconwj],
    .sub-edit .prices-edit-grid-row.cols-3-equal[b-4gftjconwj] {
        grid-template-columns: 1fr 1fr 1fr;
    }

.sub-edit .prices-edit-grid-header[b-4gftjconwj] {
    background-color: #f1f5f9;
    border-top: none;
    border-bottom: none;
}

    .sub-edit .prices-edit-grid-header span[b-4gftjconwj] {
        font-size: 12px;
        font-weight: 700;
        color: var(--gray-txt);
        display: flex;
        align-items: center;
        gap: 4px;
        letter-spacing: -0.1px;
    }

.sub-edit .prices-edit-grid-row[b-4gftjconwj] {
    background-color: var(--white);
    border-bottom: none;
}

    .sub-edit .prices-edit-grid-row.alt-row[b-4gftjconwj] {
        background-color: #f8fafc;
    }

.sub-edit .prices-select-wrap[b-4gftjconwj] {
    position: relative;
}

.sub-edit .prices-input[b-4gftjconwj] {
    width: 100%;
    height: 40px;
    margin-bottom: auto;
    padding: 6px 8px;
    background-color: var(--white);
    border: 1px solid #1e293b1f;
    border-radius: 10px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
    font-family: "Plus Jakarta Sans", sans-serif;
    font-size: 13px;
    font-weight: 600;
    color: var(--dark-txt);
    outline: none;
    transition: border-color 0.15s, box-shadow 0.15s;
}

    .sub-edit .prices-input:focus[b-4gftjconwj] {
        box-shadow: 0 0 0 0.2rem #dce0ff;
    }

    .sub-edit .prices-input[b-4gftjconwj]::placeholder {
        color: #5F6E85;
    }

    .sub-edit .prices-input[type="number"][b-4gftjconwj]::-webkit-outer-spin-button,
    .sub-edit .prices-input[type="number"][b-4gftjconwj]::-webkit-inner-spin-button {
        -webkit-appearance: none;
    }

.empty-text-primary[b-4gftjconwj] {
    color: var(--gray-txt);
    font-size: 18px;
    font-weight: 800;
}

/* ---------------------------------------------------------------- offer estimate + actions */

/* The cards down the offer panel — the estimate, the subcontractor, the prices, the discount
   — were siblings with no rhythm of their own, so they sat flush against each other and read
   as one undivided block. A gap on the stack spaces every pair, including the several that
   are behind an @if and may or may not be there on a given offer. */
.ldm-actions-section[b-4gftjconwj] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.off-estimate[b-4gftjconwj] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    padding: 16px;
    border: 1px solid #E3E7F5;
    border-radius: 12px;
    background: #F6F7FF;
}

.off-estimate-label[b-4gftjconwj] {
    margin: 0;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #9AA2B1;
}

.off-estimate-value[b-4gftjconwj] {
    margin: 4px 0 0;
    font-size: 24px;
    font-weight: 800;
    color: #1F2430;
    letter-spacing: -0.02em;
}

.off-estimate-note[b-4gftjconwj] {
    margin: 2px 0 0;
    font-size: 12px;
    color: #6B7280;
}

.off-estimate-warn[b-4gftjconwj] {
    margin: 4px 0 0;
    font-size: 13px;
    font-weight: 600;
    color: #B47500;
}

    .off-estimate-warn a[b-4gftjconwj] {
        color: #5263FF;
        margin-left: 6px;
    }

.off-lines[b-4gftjconwj] {
    width: 100%;
    margin-top: 12px;
    font-size: 13px;
}

    .off-lines td[b-4gftjconwj] {
        padding: 6px 4px;
        border-bottom: 1px solid #EEF0F3;
        color: #374151;
    }

    .off-lines tr:last-child td[b-4gftjconwj] {
        border-bottom: none;
    }

.off-chip-dot[b-4gftjconwj] {
    display: inline-block;
    width: 8px;
    height: 8px;
    border-radius: 2px;
    margin-right: 4px;
}

.off-status[b-4gftjconwj] {
    display: inline-block;
    padding: 3px 9px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    white-space: nowrap;
    flex: none;
}

.off-status-draft[b-4gftjconwj] { background: #E7F3FB; color: #1583C4; }
.off-status-sent[b-4gftjconwj] { background: #EEF0FF; color: #3730A3; }
.off-status-approved[b-4gftjconwj] { background: #E9F7EE; color: #1F7A43; }
.off-status-declined[b-4gftjconwj] { background: #FDECEA; color: #DF2917; }

.off-btn[b-4gftjconwj] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    height: 36px;
    padding: 0 14px;
    border-radius: 9px;
    border: 1px solid transparent;
    font-size: 13px;
    font-weight: 700;
    cursor: pointer;
    white-space: nowrap;
}

    .off-btn:disabled[b-4gftjconwj] {
        opacity: 0.55;
        cursor: not-allowed;
    }

.off-btn-primary[b-4gftjconwj] { background: #5263FF; color: #FFFFFF; }
.off-btn-success[b-4gftjconwj] { background: #16A34A; color: #FFFFFF; }
.off-btn-danger[b-4gftjconwj] { background: #DF2917; color: #FFFFFF; }
.off-btn-ghost[b-4gftjconwj] { background: #FFFFFF; color: #374151; border-color: #E3E7F5; }
.off-btn-icon[b-4gftjconwj] { background: #EEF2FF; color: #2563EB; }

.off-legend[b-4gftjconwj] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 12px;
}

.off-chip[b-4gftjconwj] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 3px 8px;
    border-radius: 8px;
    background: #F3F4F8;
    color: #374151;
    font-size: 12px;
    font-weight: 600;
    white-space: nowrap;
}

.off-lines-head td[b-4gftjconwj] {
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: #9AA2B1;
}

.off-estimate-value small[b-4gftjconwj] {
    font-size: 12px;
    font-weight: 600;
    color: #6B7280;
}

.off-estimate-season[b-4gftjconwj] {
    margin: 2px 0 0;
    font-size: 14px;
    color: #374151;
}

.off-side-by-side[b-4gftjconwj] {
    display: grid;
    grid-template-columns: minmax(0, 1.7fr) minmax(190px, 1fr);
    gap: 10px;
    margin-top: 10px;
    align-items: start;
}

@media (max-width: 640px) {
    .off-side-by-side[b-4gftjconwj] { grid-template-columns: 1fr; }
}

.off-card[b-4gftjconwj] {
    border: 1px solid #E3E7F5;
    border-radius: 12px;
    padding: 10px 12px;
    background: #FFFFFF;
}

.off-discount[b-4gftjconwj] {
    background: #F6F7FF;
}

.off-card-title[b-4gftjconwj] {
    margin: 0 0 8px;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #9AA2B1;
}

.off-card-empty[b-4gftjconwj], .off-card-hint[b-4gftjconwj] {
    margin: 6px 0 0;
    font-size: 12px;
    color: #6B7280;
}

.off-nearby[b-4gftjconwj] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 5px;
}

    .off-nearby li[b-4gftjconwj] {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        column-gap: 8px;
        align-items: baseline;
    }

.off-nearby-name[b-4gftjconwj] { font-size: 12.5px; font-weight: 700; color: #1F2430; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.off-nearby-address[b-4gftjconwj] { font-size: 11px; color: #6B7280; grid-column: 1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.off-nearby-dist[b-4gftjconwj] { font-size: 11.5px; font-weight: 700; color: #3730A3; grid-column: 2; grid-row: 1 / span 2; text-align: right; white-space: nowrap; }

.off-discount-control[b-4gftjconwj] {
    display: flex;
    align-items: center;
    gap: 6px;
}

.off-step[b-4gftjconwj] {
    width: 30px;
    height: 30px;
    border-radius: 9px;
    border: 1px solid #E3E7F5;
    background: #F6F7FF;
    color: #3730A3;
    font-size: 18px;
    font-weight: 700;
    cursor: pointer;
}

    .off-step:disabled[b-4gftjconwj] { opacity: 0.5; cursor: not-allowed; }

.off-discount-input[b-4gftjconwj] {
    width: 64px;
    height: 30px;
    border: 1px solid #E3E7F5;
    border-radius: 9px;
    text-align: right;
    padding: 0 8px;
    font-size: 14px;
    font-weight: 700;
    color: #1F2430;
}

.off-discount-unit[b-4gftjconwj] { font-weight: 700; color: #6B7280; }

.off-discount-gross[b-4gftjconwj] {
    margin: 8px 0 0;
    font-size: 12px;
    color: #6B7280;
}

    .off-discount-gross s[b-4gftjconwj] { color: #9AA2B1; }

.off-discount-delta[b-4gftjconwj] {
    margin: 8px 0 0;
    font-size: 15px;
    font-weight: 800;
}

    .off-discount-delta.is-discount[b-4gftjconwj] { color: #1F7A43; }
    .off-discount-delta.is-surcharge[b-4gftjconwj] { color: #B47500; }
    .off-discount-delta small[b-4gftjconwj] { font-size: 11px; font-weight: 600; color: #6B7280; }

.off-discount-gross[b-4gftjconwj] { margin: 2px 0 0; }

.off-lines-total td[b-4gftjconwj] {
    font-weight: 800;
    color: #3730A3;
    background: #EEF0FF;
    border-bottom: none;
}

/* The crew the offer is priced for, above the nearby/discount pair. */
.off-subcontractor[b-4gftjconwj] {
    margin-bottom: 12px;
}

/* An approved offer is an address: the panel reads it and sends the reader to the address page. */
.off-converted-note[b-4gftjconwj] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 12px;
    margin-bottom: 16px;
    padding: 12px 16px;
    border: 1px solid #BFDBFE;
    border-radius: 8px;
    background: #EFF6FF;
}

.off-converted-note p[b-4gftjconwj] {
    margin: 0;
    font-size: 13px;
    line-height: 18px;
    color: #1E3A8A;
}

.off-converted-link[b-4gftjconwj] {
    border: none;
    background: none;
    padding: 0;
    font-size: 13px;
    font-weight: 600;
    color: #363AF5;
    text-decoration: underline;
    white-space: nowrap;
}
/* /Pages/Offers/Offers.razor.rz.scp.css */
/* New offer share button style */
.share-btn[b-4z7e82wu2e] {
    background: #5263ff;
    border: 1px solid #5263ff;
    color: #ffffff;
    border-radius: 8px;
    font-weight: 700;
    gap: 8px;
    height: 44px;
    padding: 0 16px;
    cursor: pointer;
    transition: all 0.2s ease-in-out;
}

    .share-btn:hover[b-4z7e82wu2e] {
        background: #3b4df2;
        border-color: #3b4df2;
        box-shadow: 0 4px 12px rgba(82, 99, 255, 0.25);
    }

/* Main offers table card */
.main-table[b-4z7e82wu2e] {
    background: #ffffff;
    border: 1px solid #e5e7eb;
    border-radius: 20px;
    box-shadow: 0 18px 34px rgba(15, 23, 42, .07);
    overflow: visible;
}

/* Header container of table */
.top-side[b-4z7e82wu2e] {
    align-items: center;
    border-bottom: 1px #1E293B0F solid;
    background-color: var(--white);
    padding: 16px;
    border-radius: 20px 20px 0 0;
}

/* Search bar styling */
.search-input[b-4z7e82wu2e] {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    height: 44px;
    padding: 0 14px;
    display: flex;
    align-items: center;
    width: 280px;
    transition: all 0.2s ease-in-out;
}

    .search-input:focus-within[b-4z7e82wu2e] {
        border-color: #5263ff;
        background: #ffffff;
        box-shadow: 0 0 0 3px rgba(82, 99, 255, 0.15);
    }

    .search-input input[b-4z7e82wu2e] {
        background: transparent;
        border: 0;
        color: #1e293b;
        font-size: 14px;
        font-weight: 600;
        outline: none;
    }

        .search-input input[b-4z7e82wu2e]::placeholder {
            color: #94a3b8;
        }

/* Tab/bag styles for statuses */
.bag[b-4z7e82wu2e] {
    background: #f1f5f9;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 600;
    padding: 8px 12px;
    transition: all 0.2s ease;
    letter-spacing: -0.2px;
    line-height: 16px;
    color: #1E293B;
}

    .bag:hover[b-4z7e82wu2e] {
        background: #e2e8f0;
        color: #334155;
    }

    .bag.active[b-4z7e82wu2e] {
        background: #eef0ff;
        color: #5263ff;
    }

    .bag span[b-4z7e82wu2e] {
        font-size: 12px;
        font-weight: 600;
        opacity: 0.85;
    }

/* Table container scroll wrapper */
.table-container[b-4z7e82wu2e] {
    width: 100%;
    overflow-x: auto;
}

/* Core table layout */
table[b-4z7e82wu2e] {
    border-collapse: collapse;
    width: 100%;
}

th[b-4z7e82wu2e] {
    text-transform: uppercase;
    text-align: left;
    padding: 10px 16px !important;
    background-color: #F8FAFC;
    font-size: 12px !important;
    font-weight: 600 !important;
    line-height: 16px !important;
    letter-spacing: -0.2px !important;
    color: var(--gray-txt-2) !important;
}

td[b-4z7e82wu2e] {
    font-size: 13px !important;
    font-weight: 700;
    line-height: 20px;
    letter-spacing: -0.2px;
    color: var(--dark-txt) !important;
    position: relative;
    padding: 14px 16px !important;
    vertical-align: middle;
}

/* Primary row styling */
.main-row[b-4z7e82wu2e] {
    border-bottom: 1px solid #eef2f7;
    font-weight: 700;
    transition: background 0.15s ease;
}

    .main-row:hover[b-4z7e82wu2e] {
        background: #f8fafc;
    }

    .main-row td p[b-4z7e82wu2e] {
        margin: 0;
        color: var(--dark-txt);
        font-weight: 700;
    }

/* Customer "New" badge */
.bagge[b-4z7e82wu2e] {
    background-color: #06B1F11F;
    font-size: 12px !important;
    font-weight: 600 !important;
    padding: 4px 8px !important;
    border-radius: 8px !important;
    line-height: 16px;
    letter-spacing: -0.2px;
    color: #0071A7;
}

/* General inline count/status badge */
.icon-bagge[b-4z7e82wu2e] {
    padding: 4px 6px;
    background-color: #06B1F11F;
    border-radius: 8px;
    gap: 2px;
    width: max-content;
}

    .icon-bagge img[b-4z7e82wu2e] {
        height: 14px;
        width: 14px;
    }

    .icon-bagge span[b-4z7e82wu2e] {
        font-size: 12px;
        font-weight: 600;
        line-height: 16px;
        letter-spacing: -0.2px;
        color: #0071A7;
        padding: 0 2px;
    }

    .icon-bagge.sky[b-4z7e82wu2e] {
        background: #e0f2fe;
        border-color: #bae6fd;
        color: #0369a1;
    }

    .icon-bagge.yellow[b-4z7e82wu2e] {
        background: #fef3c7;
        border-color: #fde68a;
        color: #b45309;
    }

    .icon-bagge.green[b-4z7e82wu2e] {
        background: #dcfce7;
        border-color: #bbf7d0;
        color: #15803d;
    }

/* Three-dot menu button */
.three-dot[b-4z7e82wu2e] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border: none;
    border-radius: 6px;
    background: transparent;
    cursor: pointer;
    transition: background 0.12s, transform 0.2s;
    flex-shrink: 0;
    outline: none;
}

    .three-dot:hover[b-4z7e82wu2e] {
        background: #f1f5f9;
    }

/* Action dropdown menu using popover style from Shifts */
.shift-action-menu[b-4z7e82wu2e] {
    min-width: 135px;
    padding: 6px;
    border-radius: 24px;
    background: #fff;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.shift-menu-item[b-4z7e82wu2e] {
    width: 100%;
    height: 40px;
    padding: 4px 16px;
    border: none;
    background: transparent;
    display: flex;
    align-items: center;
    gap: 12px;
    color: #475569;
    font-size: 14px;
    font-weight: 600;
    line-height: 24px;
    border-radius: 16px;
    cursor: pointer;
    transition: background 0.15s ease;
}

    .shift-menu-item:hover[b-4z7e82wu2e] {
        background: #EEF0FF;
    }

    .shift-menu-item.danger[b-4z7e82wu2e] {
        color: #ef4444;
    }

        .shift-menu-item.danger:hover[b-4z7e82wu2e] {
            background: #fff5f5;
        }

    .shift-menu-item.success[b-4z7e82wu2e] {
        color: #2E8B39;
    }

        .shift-menu-item.success:hover[b-4z7e82wu2e] {
            background: #409B3F1F;
        }

    .shift-menu-item span[b-4z7e82wu2e] {
        margin: 0;
        color: inherit;
        font-size: 14px;
        font-weight: 600;
        line-height: 24px;
    }

    .shift-menu-item img[b-4z7e82wu2e] {
        height: 14px;
        width: 14px;
    }

/* Location button */
.location-btn[b-4z7e82wu2e] {
    padding: 8px;
    background-color: #F1F5F9CC;
    border: 1px #1E293B0F solid;
    border-radius: 8px;
    gap: 2px;
    height: 32px;
}

    .location-btn img[b-4z7e82wu2e] {
        height: 16px;
        width: 16px;
    }

    .location-btn p[b-4z7e82wu2e] {
        font-size: 12px;
        font-weight: 600;
        line-height: 16px;
        letter-spacing: -0.2px;
        color: var(--dark-txt);
        padding: 0 4px;
    }

/* Arrow toggle style */
.arrow[b-4z7e82wu2e] {
    padding: 7px;
    background-color: #5263FF1F;
    border-radius: 8px;
    height: 32px;
    width: 32px;
}

    .arrow img[b-4z7e82wu2e] {
        height: 18px;
        width: 18px;
    }



/* Pagination container styles */
.bottom-side[b-4z7e82wu2e] {
    background: #ffffff;
    border-top: 1px solid #e5e7eb;
    border-bottom-left-radius: 20px;
    border-bottom-right-radius: 20px;
}

.pagination button[b-4z7e82wu2e] {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    color: #5F6E85;
    font-size: 14px;
    font-weight: 700;
    height: 38px;
    min-width: 38px;
    padding: 0 6px;
    cursor: pointer;
    transition: all 0.15s ease;
}

    .pagination button:hover:not(:disabled)[b-4z7e82wu2e] {
        background: #e2e8f0;
        color: #334155;
    }

    .pagination button.active[b-4z7e82wu2e] {
        background: #5263ff;
        border-color: #5263ff;
        color: #ffffff;
    }

    .pagination button:disabled[b-4z7e82wu2e] {
        opacity: 0.5;
        cursor: not-allowed;
    }

.pagination .arrow img[b-4z7e82wu2e] {
    height: 14px;
    width: 14px;
}

.bottom-side p[b-4z7e82wu2e] {
    margin: 0;
    font-size: 14px;
    font-weight: 600;
    color: #5F6E85;
}

.bottom-side select[b-4z7e82wu2e] {
    font-size: 13px;
    font-weight: 700;
    color: #334155;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    padding: 4px 8px;
    outline: none;
    cursor: pointer;
}

.bottom-side hr[b-4z7e82wu2e] {
    height: 24px;
    width: 1px;
    background: #e2e8f0;
    border: 0;
    margin: 0 8px;
    display: inline-block;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .top-side[b-4z7e82wu2e] {
        flex-direction: column;
        align-items: stretch;
        gap: 12px;
    }

    .search-input[b-4z7e82wu2e] {
        width: 100%;
    }
}

/* ---------------------------------------------------------------- offers redesign */

/* The Default prices button sits beside the primary one in the title bar and reads the same
   way: white text and icon. */
.off-ghost-btn[b-4z7e82wu2e],
.off-ghost-btn p[b-4z7e82wu2e] {
    color: #fff !important;
}
.off-ghost-btn[b-4z7e82wu2e] {
    height: 44px;
    padding: 0 16px;
    border-radius: 9px;
    font-weight: 700;
}
.off-ghost-btn img[b-4z7e82wu2e] {
    filter: brightness(0) invert(1);
}

.off-customer-name[b-4z7e82wu2e] {
    font-weight: 700;
    color: #1F2430;
}

.main-row.expanded td[b-4z7e82wu2e] {
    background: #F6F7FF;
}

.off-pending-pill[b-4z7e82wu2e] {
    background: #EEF0FF !important;
    color: #3730A3 !important;
    border-radius: 8px;
    padding: 4px 10px;
    font-weight: 700;
}

    .off-pending-pill .off-dot[b-4z7e82wu2e] {
        background: #5263FF;
    }

.off-dot[b-4z7e82wu2e] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #9AA2B1;
    display: inline-block;
    margin-right: 6px;
}

.accordion-row[b-4z7e82wu2e] {
    border-bottom: 1px solid #EEF0F3;
}

    .accordion-row .accordion-content[b-4z7e82wu2e] {
        display: grid;
        grid-template-rows: 0fr;
        transition: grid-template-rows 0.2s ease;
    }

    .accordion-row.open .accordion-content[b-4z7e82wu2e] {
        grid-template-rows: 1fr;
    }

.accordion-inner[b-4z7e82wu2e] {
    overflow: hidden;
    background: #FBFBFC;
    padding: 0 16px;
}

.accordion-row.open .accordion-inner[b-4z7e82wu2e] {
    padding: 8px 16px 16px 48px;
}

.off-sub-table th[b-4z7e82wu2e] {
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: #9AA2B1;
    padding: 8px 12px;
    background: transparent;
    border-bottom: 1px solid #EEF0F3;
}

.off-sub-table td[b-4z7e82wu2e] {
    padding: 10px 12px;
    border-bottom: 1px solid #EEF0F3;
    background: #FFFFFF;
    vertical-align: middle;
}

.off-sub-row:hover td[b-4z7e82wu2e] {
    background: #F6F7FF;
}

.off-sub-table .txt p[b-4z7e82wu2e] {
    margin: 0;
    font-weight: 700;
    color: #1F2430;
    font-size: 13px;
}

.off-sub-table .txt span[b-4z7e82wu2e] {
    font-size: 12px;
    color: #6B7280;
}

.off-thumb[b-4z7e82wu2e] {
    width: 46px;
    height: 46px;
    border-radius: 9px;
    object-fit: cover;
    border: 1px solid #E3E7F5;
    flex: none;
}

.off-thumb-empty[b-4z7e82wu2e] {
    display: flex;
    align-items: center;
    justify-content: center;
    background: #F6F7FF;
}

.off-chip[b-4z7e82wu2e] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 3px 8px;
    border-radius: 8px;
    background: #F3F4F8;
    color: #374151;
    font-size: 12px;
    font-weight: 600;
    white-space: nowrap;
}

.off-chip-more[b-4z7e82wu2e] {
    background: #EEF0FF;
    color: #3730A3;
}

.off-chip-dot[b-4z7e82wu2e] {
    width: 8px;
    height: 8px;
    border-radius: 2px;
    flex: none;
}

.off-price-pill[b-4z7e82wu2e] {
    display: inline-block;
    padding: 4px 10px;
    border-radius: 8px;
    background: #EEF0FF;
    color: #3730A3;
    font-weight: 700;
    font-size: 13px;
    white-space: nowrap;
}

.off-muted[b-4z7e82wu2e] {
    color: #9AA2B1;
}

.off-warn-text[b-4z7e82wu2e] {
    color: #B47500;
    font-weight: 700;
    font-size: 12px;
}

.off-status[b-4z7e82wu2e] {
    display: inline-block;
    padding: 3px 9px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    white-space: nowrap;
}

.off-status-draft[b-4z7e82wu2e] {
    background: #E7F3FB;
    color: #1583C4;
}

.off-status-sent[b-4z7e82wu2e] {
    background: #EEF0FF;
    color: #3730A3;
}

.off-status-approved[b-4z7e82wu2e] {
    background: #E9F7EE;
    color: #1F7A43;
}

.off-status-declined[b-4z7e82wu2e] {
    background: #FDECEA;
    color: #DF2917;
}

.off-btn[b-4z7e82wu2e] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    height: 32px;
    padding: 0 12px;
    border-radius: 9px;
    border: 1px solid transparent;
    font-size: 12px;
    font-weight: 700;
    cursor: pointer;
    white-space: nowrap;
    transition: filter 0.15s ease;
}

    .off-btn:hover:not(:disabled)[b-4z7e82wu2e] {
        filter: brightness(0.95);
    }

    .off-btn:disabled[b-4z7e82wu2e] {
        opacity: 0.55;
        cursor: not-allowed;
    }

.off-btn-primary[b-4z7e82wu2e] {
    background: #5263FF;
    color: #FFFFFF;
}

.off-btn-success[b-4z7e82wu2e] {
    background: #16A34A;
    color: #FFFFFF;
}

.off-btn-danger[b-4z7e82wu2e] {
    background: #DF2917;
    color: #FFFFFF;
}

.off-btn-warn[b-4z7e82wu2e] {
    background: #FBF3E2;
    color: #B47500;
    border-color: #F1E2BF;
}

.off-btn-ghost[b-4z7e82wu2e] {
    background: #FFFFFF;
    color: #374151;
    border-color: #E3E7F5;
}

/* The remove action: an icon, kept quiet next to the decision buttons it sits beside. */
.off-btn-remove[b-4z7e82wu2e] {
    background: #FFFFFF;
    border-color: #E3E7F5;
    padding: 0 9px;
}

    .off-btn-remove:hover:not(:disabled)[b-4z7e82wu2e] {
        background: #FDECEA;
        border-color: #F3C4BE;
        filter: none;
    }

.off-btn-icon[b-4z7e82wu2e] {
    background: #EEF2FF;
    color: #2563EB;
    padding: 0 9px;
}

.off-empty[b-4z7e82wu2e] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    color: #9AA2B1;
    font-weight: 600;
}

.off-empty-sub[b-4z7e82wu2e] {
    padding: 16px;
    color: #9AA2B1;
    font-size: 13px;
    text-align: center;
}

.off-total-area[b-4z7e82wu2e] {
    margin-top: 4px;
    font-size: 11px;
    color: #6B7280;
}

/* Amber rather than red: the total above it is right, and this is the note explaining why
   it is smaller than adding the chips up would suggest. */
.off-overlap-area[b-4z7e82wu2e] {
    margin-top: 2px;
    font-size: 11px;
    color: #92400E;
    cursor: help;
}

.off-price-pill small[b-4z7e82wu2e],
.off-season small[b-4z7e82wu2e] {
    font-size: 10px;
    font-weight: 600;
    opacity: 0.75;
    margin-left: 2px;
}

.off-season[b-4z7e82wu2e] {
    margin-top: 4px;
    font-size: 12px;
    font-weight: 700;
    color: #1F2430;
}

.off-discount-badge[b-4z7e82wu2e] {
    display: inline-block;
    margin-left: 6px;
    padding: 2px 7px;
    border-radius: 8px;
    background: #E9F7EE;
    color: #1F7A43;
    font-size: 11px;
    font-weight: 700;
}

.off-discount-badge.is-surcharge[b-4z7e82wu2e] {
    background: #FBF3E2;
    color: #B47500;
}

/* Approval dialog: the prices under review. */
.off-approve-lines td[b-4z7e82wu2e] {
    vertical-align: middle;
}
.off-approve-input[b-4z7e82wu2e] {
    width: 120px;
    height: 36px;
    padding: 0 10px;
    border: 1px solid #1e293b1f;
    border-radius: 8px;
    text-align: right;
    font-size: 13px;
}

/* "And X more" under a customer's matched addresses when a search hid the rest. */
.off-more-link[b-4z7e82wu2e] {
    display: inline-block;
    margin: 8px 12px 4px;
    padding: 0;
    border: 0;
    background: none;
    color: #0D6EFD;
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
}

.off-more-link:hover[b-4z7e82wu2e] {
    text-decoration: underline;
}
/* /Pages/PrivacyPolicy.razor.rz.scp.css */
.privacy-policy-page[b-viajp3jp4f] {
    padding: 96px 0 64px;
    background: #fff;
}

.privacy-policy-container[b-viajp3jp4f] {
    max-width: 768px;
    margin: 0 auto;
    padding: 0 24px;
}

.privacy-policy-title[b-viajp3jp4f] {
    font-size: 36px;
    font-weight: 700;
    color: var(--dark-txt);
    margin-bottom: 16px;
}

.privacy-policy-updated[b-viajp3jp4f] {
    font-size: 14px;
    color: #6B7280;
    margin-bottom: 32px;
}

.privacy-policy-intro[b-viajp3jp4f] {
    font-size: 18px;
    line-height: 1.7;
    color: #6B7280;
    margin-bottom: 32px;
}

.privacy-policy-section[b-viajp3jp4f] {
    margin-bottom: 32px;
}

.privacy-policy-heading[b-viajp3jp4f] {
    font-size: 24px;
    font-weight: 700;
    color: var(--dark-txt);
    margin-bottom: 16px;
}

.privacy-policy-text[b-viajp3jp4f] {
    font-size: 16px;
    line-height: 1.7;
    color: #6B7280;
}

.privacy-policy-link[b-viajp3jp4f] {
    color: var(--purple);
    text-decoration: underline;
}
/* /Pages/Reports/Export/Export.razor.rz.scp.css */
/* Scoped for the same reason the reports page is: the global sheet carries bare
   element rules under the dashboard's tile classes (`.box span { margin-top: 4px }`
   and friends) that outrank anything put on a child by class alone. Starting from
   its own scope means this page inherits nothing it did not ask for. */

/* Same measure and inset as /Reports, so moving between the two tabs of the
   Reports group does not move the page under the reader. */
.export-page[b-0u8gjiyczf] {
    display: flex;
    flex-direction: column;
    gap: var(--wm-card-gap);
    width: 100%;
    max-width: 1680px;
    margin: 0 auto;
    padding: 24px var(--wm-page-inset) 40px;
}

/* ---- tabs ---- */

.export-tabs[b-0u8gjiyczf] {
    gap: 4px;
    border-bottom: 1px solid var(--wm-card-border-color);
}

.export-tab[b-0u8gjiyczf] {
    border: 0;
    background: none;
    padding: 10px 18px;
    font-size: 14px;
    font-weight: 600;
    color: var(--gray-txt);
    /* The underline is on the tab itself rather than on a moving marker, so the
       selected tab keeps its own baseline against the border below the row. */
    border-bottom: 2px solid transparent;
    margin-bottom: -1px;
}

.export-tab:hover[b-0u8gjiyczf] {
    color: #5263FF;
}

.export-tab.active[b-0u8gjiyczf] {
    color: #5263FF;
    border-bottom-color: #5263FF;
}

/* ---- toolbar ---- */

.export-toolbar-card[b-0u8gjiyczf] {
    background: var(--wm-card-bg);
    border: 1px solid var(--wm-card-border-color);
    border-radius: var(--wm-card-radius);
    box-shadow: var(--wm-card-shadow);
    min-height: var(--wm-header-row-height);
    padding: var(--wm-card-padding);
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
}

.export-filter-field[b-0u8gjiyczf] {
    width: min(240px, 100%);
}

.export-chip[b-0u8gjiyczf] {
    border: 1px solid var(--wm-card-border-color);
    background: var(--wm-card-bg);
    border-radius: 999px;
    padding: 7px 14px;
    font-size: 12px;
    font-weight: 600;
    color: var(--gray-txt);
    line-height: 1.2;
    white-space: nowrap;
}

.export-chip:hover:not(:disabled)[b-0u8gjiyczf] {
    border-color: #5263FF;
    color: #5263FF;
}

.export-chip.selected[b-0u8gjiyczf] {
    background: #5263FF;
    border-color: #5263FF;
    color: #fff;
}

.export-chip:disabled[b-0u8gjiyczf] {
    opacity: 0.6;
}

/* ---- states ---- */

.export-state[b-0u8gjiyczf] {
    background: var(--wm-card-bg);
    border: 1px solid var(--wm-card-border-color);
    border-radius: var(--wm-card-radius);
    box-shadow: var(--wm-card-shadow);
    padding: 48px 20px;
    color: #5263FF;
}

.export-state p[b-0u8gjiyczf] {
    margin: 0;
    font-size: 13px;
    font-weight: 500;
    color: var(--gray-txt-2);
}

.export-state.error p[b-0u8gjiyczf] {
    color: #C0301F;
}

.export-empty[b-0u8gjiyczf] {
    font-size: 13px;
    font-weight: 500;
    color: var(--gray-txt-2);
    margin: 0;
    padding: 8px 0;
}

.export-link[b-0u8gjiyczf] {
    font-size: 13px;
    font-weight: 600;
    color: #5263FF;
    background: none;
    border: 0;
    padding: 0;
    white-space: nowrap;
    text-decoration: none;
}

.export-link:hover:not(:disabled)[b-0u8gjiyczf] {
    text-decoration: underline;
}

.export-link:disabled[b-0u8gjiyczf] {
    opacity: 0.5;
}

.export-link.muted[b-0u8gjiyczf] {
    color: var(--gray-txt);
}

/* ---- catalogue ---- */

.export-section[b-0u8gjiyczf] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.export-section-head h3[b-0u8gjiyczf] {
    font-size: 17px;
    font-weight: 700;
    color: var(--dark-txt);
    margin: 0;
}

/* Auto-fill rather than auto-fit: with three exports in a category, auto-fit
   would stretch each card to a third of a wide monitor and the catalogue would
   look emptier the fewer it holds. */
.export-grid[b-0u8gjiyczf] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 16px;
}

.export-template-card[b-0u8gjiyczf] {
    position: relative;
    background: var(--wm-card-bg);
    border: 1px solid var(--wm-card-border-color);
    border-radius: var(--wm-card-radius);
    box-shadow: var(--wm-card-shadow);
    display: flex;
    min-width: 0;
}

.export-template-card:hover[b-0u8gjiyczf] {
    border-color: #5263FF;
}

.export-template-card.selected[b-0u8gjiyczf] {
    border-color: #5263FF;
    box-shadow: 0 0 0 1px #5263FF;
}

/* The whole card is the target, minus the corner the star occupies — an export
   is opened by pointing at it, not by finding a link inside it. */
.export-template-body[b-0u8gjiyczf] {
    border: 0;
    background: none;
    text-align: left;
    padding: 16px 44px 16px 16px;
    width: 100%;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.export-template-body h4[b-0u8gjiyczf] {
    font-size: 15px;
    font-weight: 700;
    color: var(--dark-txt);
    margin: 0;
    overflow-wrap: anywhere;
}

/* Two lines exactly, so every card in a row is the same height whatever the
   description runs to, and the grid does not go ragged as the catalogue grows. */
.export-template-desc[b-0u8gjiyczf] {
    font-size: 12px;
    font-weight: 500;
    color: var(--gray-txt-2);
    line-height: 1.5;
    margin: 0;
    min-height: 36px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.export-template-foot[b-0u8gjiyczf] {
    margin-top: auto;
}

.export-template-last[b-0u8gjiyczf] {
    font-size: 11px;
    font-weight: 500;
    color: var(--gray-txt-2);
    white-space: nowrap;
}

.export-template-star[b-0u8gjiyczf] {
    position: absolute;
    top: 10px;
    right: 10px;
    border: 0;
    background: none;
    padding: 4px;
    line-height: 1;
    font-size: 15px;
    color: #CBD5E1;
}

.export-template-star:hover:not(:disabled)[b-0u8gjiyczf],
.export-template-star.on[b-0u8gjiyczf] {
    color: #F59E0B;
}

.export-template-star:disabled[b-0u8gjiyczf] {
    opacity: 0.6;
}

.export-badge[b-0u8gjiyczf] {
    display: inline-block;
    background: #EEF2FF;
    color: #4338CA;
    border-radius: 999px;
    padding: 2px 9px;
    font-size: 11px;
    font-weight: 700;
    white-space: nowrap;
}

/* ---- history ---- */

.export-card[b-0u8gjiyczf] {
    background-color: var(--wm-card-bg);
    border: 1px solid var(--wm-card-border-color);
    border-radius: var(--wm-card-radius);
    box-shadow: var(--wm-card-shadow);
    padding: 20px;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

/* `.custom-table` takes its padding and striping from rules nested under the
   global `.graph-box`, which this page has no reason to reproduce in its markup.
   The same look is rebuilt here against the card instead. */
.export-table[b-0u8gjiyczf] {
    border-collapse: collapse;
    border-spacing: 0;
    width: 100%;
    font-size: 14px;
}

.export-table thead th[b-0u8gjiyczf] {
    background: #F1F5F9;
    color: var(--gray-txt);
    font-size: 13px;
    font-weight: 600;
    padding: 8px 16px;
    text-align: left;
    white-space: nowrap;
}

.export-table thead th:first-child[b-0u8gjiyczf] {
    border-radius: 12px 0 0 12px;
}

.export-table thead th:last-child[b-0u8gjiyczf] {
    border-radius: 0 12px 12px 0;
}

.export-table tbody tr[b-0u8gjiyczf] {
    background: var(--white);
}

.export-table tbody tr:nth-child(even)[b-0u8gjiyczf] {
    background: #F8FAFC;
}

.export-table tbody tr:hover[b-0u8gjiyczf] {
    background: #F1F5F9;
    transition: 0.2s ease;
}

/* The row a notification deep-linked to. Marked with a rule down its edge rather
   than a fill, so it survives the zebra striping underneath it. */
.export-table tbody tr.highlighted[b-0u8gjiyczf],
.export-table tbody tr.highlighted:hover[b-0u8gjiyczf] {
    background: #EEF2FF;
    box-shadow: inset 3px 0 0 #5263FF;
}

.export-table tbody td[b-0u8gjiyczf] {
    padding: 10px 16px;
    font-size: 13px;
    font-weight: 600;
    color: var(--gray-txt);
    vertical-align: top;
}

.export-table tbody td:first-child[b-0u8gjiyczf] {
    border-radius: 12px 0 0 12px;
}

.export-table tbody td:last-child[b-0u8gjiyczf] {
    border-radius: 0 12px 12px 0;
}

.export-table th.numeric[b-0u8gjiyczf],
.export-table td.numeric[b-0u8gjiyczf] {
    text-align: right;
    white-space: nowrap;
}

.export-nowrap[b-0u8gjiyczf] {
    white-space: nowrap;
}

.export-cell-name[b-0u8gjiyczf] {
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
}

.export-row-name[b-0u8gjiyczf] {
    font-weight: 600;
    color: var(--dark-txt);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    min-width: 0;
}

/* The filters an export ran with can be a sentence; one line of it is enough to
   tell two runs of the same template apart, and the title carries the rest. */
.export-row-note[b-0u8gjiyczf] {
    display: block;
    max-width: 260px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-weight: 500;
}

.export-status[b-0u8gjiyczf] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    border-radius: 999px;
    padding: 3px 10px;
    font-size: 11px;
    font-weight: 700;
    white-space: nowrap;
}

.export-status.queued[b-0u8gjiyczf] {
    background: #F1F5F9;
    color: #475569;
}

.export-status.running[b-0u8gjiyczf] {
    background: #EEF2FF;
    color: #4338CA;
}

.export-status.succeeded[b-0u8gjiyczf] {
    background: #E7F6EA;
    color: #2F7A2E;
}

/* Produced but not mailed: the file is real and downloadable, so neither green nor red tells
   the truth. Amber, with the reason on the tooltip like a failure's. */
.export-status.warning[b-0u8gjiyczf] {
    background: #FEF4E6;
    color: #B45309;
    cursor: help;
}

.export-status.failed[b-0u8gjiyczf] {
    background: #FCEBE9;
    color: #C0301F;
    /* The reason is on the tooltip, so the pill has to look like something worth pointing at */
    cursor: help;
}

.export-status.closed[b-0u8gjiyczf] {
    background: #F1F5F9;
    color: var(--gray-txt-2);
}

.export-actions-column[b-0u8gjiyczf] {
    text-align: right;
    white-space: nowrap;
}

/* Ten rows, then scroll, the same window the reports tables use. */
.export-scroll[b-0u8gjiyczf] {
    max-height: 560px;
    overflow-y: auto;
    overflow-x: auto;
}

.export-scroll .export-table thead th[b-0u8gjiyczf] {
    position: sticky;
    top: 0;
    z-index: 1;
}

.export-pagination[b-0u8gjiyczf] {
    padding-top: 4px;
}

/* ---- run panel ---- */

/* A panel rather than a dialogue in the middle: the parameters are read against
   the catalogue behind them, and an export is picked, filled in and run without
   the page underneath being taken away. */
.export-panel-backdrop[b-0u8gjiyczf] {
    position: fixed;
    inset: 0;
    background: rgba(15, 23, 42, 0.35);
    z-index: 1050;
}

.export-panel[b-0u8gjiyczf] {
    position: fixed;
    top: 0;
    right: 0;
    height: 100%;
    width: min(460px, 100%);
    background: var(--white);
    box-shadow: -8px 0 32px rgba(15, 23, 42, 0.18);
    z-index: 1055;
    display: flex;
    flex-direction: column;
}

.export-panel-head[b-0u8gjiyczf] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    padding: 20px 20px 16px;
    border-bottom: 1px solid #EBECED;
}

.export-panel-title[b-0u8gjiyczf] {
    min-width: 0;
}

.export-panel-title h3[b-0u8gjiyczf] {
    font-size: 17px;
    font-weight: 700;
    color: var(--dark-txt);
    margin: 0;
    overflow-wrap: anywhere;
}

.export-panel-title p[b-0u8gjiyczf] {
    font-size: 12px;
    font-weight: 500;
    color: var(--gray-txt-2);
    line-height: 1.5;
    margin: 6px 0 0;
}

/* The body scrolls on its own so the run button never leaves the screen, however
   many parameters a template grows. */
.export-panel-body[b-0u8gjiyczf] {
    flex: 1 1 auto;
    overflow-y: auto;
    padding: 20px;
    display: flex;
    flex-direction: column;
    gap: 18px;
}

.export-panel-foot[b-0u8gjiyczf] {
    padding: 16px 20px;
    border-top: 1px solid #EBECED;
}

.export-field[b-0u8gjiyczf] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.export-field > label[b-0u8gjiyczf] {
    font-size: 13px;
    font-weight: 600;
    color: var(--dark-txt);
    margin: 0;
}

.export-required[b-0u8gjiyczf] {
    color: #C0301F;
}
/* /Pages/Reports/Reports.razor.rz.scp.css */
/* Scoped on purpose. The home dashboard's tiles live in the global stylesheet
   under `.three-boxes .box`, where a bare `span { margin-top: 4px }` outranks any
   class put on a child; every element added there has to reset it at that weight.
   Keeping the reports page in its own scope means its cards start from nothing. */

/* Same measure and inset every other page uses (`.main-content .data-left-right`
   in the global sheet). Left to fill the viewport, the tables stretched to the
   full width of a wide monitor while the title above them stayed centred on
   1680px, so the page read as two different layouts stacked. */
.reports-page[b-11wa6i9k7j] {
    display: flex;
    flex-direction: column;
    gap: var(--wm-card-gap);
    width: 100%;
    max-width: 1680px;
    margin: 0 auto;
    padding: 24px var(--wm-page-inset) 40px;
}

/* The filter row gets a card of its own, matching the invoice workspace's
   toolbar rather than floating loose above the content. */
.reports-toolbar-card[b-11wa6i9k7j] {
    background: var(--wm-card-bg);
    border: 1px solid var(--wm-card-border-color);
    border-radius: var(--wm-card-radius);
    box-shadow: var(--wm-card-shadow);
    min-height: var(--wm-header-row-height);
    padding: var(--wm-card-padding);
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
}

.reports-export[b-11wa6i9k7j] {
    height: 40px;
    gap: 8px;
    display: inline-flex;
    align-items: center;
}

.reports-export img[b-11wa6i9k7j] {
    height: 16px;
}

/* ---- section heading with its own controls ---- */

.reports-subhead[b-11wa6i9k7j] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 12px;
    /* Pulled up against the cards it governs, so it reads as their heading
       rather than as a band floating between two sections. */
    margin-bottom: -8px;
}

.reports-subhead h2[b-11wa6i9k7j] {
    font-size: 17px;
    font-weight: 700;
    color: var(--dark-txt);
    margin: 0;
}

.reports-controls[b-11wa6i9k7j] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
}

/* One control, two states — joined rather than two loose pills, so it reads as
   a choice between them instead of two independent toggles. */
.reports-segmented[b-11wa6i9k7j] {
    display: inline-flex;
    border: 1px solid var(--wm-card-border-color);
    background: var(--wm-card-bg);
    border-radius: 999px;
    padding: 2px;
}

.reports-segmented button[b-11wa6i9k7j] {
    border: 0;
    background: none;
    border-radius: 999px;
    padding: 4px 12px;
    font-size: 12px;
    font-weight: 600;
    color: var(--gray-txt);
    line-height: 1.4;
}

.reports-segmented button:hover[b-11wa6i9k7j] {
    color: #5263FF;
}

.reports-segmented button.selected[b-11wa6i9k7j] {
    background: #5263FF;
    color: #fff;
}

/* ---- KPI row ---- */

.reports-kpis[b-11wa6i9k7j] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    gap: 24px;
}

.reports-kpi[b-11wa6i9k7j] {
    background-color: var(--wm-card-bg);
    border: 1px solid var(--wm-card-border-color);
    border-radius: var(--wm-card-radius);
    box-shadow: var(--wm-card-shadow);
    padding: 16px;
    display: flex;
    flex-direction: column;
}

.reports-kpi-label[b-11wa6i9k7j] {
    font-size: 15px;
    font-weight: 600;
    color: var(--gray-txt);
    margin: 0;
}

/* Value and its change share a baseline, so the percentage reads as a note on
   the number rather than a badge of its own. */
.reports-kpi-value[b-11wa6i9k7j] {
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 4px 8px;
    margin-top: 12px;
}

.reports-kpi-value h2[b-11wa6i9k7j] {
    font-size: 25px;
    font-weight: 700;
    color: var(--dark-txt);
    margin: 0;
}

/* A loss is worth seeing as one at a glance, the same way it is in the tables. */
.reports-kpi-value h2.negative[b-11wa6i9k7j] {
    color: #C0301F;
}

.reports-kpi-value h2 small[b-11wa6i9k7j] {
    font-size: 13px;
    font-weight: 600;
    color: var(--gray-txt);
}

.reports-kpi-sub[b-11wa6i9k7j] {
    font-size: 12px;
    font-weight: 500;
    color: var(--gray-txt-2);
    margin-top: 6px;
}

.reports-kpi-sub strong[b-11wa6i9k7j] {
    color: var(--dark-txt);
    font-weight: 700;
}

/* ---- cards ---- */

/* Two panels side by side down to tablet width, where a chart squeezed into
   half a phone screen stops being readable and they stack instead. */
.reports-row[b-11wa6i9k7j] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(340px, 1fr));
    gap: 24px;
    align-items: stretch;
}

/* Stretched rather than top-aligned, so a card is always as tall as the one
   beside it. Left to size themselves the short panels ended half the height of
   the chart they sit next to, and the row read as a ragged edge. */
.reports-card[b-11wa6i9k7j] {
    background-color: var(--wm-card-bg);
    border: 1px solid var(--wm-card-border-color);
    border-radius: var(--wm-card-radius);
    box-shadow: var(--wm-card-shadow);
    padding: 20px;
    min-width: 0;
    display: flex;
    flex-direction: column;
}

/* The body takes the slack the stretch created, so an empty state sits in the
   middle of the card rather than pinned under the heading. */
.reports-card > .reports-empty[b-11wa6i9k7j],
.reports-card > .reports-donut-layout[b-11wa6i9k7j],
.reports-card > .reports-bars[b-11wa6i9k7j],
.reports-card > .table-card[b-11wa6i9k7j] {
    flex: 1 1 auto;
}

.reports-card > .reports-empty[b-11wa6i9k7j] {
    display: flex;
    align-items: center;
    justify-content: center;
}

/* The chart panels earn the wider column; the list beside them reads fine narrow. */
@media (min-width: 1200px) {
    .reports-row:has(> .reports-card-wide)[b-11wa6i9k7j] {
        grid-template-columns: 1.6fr 1fr;
    }

    .reports-row:has(> .reports-card-half)[b-11wa6i9k7j] {
        grid-template-columns: 1fr 1fr;
    }
}

.reports-card-head[b-11wa6i9k7j] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 16px;
}

.reports-card-head h3[b-11wa6i9k7j] {
    font-size: 17px;
    font-weight: 700;
    color: var(--dark-txt);
    margin: 0;
}

.reports-card-head p[b-11wa6i9k7j] {
    font-size: 12px;
    font-weight: 500;
    color: var(--gray-txt-2);
    margin: 4px 0 0;
}

.reports-card-link[b-11wa6i9k7j] {
    font-size: 13px;
    font-weight: 600;
    color: #5263FF;
    background: none;
    border: 0;
    padding: 0;
    white-space: nowrap;
    text-decoration: none;
}

.reports-card-link:hover[b-11wa6i9k7j] {
    text-decoration: underline;
}

.reports-card-figure[b-11wa6i9k7j] {
    text-align: right;
    white-space: nowrap;
}

.reports-card-figure strong[b-11wa6i9k7j] {
    display: block;
    font-size: 22px;
    font-weight: 700;
}

.reports-card-figure strong.positive[b-11wa6i9k7j] {
    color: #2F7A2E;
}

.reports-card-figure strong.negative[b-11wa6i9k7j] {
    color: #C0301F;
}

.reports-card-figure span[b-11wa6i9k7j] {
    font-size: 11px;
    font-weight: 500;
    color: var(--gray-txt-2);
}

.reports-chart[b-11wa6i9k7j] {
    height: 260px;
}

.reports-empty[b-11wa6i9k7j] {
    font-size: 13px;
    font-weight: 500;
    color: var(--gray-txt-2);
    text-align: center;
    padding: 32px 0;
    margin: 0;
}

/* ---- cost donut ---- */

.reports-donut-layout[b-11wa6i9k7j] {
    display: flex;
    align-items: center;
    gap: 20px;
    flex-wrap: wrap;
}

.reports-donut[b-11wa6i9k7j] {
    position: relative;
    width: 150px;
    height: 150px;
    flex-shrink: 0;
}

.reports-legend[b-11wa6i9k7j] {
    list-style: none;
    padding: 0;
    margin: 0;
    flex: 1 1 160px;
    min-width: 0;
}

.reports-legend li[b-11wa6i9k7j] {
    display: grid;
    grid-template-columns: 10px minmax(0, 1fr) auto auto;
    align-items: center;
    gap: 4px 8px;
    padding: 5px 0;
    font-size: 13px;
    font-weight: 500;
    color: var(--dark-txt);
}

/* The share is secondary to the amount: you check the money against an invoice,
   the percentage only tells you how the ring is carved up. */
.reports-legend li small[b-11wa6i9k7j] {
    font-size: 11px;
    font-weight: 600;
    color: var(--gray-txt-2);
    min-width: 46px;
    text-align: right;
}

.reports-legend li i[b-11wa6i9k7j] {
    width: 10px;
    height: 10px;
    border-radius: 3px;
    flex-shrink: 0;
}

.reports-legend li span[b-11wa6i9k7j] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.reports-legend li strong[b-11wa6i9k7j] {
    font-weight: 700;
    color: var(--dark-txt);
    white-space: nowrap;
}

/* ---- zone bars ---- */

.reports-bars[b-11wa6i9k7j] {
    list-style: none;
    padding: 0;
    margin: 0;
}

.reports-bars li[b-11wa6i9k7j] {
    display: grid;
    grid-template-columns: minmax(90px, 140px) 1fr auto;
    align-items: center;
    gap: 12px;
    padding: 7px 0;
}

.reports-bar-label[b-11wa6i9k7j] {
    font-size: 13px;
    font-weight: 600;
    color: var(--dark-txt);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.reports-bar-track[b-11wa6i9k7j] {
    height: 10px;
    border-radius: 999px;
    background: #EEF2F7;
    overflow: hidden;
}

.reports-bar-fill[b-11wa6i9k7j] {
    display: block;
    height: 100%;
    border-radius: 999px;
}

.reports-bars li.unallocated .reports-bar-label[b-11wa6i9k7j] {
    color: var(--gray-txt-2);
    font-style: italic;
    font-weight: 500;
}

.reports-bars li strong[b-11wa6i9k7j] {
    font-size: 13px;
    font-weight: 700;
    color: var(--dark-txt);
    white-space: nowrap;
}

/* ---- tables ---- */

/* `.custom-table` gets its padding, zebra striping and rounded ends from rules
   nested under `.main-content .data-left-right .data-left .graph-box`, which this
   page has no reason to reproduce in its markup — without them the columns render
   with no spacing at all and the figures run together. The same look is rebuilt
   here against the card instead. */
.reports-table[b-11wa6i9k7j] {
    border-collapse: collapse;
    border-spacing: 0;
    width: 100%;
    font-size: 14px;
}

.reports-table thead th[b-11wa6i9k7j] {
    background: #F1F5F9;
    color: var(--gray-txt);
    font-size: 13px;
    font-weight: 600;
    padding: 8px 16px;
    text-align: left;
    white-space: nowrap;
}

.reports-table thead th:first-child[b-11wa6i9k7j] {
    border-radius: 12px 0 0 12px;
}

.reports-table thead th:last-child[b-11wa6i9k7j] {
    border-radius: 0 12px 12px 0;
}

.reports-table tbody tr[b-11wa6i9k7j] {
    background: var(--white);
}

.reports-table tbody tr:nth-child(even)[b-11wa6i9k7j] {
    background: #F8FAFC;
}

.reports-table tbody tr:hover[b-11wa6i9k7j] {
    background: #F1F5F9;
    transition: 0.2s ease;
}

.reports-table tbody td[b-11wa6i9k7j] {
    padding: 10px 16px;
    font-size: 13px;
    font-weight: 600;
    color: var(--gray-txt);
}

.reports-table tbody td:first-child[b-11wa6i9k7j] {
    border-radius: 12px 0 0 12px;
}

.reports-table tbody td:last-child[b-11wa6i9k7j] {
    border-radius: 0 12px 12px 0;
}

/* The figures cannot wrap without losing their alignment, so the name is what
   gives way. Rather than handing the name a fixed share — which either clipped
   the name or squeezed "Omkostning" until its header clipped — the numeric
   columns size to their own content and the name column absorbs whatever is
   left. `width: 100%` claims the slack, `max-width: 0` stops a long name from
   widening the column instead of truncating inside it. */
.reports-table thead th:first-child[b-11wa6i9k7j],
.reports-table tbody td:first-child[b-11wa6i9k7j] {
    width: 100%;
    max-width: 0;
    /* A floor, so the figures cannot squeeze the name down to an ellipsis and
       nothing else — min-width beats max-width, which is what makes the pair
       work. Past this the table scrolls sideways rather than crushing the one
       column that says which row you are looking at. */
    min-width: 150px;
    overflow: hidden;
}

/* Numeric columns are narrow by nature, so they spend their width on digits
   rather than on padding. */
.reports-table thead th.numeric[b-11wa6i9k7j],
.reports-table tbody td.numeric[b-11wa6i9k7j] {
    padding-left: 8px;
    padding-right: 12px;
}

/* Only the name itself truncates. Left to the cell, the ellipsis would swallow
   the tag beside it — and "own crew" or "shared" is the one piece of reading on
   the row that is not a number. */
/* Given the height of the tallest thing that can sit in it — the customer
   avatar — so every row is the same height whether or not it carries one. The
   scroll window is measured in rows, and rows of two different heights made the
   ten-row cut land in a different place on each table. */
.reports-cell-name[b-11wa6i9k7j] {
    display: flex;
    align-items: center;
    min-width: 0;
    min-height: 26px;
}

.reports-row-name[b-11wa6i9k7j] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    min-width: 0;
}

.reports-cell-name .reports-tag[b-11wa6i9k7j],
.reports-cell-name .reports-avatar[b-11wa6i9k7j],
.reports-cell-name .reports-swatch[b-11wa6i9k7j] {
    flex: 0 0 auto;
}

/* Ten rows, then scroll. Measured rather than guessed: the sticky header is 33px
   and a row is 46px, so ten rows need 493px — the extra leaves the eleventh row
   part-visible, which is what tells you the list continues. */
.reports-scroll[b-11wa6i9k7j] {
    max-height: 509px;
    overflow-y: auto;
    overflow-x: auto;
}

/* The header has to survive the scroll, or the columns lose their names as soon
   as you move. It carries its own background — the rows pass underneath it. */
.reports-scroll .reports-table thead th[b-11wa6i9k7j] {
    position: sticky;
    top: 0;
    z-index: 1;
}

/* The column the list is ordered by, marked so the ranking is visible in the
   table and not only in the control above it. */
.reports-table thead th.ranked[b-11wa6i9k7j] {
    color: #5263FF;
}

/* A loss reads as a loss. */
.reports-table tbody td.negative[b-11wa6i9k7j] {
    color: #C0301F;
}

.reports-table th.numeric[b-11wa6i9k7j],
.reports-table td.numeric[b-11wa6i9k7j] {
    text-align: right;
    white-space: nowrap;
}

.reports-row-name[b-11wa6i9k7j] {
    font-weight: 600;
    color: var(--dark-txt);
}

.reports-table td.numeric[b-11wa6i9k7j] {
    overflow: visible;
}

/* The unallocated row is part of the arithmetic rather than a subject of its
   own, so it is set back from the named rows instead of sorted among them. */
.reports-table tr.unallocated td[b-11wa6i9k7j] {
    color: var(--gray-txt-2);
    font-style: italic;
}

.reports-table tr.unallocated .reports-row-name[b-11wa6i9k7j] {
    color: var(--gray-txt-2);
    font-weight: 500;
}

/* A customer row opens that customer's sidebar, so it has to read as something
   you can click. */
.reports-table tbody tr.reports-row-clickable[b-11wa6i9k7j] {
    cursor: pointer;
}

/* The name is a button so the row is reachable from the keyboard, but it has to
   look like the text beside it rather than like a control. Colour and weight are
   left to .reports-row-name, which the button also carries. */
.reports-row-open[b-11wa6i9k7j] {
    padding: 0;
    border: 0;
    background: none;
    font-family: inherit;
    font-size: inherit;
    line-height: inherit;
    text-align: start;
}

.reports-row-open:focus-visible[b-11wa6i9k7j] {
    outline: 2px solid #5263FF;
    outline-offset: 2px;
    border-radius: 4px;
}

.reports-tag[b-11wa6i9k7j] {
    display: inline-block;
    margin-left: 6px;
    padding: 1px 7px;
    border-radius: 999px;
    background: #EEF2F7;
    font-size: 10px;
    font-weight: 600;
    font-style: normal;
    color: var(--gray-txt);
    vertical-align: middle;
}

.reports-swatch[b-11wa6i9k7j] {
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 3px;
    margin-right: 8px;
    vertical-align: middle;
}

.reports-avatar[b-11wa6i9k7j] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 26px;
    height: 26px;
    border-radius: 8px;
    margin-right: 8px;
    color: #fff;
    font-size: 12px;
    font-weight: 700;
    vertical-align: middle;
}
/* /Pages/Routes/Components/AddDriversPopup.razor.rz.scp.css */
.adp-modal-content[b-2yo9ohjv72] {
	border: 1px solid #1e293b08 !important;
	border-radius: 16px !important;
	box-shadow:
		0px 32px 32px -16px #1e293b08,
		0px 20px 20px -12px #1e293b08,
		0px 3px 3px -1.5px #1e293b08,
		0px 1px 1px -0.5px #1e293b08 !important;
	overflow: hidden;
	background-color: #FFFFFF;
}

[b-2yo9ohjv72] .modal-header {
	padding: 16px 20px !important;
	margin: 0 !important;
}

.adp-modal-body[b-2yo9ohjv72] {
	display: flex;
	flex-direction: row;
	height: 520px;
}

/* Crew on the left, everyone still available on the right, each scrolling on its own. */
.adp-column[b-2yo9ohjv72] {
	display: flex;
	flex-direction: column;
	min-width: 0;
	border-top: 1px solid #E2E8F0;
}

.adp-assigned-column[b-2yo9ohjv72] {
	flex: 1;
	background-color: #F8FAFC;
	border-right: 1px solid #E2E8F0;
}

.adp-available-column[b-2yo9ohjv72] {
	flex: 1;
}

.adp-column-list[b-2yo9ohjv72] {
	flex-grow: 1;
	overflow-y: auto;
	scrollbar-width: thin;
	min-height: 0;
}

.adp-column-list[b-2yo9ohjv72]::-webkit-scrollbar {
	width: 6px;
}

.adp-column-list[b-2yo9ohjv72]::-webkit-scrollbar-track {
	background: transparent;
}

.adp-column-list[b-2yo9ohjv72]::-webkit-scrollbar-thumb {
	background-color: #CBD5E1;
	border-radius: 3px;
}

.adp-empty[b-2yo9ohjv72] {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 100%;
	padding: 24px;
	font-size: 13px;
	color: #94A3B8;
	text-align: center;
}

.adp-header[b-2yo9ohjv72] {
	width: 100%;
	display: flex;
	align-items: center;
	gap: 16px;
}

.adp-icon-wrapper[b-2yo9ohjv72] {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 48px;
	height: 48px;
	background-color: #5263FF1F;
	border-radius: 10px;
	color: #4F46E5;
}

.adp-title-wrap[b-2yo9ohjv72] {
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 4px;
}

.adp-title[b-2yo9ohjv72] {
	font-size: 18px;
	font-weight: 700;
	color: #1E293B;
	margin: 0;
}

.adp-subtitle[b-2yo9ohjv72] {
	font-size: 13px;
	color: #5F6E85;
	margin: 0;
}

.adp-assigned-column .adp-driver-row[b-2yo9ohjv72] {
	background-color: #FFFFFF;
}

.adp-section-title[b-2yo9ohjv72] {
	flex-shrink: 0;
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: #5F6E85;
	margin: 0;
	padding: 8px 24px 4px 24px;
}

.adp-search-container[b-2yo9ohjv72] {
	flex-shrink: 0;
	background-color: #F8FAFC;
	padding: 8px 16px;
	border-bottom: 1px solid #E2E8F0;
	width: 100%;
}

[b-2yo9ohjv72] .adp-search-container .wm-search-input {
	max-width: 100% !important;
}

.adp-driver-row[b-2yo9ohjv72] {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 8px 16px;
	border-bottom: 1px solid #F1F5F9;
}

.adp-driver-left[b-2yo9ohjv72] {
	display: flex;
	align-items: center;
	gap: 12px;
	flex: 1;
	min-width: 0;
}

.adp-driver-names[b-2yo9ohjv72] {
	display: flex;
	flex-direction: row;
	gap: 5px;
	align-items: baseline;
	min-width: 0;
	flex: 1;
	white-space: nowrap;
	overflow: hidden;
}

.adp-driver-name[b-2yo9ohjv72] {
	font-size: 13px;
	font-weight: 600;
	color: #1E293B;
	margin: 0;
	white-space: nowrap;
}

.adp-driver-surname[b-2yo9ohjv72] {
	font-size: 13px;
	color: #1E293B;
	margin: 0;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.adp-driver-email[b-2yo9ohjv72] {
	font-size: 12px;
	color: #5F6E85;
	flex: 1.3;
	margin: 0;
	text-align: left;
	padding-left: 12px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.adp-action-wrap[b-2yo9ohjv72] {
	display: flex;
	align-items: center;
	gap: 12px;
	flex-shrink: 0;
	padding-left: 12px;
	justify-content: end;
}

.btn-add[b-2yo9ohjv72], .btn-remove[b-2yo9ohjv72] {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	height: 32px;
	width: 84px;
	border: none;
	border-radius: 8px;
	font-size: 13px;
	font-weight: 600;
	cursor: pointer;
	transition: background-color 0.2s;
	padding: 0;
}

.btn-add[b-2yo9ohjv72] {
	background-color: #3B82F6;
	color: #FFFFFF;
}

.btn-add:hover[b-2yo9ohjv72] {
	background-color: #2563EB;
}

.btn-remove[b-2yo9ohjv72] {
	background-color: #FEE2E2;
	color: #EF4444;
}

.btn-remove:hover[b-2yo9ohjv72] {
	background-color: #FCA5A5;
}

.btn-add:disabled[b-2yo9ohjv72], .btn-remove:disabled[b-2yo9ohjv72] {
	opacity: 0.6;
	cursor: not-allowed;
}
/* /Pages/Routes/Components/CreateRoutePopup.razor.rz.scp.css */
/* ─── Labels ────────────────────────────────────────────────────────────────── */
.nrp-body-wrap[b-e196gty4j5] {
  padding: 16px 20px 8px;
  background: #f1f5f9;
}

.nrp-label[b-e196gty4j5] {
  font-size: 13px;
  font-weight: 700;
  color: var(--gray-txt);
  letter-spacing: -0.1px;
  margin-bottom: 0;
}

.nrp-required[b-e196gty4j5] {
  color: var(--orange, #f97316);
}

.nrp-validation[b-e196gty4j5] {
  font-size: 12px;
  font-weight: 600;
  color: var(--orange, #f97316);
}

/* ─── Text input ────────────────────────────────────────────────────────────── */
.nrp-input[b-e196gty4j5] {
  width: 100%;
  padding: 10px 14px;
  background-color: #fff;
  border: 1px solid #1e293b1f;
  border-radius: 10px;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.04);
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: 13px;
  font-weight: 600;
  color: var(--dark-txt);
  outline: none;
  transition:
    border-color 0.15s,
    box-shadow 0.15s;
  height: 42px;
}

.nrp-input:focus[b-e196gty4j5],
.nrp-input:focus-within[b-e196gty4j5] {
  box-shadow: 0 0 0 0.2rem #dce0ff !important;
}

.nrp-input[b-e196gty4j5]::placeholder {
  color: #cbd5e1;
  font-weight: 500;
}

/* ─── Route type tabs (multi-tabs style) ────────────────────────────────────── */
.nrp-route-type-tabs[b-e196gty4j5] {
  gap: 6px;
  background-color: #ffffff;
  border: 1px solid #1e293b1f;
  border-radius: 16px;
  padding: 6px;
  box-shadow: 0px 1px 1px -0.5px #1e293b08;
}

.nrp-route-tab[b-e196gty4j5] {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 8px 12px;
  background: transparent;
  border: 1px solid transparent;
  border-radius: 10px;
  font-size: 13px;
  font-weight: 600;
  color: var(--gray-txt, #5F6E85);
  cursor: pointer;
  transition:
    background-color 0.35s cubic-bezier(0.22, 1, 0.36, 1),
    border-color 0.35s cubic-bezier(0.22, 1, 0.36, 1),
    box-shadow 0.35s cubic-bezier(0.22, 1, 0.36, 1),
    color 0.25s ease,
    transform 0.25s cubic-bezier(0.22, 1, 0.36, 1);
  will-change: transform, box-shadow, background-color, border-color, color;
}

.nrp-route-tab.active[b-e196gty4j5] {
  background: #5263ff1f;
  color: var(--purple, #5263ff);
  transform: scale(1.015);
}

.nrp-route-tab:hover:not(.active):not(:disabled)[b-e196gty4j5] {
  color: var(--dark-txt);
  transform: translateY(-1px) scale(1.01);
}

.nrp-route-tab:disabled[b-e196gty4j5] {
  color: #cbd5e1;
  cursor: not-allowed;
}

.nrp-route-type-help[b-e196gty4j5] {
  font-size: 12px;
  line-height: 16px;
  color: var(--gray-txt, #5F6E85);
  padding: 0 4px;
}

/* ─── Footer buttons ────────────────────────────────────────────────────────── */
.nrp-btn-cancel[b-e196gty4j5] {
  background-color: #f1f5f9cc;
  border: 1px solid #1e293b17;
  border-radius: 10px;
  font-size: 14px;
  font-weight: 600;
  color: var(--dark-txt);
  padding: 10px 20px;
  height: 44px;
  cursor: pointer;
}

.nrp-btn-create[b-e196gty4j5] {
  background: var(--purple, #5263ff);
  border: none;
  border-radius: 10px;
  font-size: 14px;
  font-weight: 600;
  color: #fff;
  padding: 10px 20px;
  height: 44px;
  cursor: pointer;
}

.nrp-btn-create:disabled[b-e196gty4j5] {
  opacity: 0.7;
  cursor: not-allowed;
}

.icon-button-div[b-e196gty4j5] {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
}

.nrp-owner-visibility-note[b-e196gty4j5] {
    padding: 10px 12px;
    border-radius: 8px;
    background: #F0F9FF;
    border: 1px solid #BAE6FD;
}

.nrp-owner-visibility-note p[b-e196gty4j5] {
    font-size: 13px;
    line-height: 18px;
    color: #075985;
}
/* /Pages/Routes/Components/ExistingRouteCard.razor.rz.scp.css */
/* ── Card shell ─────────────────────────────────────────────────────────── */
.erc-card[b-qnxdyjmmbc] {
    background: #ffffff;
    border-radius: 14px;
    box-shadow: 0px 1px 3px 0px #1e293b14, 0px 1px 2px 0px #1e293b0a;
    transition: box-shadow 0.15s ease;
}

.erc-card--expanded[b-qnxdyjmmbc] {
    box-shadow: 0px 4px 12px 0px #1e293b18, 0px 1px 3px 0px #1e293b10;
}

/* ── Main row ────────────────────────────────────────────────────────────── */
.erc-row[b-qnxdyjmmbc] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 16px;
    cursor: pointer;
    gap: 12px;
    user-select: none;
}

/* ── Left info ───────────────────────────────────────────────────────────── */
.erc-info[b-qnxdyjmmbc] {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.erc-name[b-qnxdyjmmbc] {
    font-size: 13px;
    font-weight: 700;
    color: #1E293B;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    letter-spacing:-0.2px;
    line-height:20px;
}

.erc-meta[b-qnxdyjmmbc] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.erc-loc-count[b-qnxdyjmmbc] {
    font-size: 13px;
    color: #475569;
    font-weight:500;
    letter-spacing: -0.2px;
    line-height: 20px;
}

/* Separates stacked meta facts (roads · length · locations). */
.erc-meta .erc-loc-count + .erc-loc-count[b-qnxdyjmmbc]::before {
    content: "·";
    margin-right: 8px;
    color: #94A3B8;
}

/* ── Road route summary (shown instead of an empty stop list) ─────────────── */
.erc-road-stats[b-qnxdyjmmbc] {
    display: flex;
    gap: 8px;
    padding: 0 16px 12px 16px;
}

.erc-road-stat[b-qnxdyjmmbc] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding: 8px 10px;
    background: #F8FAFC;
    border: 1px solid #E2E8F0;
    border-radius: 10px;
}

.erc-road-assignee[b-qnxdyjmmbc] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin: 0 16px 12px 16px;
    padding: 8px 10px;
    background: #F8FAFC;
    border: 1px solid #E2E8F0;
    border-radius: 10px;
}

.erc-road-stat-label[b-qnxdyjmmbc] {
    font-size: 11px;
    font-weight: 500;
    color: #5F6E85;
    letter-spacing: -0.2px;
}

.erc-road-stat-value[b-qnxdyjmmbc] {
    font-size: 13px;
    font-weight: 700;
    color: #1E293B;
    letter-spacing: -0.2px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.erc-sub-badge[b-qnxdyjmmbc] {
    font-size: 12px;
    font-weight: 500;
    color: #475569;
    background-color: #F1F5F9;
    border: 1px solid #E2E8F0;
    border-radius: 999px;
    padding: 1px 8px;
    line-height: 18px;
    letter-spacing: -0.2px;
    max-width: 160px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* ── Badges ──────────────────────────────────────────────────────────────── */
.erc-badge[b-qnxdyjmmbc] {
    font-size: 10px;
    font-weight: 600;
    padding: 4px;
    border-radius: 6px;
    white-space: nowrap;
    color: #475569;
    letter-spacing: -0.2px;
    line-height: 16px;
    border: 1px solid #1E293B17;
    backdrop-filter: blur(24px);
    box-shadow: 0px 2px 1.5px -0.5px #1E293B08, 0px 2px 3px 0px #FFFFFF08 inset;
    background-color: #FFFFFF;
    gap: 2px;
}


/* ── Right actions ───────────────────────────────────────────────────────── */
.erc-actions[b-qnxdyjmmbc] {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-shrink: 0;
}

/* ── Eye button ──────────────────────────────────────────────────────────── */
.erc-eye-btn[b-qnxdyjmmbc] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 10px;
    border: none;
    background: #f1f5f9;
    color: #94a3b8;
    cursor: pointer;
    transition: background 0.15s ease, color 0.15s ease;
    flex-shrink: 0;
}

.erc-eye-btn:hover[b-qnxdyjmmbc] {
    background: #e2e8f0;
    color: #5F6E85;
}

.erc-eye-btn--visible[b-qnxdyjmmbc] {
    background: linear-gradient(135deg, #ede9fe 0%, #ddd6fe 100%);
    color: #5263ff;
    border: 1px solid #c4b5fd;
}

.erc-eye-btn--visible:hover[b-qnxdyjmmbc] {
    background: linear-gradient(135deg, #ddd6fe 0%, #c4b5fd 100%);
    color: #4338ca;
}

.erc-eye-btn:disabled[b-qnxdyjmmbc] {
    opacity: 0.5;
    cursor: not-allowed;
}

.erc-eye-btn:disabled:hover[b-qnxdyjmmbc] {
    background: #f1f5f9;
    color: #94a3b8;
}

/* ── Chevron button ──────────────────────────────────────────────────────── */
.erc-chevron-btn[b-qnxdyjmmbc] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 8px;
    border: none;
    background: transparent;
    cursor: pointer;
    transition: background 0.15s ease;
    flex-shrink: 0;
}

.erc-chevron-btn:hover[b-qnxdyjmmbc] {
    background: #f1f5f9;
}

/* ── Location list ───────────────────────────────────────────────────────── */
.erc-locations[b-qnxdyjmmbc] {
    /*border-top: 1px solid #f1f5f9;*/
    /*padding: 8px 0 12px;*/
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.erc-locations--empty[b-qnxdyjmmbc] {
    padding: 12px 16px;
    color: #94a3b8;
    font-size: 13px;
}

.erc-loc-item[b-qnxdyjmmbc] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 8px 16px;
}

.erc-loc-item--clickable[b-qnxdyjmmbc] {
    cursor: pointer;
    transition: background 0.1s;
}

.erc-loc-item--clickable:hover[b-qnxdyjmmbc] {
    background-color: #F1F5F9;
}

.erc-loc-num[b-qnxdyjmmbc] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 99px;
    gap: 2px;
    padding: 4px;
    background-color: #FFFFFF;
    border: 1px solid #1E293B17;
    font-size: 15px;
    font-weight: 700;
    color: #475569;
    flex-shrink: 0;
    letter-spacing:-0.2px;
    line-height:24px;
    backdrop-filter: blur(24px);
    box-shadow: 0px 2px 1.5px -0.5px #1E293B08, 0px 2px 3px 0px #FFFFFF08 inset;
}

.erc-loc-info[b-qnxdyjmmbc] {
    display: flex;
    flex-direction: column;
    gap: 1px;
    min-width: 0;
}

.erc-loc-name[b-qnxdyjmmbc] {
    font-size: 13px;
    font-weight: 700;
    color: #1E293B;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    letter-spacing: -0.2px;
    line-height: 20px;
}

.erc-loc-addr[b-qnxdyjmmbc] {
    font-size: 13px;
    font-weight:600;
    color: #475569;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    letter-spacing: -0.2px;
    line-height: 20px;
}

.erc-name-row[b-qnxdyjmmbc] {
    display: flex;
    align-items: center;
    gap: 6px;
    min-width: 0;
}

.erc-color-square[b-qnxdyjmmbc] {
    width: 10px;
    height: 10px;
    border-radius: 3px;
    flex-shrink: 0;
}
/* /Pages/Routes/Components/RoadRouteBuilderModal.razor.rz.scp.css */
/* ── Layout: the map IS the modal body and the sidebar floats over it as a
   translucent glass panel (mirrors .dl-layout/.dl-left-panel on the Dispatch
   Live Map and .zm-left-panel on the Zone Map). ── */
.rrb-body[b-37bar0whcx] {
    display: flex;
    flex-direction: row;
    height: 100%;
    overflow: hidden;
    position: relative;
    background-color: #F8FAFC;
}

/* ── Left sidebar: floats over the map ── */
.rrb-sidebar[b-37bar0whcx] {
    position: absolute;
    top: 16px;
    left: 16px;
    bottom: 16px;
    /* Above the map canvas and its built-in controls, below WMMap's popups. */
    z-index: 5;
    width: 374px;
    max-width: calc(100% - 32px);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    background-color: #FFFFFFB8;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border: 1px solid #1E293B17;
    border-radius: 16px;
    box-shadow: 0 8px 24px -8px #1E293B33;
}

/* ── Stats row (compact: label over value, four columns, one line) ── */
.rrb-stats-grid[b-37bar0whcx] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 4px;
    padding: 10px 12px;
    border-bottom: 1px solid #1E293B17;
    flex-shrink: 0;
}

.rrb-stat-box[b-37bar0whcx] {
    display: flex;
    flex-direction: column;
    gap: 0;
    letter-spacing: -0.2px;
    justify-content: center;
    align-items: center;
    min-width: 0;
}

.rrb-stat-label[b-37bar0whcx] {
    font-size: 11px;
    font-weight: 600;
    color: #5F6E85;
    line-height: 16px;
}

.rrb-stat-value[b-37bar0whcx] {
    font-size: 14px;
    font-weight: 700;
    color: #1E293B;
    line-height: 20px;
    white-space: nowrap;
}

/* ── "Avoid roads already on other routes": a sidebar rule, not a map filter, so it sits
   with the route's own numbers rather than in the map's control row. ── */
.rrb-avoid-block[b-37bar0whcx] {
    padding: 10px 16px 0;
    flex-shrink: 0;
}

.rrb-avoid-row[b-37bar0whcx] {
    display: flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
}

.rrb-avoid-label[b-37bar0whcx] {
    font-size: 13px;
    font-weight: 600;
    color: #1E293B;
    line-height: 18px;
}

.rrb-avoid-hint[b-37bar0whcx] {
    margin-top: 4px;
    padding-left: 26px;
    font-size: 11px;
    font-weight: 500;
    color: #5F6E85;
    line-height: 16px;
}

/* ── Map legend popover ── */
.rrb-legend-popover[b-37bar0whcx] {
    max-width: 320px;
}

.rrb-legend-list[b-37bar0whcx] {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 4px 0 2px;
}

.rrb-legend-row[b-37bar0whcx] {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 12px;
    font-weight: 500;
    color: #1E293B;
    line-height: 16px;
}

.rrb-legend-line[b-37bar0whcx] {
    flex: 0 0 28px;
    height: 0;
}

.rrb-legend-drawn[b-37bar0whcx] {
    height: 6px;
    background: #FFFFFF;
    border: 1.5px solid #94A3B8;
    border-radius: 3px;
}

/* ── A drawn road being saved or edited ── */
.rrb-road-editor-name[b-37bar0whcx] {
    margin-top: 8px;
    height: 34px;
    font-size: 13px;
}

.rrb-road-editor-label[b-37bar0whcx] {
    margin-top: 10px;
    font-size: 12px;
    font-weight: 600;
    color: #1E293B;
}

.rrb-road-editor-types[b-37bar0whcx] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 6px;
}

.rrb-road-editor-type[b-37bar0whcx] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    height: 30px;
    padding: 0 10px;
    border: 1.5px solid #e2e8f0;
    border-radius: 8px;
    background: #FFFFFF;
    font-size: 12px;
    font-weight: 600;
    color: #1E293B;
}

.rrb-road-editor-type--active[b-37bar0whcx] {
    background: #5263FF1F;
    border-color: #363AF5;
}

.rrb-road-editor-actions[b-37bar0whcx] {
    display: flex;
    gap: 8px;
    margin-top: 10px;
}

.rrb-road-editor-actions button[b-37bar0whcx] {
    flex: 1;
    height: 34px;
    margin: 0;
}

.rrb-road-editor-delete[b-37bar0whcx] {
    width: 100%;
    height: 32px;
    margin-top: 8px;
}

.rrb-legend-types[b-37bar0whcx] {
    flex: 0 0 28px;
    display: flex;
    gap: 2px;
}

.rrb-legend-types span[b-37bar0whcx] {
    flex: 1;
    height: 5px;
    border-radius: 2px;
}

/* ── The last imported file: compare and retry ── */
.rrb-import-block[b-37bar0whcx] {
    margin: 10px 16px 0;
    padding: 10px 12px;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    flex-shrink: 0;
}

.rrb-import-block .rrb-avoid-hint[b-37bar0whcx] {
    padding-left: 0;
}

.rrb-import-summary[b-37bar0whcx] {
    margin-top: 6px;
    font-size: 12px;
    font-weight: 600;
    color: #1E293B;
    line-height: 16px;
}

.rrb-import-distance[b-37bar0whcx] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 10px;
}

.rrb-import-distance input[type="range"][b-37bar0whcx] {
    flex: 1;
    min-width: 0;
}

.rrb-import-distance-label[b-37bar0whcx],
.rrb-import-distance-value[b-37bar0whcx] {
    font-size: 12px;
    font-weight: 600;
    color: #1E293B;
    white-space: nowrap;
}

.rrb-import-retry-btn[b-37bar0whcx] {
    margin-top: 8px;
    height: 32px;
    width: 100%;
    font-size: 13px;
}

/* ── Section header ── */
.rrb-section-header[b-37bar0whcx] {
    padding: 16px 16px 8px;
    flex-shrink: 0;
}

.rrb-section-title[b-37bar0whcx] {
    font-size: 18px;
    font-weight: 600;
    color: #1E293B;
    letter-spacing: -0.2px;
    line-height: 24px;
}

/* ── Action row (Clear / Undo) ── */
.rrb-action-row[b-37bar0whcx] {
    display: flex;
    gap: 10px;
    padding: 0 16px 12px;
    flex-shrink: 0;
}

.rrb-clear-btn[b-37bar0whcx],
.rrb-undo-btn[b-37bar0whcx] {
    flex: 1;
    height: 38px;
    justify-content: center;
}

.rrb-undo-btn:disabled[b-37bar0whcx] {
    opacity: 0.5;
    cursor: not-allowed;
}

/* ── Path point list ── */
.rrb-list-area[b-37bar0whcx] {
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.rrb-point-list[b-37bar0whcx] {
    flex: 1;
    overflow-y: auto;
    padding: 12px;
    display:flex;
    flex-direction:column;
    gap:6px;
    scrollbar-width: none;
}

.rrb-point-item[b-37bar0whcx] {
    width: 100%;
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 10px;
    border-radius: 12px;
    background: #FFFFFF;
    box-shadow: 0px 3px 3px -1.5px #1E293B08, 0px 1px 1px -0.5px #1E293B08;
    border: 1px solid #1E293B17;
}

.rrb-point-item--attached[b-37bar0whcx] {
    box-shadow: 0px 0px 0px 3px #5263FF33;
    border: 1px solid #1E293B17;
}

.rrb-point-item--clickable[b-37bar0whcx] {
    cursor: pointer;
    transition: background 0.1s, border-color 0.1s;
}

/*    .rrb-point-item--clickable:hover {
        background: #5263FF0D;
    }*/

.rrb-point-item--active[b-37bar0whcx] {
/*    background: #5263FF1F;
    border-color: #A5B4FC;*/
    box-shadow: 0px 0px 0px 3px #5263FF33;
    border: 1px solid #1E293B17;
}

.rrb-item-num[b-37bar0whcx] {
    font-size: 12px;
    font-weight: 700;
    color: #475569;
    text-align: center;
    flex-shrink: 0;
    border: 1px solid #1E293B17;
    background-color: #FFFFFF;
    border-radius: 99px;
    height: 24px;
    width: 24px;
    letter-spacing: -0.2px;
    line-height: 22px;
}

.rrb-item-info[b-37bar0whcx] {
    display: flex;
    flex-direction: column;
    gap: 1px;
    flex: 1;
    min-width: 0;
}

.rrb-item-name[b-37bar0whcx] {
    font-size: 13px;
    font-weight: 700;
    color: #1E293B;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    letter-spacing: -0.2px;
    line-height: 18px;
}

.rrb-item-addr[b-37bar0whcx] {
    font-size: 12px;
    font-weight: 600;
    color: #475569;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    letter-spacing: -0.2px;
    line-height: 18px;
}

.rrb-drag-handle[b-37bar0whcx] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    cursor: grab;
    flex-shrink: 0;
    opacity: 0.5;
    transition: opacity 0.15s;
}

.rrb-drag-handle:hover[b-37bar0whcx] {
    opacity: 1;
}

.rrb-drag-handle:active[b-37bar0whcx] {
    cursor: grabbing;
}

/* ── Centered / placeholder states ── */
.rrb-centered[b-37bar0whcx] {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 1;
    padding: 24px;
}

.rrb-placeholder[b-37bar0whcx] {
    flex-direction: column;
    text-align: center;
    font-size: 13px;
    color: #94a3b8;
}

/* ── Save button (sidebar footer) ── */
.rrb-sidebar-footer[b-37bar0whcx] {
    padding: 12px 16px;
    border-top: 1px solid #1E293B17;
    flex-shrink: 0;
}

.rrb-save-btn[b-37bar0whcx] {
    width: 100%;
    height: 42px;
    justify-content: center;
}

/* ── Map area ── */
.rrb-map-area[b-37bar0whcx] {
    flex: 1;
    position: relative;
    min-height: 0;
    overflow: hidden;
}

.rrb-map-area[b-37bar0whcx]  .wm-map-wrapper,
.rrb-map-area[b-37bar0whcx]  .wm-map-wrapper > div {
    height: 100%;
}

/* ── Map overlays ── */
.rrb-map-overlay[b-37bar0whcx] {
    position: absolute;
    top: 12px;
    z-index: 10;
    display: flex;
    align-items: flex-start;
    gap: 8px;
}

/* Clears the floating sidebar (16px inset + 374px panel + gap). */
.rrb-map-overlay--left[b-37bar0whcx] {
    left: calc(374px + 32px);
}

.rrb-map-overlay--bottom-right[b-37bar0whcx] {
    top: auto;
    bottom: 12px;
    right: 12px;
    flex-direction: column;
    align-items: flex-end;
    gap: 8px;
}

/* ── Map search box ── */
/* Directly below the existing-routes button, sharing its left edge (the tool row starts
   at 12px and is ~44px tall). The routes dropdown opens over this spot at a higher
   z-index, which is intended: the search box is hidden by it only while it is open. */
.rrb-map-area[b-37bar0whcx]  .rrb-map-search {
    top: 64px;
    left: calc(374px + 32px);
}

/* ── Paint / erase tools (same pill as the routes button, one size up) ── */
.rrb-tool-btn[b-37bar0whcx] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    border-radius: 10px;
    border: 1.5px solid #e2e8f0;
    background: rgba(255, 255, 255, 0.96);
    backdrop-filter: blur(8px);
    box-shadow: 0 2px 8px rgba(30, 41, 59, 0.08);
    cursor: pointer;
    transition: background 0.15s, border-color 0.15s;
}

.rrb-tool-btn:disabled[b-37bar0whcx],
.rrb-tool-btn--disabled[b-37bar0whcx] {
    opacity: 0.5;
    cursor: default;
}

/* The import tool is a label around a hidden file input, not a button. */
label.rrb-tool-btn[b-37bar0whcx] {
    margin: 0;
    cursor: pointer;
}

.rrb-tool-btn--active[b-37bar0whcx] {
    background: #5263FF1F;
    border-color: #363AF5;
}

.rrb-tool-btn--active-erase[b-37bar0whcx] {
    background: #EF44441F;
    border-color: #EF4444;
}

/* Slider follows the tools out of the banner, so it brings its own pill. */
.rrb-map-overlay--left .rrb-brush-size[b-37bar0whcx] {
    height: 44px;
    padding: 0 12px;
    border-radius: 10px;
    border: 1.5px solid #e2e8f0;
    background: rgba(255, 255, 255, 0.96);
    backdrop-filter: blur(8px);
    box-shadow: 0 2px 8px rgba(30, 41, 59, 0.08);
    user-select: none;
}

/* ── Existing routes button / dropdown (mirrors RouteBuilderModal) ── */
.rrb-routes-btn-wrap[b-37bar0whcx] {
    position: relative;
    display: flex;
    align-items: center;
    gap: 6px;
    user-select: none;
    padding: 6px 6px;
    border-radius: 10px;
    border: 1.5px solid #e2e8f0;
    background: rgba(255, 255, 255, 0.96);
    backdrop-filter: blur(8px);
    font-size: 13px;
    font-weight: 500;
    color: #1e293b;
    cursor: pointer;
    box-shadow: 0 2px 8px rgba(30, 41, 59, 0.08);
}

.rrb-overlay-btn[b-37bar0whcx] {
    border: none;
    height: 16px;
    width: 16px;
    background: none;
}

.rrb-routes-dropdown[b-37bar0whcx] {
    position: absolute;
    top: calc(100% + 6px);
    left: 0;
    width: 380px;
    border: 1.5px solid #1E293B0F;
    border-radius: 12px;
    box-shadow: 0 8px 24px rgba(30, 41, 59, 0.12);
    overflow: hidden;
    z-index: 20;
    background-color: #F1F5F9CC;
    backdrop-filter: blur(16px);
    display: flex;
    flex-direction: column;
    /* Nearly full height: viewport minus popup header, body padding, the trigger
       button above the dropdown, and breathing room at the bottom. */
    max-height: calc(100vh - 190px);
}

.rrb-routes-search[b-37bar0whcx] {
    padding: 12px 12px 0 12px;
    flex-shrink: 0;
}

.rrb-routes-dropdown-header[b-37bar0whcx] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px;
    border-bottom: 1px solid #1E293B0F;
    background-color: #FFFFFF8F;
}

.rrb-routes-dropdown-title[b-37bar0whcx] {
    font-size: 15px;
    font-weight: 700;
    color: #475569;
    line-height: 24px;
    letter-spacing: -0.2px;
}

.rrb-routes-list-wrapper[b-37bar0whcx] {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 12px;
}

.rrb-route-heading[b-37bar0whcx] {
    font-size: 13px;
    font-weight: 600;
    color: #363AF5;
    line-height: 24px;
    letter-spacing: -0.2px;
}

.rrb-route-icon[b-37bar0whcx] {
    width: 32px;
    height: 32px;
    background: #5263FF1F;
    border-radius: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 1;
}

/* ── Info overlay (draw toggle + hint + color picker) ── */
/* Below the search box, on the tool row's left edge. Pinned top-right it ran under the tool row
   once the row grew past the brush and eraser, and a long hint (the drawing one) vanished behind
   the buttons. Here it wraps instead, and stops short of the zoom buttons on the right. */
.rrb-info-overlay[b-37bar0whcx] {
    position: absolute;
    z-index: 4;
    top: 124px;
    left: calc(374px + 32px);
    max-width: calc(100% - 374px - 32px - 72px);
}

    .rrb-info-overlay[b-37bar0whcx]  .wm-cp-btn {
        height: 24px !important;
        padding: 0 8px !important;
        border-radius: 8px !important;
        gap: 2px !important;
    }

    .rrb-info-overlay[b-37bar0whcx]  .wm-cp-swatch-preview {
        width: 16px !important;
        height: 16px !important;
        border-radius: 4px !important;
    }

.rrb-draw-info-btn[b-37bar0whcx] {
    border: none;
    background: none;
    width: 32px;
    height: 32px;
    border-radius: 8px;
    transition: background 0.15s;
}

.rrb-draw-info-btn--active[b-37bar0whcx] {
    background: #5263FF1F;
}

.rrb-info-banner[b-37bar0whcx] {
    display: flex;
    align-items: center;
    gap: 6px;
    background: #FFFFFF;
    border-radius: 12px;
    padding: 6px 12px;
    min-height: 44px;
    font-size: 13px;
    color: #363AF5;
    line-height: 20px;
    letter-spacing: -0.2px;
    white-space: normal;
    border: 1px solid #1E293B17;
    box-shadow: 0px 56px 56px -28px #1E293B08, 0px 32px 32px -16px #1E293B08, 0px 20px 20px -12px #1E293B08, 0px 3px 3px -1.5px #1E293B08, 0px 1px 1px -0.5px #1E293B08, 0px 72px 72px -36px #1E293B08;
}

/* ── Road type filter cluster (bottom-right) ── */
.rrb-filter-pill-row[b-37bar0whcx] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.rrb-reset-filters-btn[b-37bar0whcx] {
    font-size: 13px;
    font-weight: 600;
    color: #5263FF;
    background: rgba(255, 255, 255, 0.96);
    border: 1.5px solid #e2e8f0;
    cursor: pointer;
    padding: 8px 12px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    gap: 6px;
    backdrop-filter: blur(8px);
    height: 40px;
    box-shadow: 0px 56px 56px -28px #1E293B08, 0px 32px 32px -16px #1E293B08, 0px 20px 20px -12px #1E293B08, 0px 3px 3px -1.5px #1E293B08, 0px 1px 1px -0.5px #1E293B08, 0px 72px 72px -36px #1E293B08;
}

.rrb-reset-filters-btn span[b-37bar0whcx] {
    border-bottom: 1.5px solid #9CB6FF;
}

.rrb-filter-pill[b-37bar0whcx] {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 8px 12px;
    border-radius: 10px;
    border: 1.5px solid #e2e8f0;
    background: rgba(255, 255, 255, 0.96);
    backdrop-filter: blur(8px);
    font-size: 13px;
    font-weight: 600;
    color: #1e293b;
    cursor: pointer;
    box-shadow: 0 2px 8px rgba(30, 41, 59, 0.08);
    height: 40px;
}

.rrb-filter-count[b-37bar0whcx] {
    font-size: 12px;
    font-weight: 700;
    color: #5263FF;
    background: #5263FF1F;
    border-radius: 99px;
    padding: 1px 7px;
}

/* WMPopover's own .wm-popover-content already supplies the card chrome (white bg,
   24px radius, border, shadow) — this inner wrapper only sets sizing/padding. */
.rrb-road-type-popover[b-37bar0whcx] {
    padding: 16px;
}

.rrb-road-type-header[b-37bar0whcx] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0px 0px 8px 0px;
    gap:8px;
    border-bottom: 1px solid #1E293B0F;
    margin-bottom: 6px;
}

.rrb-road-type-list[b-37bar0whcx]{
    display:flex;
    flex-direction:column;
    gap:4px;
    padding:8px 0px 0px 0px;
}

.rrb-road-type-title[b-37bar0whcx] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 16px;
    font-weight: 700;
    color: #1E293B;
}

.rrb-reset-filters-link[b-37bar0whcx] {
    font-size: 14px;
    font-weight: 600;
    color: #5263FF;
    background: none;
    border: none;
    cursor: pointer;
    padding: 0;
    text-decoration: underline;
}

.rrb-road-type-row[b-37bar0whcx] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 12px;
    border-radius: 12px;
    cursor: pointer;
    margin-bottom: 4px;
    height:40px;
    width:208px;
}

.rrb-road-type-row:hover[b-37bar0whcx] {
    background: #F8FAFC;
}

.rrb-road-type-row--checked[b-37bar0whcx],
.rrb-road-type-row--checked:hover[b-37bar0whcx] {
    background: #5263FF1F;
}

.rrb-road-swatch[b-37bar0whcx] {
    width: 24px;
    height: 6px;
    border-radius: 99px;
    flex-shrink: 0;
}

.rrb-road-type-label[b-37bar0whcx] {
    font-size: 13px;
    font-weight: 600;
    color: #475569;
    flex: 1;
    letter-spacing: -0.2px;
    line-height: 24px;
}

.rrb-road-type-row--checked .rrb-road-type-label[b-37bar0whcx] {
    color: #363AF5;
}

/* ── Custom div-based checkbox (CLAUDE.md rule #17) ── */
.rrb-custom-checkbox[b-37bar0whcx] {
    width: 18px;
    height: 18px;
    border-radius: 6px;
    padding: 2px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s;
    background: linear-gradient(180deg, #f1f5f9 0%, #ffffff 100%);
    border: 2.5px solid #d9dee3;
    backdrop-filter: blur(24px);
    box-shadow: 0px 1px 1px -0.5px #1e293b08, 0px 3px 3px 0px #ffffff1f inset;
    flex-shrink: 0;
    cursor: pointer;
}

.rrb-custom-checkbox.rrb-custom-checkbox--checked[b-37bar0whcx] {
    background: linear-gradient(180deg, #5263ff 0%, #5263ff 100%);
    color: white;
    backdrop-filter: blur(24px);
    box-shadow: 0px 1px 1px -0.5px #1e293b08, 0px 3px 3px 0px #ffffff1f inset;
    border: none;
}

.rrb-custom-checkbox--lg[b-37bar0whcx] {
    width: 26px;
    height: 26px;
    border-radius: 9px;
    font-size: 14px;
}

/* ── Map loading overlay ── */
.rrb-map-loading[b-37bar0whcx] {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(255, 255, 255, 0.75);
    z-index: 10;
    color: #5263ff;
}

/* ── Sortable drag states (classes are hardcoded in wm.sortable.js) ── */
.rlp-drag-ghost[b-37bar0whcx] {
    opacity: 0.4;
}

.rlp-drag-chosen[b-37bar0whcx] {
    background: #f8fafc;
}

/* ── Paint-selection controls (municipality) ── */

.rrb-brush-size[b-37bar0whcx] {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 0 4px;
}

.rrb-brush-size-label[b-37bar0whcx] {
    font-size: 12px;
    color: #5F6E85;
}

.rrb-brush-size input[type="range"][b-37bar0whcx] {
    width: 90px;
    accent-color: #363AF5;
}





.rrb-roadtype-breakdown[b-37bar0whcx] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding: 6px;
    margin-bottom: 8px;
    background: #FFFFFF8F;
    border: 1px solid #1E293B0F;
    border-radius: 10px;
}

/* Rows are clickable: an active row highlights that road type's painted
   stretches on the map so a wrongly-typed road stands out. */
.rrb-roadtype-breakdown-row[b-37bar0whcx] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    line-height: 22px;
    padding: 3px 6px;
    border-radius: 8px;
    cursor: pointer;
}

.rrb-roadtype-breakdown-row:hover[b-37bar0whcx] {
    background: #F1F5F9;
}

.rrb-roadtype-breakdown-row--active[b-37bar0whcx],
.rrb-roadtype-breakdown-row--active:hover[b-37bar0whcx] {
    background: #5263FF1F;
}

.rrb-roadtype-breakdown-row--active .rrb-roadtype-breakdown-label[b-37bar0whcx] {
    color: #363AF5;
    font-weight: 600;
}

.rrb-roadtype-breakdown-label[b-37bar0whcx] {
    color: #334155;
}

.rrb-roadtype-breakdown-value[b-37bar0whcx] {
    margin-left: auto;
    color: #0F172A;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
}

.rrb-locations-subheader[b-37bar0whcx] {
    margin-top: 4px;
    padding: 8px 16px 4px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.rrb-locations-subheader .rrb-section-title[b-37bar0whcx] {
    font-size: 14px;
    line-height: 20px;
}

.rrb-optimize-btn[b-37bar0whcx] {
    height: 30px;
    font-size: 12px;
    padding: 0 10px;
    justify-content: center;
}

.rrb-optimize-btn:disabled[b-37bar0whcx] {
    opacity: 0.5;
    cursor: not-allowed;
}

.rrb-optimized-label[b-37bar0whcx] {
    display: flex;
    align-items: center;
    gap: 4px;
    font-size: 12px;
    font-weight: 600;
    color: #296C28;
    line-height: 20px;
}

/* A stop whose season has ended keeps its place on the path but stands down; the Inactive tag
   beside the name says why it looks that way. */
.rrb-point-item--inactive[b-37bar0whcx] {
    opacity: 0.55;
}
/* /Pages/Routes/Components/RouteBuilderModal.razor.rz.scp.css */
/* ── Layout ── */
.rb-body[b-53auy4nrdf] {
    display: flex;
    flex-direction: row;
    height: 100%;
    overflow: hidden;
    padding: 16px;
    background-color: #FFFFFF;
    gap:16px;
}

/* ── Left sidebar ── */
.rb-sidebar[b-53auy4nrdf] {
    width: 440px;
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    background: #ffffff;
    overflow: hidden;
    border: 1px solid #1E293B0F;
    border-radius:16px;
}

.rb-sidebar-top[b-53auy4nrdf] {
    padding: 16px;
    border-bottom: 1px solid #1E293B17;
    flex-shrink: 0;
    background-color: #FFFFFF;
    gap:16px;
}

.rb-draw-btn[b-53auy4nrdf] {
    width: 100%;
    height: 40px;
    justify-content: center;
}

.rb-action-row[b-53auy4nrdf] {
    display: flex;
    gap: 10px;
}

.rb-clear-btn[b-53auy4nrdf],
.rb-optimize-btn[b-53auy4nrdf] {
    flex: 1;
    height: 38px;
    justify-content: center;
}

.rb-action-row--optimized[b-53auy4nrdf] {
    align-items: center;
    justify-content: space-between;
}

.rb-clear-btn--compact[b-53auy4nrdf] {
    flex: 1;
    width: auto;
    padding-left: 16px;
    padding-right: 16px;
}

.rb-optimized-label[b-53auy4nrdf] {
	flex: 1;
	justify-content: center;
	align-items: center;
	display: flex;
	gap: 5px;
	color: #296C28;
	font-size: 13px;
}

/* ── Sections ── */
.rb-section[b-53auy4nrdf] {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-height: 0;
    overflow: hidden;
    
}

.rb-section--removed[b-53auy4nrdf] {
    flex: 0 0 auto;
    height: 140px;
    background-color: #f1f5f9cc;
}

.rb-section-header[b-53auy4nrdf] {
    padding: 8px 16px;
    display: flex;
    align-items: center;
    gap: 10px;
    flex-shrink: 0;
    justify-content:space-between;
}

.rb-section-title[b-53auy4nrdf] {
    font-size: 14px;
    font-weight: 600;
    color: #1E293B;
    letter-spacing:-0.2px;
    line-height:20px;
}

.rb-count-badge[b-53auy4nrdf] {
    font-size: 13px;
    font-weight: 700;
    color: #475569;
    letter-spacing: -0.2px;
    line-height: 20px;
}

.rb-optimize-btn--header[b-53auy4nrdf] {
    flex: 0 0 auto;
    height: 30px;
    padding: 0 10px;
    font-size: 12px;
}

.rb-route-stats[b-53auy4nrdf] {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 0 16px 8px;
    font-size: 12px;
    font-weight: 600;
    color: #5F6E85;
    letter-spacing: -0.2px;
}

.rb-stat-pill[b-53auy4nrdf] {
    background: #f1f5f9;
    color: #475569;
    padding: 2px 10px;
    border-radius: 99px;
    white-space: nowrap;
}

.rb-stats-gain--flat[b-53auy4nrdf] {
    color: #5F6E85;
    background: #64748b1a;
}

.rb-stats-gain[b-53auy4nrdf] {
    color: #296C28;
    background: #3387321a;
    font-size: 11px;
    font-weight: 700;
    padding: 1px 6px;
    border-radius: 99px;
}

/* ── Location list ── */
.rb-location-list[b-53auy4nrdf] {
    flex: 1;
    overflow-y: auto;
    padding: 8px 12px;
    gap:6px;
    background-color: #f1f5f9cc;
}

.rb-location-item[b-53auy4nrdf] {
    width:100%;
    display: flex;
    align-items: center;
    justify-content:space-between;
    gap: 6px;
    padding: 6px 8px;
    border-radius: 12px;
    background: #FFFFFF;
    margin-bottom: 4px;
    transition: box-shadow 0.15s;
    box-shadow: 0px 20px 20px -12px #1E293B08,0px 3px 3px -1.5px #1E293B08,0px 1px 1px -0.5px #1E293B08;
    border: 1px solid #1E293B17;

}

/*.rb-location-item:hover {
    box-shadow: 0 2px 6px rgba(30, 41, 59, 0.08);
}*/

.rb-item-num[b-53auy4nrdf] {
    font-size: 12px;
    font-weight: 700;
    color: #475569;
    text-align: center;
    flex-shrink: 0;
    backdrop-filter: blur(24px);
    box-shadow: 0px 2px 1.5px -0.5px var(--Elevationshadow), inset 0px 2px 3px 0px var(--ColorWhite3);
    border: 1px solid #1E293B17;
    background-color: #FFFFFF;
    gap: 2px;
    padding: 2px;
    border-radius: 99px;
    height: 24px;
    width: 24px;
    letter-spacing: -0.2px;
    line-height: 18px;
}

.rb-item-info[b-53auy4nrdf] {
    display: flex;
    flex-direction: column;
    gap: 1px;
    flex: 1;
    min-width: 0;
}

.rb-item-name[b-53auy4nrdf] {
    font-size: 12px;
    font-weight: 700;
    color: #1E293B;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    letter-spacing: -0.2px;
    line-height: 16px;
}

.rb-item-addr[b-53auy4nrdf] {
    font-size: 11px;
    font-weight:600;
    color: #475569;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    letter-spacing: -0.2px;
    line-height: 16px;
}

.rb-location-item--locked[b-53auy4nrdf] {
    background: #f8fafc;
    border-color: #cbd5e1;
}

.rb-lock-btn[b-53auy4nrdf] {
    color: #94a3b8;
    font-size: 14px;
}

.rb-lock-btn:hover[b-53auy4nrdf] {
    color: #475569;
}

.rb-lock-btn--locked[b-53auy4nrdf] {
    color: #5263ff;
}

.rb-lock-btn--locked:hover[b-53auy4nrdf] {
    color: #3b4ae0;
}

.rb-icon-btn[b-53auy4nrdf] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border-radius: 6px;
    border: none;
    background: transparent;
    cursor: pointer;
    flex-shrink: 0;
    transition: background 0.15s;
}

.rb-icon-btn:hover[b-53auy4nrdf] {
    background: #f8fafc;
}

.rb-drag-handle[b-53auy4nrdf] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    cursor: grab;
    flex-shrink: 0;
    opacity: 0.5;
    transition: opacity 0.15s;
}

.rb-drag-handle:hover[b-53auy4nrdf] {
    opacity: 1;
}

.rb-drag-handle:active[b-53auy4nrdf] {
    cursor: grabbing;
}

/* ── Removed locations ── */
.rb-removed-list[b-53auy4nrdf] {
    overflow-y: auto;
    padding: 0 8px 8px;
    flex: 1;
}

.rb-removed-item[b-53auy4nrdf] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 4px 8px;
    border-radius: 8px;
    background: #fafafa;
    border: 1px solid #e2e8f0;
    margin-bottom: 4px;
}

.rb-readd-btn[b-53auy4nrdf] {
    display: flex;
    align-items: center;
    gap: 5px;
    padding: 5px 10px;
    border-radius: 7px;
    border: 1px solid #e2e8f0;
    background: #ffffff;
    font-size: 12px;
    font-weight: 500;
    color: #5263ff;
    cursor: pointer;
    flex-shrink: 0;
    transition: background 0.15s, border-color 0.15s;
}

.rb-readd-btn:hover[b-53auy4nrdf] {
    background: #f5f6ff;
    border-color: #c7cbff;
}

/* ── Centered / placeholder states ── */
.rb-centered[b-53auy4nrdf] {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 1;
    padding: 24px;
}

.rb-placeholder[b-53auy4nrdf] {
    flex-direction: column;
    text-align: center;
    font-size: 13px;
    color: #94a3b8;
    background-color: #f1f5f9cc;
}

/* ── Save button (sidebar footer) ── */
.rb-sidebar-footer[b-53auy4nrdf] {
    padding: 12px 16px;
    border-top: 1px solid #e2e8f0;
    flex-shrink: 0;
}

.rb-save-btn[b-53auy4nrdf] {
    width: 100%;
    height: 42px;
    justify-content: center;
}

/* ── Map area ── */
.rb-map-area[b-53auy4nrdf] {
    flex: 1;
    position: relative;
    min-height: 0;
    overflow: hidden;
}

.rb-map-area[b-53auy4nrdf]  .wm-map-wrapper,
.rb-map-area[b-53auy4nrdf]  .wm-map-wrapper > div {
    height: 100%;
}

/* ── Map overlays ── */
.rb-map-overlay[b-53auy4nrdf] {
    position: absolute;
    top: 12px;
    z-index: 10;
    display: flex;
    align-items: flex-start;
    gap: 8px;
}

.rb-map-overlay--left[b-53auy4nrdf] {
    left: 12px;
}

.rb-map-overlay--right[b-53auy4nrdf] {
    right: 56px;
    gap: 8px;
    align-items: center;
}

/* ── Map search box ── */
/* Lives inside WMMap's overlay slot, so it positions against the map wrapper. Directly
   below the existing-routes button (its row starts at 12px and is ~44px tall). The
   routes dropdown opens over this spot at a higher z-index, which is intended: the
   search box is hidden by it only while the dropdown is open. */
.rb-map-area[b-53auy4nrdf]  .rb-map-search {
    top: 64px;
    left: 12px;
}

/* ── Existing routes button / dropdown ── */
.rb-routes-btn-wrap[b-53auy4nrdf] {
    position: relative;
    display: flex;
    align-items: center;
    gap: 6px;
    user-select: none;
    padding: 6px 6px;
    border-radius: 10px;
    border: 1.5px solid #e2e8f0;
    background: rgba(255, 255, 255, 0.96);
    backdrop-filter: blur(8px);
    font-size: 13px;
    font-weight: 500;
    color: #1e293b;
    cursor: pointer;
    box-shadow: 0 2px 8px rgba(30, 41, 59, 0.08);
    transition: border-color 0.15s;
}

.rb-overlay-btn[b-53auy4nrdf] {
    border: none;
    height: 16px;
    width: 16px;
    background:none;
}

.rb-routes-dropdown[b-53auy4nrdf] {
    position: absolute;
    top: calc(100% + 6px);
    left: 0;
    width: 380px;
    border: 1.5px solid #1E293B0F;
    border-radius: 12px;
    box-shadow: 0 8px 24px rgba(30, 41, 59, 0.12);
    overflow: hidden;
    z-index: 20;
    background-color: #F1F5F9CC;
    backdrop-filter: blur(16px);
    display: flex;
    flex-direction: column;
    /* Nearly full height: viewport minus popup header, body padding, the trigger
       button above the dropdown, and breathing room at the bottom. */
    max-height: calc(100vh - 190px);
}

.rb-routes-search[b-53auy4nrdf] {
    padding: 12px 12px 0 12px;
    flex-shrink: 0;
}

.rb-routes-dropdown-header[b-53auy4nrdf] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px;
    border-bottom: 1px solid #1E293B0F;
    background-color: #FFFFFF8F;
}

.rb-routes-dropdown-title[b-53auy4nrdf] {
    font-size: 15px;
    font-weight: 700;
    color: #475569;
    line-height:24px;
    letter-spacing:-0.2px;
}

.rb-show-all-btn[b-53auy4nrdf] {
    font-size: 12px;
    font-weight: 500;
    color: #5263ff;
    background: none;
    border: none;
    cursor: pointer;
    padding: 0;
}

.rb-routes-list-wrapper[b-53auy4nrdf] {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 12px;
}

.rb-route-row[b-53auy4nrdf] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    border-radius:16px;
    transition: background 0.1s;
    box-shadow: 0px 20px 20px -12px #1E293B08, 0px 3px 3px -1.5px #1E293B08, 0px 1px 1px -0.5px #1E293B08;
    border: 1px solid #1E293B17;
    background-color:white;
}

.rb-route-row:last-child[b-53auy4nrdf] {
    border-bottom: none;
}

.rb-route-row:hover[b-53auy4nrdf] {
    background: #f8fafc;
}

.rb-route-color-dot[b-53auy4nrdf] {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    flex-shrink: 0;
}

.rb-route-info[b-53auy4nrdf] {
    display: flex;
    flex-direction: column;
    gap: 1px;
    flex: 1;
    min-width: 0;
}

.rb-route-name[b-53auy4nrdf] {
    font-size: 13px;
    font-weight: 700;
    color: #1E293B;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height:20px;
    letter-spacing:-0.2px;
}

.rb-route-meta[b-53auy4nrdf] {
    font-size: 13px;
    font-weight: 500;
    color: #475569;
    line-height: 20px;
    letter-spacing: -0.2px;
}

.rb-route-heading[b-53auy4nrdf] {
    font-size: 13px;
    font-weight: 600;
    color: #363AF5;
    line-height: 24px;
    letter-spacing: -0.2px;
}

.rb-route-icon[b-53auy4nrdf] {
    width: 32px;
    height: 32px;
    background: #5263FF1F;
    border-radius: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 1;
}

.rb-eye-btn[b-53auy4nrdf] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    border-radius: 7px;
    border: 1px solid #e2e8f0;
    background: #ffffff;
    cursor: pointer;
    flex-shrink: 0;
    transition: background 0.15s, border-color 0.15s;
}

.rb-eye-btn:hover[b-53auy4nrdf] {
    background: #f5f6ff;
    border-color: #c7cbff;
}

.rb-eye-btn--active[b-53auy4nrdf] {
    background: #f0f1ff;
    border-color: #c7cbff;
}

/* ── Map loading overlay ── */
.rb-map-loading[b-53auy4nrdf] {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(255, 255, 255, 0.75);
    z-index: 10;
    color: #5263ff;
}

/* ── Sortable drag states ── */
.rlp-drag-ghost[b-53auy4nrdf] {
    opacity: 0.4;
}

.rlp-drag-chosen[b-53auy4nrdf] {
    background: #f8fafc;
}

/* A stop whose season has ended keeps its place in the order and stays readable, but stands
   down so it reads as "still here, not being served". The Inactive tag says the rest. */
.rb-location-item--inactive[b-53auy4nrdf] {
    opacity: 0.55;
}
/* /Pages/Routes/Components/RouteDetailsSlider.razor.rz.scp.css */
.z-index-lower[b-cgwch5b4ow] {
  z-index: 1049 !important;
}

/* ── Right-side slide-in animation ─────────────────────────────────────── */
.routeDetailsSlider.right .modal-dialog[b-cgwch5b4ow] {
  position: fixed;
  margin: 0;
  right: 0;
  top: 0;
  height: 100%;
  max-width: 740px;
  width: 100%;
}

.routeDetailsSlider.right .modal-content[b-cgwch5b4ow] {
  height: 100vh;
  border-radius: 0;
  display: flex;
  flex-direction: column;
  border: none;
}

.routeDetailsSlider.right.fade .modal-dialog[b-cgwch5b4ow] {
  transform: translateX(100%);
  transition: transform 0.3s ease-out;
}

.routeDetailsSlider.right.show .modal-dialog[b-cgwch5b4ow] {
  transform: translateX(0);
}

/* ── Header ──────────────────────────────────────────────────────────── */
.routeDetailsSlider .modal-header[b-cgwch5b4ow] {
  padding: 16px 20px;
  border-bottom: 1px solid #f1f5f9;
  flex-shrink: 0;
  background: #fff;
}

.routeDetailsSlider .rds-icon[b-cgwch5b4ow] {
  width: 48px;
  height: 48px;
  background: #eef0ff;
  border-radius: 10px;
  flex-shrink: 0;
}

.routeDetailsSlider .rds-icon img[b-cgwch5b4ow] {
  width: 22px;
  height: 22px;
}

.routeDetailsSlider .rds-title[b-cgwch5b4ow] {
  font-size: 18px;
  font-weight: 800;
  color: #1e293b;
  margin: 0;
  letter-spacing: -0.2px;
  line-height: 24px;
}

.routeDetailsSlider .rds-duplicate-btn[b-cgwch5b4ow] {
  font-size: 13px;
  font-weight: 600;
  color: var(--gray-txt, #5F6E85);
  background: #f1f5f9;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  padding: 7px 12px;
  cursor: pointer;
  transition: background 0.15s;
  white-space: nowrap;
}

.routeDetailsSlider .rds-duplicate-btn:hover[b-cgwch5b4ow] {
  background: #e2e8f0;
}

/* ── Tabs container ───────────────────────────────────────────────────── */
.routeDetailsSlider .rds-tabs-container[b-cgwch5b4ow] {
  padding: 12px 20px;
  background: #fff;
  border-bottom: 1px solid #f1f5f9;
  flex-shrink: 0;
}

.routeDetailsSlider .multi-tabs[b-cgwch5b4ow] {
  gap: 6px;
  background-color: #f1f5f9cc;
  border: 1px #1e293b08 solid;
  border-radius: 16px;
  padding: 6px;
}

.routeDetailsSlider .multi-tabs button.tab[b-cgwch5b4ow] {
  padding: 6px;
  background-color: transparent;
  border: 1px transparent solid;
  border-radius: 10px;
  outline: none;
  font-size: 13px;
  font-weight: 600;
  line-height: 24px;
  letter-spacing: -0.2px;
  color: var(--gray-txt);
  width: 100%;
  transition:
    background-color 0.35s cubic-bezier(0.22, 1, 0.36, 1),
    border-color 0.35s cubic-bezier(0.22, 1, 0.36, 1),
    box-shadow 0.35s cubic-bezier(0.22, 1, 0.36, 1),
    color 0.25s ease,
    transform 0.25s cubic-bezier(0.22, 1, 0.36, 1);
  will-change: transform, box-shadow, background-color, border-color, color;
}

.routeDetailsSlider .multi-tabs button.tab.active[b-cgwch5b4ow] {
  background: linear-gradient(
    to bottom,
    rgba(255, 255, 255, 1),
    rgba(248, 250, 252, 1)
  );
  border: 1px solid rgba(15, 23, 42, 0.06);
  box-shadow:
    0 1px 1px rgba(15, 23, 42, 0.03),
    0 4px 10px rgba(15, 23, 42, 0.06),
    inset 0 1px 0 rgba(255, 255, 255, 0.8);
  color: var(--dark-txt);
  transform: scale(1.015);
}

.routeDetailsSlider .multi-tabs button.tab:hover[b-cgwch5b4ow] {
  color: var(--dark-txt);
  transform: translateY(-1px) scale(1.01);
}

/* ── Body / scrollable content ───────────────────────────────────────── */
.routeDetailsSlider .rds-body[b-cgwch5b4ow] {
  flex: 1;
  overflow-y: auto;
  scrollbar-width: thin;
  padding: 0 !important;
}

.routeDetailsSlider .rds-content[b-cgwch5b4ow] {
  /* padding: 12px 24px; */
  min-height: 100%;
}

/* Tab bodies sit flush to the slider edges, which suits the full-width lists but crowds
   the calendar's grid border. The 24px sides line up with the section header above it. */
.routeDetailsSlider .rds-schedule-calendar[b-cgwch5b4ow] {
  padding: 16px 24px 24px;
}

/* ── Section header ──────────────────────────────────────────────────── */
.routeDetailsSlider .rds-section-header[b-cgwch5b4ow] {
  padding: 12px 24px;
  border-bottom: 1px solid #1e293b17;
  height: 60px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.routeDetailsSlider .rds-section-title[b-cgwch5b4ow] {
  font-size: 15px;
  font-weight: 800;
  color: var(--dark-txt);
  margin: 0;
}

.routeDetailsSlider .rds-section-details[b-cgwch5b4ow] {
  padding: 16px 24px;
}

/* ── Saved drive estimate (Locations tab) ────────────────────────────── */
/* Two-up cards across the full sidebar width, matching the road builder's stats grid. */
.rds-route-stats[b-cgwch5b4ow] {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  padding: 12px 24px 0;
  letter-spacing: -0.2px;
}

.rds-stat-box[b-cgwch5b4ow] {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
  padding: 12px 16px;
  border-radius: 16px;
  background: #f1f5f9;
}

.rds-stat-label[b-cgwch5b4ow] {
  font-size: 13px;
  font-weight: 600;
  color: #475569;
  line-height: 20px;
}

.rds-stat-value[b-cgwch5b4ow] {
  font-size: 18px;
  font-weight: 700;
  color: #1e293b;
  line-height: 24px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* ── Edit button ─────────────────────────────────────────────────────── */
.routeDetailsSlider .rds-edit-btn[b-cgwch5b4ow] {
  gap: 2px;
  padding: 8px 10px;
  /* border: 1px #1E293B17 solid; */
  border: none;
  border-radius: 10px;
  outline: none;
  height: 32px;
  background:
    linear-gradient(var(--purple), var(--purple)) padding-box,
    linear-gradient(90deg, #1e293b17, #1e293b2e) border-box;
  backdrop-filter: blur(24px);
  box-shadow:
    0px 1px 1px -0.5px #1e293b08,
    0px 3px 3px 0px #ffffff1f inset;
}

.rds-edit-btn-text[b-cgwch5b4ow] {
  font-size: 13px;
  font-weight: 600;
  line-height: 24px;
  letter-spacing: -0.2px;
  color: var(--white);
  padding: 0px 4px;
}

.routeDetailsSlider .rds-edit-btn:hover[b-cgwch5b4ow] {
  opacity: 0.9;
}

/* ── Detail grid ─────────────────────────────────────────────────────── */
.routeDetailsSlider .rds-detail-grid[b-cgwch5b4ow] {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  background: #fff;
}

.routeDetailsSlider .rds-detail-item[b-cgwch5b4ow] {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.routeDetailsSlider .rds-detail-label[b-cgwch5b4ow] {
  font-size: 13px;
  font-weight: 700;
  color: #1e293b;
  letter-spacing: -0.2px;
  line-height: 20px;
}

.routeDetailsSlider .rds-detail-value[b-cgwch5b4ow] {
  font-size: 13px;
  font-weight: 500;
  color: #475569;
  line-height: 20px;
  letter-spacing: -0.2px;
}

.routeDetailsSlider .rds-color-dot[b-cgwch5b4ow] {
  display: inline-block;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  flex-shrink: 0;
}

.routeDetailsSlider .rds-type-badge[b-cgwch5b4ow] {
  display: inline-block;
  font-size: 12px;
  font-weight: 600;
  color: #363af5;
  background: #5263ff1f;
  border-radius: 8px;
  padding: 4px 8px;
  line-height: 16px;
  letter-spacing: -0.2px;
}

/* ── Work types section ──────────────────────────────────────────────── */
.routeDetailsSlider .rds-work-types[b-cgwch5b4ow] {
  padding: 14px 16px;
  background: #fff;
}

.routeDetailsSlider .rds-wt-badge[b-cgwch5b4ow] {
  display: inline-block;
  font-size: 12px;
  font-weight: 600;
  color: #363af5;
  background: #5263ff1f;
  border-radius: 8px;
  padding: 4px 8px;
  line-height: 16px;
  letter-spacing: -0.2px;
}

/* ── Settings rows (view mode) ───────────────────────────────────────── */
.routeDetailsSlider .rds-settings[b-cgwch5b4ow] {
  display: flex;
  flex-direction: column;
  gap: 16px;
  overflow: hidden;
}

.routeDetailsSlider .rds-settings-group-title[b-cgwch5b4ow] {
  font-size: 13px;
  font-weight: 800;
  color: var(--dark-txt);
  margin: 0;
}

.routeDetailsSlider .rds-settings-group-title--spaced[b-cgwch5b4ow] {
  margin-top: 12px;
}

.routeDetailsSlider .rds-setting-row[b-cgwch5b4ow] {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 16px;
  border: none;
  border-radius: 16px;
  background-color: #f1f5f9;
}

/* A row whose control is a tag box rather than a toggle: side by side there would squeeze the
   picked work types into a sliver, so the control takes the width under its own label. */
.routeDetailsSlider .rds-setting-row--stacked[b-cgwch5b4ow] {
  flex-direction: column;
  align-items: stretch;
  gap: 8px;
}

.routeDetailsSlider .rds-setting-info[b-cgwch5b4ow] {
  flex: 1;
  min-width: 0;
}

.routeDetailsSlider .rds-setting-title[b-cgwch5b4ow] {
  font-size: 13px;
  font-weight: 700;
  color: var(--dark-txt);
  margin: 0 0 2px;
  line-height: 20px;
  letter-spacing: -0.2px;
}

.routeDetailsSlider .rds-setting-desc[b-cgwch5b4ow] {
  font-size: 13px;
  font-weight: 500;
  color: #475569;
  margin: 0;
  line-height: 20px;
  letter-spacing: -0.2px;
}

.routeDetailsSlider .rds-badge[b-cgwch5b4ow] {
  display: inline-block;
  font-size: 12px;
  font-weight: 600;
  border-radius: 8px;
  padding: 4px 8px;
  white-space: nowrap;
  flex-shrink: 0;
}

.routeDetailsSlider .rds-badge.enabled[b-cgwch5b4ow] {
  color: #296C28;
  background: #409b3f1f;
}

.routeDetailsSlider .rds-badge.disabled[b-cgwch5b4ow] {
  color: #475569;
  background: #ffffff;
  border: 1px solid #1e293b17;
  backdrop-filter: blur(24px);
  box-shadow:
    0px 2px 1.5px -0.5px #1e293b08,
    0px 2px 3px 0px #ffffff08 inset;
}

.routeDetailsSlider .rds-badge-neutral[b-cgwch5b4ow] {
  display: inline-block;
  font-size: 12px;
  font-weight: 600;
  color: var(--dark-txt);
  background: #f1f5f9;
  border-radius: 6px;
  padding: 4px 10px;
  white-space: nowrap;
  flex-shrink: 0;
}

/* ── Edit form inputs ────────────────────────────────────────────────── */
.routeDetailsSlider .rds-edit-label[b-cgwch5b4ow] {
  font-size: 13px;
  font-weight: 600;
  color: #475569;
  line-height: 20px;
  letter-spacing: -0.2px;
  margin-bottom: 0;
}

.routeDetailsSlider .rds-required[b-cgwch5b4ow] {
  color: var(--orange);
}

.routeDetailsSlider .rds-edit-input[b-cgwch5b4ow] {
  height: 40px;
  width: 100%;
  padding: 8px 12px;
  background-color: var(--white);
  border: 1px solid #1e293b1f;
  border-radius: 10px;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: 13px;
  font-weight: 600;
  color: var(--dark-txt);
  outline: none;
  transition:
    border-color 0.15s,
    box-shadow 0.15s;
}

.routeDetailsSlider .rds-edit-input:focus[b-cgwch5b4ow] {
  box-shadow: 0 0 0 0.2rem #dce0ff;
}

.routeDetailsSlider .rds-edit-input[b-cgwch5b4ow]::placeholder {
  color: #5F6E85;
}

.routeDetailsSlider .rds-validation-msg[b-cgwch5b4ow] {
  font-size: 12px;
  font-weight: 600;
  color: var(--orange, #f97316);
}

/* ── Toggle rows (edit mode) ─────────────────────────────────────────── */

.routeDetailsSlider .det-toggle-switch[b-cgwch5b4ow] {
  position: relative;
  display: inline-block;
  width: 46px;
  height: 28px;
  background: linear-gradient(
    180deg,
    rgba(226, 232, 240, 1) 0%,
    rgba(248, 250, 252, 1) 100%
  );
  border-radius: 50px;
  padding: 3px;
  flex-shrink: 0;
}

.routeDetailsSlider .det-toggle-switch input[b-cgwch5b4ow] {
  opacity: 0;
  width: 0;
  height: 0;
}

.routeDetailsSlider .det-toggle-slider[b-cgwch5b4ow] {
  position: absolute;
  cursor: pointer;
  border-radius: 30px;
  background-color: #d3dde8;
  transition: 0.3s;
  height: 22px;
  width: 40px;
}

.routeDetailsSlider .det-toggle-slider[b-cgwch5b4ow]:before {
  content: "";
  position: absolute;
  height: 18px;
  width: 18px;
  left: 2px;
  top: 2px;
  border-radius: 1000px;
  background: linear-gradient(180deg, #e2e8f0 0%, #ffffff 100%);
  border: 3.5px solid #f9fbfc;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.15);
  transition: 0.3s;
}

.routeDetailsSlider .det-toggle-switch input:checked + .det-toggle-slider[b-cgwch5b4ow] {
  background: linear-gradient(135deg, #5b67f6, #4c57e0);
}

.routeDetailsSlider
  .det-toggle-switch
  input:checked
  + .det-toggle-slider[b-cgwch5b4ow]:before {
  transform: translateX(18px);
  background: #fff;
}

.routeDetailsSlider
  .det-toggle-switch
  input:checked
  + .det-toggle-slider[b-cgwch5b4ow]:after {
  content: "";
  position: absolute;
  right: 5px;
  top: 7.5px;
  width: 11px;
  height: 11px;
  background-image: url("../img/icons/toggle-check-icon.svg");
  background-size: contain;
  background-repeat: no-repeat;
}

/* ── Delete button ───────────────────────────────────────────────────── */
.routeDetailsSlider .rds-delete-btn[b-cgwch5b4ow] {
  background-color: rgba(223, 41, 23, 1); /* Surface/danger_high_em */
  color: #fff;
  border: 1px solid transparent;
  border-radius: 8px;
  padding: 10px 16px;
  font-size: 14px;
  cursor: pointer;
  /* Gradient border effect */
  background-image:
    linear-gradient(rgba(223, 41, 23, 1), rgba(223, 41, 23, 1)),
    linear-gradient(to bottom, rgba(30, 41, 59, 0.09), rgba(30, 41, 59, 0.18));
  background-origin: border-box;
  background-clip: padding-box, border-box;
  /* Shadow + elevation */
  box-shadow:
    0 1px 1px -0.5px rgba(30, 41, 59, 0.03),
    0 4px 24px rgba(0, 0, 0, 0.15);
  /* Optional blur effect (for glass feel) */
  backdrop-filter: blur(24px);
  transition: all 0.2s ease;
}

.routeDetailsSlider .rds-delete-btn:hover:not(:disabled)[b-cgwch5b4ow] {
  transform: translateY(-1px);
  box-shadow:
    0 2px 4px rgba(0, 0, 0, 0.2),
    0 6px 30px rgba(0, 0, 0, 0.2);
}

.routeDetailsSlider .rds-delete-btn:disabled[b-cgwch5b4ow] {
  opacity: 0.6;
  cursor: not-allowed;
}

/* ── Empty state ─────────────────────────────────────────────────────── */
.routeDetailsSlider .rds-empty-state[b-cgwch5b4ow] {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 48px 20px;
  text-align: center;
}

.routeDetailsSlider .rds-empty-state p[b-cgwch5b4ow] {
  font-size: 13px;
  font-weight: 500;
  color: var(--gray-txt, #5F6E85);
  margin: 0;
}

/* ── Info banner ─────────────────────────────────────────────────────── */
.routeDetailsSlider .rds-info-banner[b-cgwch5b4ow] {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 20px 24px;
  background: #f1f5f9;
  color: #475569;
}

.routeDetailsSlider .rds-info-banner p[b-cgwch5b4ow] {
  font-size: 13px;
  font-weight: 600;
  margin: 0;
  line-height: 20px;
  color: #475569;
  letter-spacing: -0.2px;
}

/* ── Add driver button ───────────────────────────────────────────────── */
.routeDetailsSlider .rds-add-driver-btn[b-cgwch5b4ow] {
  font-size: 13px;
  font-weight: 600;
  color: #fff;
  background:
    linear-gradient(var(--purple), var(--purple)) padding-box,
    linear-gradient(90deg, #1e293b17, #1e293b2e) border-box;
  border: 1px solid transparent;
  border-radius: 10px;
  padding: 6px 12px;
  height: 32px;
  cursor: pointer;
  backdrop-filter: blur(24px);
  box-shadow:
    0px 1px 1px -0.5px #1e293b08,
    0px 3px 3px 0px #ffffff1f inset;
  transition: opacity 0.15s;
  white-space: nowrap;
}

.routeDetailsSlider .rds-add-driver-btn:hover[b-cgwch5b4ow] {
  opacity: 0.9;
}

/* ── Drivers list ────────────────────────────────────────────────────── */
.routeDetailsSlider .rds-drivers-list[b-cgwch5b4ow] {
  display: flex;
  flex-direction: column;
  gap: 0;
  background: #fff;
  border-radius: 12px;
  overflow: hidden;
  border-bottom: 1px solid #1e293b17;
}

.routeDetailsSlider .rds-driver-row[b-cgwch5b4ow] {
  padding: 12px 24px;
  border-bottom: 1px solid #f1f5f9;
}

.routeDetailsSlider .rds-driver-row:last-child[b-cgwch5b4ow] {
  border-bottom: none;
}

.rds-driver-info[b-cgwch5b4ow] {
  flex: 1;
}

.routeDetailsSlider .rds-driver-name[b-cgwch5b4ow] {
  font-size: 13px;
  font-weight: 600;
  color: var(--dark-txt);
  margin: 0;
  display: flex;
  flex-direction: column;
  max-width: 160px;
}

.routeDetailsSlider .rds-driver-phone[b-cgwch5b4ow] {
  font-size: 13px;
  font-weight: 500;
  color: var(--gray-txt, #475569);
  margin: 0;
  white-space: nowrap;
  min-width: 130px;
  flex: 1px;
  overflow: hidden;
  text-overflow: ellipsis;
}

.routeDetailsSlider .rds-driver-email[b-cgwch5b4ow] {
  font-size: 13px;
  font-weight: 500;
  color: var(--gray-txt, #475569);
  margin: 0;
  white-space: nowrap;
  min-width: 160px;
  text-align: right;
  flex: 1;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* ── Footer (edit mode) ──────────────────────────────────────────────── */
.routeDetailsSlider .rds-footer[b-cgwch5b4ow] {
  padding: 14px 20px;
  display: flex;
  gap: 16px;
  border-top: 1px solid #f1f5f9;
  background: #fff;
  flex-shrink: 0;
}

.routeDetailsSlider .rds-cancel-btn[b-cgwch5b4ow] {
  flex: 1px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  font-size: 13px;
  font-weight: 600;
  color: var(--gray-txt, #5F6E85);
  background: #f1f5f9;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  padding: 10px 16px;
  cursor: pointer;
  transition: background 0.15s;
}

.routeDetailsSlider .rds-cancel-btn:hover:not(:disabled)[b-cgwch5b4ow] {
  background: #e2e8f0;
}

.routeDetailsSlider .rds-cancel-btn:disabled[b-cgwch5b4ow] {
  opacity: 0.6;
  cursor: not-allowed;
}

.routeDetailsSlider .rds-save-btn[b-cgwch5b4ow] {
  flex: 1px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  font-size: 13px;
  font-weight: 600;
  color: #fff;
  background: var(--purple, #5263ff);
  border: none;
  border-radius: 10px;
  box-shadow: 0 6px 18px rgba(79, 91, 213, 0.3);
  padding: 10px 20px;
  cursor: pointer;
  transition: background 0.15s;
}

.routeDetailsSlider .rds-save-btn:hover:not(:disabled)[b-cgwch5b4ow] {
  background: #4250e0;
}

.routeDetailsSlider .rds-save-btn:disabled[b-cgwch5b4ow] {
  opacity: 0.7;
  cursor: not-allowed;
}

.routeDetailsSlider .icon-button-div[b-cgwch5b4ow] {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
}

/* ── Locations tab ── */
.routeDetailsSlider .rds-loc-empty-banner[b-cgwch5b4ow] {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 14px 16px;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  color: #475569;
}

.routeDetailsSlider .rds-loc-empty-banner p[b-cgwch5b4ow] {
  font-size: 13px;
  font-weight: 500;
  margin: 0;
}

.routeDetailsSlider .rds-loc-list[b-cgwch5b4ow] {
  display: flex;
  flex-direction: column;
  gap: 0;
}

.routeDetailsSlider .rds-loc-item[b-cgwch5b4ow] {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 24px;
  border-bottom: 1px solid #1e293b17;
}

.routeDetailsSlider .rds-loc-item:first-child[b-cgwch5b4ow] {
  border-top: 1px solid #1e293b17;
}

.routeDetailsSlider .rds-loc-item:hover[b-cgwch5b4ow] {
  background: #5263ff1f;
}

.routeDetailsSlider .rds-loc-num[b-cgwch5b4ow] {
  width: 40px;
  height: 40px;
  border-radius: 8px;
  background: #f1f5f9cc;
  border: 1px solid #1e293b0f;
  font-size: 15px;
  font-weight: 700;
  color: #475569;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

/* Location rows (actual locations, e.g. all ByStops rows) use a round badge; road points stay square. */
.routeDetailsSlider .rds-loc-num--round[b-cgwch5b4ow] {
  border-radius: 50%;
}

.routeDetailsSlider .rds-loc-info[b-cgwch5b4ow] {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 1px;
}

.routeDetailsSlider .rds-loc-name[b-cgwch5b4ow] {
  font-size: 13px;
  font-weight: 700;
  color: #1e293b;
  line-height: 20px;
  letter-spacing: -0.2px;
  overflow-wrap: anywhere;
  word-break: normal;
}

.routeDetailsSlider .rds-loc-addr[b-cgwch5b4ow] {
  font-size: 13px;
  font-weight: 600;
  color: #475569;
  line-height: 20px;
  letter-spacing: -0.2px;
  overflow-wrap: anywhere;
  word-break: normal;
}

.rds-button-text[b-cgwch5b4ow] {
  font-size: 13px;
  font-weight: 600;
  line-height: 20px;
  letter-spacing: -0.2px;
}

/* ── Duplicate-route confirmation popup ─────────────────────────────────────
   Rendered outside the slider container, so these rules are not prefixed with
   .routeDetailsSlider. Mirrors the New Route popup's label/input styling. */
.rds-dup-label[b-cgwch5b4ow] {
  font-size: 13px;
  font-weight: 700;
  color: var(--gray-txt);
  letter-spacing: -0.1px;
  margin-bottom: 0;
}

.rds-dup-required[b-cgwch5b4ow] {
  color: var(--orange, #f97316);
}

.rds-dup-input[b-cgwch5b4ow] {
  width: 100%;
  padding: 10px 14px;
  background-color: #fff;
  border: 1px solid #1e293b1f;
  border-radius: 10px;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.04);
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: 13px;
  font-weight: 600;
  color: var(--dark-txt);
  outline: none;
  transition:
    border-color 0.15s,
    box-shadow 0.15s;
  height: 42px;
}

.rds-dup-input:focus[b-cgwch5b4ow],
.rds-dup-input:focus-within[b-cgwch5b4ow] {
  box-shadow: 0 0 0 0.2rem #dce0ff !important;
}

/* ── Dispatches table ───────────────────────────────────────────────────── */
/* The slider is a fixed 740px, so the table has to fit — long values wrap instead
   of pushing the row into a horizontal scroll. */
.routeDetailsSlider .rds-dispatch-table-wrap[b-cgwch5b4ow] {
  overflow: hidden;
  border: 1px solid #1e293b0f;
  border-radius: 16px;
}

.routeDetailsSlider .rds-dispatch-table[b-cgwch5b4ow] {
  width: 100%;
  table-layout: fixed;
  border-collapse: collapse;
}

.routeDetailsSlider .rds-dispatch-table th[b-cgwch5b4ow],
.routeDetailsSlider .rds-dispatch-table td[b-cgwch5b4ow] {
  padding: 10px 12px;
  color: var(--dark-txt);
  font-size: 12px;
  font-weight: 600;
  text-align: left;
  border-right: 1px solid #1e293b0f;
  vertical-align: middle;
  overflow-wrap: anywhere;
}

/* Planned / dispatched timestamps and the stop count stay on one line; the wider
   text columns take the wrapping. */
.routeDetailsSlider .rds-dispatch-table th:nth-child(1)[b-cgwch5b4ow],
.routeDetailsSlider .rds-dispatch-table td:nth-child(1)[b-cgwch5b4ow],
.routeDetailsSlider .rds-dispatch-table th:nth-child(2)[b-cgwch5b4ow],
.routeDetailsSlider .rds-dispatch-table td:nth-child(2)[b-cgwch5b4ow] { width: 110px; }

.routeDetailsSlider .rds-dispatch-table th:nth-child(5)[b-cgwch5b4ow],
.routeDetailsSlider .rds-dispatch-table td:nth-child(5)[b-cgwch5b4ow] { width: 104px; }

.routeDetailsSlider .rds-dispatch-table th:nth-child(6)[b-cgwch5b4ow],
.routeDetailsSlider .rds-dispatch-table td:nth-child(6)[b-cgwch5b4ow] { width: 56px; }

.routeDetailsSlider .rds-dispatch-table th[b-cgwch5b4ow] {
  background: #f1f5f9;
  font-size: 13px;
  font-weight: 700;
}

.routeDetailsSlider .rds-dispatch-table td:last-child[b-cgwch5b4ow],
.routeDetailsSlider .rds-dispatch-table th:last-child[b-cgwch5b4ow] { border-right: 0; }
.routeDetailsSlider .rds-dispatch-table tbody tr:nth-child(even)[b-cgwch5b4ow] { background: #f8fafc; }
.routeDetailsSlider .rds-dispatch-row[b-cgwch5b4ow] { cursor: pointer; }
.routeDetailsSlider .rds-dispatch-row:hover[b-cgwch5b4ow] { background: #eef2ff !important; }

/* Dispatched by: company on top, the user below when we are allowed to name them. */
.routeDetailsSlider .rds-dispatch-company[b-cgwch5b4ow] {
  display: block;
}

.routeDetailsSlider .rds-dispatch-user[b-cgwch5b4ow] {
  display: block;
  color: var(--gray-txt);
  font-size: 11px;
  font-weight: 600;
}

.routeDetailsSlider .rds-dispatch-empty[b-cgwch5b4ow] {
  padding: 24px !important;
  color: var(--gray-txt) !important;
  font-weight: 500 !important;
  text-align: center !important;
}

.routeDetailsSlider .rds-dispatch-status[b-cgwch5b4ow] {
  display: inline-flex;
  padding: 3px 7px;
  border-radius: 7px;
  font-size: 11px;
  font-weight: 700;
  white-space: nowrap;
}

.routeDetailsSlider .rds-dispatch-status.completed[b-cgwch5b4ow] { color: #296C28; background: #dff4df; }
.routeDetailsSlider .rds-dispatch-status.in-progress[b-cgwch5b4ow] { color: #363af5; background: #eaecff; }
.routeDetailsSlider .rds-dispatch-status.planned[b-cgwch5b4ow] { color: #a16207; background: #fef3c7; }
.routeDetailsSlider .rds-dispatch-status.cancelled[b-cgwch5b4ow] { color: #475569; background: #e2e8f0; }

/* ── Dispatches tab filters ──────────────────────────────────────────────
   The popup renders outside the slider container, so like the duplicate-route
   popup these rules are not prefixed with .routeDetailsSlider. */
.rds-dispatch-filters[b-cgwch5b4ow] {
  padding: 16px 20px;
  padding-top: 0;
}

.rds-filter-label[b-cgwch5b4ow] {
  font-size: 13px;
  font-weight: 600;
  color: #475569;
  line-height: 20px;
  letter-spacing: -0.2px;
  margin-bottom: 0;
}

.routeDetailsSlider .rds-dispatch-filter-dot[b-cgwch5b4ow] {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #5263ff;
}

/* ── Average time to completion, per work type (SM-70) ────────────────────
   One card per work type that has been run enough times to have an average,
   sitting above the dispatch history it is derived from. */
.routeDetailsSlider .rds-stats-grid[b-cgwch5b4ow] {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 12px;
}

.routeDetailsSlider .rds-stat-card[b-cgwch5b4ow] {
  padding: 12px 14px;
  border: 1px solid #1e293b0f;
  border-radius: 16px;
  background: #f8fafc;
}

.routeDetailsSlider .rds-stat-card p[b-cgwch5b4ow] { margin: 0; }

.routeDetailsSlider .rds-stat-worktype[b-cgwch5b4ow] {
  font-size: 12px;
  font-weight: 700;
  color: #64748b;
  text-transform: uppercase;
  letter-spacing: 0.4px;
}

.routeDetailsSlider .rds-stat-average[b-cgwch5b4ow] {
  font-size: 22px;
  font-weight: 700;
  color: var(--dark-txt);
  line-height: 30px;
}

.routeDetailsSlider .rds-stat-runs[b-cgwch5b4ow] {
  font-size: 12px;
  font-weight: 600;
  color: #64748b;
}

.routeDetailsSlider .rds-stat-latest[b-cgwch5b4ow] {
  margin-top: 6px !important;
  font-size: 12px;
  font-weight: 700;
}

.routeDetailsSlider .rds-stat-latest.above[b-cgwch5b4ow] { color: #b45309; }
.routeDetailsSlider .rds-stat-latest.below[b-cgwch5b4ow] { color: #338732; }

/* The average is still the one from before the route was edited (SM-70). */
.routeDetailsSlider .rds-stat-stale[b-cgwch5b4ow] {
  margin-top: 4px !important;
  font-size: 11px;
  font-weight: 600;
  color: #64748b;
  line-height: 15px;
}

/* A stop whose season has ended stays on the route and stays readable, but stands down so the
   eye skips it while the Inactive tag beside the name says why. */
.rds-loc-item--inactive[b-cgwch5b4ow] {
    opacity: 0.55;
}

/* ── Area and per-dispatch money ── */
.routeDetailsSlider .rds-economics[b-cgwch5b4ow] {
  padding: 16px 24px;
  border-bottom: 1px solid #1e293b17;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.routeDetailsSlider .rds-economics h6[b-cgwch5b4ow] {
  margin: 0;
}

.routeDetailsSlider .rds-overview-grid[b-cgwch5b4ow] {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
  gap: 10px;
}

.routeDetailsSlider .rds-overview-card[b-cgwch5b4ow] {
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 12px;
  border-radius: 10px;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
}

.routeDetailsSlider .rds-overview-label[b-cgwch5b4ow] {
  font-size: 12px;
  font-weight: 600;
  color: #5f6e85;
}

.routeDetailsSlider .rds-overview-value[b-cgwch5b4ow] {
  font-size: 18px;
  font-weight: 700;
  line-height: 26px;
  letter-spacing: -0.3px;
  color: #1e293b;
  white-space: nowrap;
}

.routeDetailsSlider .rds-overview-note[b-cgwch5b4ow] {
  font-size: 11px;
  line-height: 14px;
  color: #5f6e85;
}

.routeDetailsSlider .rds-economics-card-head[b-cgwch5b4ow] {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px;
}

.routeDetailsSlider .rds-economics-time[b-cgwch5b4ow] {
  font-size: 12px;
  font-weight: 600;
  color: #5f6e85;
  white-space: nowrap;
}

.routeDetailsSlider .rds-economics-grid[b-cgwch5b4ow] {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 10px;
}

.routeDetailsSlider .rds-economics-card[b-cgwch5b4ow] {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 12px;
  border-radius: 10px;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
}

.routeDetailsSlider .rds-economics-worktype[b-cgwch5b4ow] {
  margin: 0;
  font-size: 13px;
  font-weight: 700;
  color: #1e293b;
}

.routeDetailsSlider .rds-economics-note[b-cgwch5b4ow] {
  font-size: 11px;
  line-height: 14px;
  color: #5f6e85;
  cursor: help;
}

.routeDetailsSlider .rds-area-badge[b-cgwch5b4ow] {
  display: inline-block;
  max-width: 100%;
  padding: 2px 6px;
  border-radius: 6px;
  font-size: 12px;
  font-weight: 600;
  line-height: 16px;
  overflow-wrap: anywhere;
  background-color: #06b1f11f;
  color: var(--sky);
}

.routeDetailsSlider .rds-area-value[b-cgwch5b4ow] {
  white-space: nowrap;
}

.routeDetailsSlider .rds-loc-badges[b-cgwch5b4ow] {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
}

/* ── Stop table ── */
.routeDetailsSlider .rds-loc-table-scroll[b-cgwch5b4ow] {
  border-top: 1px solid #1e293b17;
}

/* Fixed layout: the columns share the sidebar's width and their content wraps, so the table
   never grows wider than the sidebar and never scrolls sideways. */
.routeDetailsSlider .rds-loc-table[b-cgwch5b4ow] {
  width: 100%;
  table-layout: fixed;
  border-collapse: collapse;
}

.routeDetailsSlider .rds-loc-table th[b-cgwch5b4ow] {
  padding: 10px 8px;
  vertical-align: bottom;
  font-size: 11px;
  font-weight: 600;
  line-height: 16px;
  letter-spacing: 0.2px;
  text-transform: uppercase;
  color: #5f6e85;
  background: #f8fafc;
  border-bottom: 1px solid #1e293b17;
  text-align: left;
  overflow-wrap: anywhere;
}

.routeDetailsSlider .rds-loc-table .rds-th-legend[b-cgwch5b4ow] {
  display: block;
  margin-top: 2px;
  font-size: 10px;
  font-weight: 500;
  letter-spacing: 0;
  text-transform: none;
}

.routeDetailsSlider .rds-loc-table td[b-cgwch5b4ow] {
  padding: 10px 8px;
  vertical-align: middle;
  border-bottom: 1px solid #1e293b17;
  overflow-wrap: anywhere;
}

.routeDetailsSlider .rds-loc-table th:first-child[b-cgwch5b4ow],
.routeDetailsSlider .rds-loc-table td:first-child[b-cgwch5b4ow] {
  padding-left: 24px;
}

.routeDetailsSlider .rds-loc-table th:last-child[b-cgwch5b4ow],
.routeDetailsSlider .rds-loc-table td:last-child[b-cgwch5b4ow] {
  padding-right: 24px;
}

.routeDetailsSlider .rds-loc-table .rds-col-num[b-cgwch5b4ow] {
  width: 64px;
}

.routeDetailsSlider .rds-loc-table .rds-col-location[b-cgwch5b4ow] {
  width: 34%;
}

.routeDetailsSlider .rds-loc-table .rds-loc-num[b-cgwch5b4ow] {
  width: 32px;
  height: 32px;
  font-size: 13px;
}

.routeDetailsSlider .rds-loc-row:hover[b-cgwch5b4ow] {
  background: #5263ff1f;
}

.routeDetailsSlider .rds-price-chip[b-cgwch5b4ow] {
  align-self: flex-start;
  padding: 3px 8px;
  border-radius: 8px;
  font-size: 12px;
  font-weight: 600;
  line-height: 16px;
  background: #f1f5f9cc;
  color: #475569;
}

.routeDetailsSlider .rds-price-chip--missing[b-cgwch5b4ow] {
  background: #b822131a;
  color: #b82213;
}
/* /Pages/Routes/Components/RouteLocationsPopup.razor.rz.scp.css */
.rlp-body[b-7y4egce3p2] {
  padding: 16px;
  background-color: #f1f5f9;
}

.rlp-loading[b-7y4egce3p2] {
  display: flex;
  justify-content: center;
  align-items: center;
  height: min(660px, calc(100dvh - 320px));
}

/* ── Two-column layout ── */
/* Capped to the viewport so the popup (incl. footer) never needs page scrolling */
.rlp-columns[b-7y4egce3p2] {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  max-height: min(640px, calc(100dvh - 320px));
  min-height: min(640px, calc(100dvh - 320px));
  height: 100%;
}

/* ── Panel ── */
.rlp-panel[b-7y4egce3p2] {
  display: flex;
  flex-direction: column;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  overflow: hidden;
  max-height: 640px;
  height: 100%;
}

.rlp-panel-header[b-7y4egce3p2] {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px 16px;
  background: #ffffff;
  border-bottom: 1px solid #e2e8f0;
  flex-shrink: 0;
  gap: 8px;
  height: 56px;
}

.rlp-panel-title[b-7y4egce3p2] {
  flex: 1;
  font-size: 15px;
  font-weight: 700;
  color: #1e293b;
  line-height: 24px;
  letter-spacing: -0.2px;
}

/* ── Search ── */
.rlp-search-wrap[b-7y4egce3p2] {
  flex: 1;
}

/* ── Filter row ── */
.rlp-filter-row[b-7y4egce3p2] {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 8px 16px;
  background: #ffffff;
  border-bottom: 1px solid #e2e8f0;
  flex-shrink: 0;
}

.rlp-filter-check[b-7y4egce3p2] {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  font-weight: 600;
  color: #1e293b;
  margin: 0;
  cursor: pointer;
  white-space: nowrap;
}

.rlp-filter-from[b-7y4egce3p2] {
  min-width: 180px;
}

/* ── Route tags ── */
.rlp-route-tags[b-7y4egce3p2] {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  margin-top: 2px;
}

.rlp-route-tag[b-7y4egce3p2] {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 1px 8px;
  border-radius: 8px;
  background: #eef2ff;
  color: #3730a3;
  font-size: 11px;
  font-weight: 600;
}

.rlp-route-tag-dot[b-7y4egce3p2] {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  flex-shrink: 0;
}

/* ── Lists ── */
.rlp-list[b-7y4egce3p2] {
  flex: 1;
  overflow-y: auto;
  scrollbar-width: thin;
  background-color: #ffffff;
}

.rlp-empty[b-7y4egce3p2] {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  font-size: 13px;
  font-weight: 500;
  color: #94a3b8;
}

/* ── Added location item ── */
.rlp-added-item[b-7y4egce3p2] {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 14px;
  border-bottom: 1px solid #f1f5f9;
  cursor: default;
  background: #fff;
  transition: background 0.12s;
}

.rlp-added-item:last-child[b-7y4egce3p2] {
  border-bottom: none;
}

.rlp-added-item:hover[b-7y4egce3p2] {
  background: #f8fafc;
}

/* SortableJS drag states */
.rlp-drag-ghost[b-7y4egce3p2] {
  opacity: 0.3 !important;
  border: 1px dashed #cbd5e1 !important;
  background: #f8fafc !important;
}

.rlp-drag-chosen[b-7y4egce3p2] {
  background: #f8fafc !important;
}

.rlp-drag-dragging[b-7y4egce3p2] {
  background: #ffffff !important;
  box-shadow:
    0 10px 25px -5px rgba(0, 0, 0, 0.1),
    0 8px 10px -6px rgba(0, 0, 0, 0.1) !important;
  border: 1px solid #cbd5e1 !important;
  border-radius: 8px !important;
  opacity: 0.95 !important;
}

.rlp-item-num[b-7y4egce3p2] {
  width: 40px;
  height: 40px;
  border-radius: 8px;
  background: #F1F5F9CC;
  border: 1px solid #1E293B0F;
  font-size: 15px;
  font-weight: 700;
  color: #475569;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

/* ── All location item ── */
.rlp-all-item[b-7y4egce3p2] {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 14px;
  border-bottom: 1px solid #f1f5f9;
  background: #fff;
  transition: background 0.12s;
}

.rlp-all-item:last-child[b-7y4egce3p2] {
  border-bottom: none;
}

.rlp-all-item:hover[b-7y4egce3p2] {
  background: #f8fafc;
}

.rlp-all-item--added[b-7y4egce3p2] {
  opacity: 0.55;
}

.rlp-loc-icon[b-7y4egce3p2] {
  color: #94a3b8;
  flex-shrink: 0;
}

/* ── Item text ── */
.rlp-item-info[b-7y4egce3p2] {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 1px;
}

.rlp-item-name[b-7y4egce3p2] {
  font-size: 13px;
  font-weight: 700;
  color: #1e293b;
  line-height: 20px;
  letter-spacing: -0.2px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 448px;
}

.rlp-item-addr[b-7y4egce3p2] {
  font-size: 13px;
  font-weight: 600;
  color: #475569;
  line-height: 20px;
  letter-spacing: -0.2px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 448px;
}

/* ── Buttons ── */
.rlp-remove-btn[b-7y4egce3p2] {
  width: 32px;
  height: 32px;
  border: none;
  background: transparent;
  color: #ef4444;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  padding: 0;
  border-radius: 8px;
  transition:
    background 0.12s,
    color 0.12s;
  background-color: #ed40301f;
}

.rlp-remove-btn:hover[b-7y4egce3p2] {
  background: #fef2f2;
  color: #dc2626;
}

.rlp-add-btn[b-7y4egce3p2] {
  width: 32px;
  height: 32px;
  border: none;
  background: #fff;
  color: #5263ff;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  padding: 0;
  border-radius: 8px;
  transition:
    background 0.12s,
    border-color 0.12s;
  background-color: #5263ff1f;
}

.rlp-add-btn:hover[b-7y4egce3p2] {
  background: #eef0ff;
  border-color: #5263ff;
}

.rlp-added-badge[b-7y4egce3p2] {
  width: 28px;
  height: 28px;
  border-radius: 6px;
  background: #f0fdf4;
  color: #16a34a;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.rlp-drag-handle[b-7y4egce3p2] {
  color: #cbd5e1;
  cursor: grab;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  padding: 2px;
  background-color: #f1f5f9cc;
  border: 1px solid #1e293b0f;
  border-radius: 8px;
}

.rlp-drag-handle:hover[b-7y4egce3p2] {
  color: #94a3b8;
  background: #E2E8F0CC;
}

.rlp-drag-handle:active[b-7y4egce3p2] {
  cursor: grabbing;
}

.rlp-restore-btn[b-7y4egce3p2] {
  width: 32px;
  height: 32px;
  border: none;
  background: #fff;
  color: #5263ff;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  padding: 0;
  border-radius: 8px;
  transition:
    background 0.12s,
    border-color 0.12s;
  background-color: #5263ff1f;
}

.rlp-restore-btn:hover[b-7y4egce3p2] {
  background: #eef0ff;
  border-color: #5263ff;
}

.rlp-footer[b-7y4egce3p2] {
  display: flex;
  justify-content: flex-end; /* push buttons to right */
  align-items: center;
  gap: 16px; /* space between buttons */
  width: 100%;
  margin: 0px;
}

/* An address with no contractor on a contractor route - assigned on save, after a confirm. */
.rlp-no-contractor[b-7y4egce3p2] {
	align-self: flex-start;
	margin-top: 2px;
	font-size: 11px;
	font-weight: 700;
	border-radius: 99px;
	padding: 1px 8px;
	background: #FEF3C7;
	color: #B45309;
	white-space: nowrap;
}

/* A stop nobody is serving stays legible but visibly stands down: the route still carries it,
   and the Inactive tag beside the name says why it looks that way. 0.55 is the same knock-back
   the disabled controls elsewhere in the popup use. */
.rlp-item--inactive[b-7y4egce3p2] {
    opacity: 0.55;
}

/* Never dim the add button itself out of existence: an address the route cannot take keeps its
   button visible so the tooltip explaining the refusal is reachable. */
.rlp-add-btn:disabled[b-7y4egce3p2] {
    cursor: not-allowed;
    opacity: 0.5;
}
/* /Pages/Routes/Components/RouteMoneyBadges.razor.rz.scp.css */
.rmb[b-qpvnexwhmb] {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 4px;
}

.rmb--stacked[b-qpvnexwhmb] {
	flex-direction: column;
	align-items: flex-start;
}

.rmb-badge[b-qpvnexwhmb] {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	padding: 3px 8px;
	border-radius: 8px;
	font-size: 12px;
	font-weight: 600;
	line-height: 16px;
	letter-spacing: -0.2px;
	white-space: nowrap;
}

.rmb-label[b-qpvnexwhmb] {
	font-weight: 500;
	opacity: 0.75;
}

.rmb-price[b-qpvnexwhmb] {
	background-color: #409B3F1F;
	color: var(--green);
}

.rmb-cost[b-qpvnexwhmb] {
	background-color: #F1F5F9CC;
	color: var(--dark-txt);
	border: 1px #1E293B08 solid;
}

.rmb-compact[b-qpvnexwhmb] {
	display: flex;
	flex-direction: column;
	gap: 2px;
	font-size: 12px;
	line-height: 16px;
	letter-spacing: -0.2px;
}

.rmb-compact span[b-qpvnexwhmb] {
	white-space: nowrap;
}

.rmb-compact-price[b-qpvnexwhmb] {
	font-weight: 700;
	color: var(--green);
}

.rmb-compact-cost[b-qpvnexwhmb] {
	font-weight: 600;
	color: #5f6e85;
}
/* /Pages/Routes/Components/RouteScheduleCalendar.razor.rz.scp.css */
.rsc-root[b-yh09ip0riz] {
	display: flex;
	flex-direction: column;
	gap: 12px;
	position: relative;
	min-height: 0;
	flex: 1 1 auto;
}

.rsc-toolbar[b-yh09ip0riz] {
	display: flex;
	align-items: center;
	gap: 16px;
	flex: 0 0 auto;
}

.rsc-month-nav[b-yh09ip0riz] {
	display: flex;
	align-items: center;
	gap: 4px;
}

.rsc-nav-btn[b-yh09ip0riz],
.rsc-today-btn[b-yh09ip0riz] {
	border: 1px solid #E2E8F0;
	background: #FFFFFF;
	border-radius: 8px;
	height: 32px;
	padding: 0 10px;
	font-size: 14px;
	color: #334155;
	cursor: pointer;
}

.rsc-nav-btn:hover[b-yh09ip0riz],
.rsc-today-btn:hover[b-yh09ip0riz] {
	background: #F1F5F9;
}

.rsc-month-label[b-yh09ip0riz] {
	margin: 0;
	font-size: 16px;
	font-weight: 600;
	color: #0F172A;
}

/* The day-name strip takes its own height and the week rows split what is left, each row
   never dropping below its own content: `minmax(min-content, 1fr)` is what makes a sparse
   month draw a full-height calendar while a crowded week still fits its lanes. With no
   definite height to share (the route slider tab) every row falls back to its content. */
.rsc-grid-wrap[b-yh09ip0riz] {
	border: 1px solid #E2E8F0;
	border-radius: 12px;
	overflow: hidden auto;
	display: grid;
	grid-template-rows: auto;
	grid-auto-rows: minmax(min-content, 1fr);
	min-height: 0;
	flex: 1 1 auto;
	background: #FFFFFF;
}

.rsc-dow-row[b-yh09ip0riz] {
	display: grid;
	grid-template-columns: repeat(7, 1fr);
	border-bottom: 1px solid #E2E8F0;
	background: #F8FAFC;
}

.rsc-dow-cell[b-yh09ip0riz] {
	padding: 6px 8px;
	font-size: 12px;
	font-weight: 600;
	color: #64748B;
	text-transform: capitalize;
}

.rsc-week[b-yh09ip0riz] {
	position: relative;
	display: flex;
	flex-direction: column;
	min-height: 86px;
	border-bottom: 1px solid #E2E8F0;
	padding-bottom: 6px;
	user-select: none;
}

.rsc-week:last-of-type[b-yh09ip0riz] {
	border-bottom: none;
}

.rsc-week-bg[b-yh09ip0riz] {
	position: absolute;
	inset: 0;
	display: grid;
	grid-template-columns: repeat(7, 1fr);
}

.rsc-bg-cell[b-yh09ip0riz] {
	border-right: 1px solid #F1F5F9;
}

.rsc-bg-cell:last-child[b-yh09ip0riz] {
	border-right: none;
}

.rsc-bg-other-month[b-yh09ip0riz] {
	background: #FBFCFD;
}

.rsc-bg-selected[b-yh09ip0riz] {
	background: #363AF51F;
}

/* Only the bars and the overflow buttons take the pointer; the rest of the foreground lets
   a press through to the day column behind it. */
.rsc-week-fg[b-yh09ip0riz] {
	position: relative;
	pointer-events: none;
}

.rsc-bar[b-yh09ip0riz],
.rsc-overflow[b-yh09ip0riz] {
	pointer-events: auto;
}

/* Mid-drag a bar must not swallow the pointer, or crossing one stalls the selection. */
.rsc-dragging .rsc-bar[b-yh09ip0riz],
.rsc-dragging .rsc-overflow[b-yh09ip0riz] {
	pointer-events: none;
}

.rsc-daynum-row[b-yh09ip0riz] {
	display: grid;
	grid-template-columns: repeat(7, 1fr);
}

.rsc-day-cell[b-yh09ip0riz] {
	padding: 6px 8px 2px;
	min-height: 30px;
}

.rsc-day-clickable[b-yh09ip0riz] {
	cursor: pointer;
}

.rsc-day-clickable:hover[b-yh09ip0riz] {
	background: #F8FAFC;
}

.rsc-bg-selected.rsc-day-clickable:hover[b-yh09ip0riz] {
	background: #363AF51F;
}

.rsc-daynum[b-yh09ip0riz] {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 24px;
	height: 24px;
	border-radius: 99px;
	font-size: 13px;
	color: #334155;
}

.rsc-other-month .rsc-daynum[b-yh09ip0riz] {
	color: #CBD5E1;
}

.rsc-today[b-yh09ip0riz] {
	background: #363AF5;
	color: #FFFFFF;
	font-weight: 600;
}

.rsc-lanes[b-yh09ip0riz] {
	display: grid;
	grid-template-columns: repeat(7, 1fr);
	gap: 3px 0;
	padding: 0 2px;
}

.rsc-bar[b-yh09ip0riz] {
	display: flex;
	align-items: center;
	gap: 6px;
	height: 24px;
	margin: 0 3px;
	padding: 0 8px;
	border-radius: 6px;
	font-size: 12px;
	overflow: hidden;
	white-space: nowrap;
	min-width: 0;
}

.rsc-bar-route[b-yh09ip0riz] {
	border-left: 3px solid #363AF5;
	color: #0F172A;
}

/* Driver bars ride on the avatar gradient classes (wm.avatars.css). */
.rsc-bar-driver[b-yh09ip0riz] {
	color: #FFFFFF;
	width: auto;
	height: 24px;
	justify-content: flex-start;
}

.rsc-bar-clickable[b-yh09ip0riz] {
	cursor: pointer;
}

.rsc-bar-clickable:hover[b-yh09ip0riz] {
	filter: brightness(0.96);
}

.rsc-cut-left[b-yh09ip0riz] {
	border-top-left-radius: 0;
	border-bottom-left-radius: 0;
	margin-left: 0;
}

.rsc-cut-right[b-yh09ip0riz] {
	border-top-right-radius: 0;
	border-bottom-right-radius: 0;
	margin-right: 0;
}

.rsc-bar-label[b-yh09ip0riz] {
	overflow: hidden;
	text-overflow: ellipsis;
	min-width: 0;
}

/* The window sits at the ends of the bar, so the name keeps the middle and stays the
   part that ellipsizes when the bar is narrow. */
.rsc-bar-time[b-yh09ip0riz] {
	flex: 0 0 auto;
	font-variant-numeric: tabular-nums;
	font-size: 11px;
	opacity: 0.75;
}

.rsc-bar-time-end[b-yh09ip0riz] {
	margin-left: auto;
}

.rsc-ineligible[b-yh09ip0riz] {
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 16px;
	height: 16px;
	border-radius: 99px;
	background: #FEF3C7;
	color: #B45309;
	font-size: 11px;
	font-weight: 700;
}

.rsc-overflow[b-yh09ip0riz] {
	margin: 0 3px;
	height: 22px;
	border: none;
	border-radius: 6px;
	background: #F1F5F9;
	color: #475569;
	font-size: 12px;
	cursor: pointer;
}

.rsc-overflow:hover[b-yh09ip0riz] {
	background: #E2E8F0;
}

.rsc-loading[b-yh09ip0riz] {
	display: flex;
	justify-content: center;
	align-items: center;
	min-height: 240px;
	color: #0D6EFD;
}

.rsc-overflow-panel[b-yh09ip0riz] {
	position: absolute;
	top: 52px;
	right: 8px;
	z-index: 20;
	width: 320px;
	max-height: 320px;
	overflow-y: auto;
	background: #FFFFFF;
	border: 1px solid #E2E8F0;
	border-radius: 12px;
	box-shadow: 0 8px 24px rgba(15, 23, 42, 0.12);
	padding: 12px;
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.rsc-overflow-header[b-yh09ip0riz] {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.rsc-overflow-title[b-yh09ip0riz] {
	margin: 0;
	font-weight: 600;
	font-size: 14px;
	color: #0F172A;
}

.rsc-overflow-close[b-yh09ip0riz] {
	width: 24px;
	height: 24px;
	background-size: 10px;
}

.rsc-overflow-item[b-yh09ip0riz] {
	display: flex;
	align-items: center;
	gap: 8px;
	border: none;
	background: transparent;
	border-radius: 8px;
	padding: 6px 8px;
	font-size: 13px;
	color: #334155;
	cursor: pointer;
	text-align: left;
}

.rsc-overflow-item:hover[b-yh09ip0riz] {
	background: #F8FAFC;
}

.rsc-overflow-dot[b-yh09ip0riz] {
	flex: 0 0 auto;
	width: 10px;
	height: 10px;
	border-radius: 99px;
}

.rsc-overflow-text[b-yh09ip0riz] {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

/* Quick-create popover: dropped at the pointer inside the positioned root and clamped to it,
   so it never leaves the calendar. The backdrop catches the click that closes it. */
.rsc-popover-backdrop[b-yh09ip0riz] {
	position: fixed;
	inset: 0;
	z-index: 30;
}

.rsc-popover[b-yh09ip0riz] {
	position: absolute;
	z-index: 31;
	width: 300px;
	padding: 14px;
	background: #FFFFFF;
	border: 1px solid #E2E8F0;
	border-radius: 12px;
	box-shadow: 0 12px 32px rgba(15, 23, 42, 0.16);
	display: flex;
	flex-direction: column;
	gap: 10px;
	outline: none;
}

.rsc-pop-title[b-yh09ip0riz] {
	margin: 0;
	font-size: 14px;
	font-weight: 600;
	color: #0F172A;
}

.rsc-pop-field[b-yh09ip0riz] {
	display: flex;
	flex-direction: column;
	gap: 4px;
	min-width: 0;
}

/* The two times read as one window, so they share a row inside the fixed-width popover. */
.rsc-pop-times[b-yh09ip0riz] {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 8px;
}

.rsc-pop-label[b-yh09ip0riz] {
	margin: 0;
	font-size: 12px;
	font-weight: 500;
	color: #64748B;
}

.rsc-pop-range[b-yh09ip0riz] {
	margin: 0;
	font-size: 13px;
	font-weight: 500;
	color: #0F172A;
}

.rsc-pop-error[b-yh09ip0riz] {
	margin: 0;
	font-size: 12px;
	color: #DC2626;
}

.rsc-pop-actions[b-yh09ip0riz] {
	display: flex;
	justify-content: flex-end;
	gap: 8px;
	margin-top: 2px;
}
/* /Pages/Routes/Components/RouteSchedulePopup.razor.rz.scp.css */
.rsp-modal-content[b-5vti5s1vcw] {
	padding: 24px !important;
	border-radius: 16px;
}

.rsp-title[b-5vti5s1vcw] {
	margin: 0;
	font-size: 18px;
	font-weight: 600;
	color: #0F172A;
}

.rsp-form[b-5vti5s1vcw] {
	display: flex;
	flex-direction: column;
	gap: 16px;
}

.rsp-field[b-5vti5s1vcw] {
	display: flex;
	flex-direction: column;
	gap: 6px;
	min-width: 0;
}

/* From/To and the two times read as pairs, so each pair shares a row and splits it evenly.
   Below 420px the modal is narrower than two usable pickers, so the pair stacks. */
.rsp-field-row[b-5vti5s1vcw] {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 12px;
}

@media (max-width: 420px) {
	.rsp-field-row[b-5vti5s1vcw] {
		grid-template-columns: 1fr;
	}
}

.rsp-label[b-5vti5s1vcw] {
	font-size: 13px;
	font-weight: 500;
	color: #475569;
}

.rsp-error[b-5vti5s1vcw] {
	margin: 0;
	font-size: 13px;
	color: #DC2626;
}
/* /Pages/Routes/Routes.razor.rz.scp.css */
.title-button[b-s4qnxegvjc] {
	/*height: 40px;
	width: 194px;*/
	padding:4px 10px;
	gap: 6px;
	font-size: 13px;
	font-weight: 600;
	line-height: 24px;
	letter-spacing: -0.2px;
	color: var(--white);
	border: none;
	outline: none;
	/* border: 1px transparent solid; */
	border-radius: 10px;
	background: linear-gradient(var(--purple), var(--purple)) padding-box, linear-gradient(90deg, #1E293B17, #1E293B2E) border-box;
	backdrop-filter: blur(24px);
	box-shadow: 0px 1px 1px -0.5px #1E293B08, 0px 3px 3px 0px #FFFFFF1F inset;
}

.title-button img[b-s4qnxegvjc] {
	height: 18px;
}

.title-button .badgee[b-s4qnxegvjc] {
	height: 18px;
	width: 18px;
	background-color: var(--white);
	border: 1px #1E293B17 solid;
	box-shadow: 0 2px 1.5px -0.5px #1E293B08;
	color: var(--gray-txt);
	border-radius: 6px;
	font-size: 10px;
	font-weight: 600;
	line-height: 16px;
	letter-spacing: -0.2px;
}

.title-button:hover[b-s4qnxegvjc] {
	opacity: 0.9;
}

.menu-backdrop[b-s4qnxegvjc] {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  background: transparent;
  z-index: 999;
}

/* ─── Route color dot ──────────────────────────────────────────────────────── */
.route-color-dot[b-s4qnxegvjc] {
  display: inline-block;
  width: 11px;
  height: 11px;
  border-radius: 99999px;
  flex-shrink: 0;
}

/* ─── Route name ───────────────────────────────────────────────────────────── */
.route-name-text[b-s4qnxegvjc] {
  font-size: 13px;
  font-weight: 800;
  color: var(--dark-txt);
  margin: 0;
  line-height: 20px;
  letter-spacing: -0.2px;
}

/* ─── Contractor own badge ─────────────────────────────────────────────────── */
.contractor-own-badge[b-s4qnxegvjc] {
  font-size: 12px;
  font-weight: 600;
  color: #363AF5;
  background-color: #5263FF1F;
  border-radius: 8px;
  padding: 4px 8px;
  white-space: nowrap;
  border: none;
  line-height: 16px;
  letter-spacing: -0.2px;
}

.contractor-other-badge[b-s4qnxegvjc] {
	font-size: 12px;
	font-weight: 600;
	color: #1E293B;
	background-color: #F1F5F9CC;
	border-radius: 8px;
	padding: 4px 8px;
	white-space: nowrap;
	border: 1px solid #1E293B08;
	line-height: 16px;
	letter-spacing: -0.2px;
}

/* ─── Count badge (locations / drivers) ────────────────────────────────────── */
.route-location-badge[b-s4qnxegvjc] {
	display: inline-flex;
	justify-content: center;
	align-items: center;
	gap: 5px;
	width: fit-content;
	background-color: #5263FF1F;
	border: none;
	border-radius: 8px;
	padding: 4px 8px;
	font-size: 12px;
	font-weight: 600;
	color: #363AF5;
	line-height: 16px;
	letter-spacing: -0.2px;
}

.route-driver-badge[b-s4qnxegvjc] {
	display: inline-flex;
	justify-content: center;
	align-items: center;
	gap: 5px;
	width: fit-content;
	background-color: #06B1F11F;
	border: none;
	border-radius: 8px;
	padding: 4px 8px;
	font-size: 12px;
	font-weight: 600;
	color: #0071A7;
	line-height: 16px;
	letter-spacing: -0.2px;
}

/* ─── Warning icon column ──────────────────────────────────────────────────── */
.routes-icon-col[b-s4qnxegvjc] {
  width: 16px;
  white-space: nowrap;
  text-align: center;
  padding-right: 16px !important;
}

.route-warning-icon[b-s4qnxegvjc] {
  width: 20px;
  height: 20px;
  display: block;
}

/* ─── Filter select button ─────────────────────────────────────────────────── */
.route-filter-select button[b-s4qnxegvjc] {
  white-space: nowrap;
}

/* ─── Area and per-dispatch money ─────────────────────────────────────────── */
.routes-area-badge[b-s4qnxegvjc] {
  display: inline-block;
  padding: 3px 8px;
  border-radius: 8px;
  font-size: 12px;
  font-weight: 600;
  line-height: 16px;
  white-space: nowrap;
  background-color: #06B1F11F;
  color: var(--sky);
}

.routes-money-note[b-s4qnxegvjc] {
  display: inline-block;
  margin-top: 4px;
  font-size: 11px;
  line-height: 14px;
  color: var(--gray-txt);
  white-space: nowrap;
  cursor: help;
}

/* ─── Fit the page instead of scrolling sideways ──────────────────────────── */
/* Fixed layout: the columns share the card's width and their content wraps. The page-wide
   table rule sets min-width: 1000px and 16px cell padding, which is what pushed the grid past
   the card once the work type columns arrived, hence the !important. */
.routes-table[b-s4qnxegvjc] {
  table-layout: fixed;
  min-width: 0 !important;
}

.routes-table th[b-s4qnxegvjc],
.routes-table td[b-s4qnxegvjc] {
  padding: 12px 10px !important;
  vertical-align: middle;
}

/* Words wrap whole and only split when one alone is wider than its column (a long route or
   company name). Headers hyphenate in the page language, which the table's lang attribute
   supplies, so CHAUFFØRER breaks at a syllable rather than at a random letter. */
.routes-table td[b-s4qnxegvjc] {
  overflow-wrap: break-word;
}

.routes-table th[b-s4qnxegvjc] {
  overflow-wrap: break-word;
  hyphens: auto;
}

.routes-table th:first-child[b-s4qnxegvjc],
.routes-table td:first-child[b-s4qnxegvjc] {
  padding-left: 16px !important;
}

.routes-table .routes-col-name[b-s4qnxegvjc] {
  width: 17%;
}

.routes-table .routes-col-contractor[b-s4qnxegvjc] {
  width: 15%;
}

.routes-table .routes-col-count[b-s4qnxegvjc] {
  width: 108px;
}

.routes-table .routes-col-area[b-s4qnxegvjc] {
  width: 100px;
}

.routes-th-legend[b-s4qnxegvjc] {
  display: block;
  margin-top: 2px;
  font-size: 10px;
  font-weight: 500;
  letter-spacing: 0;
}

.routes-table .contractor-own-badge[b-s4qnxegvjc],
.routes-table .contractor-other-badge[b-s4qnxegvjc] {
  display: inline-block;
  max-width: 100%;
  white-space: normal;
}

.routes-table .routes-money-note[b-s4qnxegvjc] {
  white-space: normal;
}
/* /Pages/Routes/RouteSchedule.razor.rz.scp.css */
/* Three classes deep so this beats the `wm-fixed-page .main-content > *` shrink rule that
   pins page chrome: the body row is the one child that has to grow into the viewport. */
.wm-fixed-page .main-content .rsch-body[b-8k5imtjwsz] {
	display: flex;
	align-items: stretch;
	flex: 1 1 auto;
	min-height: 0;
	overflow: hidden;
}

.rsch-sidebar[b-8k5imtjwsz] {
	flex: 0 0 240px;
	display: flex;
	flex-direction: column;
	gap: 20px;
	min-height: 0;
	overflow: hidden;
	padding: 16px 12px 24px 24px;
	border-right: 1px solid #E2E8F0;
}

/* Each section takes half the sidebar and scrolls its own list, so a business with a hundred
   routes cannot push the drivers out of the viewport. Equal flex-basis of 0 makes the split
   even regardless of how long either list is. */
.rsch-filter-group[b-8k5imtjwsz] {
	display: flex;
	flex-direction: column;
	gap: 6px;
	flex: 1 1 0;
	min-height: 0;
}

.rsch-filter-head[b-8k5imtjwsz] {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 8px;
}

.rsch-filter-title[b-8k5imtjwsz] {
	margin: 0;
	font-size: 13px;
	font-weight: 600;
	color: #0F172A;
	text-transform: uppercase;
	letter-spacing: 0.02em;
}

.rsch-filter-toggle[b-8k5imtjwsz] {
	border: none;
	background: transparent;
	padding: 0;
	font-size: 12px;
	color: #363AF5;
	cursor: pointer;
	white-space: nowrap;
}

.rsch-filter-toggle:hover[b-8k5imtjwsz] {
	text-decoration: underline;
}

/* The shared search box is sized for a grid toolbar; the sidebar column is 204px wide, so it
   loses the padding it does not have room for. ::deep because the box is a child component. */
.rsch-filter-search[b-8k5imtjwsz]  .wm-search-input {
	padding: 6px 10px;
	max-width: none;
}

.rsch-filter-list[b-8k5imtjwsz] {
	display: flex;
	flex-direction: column;
	gap: 2px;
	flex: 1 1 auto;
	min-height: 60px;
	overflow-y: auto;
	scrollbar-width: thin;
}

.rsch-filter-empty[b-8k5imtjwsz] {
	margin: 6px;
	font-size: 12px;
	color: #94A3B8;
}

.rsch-filter-row[b-8k5imtjwsz] {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 4px 6px;
	border-radius: 8px;
	font-size: 13px;
	color: #334155;
	cursor: pointer;
	margin: 0;
}

.rsch-filter-row:hover[b-8k5imtjwsz] {
	background: #F1F5F9;
}

.rsch-checkbox[b-8k5imtjwsz] {
	flex: 0 0 auto;
	width: 15px;
	height: 15px;
	accent-color: #363AF5;
	cursor: pointer;
}

.rsch-color-dot[b-8k5imtjwsz] {
	flex: 0 0 auto;
	width: 10px;
	height: 10px;
	border-radius: 99px;
}

.rsch-filter-name[b-8k5imtjwsz] {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.rsch-sidebar-loading[b-8k5imtjwsz] {
	display: flex;
	justify-content: center;
	padding: 12px 0;
	color: #0D6EFD;
}

.rsch-calendar-host[b-8k5imtjwsz] {
	display: flex;
	flex-direction: column;
	flex: 1 1 auto;
	min-width: 0;
	min-height: 0;
	padding: 16px 24px 24px;
}
/* /Pages/Settlement/Components/SettlementApproveDialog.razor.rz.scp.css */
/* The last thing either side sees before the month is settled: what they are agreeing to, in
   figures, and what approving will set in motion. Same metrics as the change dialog beside it. */

/* All four sides, and nothing above will do it: see the note in SettlementChangeDialog.razor.css.
   20px matches the header above it. */
.sad-body[b-ih5ynuv2gb] {
    display: flex;
    flex-direction: column;
    gap: 14px;
    padding: 18px 20px 20px;
}

.sad-sums[b-ih5ynuv2gb] {
    display: flex;
    flex-direction: column;
    border: 1px solid #1e293b0f;
    border-radius: 12px;
    overflow: hidden;
}

.sad-line[b-ih5ynuv2gb] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 9px 14px;
    font-size: 13px;
    font-weight: 500;
    color: #475569;
    letter-spacing: -0.2px;
}

.sad-line + .sad-line[b-ih5ynuv2gb] { border-top: 1px solid #1e293b0f; }

.sad-line b[b-ih5ynuv2gb] {
    font-size: 14px;
    font-weight: 700;
    color: #1E293B;
    font-variant-numeric: tabular-nums;
}

.sad-line b.danger[b-ih5ynuv2gb] { color: #B82213; }

/* What approving will do, said before it is done rather than reported after. */
.sad-info[b-ih5ynuv2gb] {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 10px 12px;
    border-radius: 10px;
    background: #eef2ff;
    font-size: 12px;
    font-weight: 500;
    line-height: 18px;
    color: #475569;
    letter-spacing: -0.2px;
}

.sad-info.warn[b-ih5ynuv2gb] { background: #fff7ed; color: #8a5a12; }

.sad-i[b-ih5ynuv2gb] {
    width: 20px;
    height: 20px;
    flex: 0 0 20px;
    border-radius: 6px;
    background: #5263FF;
    color: #ffffff;
    display: grid;
    place-items: center;
    font-size: 11px;
    font-weight: 800;
}

.sad-info.warn .sad-i[b-ih5ynuv2gb] { background: #f59e0b; }
/* /Pages/Settlement/Components/SettlementChangeDialog.razor.rz.scp.css */
/* The one dialog behind every argument on the sheet. Its controls are choices rather than free
   text wherever a choice will do, because a reason that can be counted is worth more at the end
   of a season than a paragraph. */

/* The body pays for its own padding on all four sides, and nothing above it will do it.
   WMPopup's shell carries Bootstrap's p-4, but `.new-location .modal-content` zeroes that
   with !important, and WMPopup then sets `padding: 0` inline on .modal-body, which beats the
   `.new-location .modal-body` rule that would have put it back. So a body that asks for
   nothing gets nothing, on every side. 20px matches the header above it. */
.scd-body[b-tjxprlxa0v] {
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding: 18px 20px 20px;
}

.scd-field[b-tjxprlxa0v] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.scd-field > label[b-tjxprlxa0v] {
    font-size: 13px;
    font-weight: 600;
    color: #475569;
    letter-spacing: -0.2px;
}

.scd-req[b-tjxprlxa0v] { color: #B82213; }

.scd-help[b-tjxprlxa0v] {
    font-size: 12px;
    font-weight: 500;
    color: #5F6E85;
    letter-spacing: -0.2px;
}

.scd-choices[b-tjxprlxa0v] {
    display: flex;
    flex-direction: column;
    gap: 7px;
}

.scd-choices.scd-row[b-tjxprlxa0v] {
    flex-direction: row;
    flex-wrap: wrap;
}

.scd-choice[b-tjxprlxa0v] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 36px;
    padding: 6px 11px;
    border: 1px solid #1e293b1f;
    border-radius: 10px;
    background: #ffffff;
    color: #1E293B;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: -0.2px;
    text-align: left;
    cursor: pointer;
}

.scd-choices:not(.scd-row) .scd-choice[b-tjxprlxa0v] { width: 100%; }
.scd-choice:hover[b-tjxprlxa0v] { background: #F8FAFC; }

.scd-choice.on[b-tjxprlxa0v] {
    background: #eef2ff;
    border-color: #5263ff55;
    color: #363AF5;
    box-shadow: 0 0 0 2px #dce0ff;
}

.scd-choice.danger.on[b-tjxprlxa0v] {
    background: #FDE8E6;
    border-color: #B8221355;
    color: #B82213;
    box-shadow: 0 0 0 2px #fbd9d5;
}

.scd-dot[b-tjxprlxa0v] {
    width: 14px;
    height: 14px;
    flex: 0 0 14px;
    border-radius: 50%;
    border: 1.5px solid #1e293b1f;
    background: #ffffff;
}

.scd-choice.on .scd-dot[b-tjxprlxa0v] {
    border-color: #5263FF;
    background: radial-gradient(circle, #5263FF 0 45%, #ffffff 46%);
}

.scd-choice.danger.on .scd-dot[b-tjxprlxa0v] {
    border-color: #B82213;
    background: radial-gradient(circle, #B82213 0 45%, #ffffff 46%);
}

/* The visits already registered in this cell: read-only facts, and the thing a removal or a
   work-type correction points at. */
.scd-read[b-tjxprlxa0v] {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    padding: 11px 12px;
    background: #F8FAFC;
    border: 1px solid #1e293b0f;
    border-radius: 12px;
    font-size: 13px;
    font-weight: 500;
    color: #475569;
    letter-spacing: -0.2px;
    text-align: left;
}

.scd-pick[b-tjxprlxa0v] { cursor: pointer; }
.scd-pick:hover[b-tjxprlxa0v] { background: #eef2ff; }

.scd-pick.on[b-tjxprlxa0v] {
    background: #eef2ff;
    border-color: #5263ff55;
    box-shadow: 0 0 0 2px #dce0ff;
}

/* Already waiting on a change: readable, but plainly not something to argue about again. */
.scd-pick.pending[b-tjxprlxa0v],
.scd-pick.pending:hover[b-tjxprlxa0v] {
    cursor: default;
    background: #f8fafc;
    border-style: dashed;
    box-shadow: none;
}

.scd-pick.pending .wt-chip[b-tjxprlxa0v] { opacity: .6; }

.scd-pending[b-tjxprlxa0v] {
    padding: 2px 8px;
    border-radius: 999px;
    background: #409B3F1F;
    color: #296C28;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: -0.1px;
    white-space: nowrap;
}

.scd-pending.rm[b-tjxprlxa0v] { background: #ED40301F; color: #B82213; }

.scd-grow[b-tjxprlxa0v] { flex: 1; }

.scd-time[b-tjxprlxa0v] {
    font-size: 12px;
    font-weight: 600;
    color: #5F6E85;
    font-variant-numeric: tabular-nums;
}

.scd-body .wt-chip[b-tjxprlxa0v] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 20px;
    padding: 1px 7px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    line-height: 18px;
}

.scd-body .wt-chip.wt-slot-0[b-tjxprlxa0v] { background: #5263FF1F; color: #363AF5; }
.scd-body .wt-chip.wt-slot-1[b-tjxprlxa0v] { background: #409B3F1F; color: #296C28; }
.scd-body .wt-chip.wt-slot-2[b-tjxprlxa0v] { background: #F59E0B29; color: #B45309; }
.scd-body .wt-chip.wt-slot-3[b-tjxprlxa0v] { background: #06B1F11F; color: #0075AA; }
.scd-body .wt-chip.wt-slot-none[b-tjxprlxa0v] { background: #1E293B14; color: #1E293B; }

/* What pressing the button will actually do. Different on the two sides, and worth saying:
   the owner's change is agreed at once, the contractor's waits for an answer. */
.scd-info[b-tjxprlxa0v] {
    display: flex;
    gap: 10px;
    align-items: flex-start;
    padding: 11px 12px;
    border-radius: 12px;
    background: #eef2ff;
    font-size: 12px;
    font-weight: 500;
    line-height: 18px;
    color: #475569;
    letter-spacing: -0.2px;
}

.scd-info.wait[b-tjxprlxa0v] { background: #fff7ed; color: #8a5a12; }

.scd-i[b-tjxprlxa0v] {
    width: 20px;
    height: 20px;
    flex: 0 0 20px;
    border-radius: 6px;
    background: #5263FF;
    color: #ffffff;
    display: grid;
    place-items: center;
    font-size: 11px;
    font-weight: 800;
}

.scd-info.wait .scd-i[b-tjxprlxa0v] { background: #f59e0b; }

/* The reason box is a .form-input like every other control in the app; only its height and
   its prose weight differ, because it is written in rather than filled in. */
.notefield[b-tjxprlxa0v] {
    display: block;
    min-height: 84px;
    resize: vertical;
    font-weight: 500;
    line-height: 20px;
    padding: 10px 12px;
    font-family: inherit;
}

/* Which of several otherwise identical call-outs this row is. */
.scd-num[b-tjxprlxa0v] {
    width: 18px;
    height: 18px;
    flex: 0 0 18px;
    border-radius: 6px;
    display: grid;
    place-items: center;
    background: #1E293B14;
    color: #5F6E85;
    font-size: 11px;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
}

.scd-pick.on .scd-num[b-tjxprlxa0v] { background: #5263FF29; color: #363AF5; }

/* Nothing to choose from, and why. */
.scd-empty[b-tjxprlxa0v] {
    padding: 10px 12px;
    border: 1px dashed #1E293B1F;
    border-radius: 10px;
    background: #f8fafc;
    font-size: 12px;
    font-weight: 500;
    line-height: 18px;
    color: #5F6E85;
    letter-spacing: -0.2px;
}

.scd-error[b-tjxprlxa0v] {
    padding: 10px 12px;
    border-radius: 10px;
    background: #fee2e2;
    color: #b91c1c;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: -0.2px;
}
/* /Pages/Settlement/Components/SettlementGrid.razor.rz.scp.css */
/* The grid is the one place in the app where a table is read as a picture rather than a list,
   so it drops the 56px row height the rest of the tables use: a month of ninety addresses has to
   fit on a screen for the shape of it to mean anything. */

.settlement-grid-wrap[b-px4y76l5hz] {
    overflow-x: auto;
    overscroll-behavior-x: contain;
    scrollbar-width: thin;
    scrollbar-color: #c3c8cf transparent;
}

.settlement-grid-wrap[b-px4y76l5hz]::-webkit-scrollbar { height: 8px; }
.settlement-grid-wrap[b-px4y76l5hz]::-webkit-scrollbar-thumb { background: #c3c8cf; border-radius: 4px; }

.settlement-grid[b-px4y76l5hz] {
    border-collapse: separate;
    border-spacing: 0;
    font-variant-numeric: tabular-nums;
    width: 100%;
}

.settlement-grid th[b-px4y76l5hz],
.settlement-grid td[b-px4y76l5hz] {
    padding: 0;
    border-bottom: 1px solid rgba(30, 41, 59, .06);
}

.settlement-grid thead th[b-px4y76l5hz] {
    position: sticky;
    top: 0;
    z-index: 3;
    background: #F8FAFC;
    border-bottom: 1px solid rgba(30, 41, 59, .09);
    height: 46px;
    font-size: 12px;
    font-weight: 600;
    color: #5F6E85;
    letter-spacing: -0.2px;
}

/* The address column stays put while the month scrolls under it. Without this the grid is
   unreadable past the second week: the marks are all identical and the row they belong to has
   gone off the left edge. */
.settlement-grid .sg-addr[b-px4y76l5hz] {
    position: sticky;
    left: 0;
    z-index: 2;
    background: #ffffff;
    text-align: left;
    min-width: 210px;
    max-width: 210px;
    padding: 5px 10px;
    border-right: 1px solid rgba(30, 41, 59, .09);
}

.settlement-grid thead .sg-addr[b-px4y76l5hz] { z-index: 4; background: #F8FAFC; }
.settlement-grid tbody tr:hover .sg-addr[b-px4y76l5hz],
.settlement-grid tbody tr:hover td[b-px4y76l5hz] { background: #f5f7ff; }

.sg-a[b-px4y76l5hz] {
    font-size: 13px;
    font-weight: 600;
    color: #1E293B;
    letter-spacing: -0.2px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.sg-r[b-px4y76l5hz] {
    font-size: 11px;
    font-weight: 500;
    color: #5F6E85;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Narrow on purpose. A month has to fit across the screen without scrolling, and the cell
   only ever holds a letter or two, so the day column is sized to the mark and not to the
   comfortable padding a table would otherwise take. */
.sg-day[b-px4y76l5hz] {
    width: 26px;
    min-width: 26px;
    text-align: center;
    padding: 3px 0;
}

.sg-wd[b-px4y76l5hz] { display: block; font-size: 10px; font-weight: 500; color: #94a3b8; }

/* The date is the way into the day sheet, but a column header painted like a link would turn
   the top of the grid into a row of blue numbers, so it only says so on hover. */
.sg-daylink[b-px4y76l5hz] { color: inherit; display: block; text-decoration: none; }
.sg-daylink:hover[b-px4y76l5hz] { color: #363AF5; text-decoration: underline; }

.sg-lock[b-px4y76l5hz] { display: block; font-size: 10px; line-height: 11px; margin-top: 1px; }

/* A settled day is green the whole way down its column: the contractor has already agreed it and
   the grid will not reopen the argument. */
.sg-day.settled[b-px4y76l5hz] { background: rgba(64, 155, 63, .13); color: #296C28; }
.sg-day.settled .sg-wd[b-px4y76l5hz],
.sg-day.settled .sg-lock[b-px4y76l5hz] { color: #296C28; }

.settlement-grid td.sg-cell[b-px4y76l5hz] {
    width: 26px;
    min-width: 26px;
    height: 30px;
    text-align: center;
    background: #ffffff;
    border-right: 1px solid rgba(30, 41, 59, .03);
    font-size: 11px;
    font-weight: 700;
    color: #363AF5;
}

.settlement-grid td.sg-cell.settledcol[b-px4y76l5hz] { background: rgba(64, 155, 63, .07); }
.settlement-grid tbody tr:hover td.sg-cell.settledcol[b-px4y76l5hz] { background: rgba(64, 155, 63, .11); }

.sg-cellbtn[b-px4y76l5hz] {
    width: 100%;
    height: 30px;
    border: none;
    background: transparent;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1px;
    position: relative;
    cursor: pointer;
}

.sg-cellbtn:hover[b-px4y76l5hz] { box-shadow: inset 0 0 0 1.5px #5263FF; }
.sg-cellbtn:focus-visible[b-px4y76l5hz] { outline: 2px solid #5263FF; outline-offset: -2px; }

.sg-cellbtn .sg-m[b-px4y76l5hz] {
    min-width: 15px;
    height: 19px;
    padding: 0 1px;
    display: grid;
    place-items: center;
    border-radius: 5px;
    font-size: 11px;
    font-weight: 700;
    line-height: 16px;
}

/* Work-type colours are the app's own chip slots, so a work type keeps one colour everywhere. */
.sg-m.wt-slot-0[b-px4y76l5hz] { background: #5263FF1F; color: #363AF5; }
.sg-m.wt-slot-1[b-px4y76l5hz] { background: #409B3F1F; color: #296C28; }
.sg-m.wt-slot-2[b-px4y76l5hz] { background: #F59E0B29; color: #B45309; }
.sg-m.wt-slot-3[b-px4y76l5hz] { background: #06B1F11F; color: #0075AA; }
.sg-m.wt-slot-none[b-px4y76l5hz] { background: #1E293B14; color: #1E293B; }

/* A crew that turned up and could not do the job. Still a visit, still reaches invoicing. */
.sg-m.x[b-px4y76l5hz] { background: #ED40301F; color: #B82213; }

/* A claim rather than a record: they say they were here and no call-out says so. */
.sg-m.ghost[b-px4y76l5hz] {
    background: transparent;
    color: #5F6E85;
    border: 1px dashed #1E293B1F;
    font-weight: 600;
}

/* Registered today, but they have asked for it to go. The mark stays so the cell keeps saying
   what the record says. */
.sg-m.struck[b-px4y76l5hz] { background: #1E293B14; color: #5F6E85; text-decoration: line-through; }
.sg-m.asked[b-px4y76l5hz] { background: #F59E0B29; color: #B45309; }

/* Amber while the two of them are still arguing about it. */
.sg-cellbtn.asked[b-px4y76l5hz]::after,
.sg-cellbtn.agreed[b-px4y76l5hz]::after {
    content: "";
    position: absolute;
    top: 3px;
    right: 3px;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #f59e0b;
    box-shadow: 0 0 0 1.5px #ffffff;
}

/* Green once it is agreed but not yet written: the period commits when the owner approves it,
   so the cell still shows what the call-outs say and the dot says that is about to change. */
.sg-cellbtn.agreed[b-px4y76l5hz]::after { background: #296C28; }
.sg-m.agreed[b-px4y76l5hz] { background: rgba(64, 155, 63, .13); color: #296C28; }
.sg-m.ghost.agreed[b-px4y76l5hz] { background: transparent; border-color: #296C28; color: #296C28; }
.sg-m.struck.agreed[b-px4y76l5hz] { color: #296C28; text-decoration: line-through; }

.sg-cellbtn.empty[b-px4y76l5hz]::before { content: "\00b7"; font-size: 15px; color: #cbd5e1; }

.settlement-grid .sg-total[b-px4y76l5hz] {
    width: 56px;
    min-width: 56px;
    text-align: right;
    padding-right: 10px;
    border-left: 1px solid rgba(30, 41, 59, .09);
    background: #ffffff;
    font-size: 12px;
    font-weight: 700;
    color: #1E293B;
}

.settlement-grid thead .sg-total[b-px4y76l5hz] { background: #F8FAFC; font-weight: 600; color: #5F6E85; }
.settlement-grid td.sg-total.zero[b-px4y76l5hz] { color: #B82213; }
.sg-warn[b-px4y76l5hz] { margin-left: 3px; }

/* An address nobody visited gets a red edge, because the empty row is the conversation. */
.settlement-grid tr.sg-flagged .sg-addr[b-px4y76l5hz] { box-shadow: inset 3px 0 0 #B82213; }
.settlement-grid tr.sg-kid .sg-addr[b-px4y76l5hz] { padding-left: 28px; }

.settlement-grid tr.sg-group > *[b-px4y76l5hz] {
    background: #eef2ff !important;
    border-bottom: 1px solid #d9e0ff;
    cursor: pointer;
}

.settlement-grid tr.sg-group:hover > *[b-px4y76l5hz] { background: #e7ecff !important; }
.settlement-grid tr.sg-group td.sg-cell[b-px4y76l5hz] { height: 30px; color: #363AF5; }
.settlement-grid tr.sg-group td.sg-total[b-px4y76l5hz] { background: #eef2ff; color: #363AF5; font-weight: 800; }

.sg-gname[b-px4y76l5hz] {
    font-size: 12px;
    font-weight: 800;
    color: #363AF5;
    letter-spacing: -0.2px;
    display: flex;
    align-items: center;
    gap: 6px;
}

.sg-tw[b-px4y76l5hz] { font-size: 9px; width: 9px; }
.sg-gsub[b-px4y76l5hz] { font-size: 11px; font-weight: 500; color: #7b83b8; padding-left: 15px; }
.sg-zero[b-px4y76l5hz] { color: #b9c1e8; }
/* /Pages/Settlement/Components/SettlementReopenDialog.razor.rz.scp.css */
/* Undoing a settlement. One warning and one box, because there is one decision here and the
   reason for it is the whole message the other side receives. */

/* The body pays for its own padding on all four sides, and nothing above it will do it: see the
   note in SettlementChangeDialog.razor.css. 20px matches the header above it. */
.srd-body[b-63ti23gnbl] {
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding: 18px 20px 20px;
}

.srd-info[b-63ti23gnbl] {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 10px 12px;
    border-radius: 10px;
    background: #fff7ed;
    font-size: 12px;
    font-weight: 500;
    line-height: 18px;
    color: #8a5a12;
    letter-spacing: -0.2px;
}

.srd-i[b-63ti23gnbl] {
    width: 20px;
    height: 20px;
    flex: 0 0 20px;
    border-radius: 6px;
    background: #f59e0b;
    color: #ffffff;
    display: grid;
    place-items: center;
    font-size: 11px;
    font-weight: 800;
}

.srd-field[b-63ti23gnbl] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.srd-field > label[b-63ti23gnbl] {
    font-size: 13px;
    font-weight: 600;
    color: #475569;
    letter-spacing: -0.2px;
}

.srd-req[b-63ti23gnbl] { color: #B82213; }

/* A .form-input like every other control in the app, given the height and the prose weight of
   something written in rather than filled in. */
.srd-field .notefield[b-63ti23gnbl] {
    display: block;
    width: 100%;
    min-height: 84px;
    resize: vertical;
    font-weight: 500;
    line-height: 20px;
    padding: 10px 12px;
    font-family: inherit;
}
/* /Pages/Settlement/Components/SettlementRequestPanel.razor.rz.scp.css */
/* The argument over this period, from both sides. Each entry is a short claim, whatever came
   back, and whichever button the reader is allowed to press. Same metrics as the sheet it sits
   under (SettlementSheet.razor.css). */

.srp[b-rze53sruvr] {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 16px;
    border-top: 1px solid #1e293b0f;
}

.srp-head h2[b-rze53sruvr] {
    margin: 0;
    font-size: 15px;
    font-weight: 700;
    color: #1E293B;
    letter-spacing: -0.2px;
}

.srp-head p[b-rze53sruvr] {
    margin: 2px 0 0;
    font-size: 12px;
    font-weight: 500;
    color: #5F6E85;
    letter-spacing: -0.2px;
}

/* ---- one disputed cell ---- */

.srp-item[b-rze53sruvr] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 12px 14px;
    background: #ffffff;
    border: 1px solid #1e293b0f;
    border-radius: 12px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.04);
}

.srp-item.busy[b-rze53sruvr] {
    opacity: .6;
    pointer-events: none;
}

/* Already answered: still readable, still quotable on the phone, but plainly behind the
   entries that are still waiting on somebody. */
.srp-item.quiet[b-rze53sruvr] {
    background: #F8FAFC;
    box-shadow: none;
}

/* Where the record begins and the work ends. */
.srp-sep[b-rze53sruvr] {
    margin-top: 6px;
    font-size: 11px;
    font-weight: 700;
    color: #5F6E85;
    letter-spacing: 0.4px;
    text-transform: uppercase;
}

.srp-top[b-rze53sruvr] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

/* The kind of claim, as the same letter the grid draws, so the panel and the cells agree. */
.srp-icon[b-rze53sruvr] {
    width: 22px;
    height: 22px;
    flex: 0 0 22px;
    border-radius: 7px;
    display: grid;
    place-items: center;
    font-style: normal;
    font-size: 11px;
    font-weight: 800;
    background: #eef2ff;
    color: #4338ca;
}

.srp-icon.add[b-rze53sruvr] { background: #ecfdf5; color: #047857; }
.srp-icon.rm[b-rze53sruvr] { background: #fee2e2; color: #b91c1c; }
.srp-icon.ch[b-rze53sruvr] { background: #fff7ed; color: #b45309; }

.srp-when[b-rze53sruvr] {
    font-size: 12px;
    font-weight: 700;
    color: #1E293B;
    letter-spacing: -0.2px;
    font-variant-numeric: tabular-nums;
}

.srp-what[b-rze53sruvr] {
    font-size: 13px;
    font-weight: 600;
    color: #1E293B;
    letter-spacing: -0.2px;
}

.src-tag[b-rze53sruvr] {
    margin-left: auto;
    padding: 2px 8px;
    border-radius: 999px;
    background: #f1f5f9;
    color: #475569;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: -0.1px;
}

/* Who put it on the sheet, where that is not obvious from which side is reading. */
.srp-origin[b-rze53sruvr] {
    padding: 2px 8px;
    border-radius: 999px;
    background: #eef2ff;
    color: #4338ca;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: -0.1px;
}

.srp-status[b-rze53sruvr] {
    padding: 2px 8px;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: -0.1px;
    background: #1E293B14;
    color: #1E293B;
}

.srp-status.ok[b-rze53sruvr] { background: #409B3F1F; color: #296C28; }
.srp-status.no[b-rze53sruvr] { background: #ED40301F; color: #B82213; }
.srp-status.off[b-rze53sruvr] { background: #1E293B14; color: #5F6E85; }

.srp-detail[b-rze53sruvr] {
    font-size: 13px;
    font-weight: 500;
    color: #475569;
    letter-spacing: -0.2px;
}

/* Their own words, kept as theirs rather than folded into the app's voice. */
.srp-quote[b-rze53sruvr] {
    padding: 8px 12px;
    border-left: 3px solid #cbd5e1;
    background: #f8fafc;
    border-radius: 0 8px 8px 0;
    font-size: 13px;
    font-weight: 500;
    line-height: 20px;
    color: #334155;
    letter-spacing: -0.2px;
    white-space: pre-wrap;
    overflow-wrap: anywhere;
}

/* ---- the answer that came back ---- */

/* A rejection is read word for word by whoever raised it, so it is given the weight of the
   claim above it rather than tucked away as a footnote. */
.srp-answer[b-rze53sruvr] {
    padding: 10px 12px;
    border-radius: 10px;
    background: #ED40300F;
    border: 1px solid #ED403029;
}

.srp-answer-lbl[b-rze53sruvr] {
    font-size: 11px;
    font-weight: 700;
    color: #B82213;
    letter-spacing: -0.1px;
    margin-bottom: 4px;
}

.srp-answer-txt[b-rze53sruvr] {
    font-size: 13px;
    font-weight: 500;
    line-height: 20px;
    color: #334155;
    letter-spacing: -0.2px;
    white-space: pre-wrap;
    overflow-wrap: anywhere;
}

.srp-answered-on[b-rze53sruvr] {
    font-size: 11px;
    font-weight: 500;
    color: #5F6E85;
    letter-spacing: -0.2px;
}

/* ---- refusing one ---- */

.srp-reject[b-rze53sruvr] {
    display: flex;
    flex-direction: column;
}

.srp-reject label[b-rze53sruvr] {
    font-size: 13px;
    font-weight: 600;
    color: #475569;
    letter-spacing: -0.2px;
    margin-bottom: 6px;
}

.srp-reject .scd-req[b-rze53sruvr] { color: #dc2626; }

.srp-reject .notefield[b-rze53sruvr] {
    display: block;
    width: 100%;
    min-height: 72px;
    resize: vertical;
    font-weight: 500;
    line-height: 20px;
    padding: 10px 12px;
    font-family: inherit;
}

.srp-acts[b-rze53sruvr] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.srp-acts .grow[b-rze53sruvr] { flex: 1 1 auto; }
/* /Pages/Settlement/DailyOverview.razor.rz.scp.css */
/* The page borrows the list-page chrome (`.dispatch .main-content .data-left-right
   .main-table`) from the global sheet. Only what one night adds lives here, in the same
   metrics as the month overview beside it. */

.do-title-sub[b-r6z9n79qbp] {
    color: var(--wm-text-muted);
    font-size: var(--wm-font-sm);
    font-weight: var(--wm-weight-body);
    line-height: var(--wm-line-sm);
    margin: 2px 0 0;
}

/* ---- Day stepper --------------------------------------------------------- */

.do-period[b-r6z9n79qbp] {
    align-items: center;
    background: var(--wm-card-bg);
    border: 1px solid var(--wm-card-border-color);
    border-radius: var(--wm-control-radius);
    display: flex;
    height: var(--wm-control-height);
    overflow: hidden;
}

/* Scoped from `.main-title` on purpose: the global sheet paints every button in a
   title bar as a primary action, and these two are stepper arrows. */
.main-title .do-period button[b-r6z9n79qbp] {
    background: transparent;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    color: var(--wm-text-muted);
    font-size: 14px;
    height: 30px;
    line-height: 1;
    padding: 0;
    width: 26px;
}

.main-title .do-period button:hover[b-r6z9n79qbp] {
    background: var(--wm-control-bg);
    opacity: 1;
}

/* The date itself is the way into the calendar, so it is a button that reads as the caption.
   More specific than the arrow rule above so it keeps its own width and borders. */
.main-title .do-period button.do-period-current[b-r6z9n79qbp] {
    border-left: 1px solid var(--wm-card-border-color);
    border-right: 1px solid var(--wm-card-border-color);
    color: var(--wm-text-strong);
    cursor: pointer;
    font-size: var(--wm-font-sm);
    font-weight: var(--wm-weight-strong);
    line-height: 30px;
    padding: 0 10px;
    white-space: nowrap;
    width: auto;
}

.do-period-wrap[b-r6z9n79qbp] {
    position: relative;
}

/* ---- Filter -------------------------------------------------------------- */

.do-select[b-r6z9n79qbp] {
    appearance: none;
    background-color: var(--wm-card-bg);
    background-image:
        linear-gradient(45deg, transparent 50%, #5F6E85 50%),
        linear-gradient(135deg, #5F6E85 50%, transparent 50%);
    background-position: calc(100% - 15px) 14px, calc(100% - 10px) 14px;
    background-repeat: no-repeat;
    background-size: 5px 5px, 5px 5px;
    border: 1px solid var(--wm-card-border-color);
    border-radius: var(--wm-control-radius);
    color: var(--wm-text-strong);
    cursor: pointer;
    font-size: var(--wm-font-sm);
    font-weight: var(--wm-weight-strong);
    height: var(--wm-control-height);
    max-width: 260px;
    padding: 0 30px 0 10px;
}

.do-select:focus[b-r6z9n79qbp] {
    box-shadow: 0 0 0 0.2rem #dce0ff;
    outline: none;
}

/* ---- Calendar ------------------------------------------------------------ */

.do-cal-backdrop[b-r6z9n79qbp] {
    inset: 0;
    position: fixed;
    z-index: 40;
}

.do-cal[b-r6z9n79qbp] {
    background: var(--wm-card-bg);
    border: 1px solid var(--wm-card-border-color);
    border-radius: 14px;
    box-shadow: 0 16px 40px rgba(15, 23, 42, 0.16);
    padding: 12px;
    position: absolute;
    right: 0;
    top: calc(100% + 6px);
    width: 280px;
    z-index: 41;
}

.do-cal-head[b-r6z9n79qbp] {
    align-items: center;
    display: flex;
    justify-content: space-between;
    margin-bottom: 8px;
}

.do-cal-month[b-r6z9n79qbp] {
    color: var(--wm-text-strong);
    font-size: var(--wm-font-md);
    font-weight: 700;
}

.main-title .do-cal button.do-cal-nav[b-r6z9n79qbp] {
    background: transparent;
    border: 0;
    border-radius: 8px;
    box-shadow: none;
    color: var(--wm-text-muted);
    font-size: 16px;
    height: 28px;
    line-height: 1;
    padding: 0;
    width: 28px;
}

.main-title .do-cal button.do-cal-nav:hover[b-r6z9n79qbp] {
    background: var(--wm-control-bg);
    opacity: 1;
}

.do-cal-grid[b-r6z9n79qbp] {
    display: grid;
    gap: 4px;
    grid-template-columns: repeat(7, 1fr);
}

.do-cal-wd[b-r6z9n79qbp] {
    color: var(--wm-text-muted);
    font-size: 11px;
    font-weight: 700;
    padding: 2px 0 4px;
    text-align: center;
}

/* Scoped from `.main-title` for the same reason as the stepper: the title bar paints every
   button in it as a primary action. */
.main-title .do-cal button.do-cal-day[b-r6z9n79qbp] {
    align-items: center;
    background: transparent;
    border: 1px solid transparent;
    border-radius: 8px;
    box-shadow: none;
    color: var(--wm-text-strong);
    display: flex;
    font-size: 12px;
    font-variant-numeric: tabular-nums;
    font-weight: 600;
    height: 32px;
    justify-content: center;
    padding: 0;
    width: 100%;
}

.main-title .do-cal button.do-cal-day:hover[b-r6z9n79qbp] {
    background: var(--wm-control-bg);
    opacity: 1;
}

/* Work that night the reader's side has not signed yet. */
.main-title .do-cal button.do-cal-day.waiting[b-r6z9n79qbp] {
    background: #5263FF1F;
    color: #363AF5;
    font-weight: 700;
}

/* Everything driven that night is signed by the reader's side. */
.main-title .do-cal button.do-cal-day.done[b-r6z9n79qbp] {
    background: #409B3F1F;
    color: #296C28;
    font-weight: 700;
}

.main-title .do-cal button.do-cal-day.today[b-r6z9n79qbp] {
    text-decoration: underline;
    text-underline-offset: 3px;
}

.main-title .do-cal button.do-cal-day.selected[b-r6z9n79qbp] {
    border-color: var(--wm-text-strong);
}

.do-cal-foot[b-r6z9n79qbp] {
    align-items: center;
    border-top: 1px solid var(--wm-divider);
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    justify-content: center;
    margin-top: 10px;
    min-height: 34px;
    padding-top: 8px;
}

.do-cal-key[b-r6z9n79qbp] {
    align-items: center;
    color: var(--wm-text-muted);
    display: inline-flex;
    font-size: 11px;
    font-weight: 600;
    gap: 6px;
}

.do-cal-key i[b-r6z9n79qbp] {
    border-radius: 4px;
    display: inline-block;
    height: 12px;
    width: 12px;
}

.do-cal-key i.waiting[b-r6z9n79qbp] { background: #5263FF3D; }
.do-cal-key i.done[b-r6z9n79qbp] { background: #409B3F3D; }

/* ---- Sections and cards -------------------------------------------------- */

.do-section-title[b-r6z9n79qbp] {
    color: var(--wm-text-muted);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.4px;
    margin-top: 4px;
    text-transform: uppercase;
}

.do-card[b-r6z9n79qbp] {
    margin: 0;
    overflow: hidden;
    padding: 0;
}

/* The whole head is the way into the day, so it is one button rather than a row with a
   small link at the end of it. */
.do-head[b-r6z9n79qbp] {
    align-items: center;
    background: transparent;
    border: 0;
    cursor: pointer;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    padding: 12px 16px;
    text-align: left;
    width: 100%;
}

.do-head:hover[b-r6z9n79qbp] {
    background: #f5f7ff;
}

.do-head:focus-visible[b-r6z9n79qbp] {
    outline: 2px solid #5263FF;
    outline-offset: -2px;
}

.do-swatch[b-r6z9n79qbp] {
    align-self: stretch;
    border-radius: 2px;
    flex: 0 0 3px;
    min-height: 22px;
    width: 3px;
}

.do-name[b-r6z9n79qbp] {
    color: var(--wm-text-strong);
    font-size: var(--wm-font-md);
    font-weight: 700;
    line-height: var(--wm-line-md);
}

.do-count[b-r6z9n79qbp] {
    color: var(--wm-text-muted);
    font-size: var(--wm-font-sm);
}

.do-count b[b-r6z9n79qbp] {
    color: var(--wm-text-strong);
    font-variant-numeric: tabular-nums;
}

.do-grow[b-r6z9n79qbp] {
    flex: 1 1 auto;
}

.do-link[b-r6z9n79qbp] {
    color: #363AF5;
    font-size: var(--wm-font-sm);
    font-weight: var(--wm-weight-strong);
    white-space: nowrap;
}

.do-chip[b-r6z9n79qbp] {
    align-items: center;
    border-radius: var(--wm-control-radius);
    display: inline-flex;
    font-size: var(--wm-font-sm);
    font-weight: 700;
    line-height: var(--wm-line-sm);
    padding: 3px 8px;
    white-space: nowrap;
}

.do-chip-ok[b-r6z9n79qbp] {
    background: #ecfdf5;
    color: #16a34a;
}

.do-chip-warn[b-r6z9n79qbp] {
    background: #fff7ed;
    color: #f59e0b;
}

.do-chip-idle[b-r6z9n79qbp] {
    background: #f1f5f9;
    color: var(--wm-text-muted);
}

/* ---- The stops on a card ------------------------------------------------- */

.do-stops[b-r6z9n79qbp] {
    border-top: 1px solid var(--wm-divider);
    margin: 0;
}

.do-num[b-r6z9n79qbp] {
    font-variant-numeric: tabular-nums;
    text-align: right;
}

.do-address[b-r6z9n79qbp] {
    color: var(--wm-text-strong);
    font-weight: var(--wm-weight-strong);
}

.do-tag[b-r6z9n79qbp] {
    background: #f1f3f9;
    border-radius: var(--wm-control-radius);
    color: #5a6070;
    font-size: 11px;
    font-weight: var(--wm-weight-strong);
    margin-left: 6px;
    padding: 2px 8px;
    white-space: nowrap;
}

.do-tag.do-tag-pending[b-r6z9n79qbp] {
    background: #F59E0B29;
    color: #B45309;
}

/* Turned up and could not do the job: still a kørsel, but not the work that was asked for. */
.do-unable[b-r6z9n79qbp] {
    color: #B82213;
}

.do-loading[b-r6z9n79qbp] {
    border-top: 1px solid var(--wm-divider);
    display: flex;
    justify-content: center;
    padding: 14px;
}

/* ---- States -------------------------------------------------------------- */

.do-state[b-r6z9n79qbp] {
    align-items: center;
    display: flex;
    flex-direction: column;
    gap: 12px;
    justify-content: center;
    margin: 0;
    min-height: 240px;
}

.do-state p[b-r6z9n79qbp] {
    color: var(--wm-text-muted);
    margin: 0;
}

.do-retry[b-r6z9n79qbp] {
    background: var(--purple);
    border: 1px solid var(--purple);
    border-radius: var(--wm-control-radius);
    color: var(--white);
    font-size: var(--wm-font-sm);
    font-weight: var(--wm-weight-strong);
    height: var(--wm-control-height);
    padding: 4px 12px;
}
/* /Pages/Settlement/MonthlyOverview.razor.rz.scp.css */
/* The page borrows the list-page chrome (`.dispatch .main-content .data-left-right
   .main-table`) from the global sheet, so only what the overview adds on top of a
   list page lives here. */

.mo-title-sub[b-6cbnkxd436] {
    color: var(--wm-text-muted);
    font-size: var(--wm-font-sm);
    font-weight: var(--wm-weight-body);
    line-height: var(--wm-line-sm);
    margin: 2px 0 0;
}

/* ---- Month stepper ------------------------------------------------------- */

.mo-period[b-6cbnkxd436] {
    align-items: center;
    background: var(--wm-card-bg);
    border: 1px solid var(--wm-card-border-color);
    border-radius: var(--wm-control-radius);
    display: flex;
    height: var(--wm-control-height);
    overflow: hidden;
}

/* Scoped from `.main-title` on purpose: the global sheet paints every button in a
   title bar as a primary action, and these two are stepper arrows. */
.main-title .mo-period button[b-6cbnkxd436] {
    background: transparent;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    color: var(--wm-text-muted);
    font-size: 14px;
    height: 30px;
    line-height: 1;
    padding: 0;
    width: 26px;
}

.main-title .mo-period button:hover[b-6cbnkxd436] {
    background: var(--wm-control-bg);
    opacity: 1;
}

.mo-period-current[b-6cbnkxd436] {
    border-left: 1px solid var(--wm-card-border-color);
    border-right: 1px solid var(--wm-card-border-color);
    color: var(--wm-text-strong);
    font-size: var(--wm-font-sm);
    font-weight: var(--wm-weight-strong);
    line-height: 30px;
    padding: 0 10px;
    white-space: nowrap;
}

/* ---- Status chips -------------------------------------------------------- */

.mo-chip[b-6cbnkxd436] {
    border-radius: var(--wm-control-radius);
    display: inline-flex;
    align-items: center;
    font-size: var(--wm-font-sm);
    font-weight: 700;
    line-height: var(--wm-line-sm);
    padding: 4px 8px;
    white-space: nowrap;
}

.mo-chip-ok[b-6cbnkxd436] {
    background: #ecfdf5;
    color: #16a34a;
}

.mo-chip-warn[b-6cbnkxd436] {
    background: #fff7ed;
    color: #f59e0b;
}

.mo-chip-idle[b-6cbnkxd436] {
    background: #f1f5f9;
    color: var(--wm-text-muted);
}

/* ---- Table --------------------------------------------------------------- */

.mo-num[b-6cbnkxd436] {
    font-variant-numeric: tabular-nums;
    text-align: right;
}

.mo-row-clickable[b-6cbnkxd436] {
    cursor: pointer;
}

.mo-contractor[b-6cbnkxd436] {
    align-items: center;
    display: flex;
    gap: 10px;
}

.mo-swatch[b-6cbnkxd436] {
    align-self: stretch;
    border-radius: 2px;
    flex: 0 0 3px;
    min-height: 32px;
    width: 3px;
}

.mo-contractor-text[b-6cbnkxd436] {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.mo-contractor-name[b-6cbnkxd436] {
    color: var(--wm-text-strong);
    font-size: var(--wm-font-md);
    font-weight: 700;
    line-height: var(--wm-line-md);
}

.mo-contractor-sub[b-6cbnkxd436] {
    color: var(--wm-text-muted);
    font-size: var(--wm-font-sm);
    font-weight: var(--wm-weight-body);
    line-height: var(--wm-line-sm);
}

/* Own crews are shown for the sake of the totals, not to be opened, so the row
   reads as a footnote and does not offer a hover or a link. */
.mo-row-own td[b-6cbnkxd436] {
    color: var(--wm-text-muted);
}

.mo-row-own .mo-contractor-name[b-6cbnkxd436] {
    color: var(--wm-text-muted);
}

.mo-row-link[b-6cbnkxd436] {
    color: var(--purple);
    font-size: var(--wm-font-sm);
    font-weight: 700;
    white-space: nowrap;
}

.mo-empty[b-6cbnkxd436] {
    color: var(--wm-text-muted);
    text-align: center;
}

/* ---- States and footer --------------------------------------------------- */

.mo-state[b-6cbnkxd436] {
    align-items: center;
    display: flex;
    flex-direction: column;
    gap: 12px;
    justify-content: center;
    min-height: 300px;
}

.mo-state p[b-6cbnkxd436] {
    color: var(--wm-text-muted);
    margin: 0;
}

.mo-retry[b-6cbnkxd436] {
    background: var(--purple);
    border: 1px solid var(--purple);
    border-radius: var(--wm-control-radius);
    color: var(--white);
    font-size: var(--wm-font-sm);
    font-weight: var(--wm-weight-strong);
    height: var(--wm-control-height);
    padding: 4px 12px;
}

.mo-card-foot[b-6cbnkxd436] {
    align-items: center;
    background: #F8FAFC;
    border-top: 1px solid var(--wm-divider);
    color: var(--wm-text-muted);
    display: flex;
    flex-wrap: wrap;
    font-size: var(--wm-font-sm);
    font-weight: var(--wm-weight-body);
    gap: 16px;
    padding: 12px 16px;
}
/* /Pages/Settlement/SettlementDay.razor.rz.scp.css */
/* The day sheet reuses the list-page card from the global sheet; only what one
   day adds on top of a list page lives here. */

.sd-title-sub[b-pm7k00h67p] {
    color: var(--wm-text-muted);
    font-size: var(--wm-font-sm);
    font-weight: var(--wm-weight-body);
    line-height: var(--wm-line-sm);
    margin: 2px 0 0;
}

/* ---- Day stepper --------------------------------------------------------- */

.sd-period[b-pm7k00h67p] {
    align-items: center;
    background: var(--wm-card-bg);
    border: 1px solid var(--wm-card-border-color);
    border-radius: var(--wm-control-radius);
    display: flex;
    height: var(--wm-control-height);
    overflow: hidden;
}

/* Scoped from `.main-title` on purpose: the global sheet paints every button in a
   title bar as a primary action, and these two are stepper arrows. */
.main-title .sd-period button[b-pm7k00h67p] {
    background: transparent;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    color: var(--wm-text-muted);
    font-size: 14px;
    height: 30px;
    line-height: 1;
    padding: 0;
    width: 26px;
}

.main-title .sd-period button:hover[b-pm7k00h67p] {
    background: var(--wm-control-bg);
    opacity: 1;
}

.sd-period-current[b-pm7k00h67p] {
    border-left: 1px solid var(--wm-card-border-color);
    border-right: 1px solid var(--wm-card-border-color);
    color: var(--wm-text-strong);
    font-size: var(--wm-font-sm);
    font-weight: var(--wm-weight-strong);
    line-height: 30px;
    padding: 0 10px;
    white-space: nowrap;
}

/* ---- Card head ----------------------------------------------------------- */

.sd-summary[b-pm7k00h67p] {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 8px;
}

.sd-summary-main[b-pm7k00h67p] {
    color: var(--wm-text-strong);
    font-size: var(--wm-font-md);
    font-weight: 700;
    line-height: var(--wm-line-md);
}

.sd-summary-times[b-pm7k00h67p] {
    color: var(--wm-text-muted);
    font-size: var(--wm-font-sm);
    font-weight: var(--wm-weight-body);
    font-variant-numeric: tabular-nums;
}

.sd-chip[b-pm7k00h67p] {
    border-radius: var(--wm-control-radius);
    display: inline-flex;
    align-items: center;
    font-size: var(--wm-font-sm);
    font-weight: 700;
    line-height: var(--wm-line-sm);
    padding: 4px 8px;
    white-space: nowrap;
}

.sd-chip-ok[b-pm7k00h67p] {
    background: #ecfdf5;
    color: #16a34a;
}

.sd-chip-warn[b-pm7k00h67p] {
    background: #fff7ed;
    color: #f59e0b;
}

.sd-chip-idle[b-pm7k00h67p] {
    background: #f1f5f9;
    color: var(--wm-text-muted);
}

/* ---- Table --------------------------------------------------------------- */

.sd-num[b-pm7k00h67p] {
    text-align: right;
}

.sd-time[b-pm7k00h67p] {
    font-variant-numeric: tabular-nums;
}

.sd-address[b-pm7k00h67p] {
    color: var(--wm-text-strong);
    font-weight: var(--wm-weight-strong);
}

.sd-muted[b-pm7k00h67p] {
    color: var(--wm-text-muted);
}

.sd-work[b-pm7k00h67p] {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.sd-work-name[b-pm7k00h67p] {
    color: var(--wm-text-body);
}

/* The chip is the work type at a glance, and the same four colours the month
   grid marks its cells with. */
.sd-wt[b-pm7k00h67p] {
    align-items: center;
    border-radius: var(--wm-control-radius);
    display: inline-flex;
    font-size: var(--wm-font-sm);
    font-weight: 700;
    justify-content: center;
    line-height: 18px;
    padding: 1px 7px;
    white-space: nowrap;
}

.sd-wt-a[b-pm7k00h67p] {
    background: #06B1F11F;
    color: #0075AA;
}

.sd-wt-b[b-pm7k00h67p] {
    background: #F59E0B29;
    color: #B45309;
}

.sd-wt-c[b-pm7k00h67p] {
    background: #5263FF1F;
    color: #363AF5;
}

.sd-wt-d[b-pm7k00h67p] {
    background: #409B3F1F;
    color: #296C28;
}

.sd-wt-danger[b-pm7k00h67p] {
    background: #ED40301F;
    color: #B82213;
}

.sd-tag[b-pm7k00h67p] {
    background: #f1f3f9;
    border-radius: var(--wm-control-radius);
    color: #5a6070;
    font-size: 11px;
    font-weight: var(--wm-weight-strong);
    line-height: var(--wm-line-sm);
    padding: 2px 8px;
    white-space: nowrap;
}

/* Part of this row is about to change: amber, the colour the grid gives an argument. */
.sd-tag.sd-tag-pending[b-pm7k00h67p] {
    background: #F59E0B29;
    color: #B45309;
}

.sd-flag-btn[b-pm7k00h67p] {
    background: var(--wm-control-bg);
    border: 1px solid var(--wm-divider-soft);
    border-radius: var(--wm-control-radius);
    color: var(--wm-text-strong);
    font-size: 11px;
    font-weight: var(--wm-weight-strong);
    height: 26px;
    padding: 2px 9px;

    /* The label is a phrase, not a word ("Ser forkert ud"), and it must stay inside its button
       in every language rather than wrap onto the row below it. */
    white-space: nowrap;
}

.sd-flag-btn:hover[b-pm7k00h67p] {
    background: #E2E8F0CC;
}

.sd-empty[b-pm7k00h67p] {
    color: var(--wm-text-muted);
    text-align: center;
}

/* ---- States and action bar ----------------------------------------------- */

.sd-state[b-pm7k00h67p] {
    align-items: center;
    display: flex;
    flex-direction: column;
    gap: 12px;
    justify-content: center;
    min-height: 300px;
}

.sd-state p[b-pm7k00h67p] {
    color: var(--wm-text-muted);
    margin: 0;
}

.sd-retry[b-pm7k00h67p] {
    background: var(--purple);
    border: 1px solid var(--purple);
    border-radius: var(--wm-control-radius);
    color: var(--white);
    font-size: var(--wm-font-sm);
    font-weight: var(--wm-weight-strong);
    height: var(--wm-control-height);
    padding: 4px 12px;
}

.sd-actionbar[b-pm7k00h67p] {
    align-items: center;
    border-top: 1px solid var(--wm-divider);
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    padding: var(--wm-card-padding);
}

.sd-tally[b-pm7k00h67p] {
    display: flex;
    flex-wrap: wrap;
    gap: 22px;
}

.sd-tally div[b-pm7k00h67p] {
    color: var(--wm-text-muted);
    font-size: var(--wm-font-sm);
    font-weight: var(--wm-weight-body);
}

.sd-tally b[b-pm7k00h67p] {
    color: var(--wm-text-strong);
    display: block;
    font-size: 17px;
    font-weight: 800;
    font-variant-numeric: tabular-nums;
    line-height: 22px;
}

.sd-tally b.sd-tally-warn[b-pm7k00h67p] {
    color: #f59e0b;
}

.sd-approve-btn[b-pm7k00h67p] {
    background: var(--purple);
    border: 1px solid var(--purple);
    border-radius: var(--wm-control-radius);
    color: var(--white);
    font-size: var(--wm-font-md);
    font-weight: var(--wm-weight-strong);
    height: 40px;
    margin-left: auto;
    padding: 8px 14px;
}

/* Approving is admin-only on both sides, and the day may already be settled;
   the button stays visible so it is clear what is missing, not why. */
.sd-approve-btn:disabled[b-pm7k00h67p] {
    cursor: not-allowed;
    opacity: .6;
}

/* ---- The day's own confirmation ------------------------------------------ */

/* A popup body gets no padding of its own, so the dialog pays for all four sides
   here; 20px matches the header above it. */
.sd-confirm[b-pm7k00h67p] {
    display: flex;
    flex-direction: column;
    gap: 14px;
    padding: 18px 20px 20px;
}

.sd-confirm-sums[b-pm7k00h67p] {
    border: 1px solid #1e293b0f;
    border-radius: 12px;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.sd-confirm-line[b-pm7k00h67p] {
    align-items: center;
    color: #475569;
    display: flex;
    font-size: 13px;
    font-weight: 500;
    gap: 12px;
    justify-content: space-between;
    letter-spacing: -0.2px;
    padding: 9px 14px;
}

.sd-confirm-line + .sd-confirm-line[b-pm7k00h67p] {
    border-top: 1px solid #1e293b0f;
}

.sd-confirm-line b[b-pm7k00h67p] {
    color: #1E293B;
    font-size: 14px;
    font-variant-numeric: tabular-nums;
    font-weight: 700;
}

.sd-confirm-line b.danger[b-pm7k00h67p] {
    color: #B82213;
}

/* What signing the day off will do, said before it is done rather than after. */
.sd-confirm-info[b-pm7k00h67p] {
    align-items: flex-start;
    background: #eef2ff;
    border-radius: 10px;
    color: #475569;
    display: flex;
    font-size: 12px;
    font-weight: 500;
    gap: 10px;
    letter-spacing: -0.2px;
    line-height: 18px;
    padding: 10px 12px;
}

.sd-confirm-info.warn[b-pm7k00h67p] {
    background: #fff7ed;
    color: #8a5a12;
}

.sd-confirm-i[b-pm7k00h67p] {
    background: #5263FF;
    border-radius: 6px;
    color: #ffffff;
    display: grid;
    flex: 0 0 20px;
    font-size: 11px;
    font-weight: 800;
    height: 20px;
    place-items: center;
    width: 20px;
}

.sd-confirm-info.warn .sd-confirm-i[b-pm7k00h67p] {
    background: #f59e0b;
}
/* /Pages/Settlement/SettlementSheet.razor.rz.scp.css */
/* The sheet around the grid: the controls that reshape it, the legend that decodes it, and the
   bar that ends the month. The grid itself is styled in SettlementGrid.razor.css. */

.settlement-sub[b-z5p1x50fl8] {
    margin: 2px 0 0;
    font-size: 12px;
    font-weight: 500;
    color: #5F6E85;
    letter-spacing: -0.2px;
}

.settlement-period[b-z5p1x50fl8] {
    display: flex;
    align-items: center;
    height: 32px;
    background: #ffffff;
    border: 1px solid #1e293b0f;
    border-radius: 8px;
    overflow: hidden;
}

.settlement-period button[b-z5p1x50fl8] {
    width: 26px;
    height: 30px;
    border: none;
    background: transparent;
    color: #5F6E85;
    font-size: 14px;
    line-height: 1;
    cursor: pointer;
}

.settlement-period button:hover[b-z5p1x50fl8] { background: rgba(241, 245, 249, .8); }

.settlement-period .cur[b-z5p1x50fl8] {
    padding: 0 10px;
    font-size: 12px;
    font-weight: 600;
    color: #1E293B;
    line-height: 30px;
    letter-spacing: -0.2px;
    border-inline: 1px solid #1e293b0f;
    font-variant-numeric: tabular-nums;

    /* No text-transform. Danish and Swedish write month names in lower case, so capitalising
       here made the picker disagree with the heading beside it and was wrong in two of the
       three languages the app ships. The culture already knows the right form. */
}

.settlement-card[b-z5p1x50fl8] { overflow: hidden; }

/* ---- who has signed ---- */

/* Amber while it is waiting on the reader, green once both sides have signed. */
.settlement-signed[b-z5p1x50fl8] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 16px;
    background: #fff7ed;
    border-bottom: 1px solid #1e293b0f;
    font-size: 13px;
    font-weight: 600;
    color: #8a5a12;
    letter-spacing: -0.2px;
}

.settlement-signed.done[b-z5p1x50fl8] { background: rgba(64, 155, 63, .09); color: #296C28; }

.settlement-signed .tick[b-z5p1x50fl8] {
    width: 20px;
    height: 20px;
    flex: 0 0 20px;
    border-radius: 6px;
    display: grid;
    place-items: center;
    background: #f59e0b;
    color: #ffffff;
    font-size: 11px;
    font-weight: 800;
}

.settlement-signed.done .tick[b-z5p1x50fl8] { background: #409B3F; }

/* ---- toolbar ---- */

.settlement-toolbar[b-z5p1x50fl8] {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    padding: 12px 16px;
    background: #ffffff;
    border-bottom: 1px solid #1e293b0f;
}

.settlement-toolbar .lbl[b-z5p1x50fl8] {
    font-size: 12px;
    font-weight: 600;
    color: #5F6E85;
    letter-spacing: -0.2px;
}

/* The native select carries the app's own control metrics rather than the browser's, which
   otherwise lands a 20px system dropdown next to 32px buttons. */
.settlement-select[b-z5p1x50fl8] {
    height: 32px;
    padding: 0 30px 0 10px;
    border: 1px solid #1e293b0f;
    border-radius: 8px;
    background-color: #ffffff;
    color: #1E293B;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: -0.2px;
    appearance: none;
    cursor: pointer;
    background-image:
        linear-gradient(45deg, transparent 50%, #5F6E85 50%),
        linear-gradient(135deg, #5F6E85 50%, transparent 50%);
    background-position: calc(100% - 15px) 14px, calc(100% - 10px) 14px;
    background-size: 5px 5px, 5px 5px;
    background-repeat: no-repeat;
}

.settlement-select:focus[b-z5p1x50fl8] {
    outline: none;
    box-shadow: 0 0 0 0.2rem #dce0ff;
}

.settlement-seg[b-z5p1x50fl8] {
    display: inline-flex;
    gap: 4px;
    padding: 3px;
    background: rgba(241, 245, 249, .8);
    border: 1px solid #1e293b0f;
    border-radius: 12px;
}

.settlement-seg button[b-z5p1x50fl8] {
    height: 26px;
    padding: 3px 10px;
    border: 1px solid transparent;
    border-radius: 9px;
    background: transparent;
    color: #5F6E85;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: -0.2px;
    cursor: pointer;
}

.settlement-seg button.on[b-z5p1x50fl8] {
    background: #ffffff;
    border-color: #1e293b1f;
    color: #1E293B;
    box-shadow: 0 1.5px 2px 0.5px rgba(0, 0, 0, .06);
}

/* ---- legend ---- */

.settlement-legend[b-z5p1x50fl8] {
    display: flex;
    align-items: center;
    gap: 16px;
    flex-wrap: wrap;
    padding: 10px 16px;
    background: #F8FAFC;
    border-bottom: 1px solid #1e293b0f;
    font-size: 12px;
    font-weight: 500;
    color: #5F6E85;
    letter-spacing: -0.2px;
}

.settlement-legend .lg[b-z5p1x50fl8] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.settlement-legend .wt-chip[b-z5p1x50fl8] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 20px;
    padding: 1px 7px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    line-height: 18px;
}

.wt-chip.wt-slot-0[b-z5p1x50fl8] { background: #5263FF1F; color: #363AF5; }
.wt-chip.wt-slot-1[b-z5p1x50fl8] { background: #409B3F1F; color: #296C28; }
.wt-chip.wt-slot-2[b-z5p1x50fl8] { background: #F59E0B29; color: #B45309; }
.wt-chip.wt-slot-3[b-z5p1x50fl8] { background: #06B1F11F; color: #0075AA; }
.wt-chip.wt-slot-none[b-z5p1x50fl8] { background: #1E293B14; color: #1E293B; }
.wt-chip.wt-danger[b-z5p1x50fl8] { background: #ED40301F; color: #B82213; }

/* ---- footer ---- */

.settlement-foot[b-z5p1x50fl8] {
    display: flex;
    align-items: center;
    gap: 16px;
    flex-wrap: wrap;
    padding: 12px 16px;
    background: #F8FAFC;
    border-top: 1px solid #1e293b0f;
    font-size: 12px;
    font-weight: 500;
    color: #5F6E85;
    letter-spacing: -0.2px;
}

.settlement-foot .grow[b-z5p1x50fl8] { flex: 1; }
.settlement-foot b[b-z5p1x50fl8] { color: #1E293B; font-weight: 700; }
.settlement-foot b.danger[b-z5p1x50fl8] { color: #B82213; }

/* ---- note ---- */

.settlement-note[b-z5p1x50fl8] { padding: 16px 16px 0; }

.settlement-note label[b-z5p1x50fl8] {
    display: block;
    font-size: 13px;
    font-weight: 600;
    color: #475569;
    letter-spacing: -0.2px;
    margin-bottom: 6px;
}

/* A .form-input like every other control in the app, given the height and the prose weight
   of something written in rather than filled in, and the full width of what it sits under. */
.settlement-note .notefield[b-z5p1x50fl8] {
    display: block;
    width: 100%;
    min-height: 84px;
    resize: vertical;
    font-weight: 500;
    line-height: 20px;
    padding: 10px 12px;
    font-family: inherit;
}

/* ---- action bar ---- */

.settlement-actions[b-z5p1x50fl8] {
    display: flex;
    align-items: center;
    gap: 16px;
    flex-wrap: wrap;
    padding: 16px;
    border-top: 1px solid #1e293b0f;
}

.settlement-tally[b-z5p1x50fl8] {
    display: flex;
    gap: 22px;
    flex-wrap: wrap;
}

.settlement-tally div[b-z5p1x50fl8] {
    font-size: 12px;
    font-weight: 500;
    color: #5F6E85;
    letter-spacing: -0.2px;
}

.settlement-tally b[b-z5p1x50fl8] {
    display: block;
    font-size: 17px;
    font-weight: 800;
    color: #1E293B;
    line-height: 22px;
    font-variant-numeric: tabular-nums;
}

/* ---- the strip that says what approving does ---- */

.settlement-info[b-z5p1x50fl8] {
    display: flex;
    gap: 12px;
    align-items: flex-start;
    padding: 14px 16px;
    background: #eef2ff;
    border-top: 1px solid #1e293b0f;
    font-size: 12px;
    font-weight: 500;
    line-height: 19px;
    color: #475569;
    letter-spacing: -0.2px;
}

/* Amber for the one that is a consequence rather than an explanation: editing a settled month
   undoes the settlement. */
.settlement-info.warn[b-z5p1x50fl8] { background: #fff7ed; color: #8a5a12; }

/* The same strip sitting at the top of the card instead of the bottom of it. */
.settlement-info.top[b-z5p1x50fl8] {
    border-top: none;
    border-bottom: 1px solid #1e293b0f;
}

.settlement-info .i[b-z5p1x50fl8] {
    width: 20px;
    height: 20px;
    flex: 0 0 20px;
    border-radius: 6px;
    background: #5263FF;
    color: #ffffff;
    display: grid;
    place-items: center;
    font-size: 11px;
    font-weight: 800;
}

.settlement-info.warn .i[b-z5p1x50fl8] { background: #f59e0b; }

@media (max-width: 768px) {
    .settlement-toolbar[b-z5p1x50fl8],
    .settlement-legend[b-z5p1x50fl8],
    .settlement-foot[b-z5p1x50fl8],
    .settlement-actions[b-z5p1x50fl8] { padding-inline: 12px; }

    .settlement-tally[b-z5p1x50fl8] { gap: 14px; }
}
/* /Pages/Shifts/Components/ManageShiftPopup.razor.rz.scp.css */
.cu-body-wrap[b-mtbbc1wfb4] {
    padding: 20px;
    background: #f1f5f9;
}

.red[b-mtbbc1wfb4] {
    font-size: 13px;
    font-weight: 600;
    line-height: 20px;
    letter-spacing: -0.2px;
    color: var(--orange);
}

.shift-date-time[b-mtbbc1wfb4] {
    display: flex;
    width: 100%;
    border-radius: 10px;
}

.shift-date[b-mtbbc1wfb4] {
    flex: 1;
}

.shift-time[b-mtbbc1wfb4] {
    width: 70px;
}

.shift-date-time[b-mtbbc1wfb4] {
    width: 100%;
    height: 40px;
    display: flex;
    align-items: center;
    border: 1px solid #1E293B1F;
    border-radius: 10px;
    background: #fff;
    background-color: var(--white);
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
    overflow: hidden;
}

.shift-date-time:focus[b-mtbbc1wfb4],
.shift-date-time:focus-within[b-mtbbc1wfb4] {
    box-shadow: 0 0 0 0.2rem #dce0ff !important;
}

.shift-date-time:hover:not(.disabled)[b-mtbbc1wfb4] {
    border-color: #eaecff !important;
}

.shift-date-time.disabled[b-mtbbc1wfb4] {
    background: transparent !important;
    box-shadow: initial !important;
    cursor: not-allowed !important;
}

.shift-date-time-divider[b-mtbbc1wfb4] {
    width: 1px;
    align-self: stretch;
    background-color: #1E293B1F;
    flex-shrink: 0;
}

/* ::deep .wm-calendar-container.shift-date {
    width: fit-content !important;
} */

[b-mtbbc1wfb4] .shift-date .wm-calendar-input {
    border: none !important;
    box-shadow: none !important;
    border-radius: 0 !important;
    background: transparent !important;
    height: 40px !important;
    white-space: nowrap;
    outline: none !important;
}

[b-mtbbc1wfb4] .shift-date .wm-calendar-input:focus {
    box-shadow: none !important;
}

[b-mtbbc1wfb4] .wm-time-container.shift-time {
    width: fit-content !important;
}

[b-mtbbc1wfb4] .shift-time .wm-time-input {
    border: none !important;
    box-shadow: none !important;
    border-radius: 0 !important;
    background: transparent !important;
    height: 40px !important;
    width: 100px !important;
    white-space: nowrap;
    outline: none !important;
}

[b-mtbbc1wfb4] .shift-time .wm-time-input:focus {
    box-shadow: none !important;
}

.det-toggle-item[b-mtbbc1wfb4] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.det-toggle-switch[b-mtbbc1wfb4] {
    position: relative;
    display: inline-block;
    width: 46px;
    height: 28px;
    background: linear-gradient( 180deg, rgba(226, 232, 240, 1) 0%, rgba(248, 250, 252, 1) 100% );
    border-radius: 50px;
    padding: 3px;
    flex-shrink: 0;
}

    .det-toggle-switch input[b-mtbbc1wfb4] {
        opacity: 0;
        width: 0;
        height: 0;
    }

.det-toggle-slider[b-mtbbc1wfb4] {
    position: absolute;
    cursor: pointer;
    border-radius: 30px;
    background-color: #d3dde8;
    transition: 0.3s;
    height: 22px;
    width: 40px;
}

    .det-toggle-slider[b-mtbbc1wfb4]:before {
        content: "";
        position: absolute;
        height: 18px;
        width: 18px;
        left: 2px;
        top: 2px;
        border-radius: 1000px;
        background: linear-gradient(180deg, #e2e8f0 0%, #ffffff 100%);
        border: 3.5px solid #f9fbfc;
        box-shadow: 0 2px 4px rgba(0,0,0,.15);
        transition: .3s;
    }

.det-toggle-switch input:checked + .det-toggle-slider[b-mtbbc1wfb4] {
    background: linear-gradient(135deg, #5b67f6, #4c57e0);
}

    .det-toggle-switch input:checked + .det-toggle-slider[b-mtbbc1wfb4]:before {
        transform: translateX(18px);
        background: #fff;
    }

    .det-toggle-switch input:checked + .det-toggle-slider[b-mtbbc1wfb4]:after {
        content: "";
        position: absolute;
        right: 5px;
        top: 7.5px;
        width: 11px;
        height: 11px;
        background-image: url("../img/icons/toggle-check-icon.svg");
        background-size: contain;
        background-repeat: no-repeat;
    }

.det-toggle-label[b-mtbbc1wfb4] {
    font-size: 15px;
    font-weight: 600;
    color: var(--dark-txt);
}
/* /Pages/Shifts/Shifts.razor.rz.scp.css */
.shift-page .main-table[b-ogrfjm2odk] {
    background: #FFFFFF;
    border: 1px solid #EBECED;
    border-radius: 20px;
    overflow: hidden;
}

.shift-page .table-title[b-ogrfjm2odk] {
    padding: 16px;
    border-bottom: 1px solid #EBECED;
}

.shift-page .main-content .table-title .top-bagge .bagge[b-ogrfjm2odk] {
    padding: 8px;
    border-radius: 8px;
    gap: 4px;
}

    .shift-page .main-content .table-title .top-bagge .bagge.green[b-ogrfjm2odk] {
        background-color: #409B3F1F;
    }

    .shift-page .main-content .table-title .top-bagge .bagge.yellow[b-ogrfjm2odk] {
        background-color: #FFC30A1F;
    }

    .shift-page .main-content .table-title .top-bagge .bagge img[b-ogrfjm2odk] {
        width: 14px;
        height: 14px;
    }

    .shift-page .main-content .table-title .top-bagge .bagge p[b-ogrfjm2odk] {
        font-size: 12px;
        font-weight: 600;
        line-height: 16px;
        letter-spacing: -0.2px;
    }

    .shift-page .main-content .table-title .top-bagge .bagge.green p[b-ogrfjm2odk] {
        color: #4D9B3F;
    }

    .shift-page .main-content .table-title .top-bagge .bagge.yellow p[b-ogrfjm2odk] {
        color: #C58B00;
    }

    .shift-page .main-content .table-title .top-bagge .bagge p span[b-ogrfjm2odk] {
        font-weight: 600;
    }

.shift-page .shift-table[b-ogrfjm2odk] {
    margin-bottom: 0;
}

    .shift-page .shift-table thead th[b-ogrfjm2odk] {
        background: #F8FAFC;
        border: none;
        padding: 16px 20px;
        font-size: 12px;
        font-weight: 600;
        color: #667085;
        text-transform: uppercase;
        white-space: nowrap;
        vertical-align: middle;
    }

    .shift-page .shift-table tbody td[b-ogrfjm2odk] {
        padding: 20px;
        border-top: 1px solid #F1F5F9;
        vertical-align: middle;
    }

.shift-page .profile.blue[b-ogrfjm2odk] {
    width: 32px;
    height: 32px;
    min-width: 32px;
    border-radius: 50%;
    background: #6366F1;
    color: #FFFFFF;
    font-size: 12px;
    font-weight: 600;
}

.shift-page .profile-txt h6[b-ogrfjm2odk] {
    margin: 0;
    font-size: 14px;
    font-weight: 600;
    color: #1E293B;
}

.shift-page .profile-txt span[b-ogrfjm2odk] {
    font-size: 12px;
    font-weight: 600;
    color: #475569;
    line-height: 18px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.shift-page .bagee[b-ogrfjm2odk] {
    padding: 4px 8px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 600;
    line-height: 16px;
    letter-spacing: -0.2px;
    width: max-content;
    gap: 4px;
}

    .shift-page .bagee.green[b-ogrfjm2odk] {
        background-color: #409B3F1F;
        color: #4D9B3F;
    }

    .shift-page .bagee.yellow[b-ogrfjm2odk] {
        background-color: #FFC30A1F;
        color: #C58B00;
    }

    .shift-page .bagee.archive[b-ogrfjm2odk] {
        background-color: #F1F5F9CC;
        color: #1E293B;
        border: 1px solid #1E293B08;
    }

.shift-page .archive-bagge[b-ogrfjm2odk] {
    padding: 6px 10px;
    border-radius: 999px;
    background: #F2F4F7;
    width: fit-content;
    gap: 4px;
}

    .shift-page .archive-bagge p[b-ogrfjm2odk] {
        margin: 0;
        font-size: 13px;
    }

.shift-page .shift-table tbody tr:hover[b-ogrfjm2odk] {
    background: #FAFAFA;
}

.shift-page .table-responsive[b-ogrfjm2odk] {
    overflow-x: auto;
}

.shift-page .filter-btn[b-ogrfjm2odk] {
    display: flex;
    align-items: center;
    gap: 8px;
    /* Matches the shared title-bar button scale (32px / 12px / 8px radius). */
    height: 32px;
    padding: 4px 8px;
    border-radius: 8px;
    border: 1px solid #1E293B17;
    background: #F1F5F9;
    font-size: 12px;
    font-weight: 600;
    line-height: 16px;
    letter-spacing: -0.2px;
    color: #344054;
    cursor: pointer;
}

    .shift-page .filter-btn img[b-ogrfjm2odk] {
        width: 16px;
        height: 16px;
    }

    .shift-page .filter-btn:hover[b-ogrfjm2odk] {
        background: #EAEFF5;
    }

.filter-popup[b-ogrfjm2odk] {
    width: 360px;
    background: #FFFFFF;
    border-radius: 20px;
    overflow: hidden;
}

.filter-header[b-ogrfjm2odk] {
    padding: 8px 16px 8px 16px;
    border-bottom: 1px solid #EBECED;
}

    .filter-header h6[b-ogrfjm2odk] {
        margin: 0;
        font-size: 15px;
        font-weight: 700;
        line-height: 24px;
        color: var(--dark-txt);
        letter-spacing: -0.2px;
    }

.filter-body[b-ogrfjm2odk] {
    padding: 16px;
}

.filter-group[b-ogrfjm2odk] {
    margin-bottom: 16px;
}

    .filter-group label[b-ogrfjm2odk] {
        display: block;
        font-size: 12px;
        font-weight: 600;
        line-height: 16px;
        letter-spacing: -0.2px;
        color: var(--gray-txt);
        margin-bottom: 4px;
    }

.status-buttons[b-ogrfjm2odk] {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}

.status-chip[b-ogrfjm2odk] {
    border: none;
    background: #F2F4F7;
    border-radius: 1000px;
    padding: 6px 14px;
    font-size: 12px;
    font-weight: 600;
    color: #344054;
    transition: all 0.15s;
}

    .status-chip.active[b-ogrfjm2odk] {
        background: #5263FF1F;
        color: var(--purple-2);
    }

    .status-chip:hover:not(.active)[b-ogrfjm2odk] {
        background: #aab2ff1f;
        color: var(--purple-2);
    }

.filter-footer[b-ogrfjm2odk] {
    padding: 12px 16px;
    border-top: 1px solid #EBECED;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.reset-btn[b-ogrfjm2odk] {
    border: none;
    background: transparent;
    color: #475569;
    font-size: 13px;
    font-weight: 600;
}

.dispatch .main-content .data-left-right .main-table table tr td p[b-ogrfjm2odk] {
    font-size: 12px;
    font-weight: 600;
    line-height: 16px;
    letter-spacing: -0.2px;
    color: var(--dark-txt);
}

.cu-contractors-checkbox[b-ogrfjm2odk] {
    width: 20px !important;
    height: 20px !important;
    border-radius: 6px !important;
    padding: 2px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    transition: all 0.2s !important;
    background: linear-gradient(180deg, #f1f5f9 0%, #ffffff 100%) !important;
    border: 2.5px solid #d9dee3 !important;
    backdrop-filter: blur(24px) !important;
    box-shadow:
        0px 1px 1px -0.5px #1e293b08,
        0px 3px 3px 0px #ffffff1f inset !important;
    flex-shrink: 0 !important;
}

    .cu-contractors-checkbox.checked[b-ogrfjm2odk],
    .cu-contractors-checkbox.mixed[b-ogrfjm2odk] {
        background: linear-gradient(180deg, #5263ff 0%, #5263ff 100%) !important;
        color: white !important;
        backdrop-filter: blur(24px) !important;
        box-shadow:
            0px 1px 1px -0.5px #1e293b08,
            0px 3px 3px 0px #ffffff1f inset !important;
        border: none !important;
    }

    .cu-contractors-checkbox.mixed[b-ogrfjm2odk] {
        background: #D1D8FA !important;
        color: #5263FF !important;
    }

.cu-contractors-checkbox-icon[b-ogrfjm2odk] {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
}

.cu-contractors-checkbox:disabled[b-ogrfjm2odk],
.cu-contractors-checkbox.disabled[b-ogrfjm2odk] {
    opacity: 0.6;
    cursor: not-allowed;
}

.selected-row[b-ogrfjm2odk] {
    padding: 8px 16px;
}

.selected-count[b-ogrfjm2odk] {
    font-size: 13px;
    font-weight: 500;
    color: #5F6E85;
    display: flex;
    align-items: center;
    gap: 6px;
}

.filter-chip[b-ogrfjm2odk] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    height: 32px;
    padding: 8px 12px;
    border-radius: 8px;
    background: rgba(82, 99, 255, 0.12);
}

.filter-chip-text[b-ogrfjm2odk] {
    color: #363AF5;
    font-size: 14px;
    font-weight: 600;
    line-height: 16px;
}

.filter-chip-close[b-ogrfjm2odk] {
    width: 10px;
    height: 10px;
    cursor: pointer;
    object-fit: contain;
}

.shift-note[b-ogrfjm2odk] {
    /* width: 20%; */
    min-width: 180px;
    max-width: 180px;
}

    .shift-note p[b-ogrfjm2odk] {
        margin: 0;
        white-space: normal;
        word-break: break-word;
        overflow-wrap: anywhere;
        line-height: 20px;
    }

.lgs-btn-icon[b-ogrfjm2odk] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border: none;
    border-radius: 6px;
    background: transparent;
    cursor: pointer;
    transition: background 0.12s, transform 0.2s;
    flex-shrink: 0;
}

    .lgs-btn-icon:hover[b-ogrfjm2odk] {
        background: #f1f5f9;
    }

.shift-menu-item.danger[b-ogrfjm2odk] {
    color: #ef4444;
}

    .shift-menu-item.danger:hover[b-ogrfjm2odk] {
        background: #fff5f5 ;
    }

.shift-menu-item.success[b-ogrfjm2odk] {
    color: #2E8B39;
}

    .shift-menu-item.success:hover[b-ogrfjm2odk] {
        background: #409B3F1F;
    }

.shift-action-menu[b-ogrfjm2odk] {
    min-width: 135px;
    padding: 6px;
    border-radius: 24px;
    background: #fff;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.shift-menu-item[b-ogrfjm2odk] {
    width: 100%;
    height: 40px;
    padding: 4px 16px;
    border: none;
    background: transparent;
    display: flex;
    align-items: center;
    gap: 12px;
    border-radius: 12px;
    color: #475569;
    font-size: 14px;
    font-weight: 600;
    line-height: 24px;
    border-radius: 16px;
}

    .shift-menu-item.active[b-ogrfjm2odk] {
        background: #EEF0FF;
        color: #475569;
    }

    .shift-menu-item.success[b-ogrfjm2odk] {
        color: #2E8B39;
    }

    .shift-menu-item.danger[b-ogrfjm2odk] {
        color: #E42B1D;
    }

    .shift-menu-item:hover[b-ogrfjm2odk] {
        background: #EEF0FF;
    }
/* /Pages/TermsAndConditions.razor.rz.scp.css */
.terms-page[b-2hlw47a46e] {
    padding: 96px 0 64px;
    background: #fff;
}

.terms-container[b-2hlw47a46e] {
    max-width: 768px;
    margin: 0 auto;
    padding: 0 24px;
}

.terms-title[b-2hlw47a46e] {
    font-size: 36px;
    font-weight: 700;
    color: var(--dark-txt);
    margin-bottom: 16px;
}

.terms-updated[b-2hlw47a46e] {
    font-size: 14px;
    color: #6B7280;
    margin-bottom: 12px;
}

.terms-intro[b-2hlw47a46e] {
    font-size: 16px;
    line-height: 1.7;
    color: #6B7280;
    margin-bottom: 32px;
}

.terms-section[b-2hlw47a46e] {
    margin-bottom: 32px;
}

.terms-heading[b-2hlw47a46e] {
    font-size: 24px;
    font-weight: 700;
    color: var(--dark-txt);
    margin-bottom: 16px;
}

.terms-text[b-2hlw47a46e] {
    font-size: 16px;
    line-height: 1.7;
    color: #6B7280;
    white-space: pre-line;
}
/* /Pages/Users/Components/BulkUserImportPopup.razor.rz.scp.css */
/* START bulk-user-import-popup */

.bulk-user-import-popup .modal-dialog[b-f97nx1f9ce] {
    min-width: 860px;
}

.bulk-user-import-popup .modal-content[b-f97nx1f9ce] {
    padding: 0 !important;
}

.bulk-user-import-popup .modal-header[b-f97nx1f9ce] {
    padding: 16px 20px;
    border-bottom: 1px #dee2e6 solid !important;
}

    .bulk-user-import-popup .modal-header h6[b-f97nx1f9ce] {
        font-size: 18px;
        font-weight: 700;
        line-height: 24px;
        letter-spacing: -0.2px;
        color: var(--dark-txt);
    }

.bulk-user-import-popup .modal-body[b-f97nx1f9ce] {
    background-color: #F1F5F9;
}

    .bulk-user-import-popup .modal-body .two-box .box[b-f97nx1f9ce] {
        padding: 24px;
        background-color: var(--white);
        border: #1E293B0F solid;
        border-radius: 24px;
        box-shadow: 0px 3px 3px -1.5px #1E293B08;
    }

        .bulk-user-import-popup .modal-body .two-box .box h6[b-f97nx1f9ce] {
            font-size: 18px;
            font-weight: 800;
            line-height: 24px;
            letter-spacing: -0.2px;
            color: var(--dark-txt);
        }

        .bulk-user-import-popup .modal-body .two-box .box button[b-f97nx1f9ce] {
            height: 40px;
            border: none;
            outline: none;
            border-radius: 10px;
            width: 100%;
        }

        .bulk-user-import-popup .modal-body .two-box .box p[b-f97nx1f9ce] {
            font-size: 15px;
            font-weight: 500;
            line-height: 24px;
            letter-spacing: -0.2px;
            color: var(--gray-txt);
        }

            .bulk-user-import-popup .modal-body .two-box .box p b[b-f97nx1f9ce] {
                font-weight: 800;
            }

    .bulk-user-import-popup .modal-body .upload-box[b-f97nx1f9ce] {
        height: 404px;
        background-color: var(--white);
        border: 2px var(--purple) dashed;
        border-radius: 24px;
        box-shadow: 0px 3px 3px -0.5px #1E293B08;
    }

    .bulk-user-import-popup .modal-body .validation-results .title h6[b-f97nx1f9ce] {
        font-size: 18px;
        font-weight: 800;
        line-height: 24px;
        letter-spacing: -0.2px;
        color: var(--dark-txt);
    }

    .bulk-user-import-popup .modal-body .validation-results .title .badgee[b-f97nx1f9ce] {
        background-color: #ED40301F;
        padding: 6px;
        border-radius: 8px;
        gap: 2px;
    }

    .bulk-user-import-popup .modal-body .validation-results .title .badgee-green[b-f97nx1f9ce] {
        background-color: #409B3F1F;
        color: var(--green);
        padding: 6px;
        border-radius: 8px;
        gap: 2px;
    }

        .bulk-user-import-popup .modal-body .validation-results .title .badgee img[b-f97nx1f9ce] {
            height: 16px;
        }

        .bulk-user-import-popup .modal-body .validation-results .title .badgee-green img[b-f97nx1f9ce] {
            height: 16px;
        }

        .bulk-user-import-popup .modal-body .validation-results .title .badgee p[b-f97nx1f9ce] {
            padding: 0 4px;
            font-size: 12px;
            font-weight: 600;
            line-height: 16px;
            letter-spacing: -0.2px;
            color: var(--orange);
        }

        .bulk-user-import-popup .modal-body .validation-results .title .badgee-green p[b-f97nx1f9ce] {
            padding: 0 4px;
            font-size: 12px;
            font-weight: 600;
            line-height: 16px;
            letter-spacing: -0.2px;
            color: var(--green);
        }

    .bulk-user-import-popup .modal-body .validation-results .error[b-f97nx1f9ce] {
        background-color: #ED40301F;
        border-left: 4px #ED403066 solid;
        padding: 16px;
        border-radius: 16px;
    }

        .bulk-user-import-popup .modal-body .validation-results .error p[b-f97nx1f9ce] {
            font-size: 15px;
            font-weight: 700;
            line-height: 24px;
            letter-spacing: -0.2px;
            color: #BA1E0F;
        }

            .bulk-user-import-popup .modal-body .validation-results .error p span[b-f97nx1f9ce] {
                font-weight: 500;
            }

.bulk-user-import-popup .modal-footer[b-f97nx1f9ce] {
    padding: 16px 20px;
}

    .bulk-user-import-popup .modal-footer button[b-f97nx1f9ce] {
        width: 214px;
    }

.slider[b-f97nx1f9ce]:before {
    content: "";
    position: absolute;
    height: 18px;
    width: 18px;
    left: 2px;
    top: 2px;
    border-radius: 1000px;
    background: linear-gradient(180deg, #e2e8f0 0%, #ffffff 100%);
    border: 3.5px solid #f9fbfc;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.15);
    transition: 0.3s;
}

/*Dropzone*/
.bulk-user-import-popup .upload-box[b-f97nx1f9ce] {
    height: 404px;
    background-color: var(--white);
    border: 2px var(--purple) dashed;
    border-radius: 24px;
    box-shadow: 0px 3px 3px -0.5px #1E293B08;
}

    .bulk-user-import-popup .upload-box img[b-f97nx1f9ce] {
        height: 32px;
    }

    .bulk-user-import-popup .upload-box h6[b-f97nx1f9ce] {
        font-size: 18px;
        font-weight: 800;
        line-height: 24px;
        letter-spacing: -0.2px;
        color: var(--dark-txt);
    }

    .bulk-user-import-popup .upload-box span[b-f97nx1f9ce] {
        font-size: 13px;
        font-weight: 500;
        line-height: 20px;
        letter-spacing: -0.2px;
        color: var(--gray-txt-2);
    }

    .bulk-user-import-popup .upload-box label[b-f97nx1f9ce] {
        display: flex;
        justify-content: center;
        align-items: center;
        text-align: center;
        gap: 2px;
        padding: 8px 10px;
        border: none;
        border-radius: 10px;
        outline: none;
        height: 40px;
        width: max-content;
        background: linear-gradient(var(--purple), var(--purple)) padding-box, linear-gradient(90deg, #1E293B17, #1E293B2E) border-box;
        backdrop-filter: blur(24px);
        box-shadow: 0px 1px 1px -0.5px #1E293B08, 0px 3px 3px 0px #FFFFFF1F inset;
        font-size: 13px;
        font-weight: 600;
        line-height: 24px;
        letter-spacing: -0.2px;
    }

        .bulk-user-import-popup .upload-box label img[b-f97nx1f9ce] {
            height: 18px;
        }

        .bulk-user-import-popup .upload-box label p[b-f97nx1f9ce] {
            font-size: 13px;
            font-weight: 600;
            line-height: 24px;
            letter-spacing: -0.2px;
            color: var(--white);
            padding: 0 4px;
        }

        .bulk-user-import-popup .upload-box label:hover[b-f97nx1f9ce] {
            opacity: 0.9;
        }

        .bulk-user-import-popup .upload-box label input[b-f97nx1f9ce] {
            position: absolute;
            left: 50%;
            top: 50%;
            transform: translate(-50%, -50%);
            height: 40px;
            width: 170px;
            opacity: 0;
        }

    .bulk-user-import-popup .upload-box.dragging[b-f97nx1f9ce] {
        border-color: var(--purple);
        background-color: #f5f3ff;
        transform: scale(1.01);
        transition: all 0.2s ease;
    }
/*Dropzone*/


@media (max-width:1240px) {
    .bulk-user-import-popup .modal-dialog[b-f97nx1f9ce] {
        min-width: 95%;
    }
}

/* END bulk-user-import-popup */

/* The file that was picked, and the choice about invitations, both sit on the same card
   surface the rest of the body uses. */
.bulk-user-import-popup .modal-body .selected-file[b-f97nx1f9ce],
.bulk-user-import-popup .modal-body .invite-choice[b-f97nx1f9ce] {
    padding: 16px 20px;
    background-color: var(--white);
    border: 1px #1E293B0F solid;
    border-radius: 16px;
    box-shadow: 0px 2px 1.5px -0.5px #1E293B08;
}

    .bulk-user-import-popup .modal-body .selected-file p[b-f97nx1f9ce],
    .bulk-user-import-popup .modal-body .invite-choice p[b-f97nx1f9ce] {
        font-size: 15px;
        font-weight: 600;
        line-height: 24px;
        letter-spacing: -0.2px;
        color: var(--dark-txt);
    }

    .bulk-user-import-popup .modal-body .invite-choice span[b-f97nx1f9ce] {
        font-size: 13px;
        font-weight: 500;
        line-height: 20px;
        letter-spacing: -0.2px;
        color: var(--gray-txt);
    }

.bulk-user-import-popup .modal-body .upload-box[b-f97nx1f9ce] {
    height: 280px;
}

.bulk-user-import-popup .upload-box[b-f97nx1f9ce] {
    height: 280px;
}

/* The three-way "who is invited now" choice, in place of the old on/off toggle. */
.bulk-user-import-popup .modal-body .invite-policy-option[b-f97nx1f9ce] {
    padding: 8px 14px;
    background: #F1F5F9CC;
    border: 1px solid #1E293B0F;
    border-radius: 10px;
    font-size: 13px;
    font-weight: 600;
    line-height: 20px;
    letter-spacing: -0.2px;
    color: var(--dark-txt);
}

.bulk-user-import-popup .modal-body .invite-policy-option.selected[b-f97nx1f9ce] {
    background: #5263ff;
    border-color: #5263ff;
    color: #ffffff;
}
/* /Pages/Users/Components/CreateUserPopup.razor.rz.scp.css */
/* ── Input focus override (matches design system: indigo ring) ───────────── */
.form-control:focus[b-1paae51nrj] {
  border-color: #5263ff;
  box-shadow: 0 0 0 3px rgba(82, 99, 255, 0.1);
}

.form-control.is-invalid:focus[b-1paae51nrj] {
  border-color: #ef4444;
  box-shadow: 0 0 0 3px rgba(239, 68, 68, 0.1);
}

.cu-body-wrap[b-1paae51nrj] {
  padding: 20px;
  background: #f1f5f9;
}

/* The profile pane keeps its grey field background when the account rail is beside it,
   so the rail reads as chrome and the form as the thing being edited. */
.acct-pane .cu-body-wrap[b-1paae51nrj] {
  min-height: 100%;
}

/* ── Share with contractors box ──────────────────────────────────────────── */
.cu-contractors-box[b-1paae51nrj] {
  border: none;
  border-radius: 16px;
  overflow: hidden;
  background: #ffffff;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05) !important;
}

.cu-contractors-header[b-1paae51nrj] {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 14px;
  font-size: 13px;
  font-weight: 500;
  color: #1e293b;
  border-bottom: 1px solid #1e293b0f;
}

.cu-contractors-count[b-1paae51nrj] {
  color: #5F6E85;
  font-weight: 500;
  font-size: 12px;
}

.cu-contractors-list[b-1paae51nrj] {
  max-height: 180px;
  overflow-y: auto;
  scrollbar-width: thin;
  scrollbar-color: #c3c8cf transparent;
}

.cu-contractors-item[b-1paae51nrj] {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 9px 14px;
  cursor: pointer;
  font-size: 13px;
  color: #1e293b;
  margin: 0;
  user-select: none;
}

.cu-contractors-item:hover[b-1paae51nrj] {
  background-color: #eef0ff;
}

.cu-contractors-checkbox[b-1paae51nrj] {
  width: 18px !important;
  height: 18px !important;
  border-radius: 6px !important;
  padding: 2px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  transition: all 0.2s !important;
  background: linear-gradient(180deg, #f1f5f9 0%, #ffffff 100%) !important;
  border: 2.5px solid #d9dee3 !important;
  backdrop-filter: blur(24px) !important;
  box-shadow:
    0px 1px 1px -0.5px #1e293b08,
    0px 3px 3px 0px #ffffff1f inset !important;
  flex-shrink: 0 !important;
}

.cu-contractors-checkbox.checked[b-1paae51nrj] {
  background: linear-gradient(180deg, #5263ff 0%, #5263ff 100%) !important;
  color: white !important;
  backdrop-filter: blur(24px) !important;
  box-shadow:
    0px 1px 1px -0.5px #1e293b08,
    0px 3px 3px 0px #ffffff1f inset !important;
  border: none !important;
}

.cu-contractors-checkbox-icon[b-1paae51nrj] {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  font-size: 15px !important;
  font-weight: initial !important;
  line-height: initial !important;
  letter-spacing: initial !important;
  color: white !important;
}

.phone-group[b-1paae51nrj] {
    width: 100% !important;
    height: fit-content !important;
    display: flex !important;
    align-items: stretch !important;
    border: 1px solid #1E293B1F !important;
    border-radius: 10px !important;
    background: #fff !important;
    background-color: var(--white) !important;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05) !important;
    overflow: hidden !important;
}

    .phone-group:focus[b-1paae51nrj],
    .phone-group:focus-within[b-1paae51nrj] {
        box-shadow: 0 0 0 0.2rem #dce0ff !important;
    }

    .phone-group input:focus[b-1paae51nrj],
    .phone-group input:focus-within[b-1paae51nrj] {
        box-shadow: none !important;
    }

    .phone-group:hover:not(.disabled)[b-1paae51nrj] {
        border-color: #eaecff !important;
    }

    .phone-group.disabled[b-1paae51nrj] {
        background: transparent !important;
        box-shadow: initial !important;
        cursor: not-allowed !important;
    }

.phone-group-divider[b-1paae51nrj] {
    width: 1px !important;
    height: 40px !important;
    background-color: #1E293B1F;
    flex-shrink: 0 !important;
}

.phone-input[b-1paae51nrj] {
    flex: 1 !important;
    height: 40px !important;
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
    background: transparent !important;
    padding: 0 12px !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    color: #212529 !important;
    min-width: 0 !important;
    border-radius: 0px !important;
}

    .phone-input[b-1paae51nrj]::placeholder {
        color: #5F6E85 !important;
    }

[b-1paae51nrj] .dropdown:has(> .user-phone-code) {
    width: fit-content !important;
    height: 40px !important;
    display: flex !important;
    align-items: stretch !important;
}

[b-1paae51nrj] .user-phone-code {
    box-shadow: none !important;
    border-radius: 0 !important;
    height: 40px !important;
    width: 100px !important;
    white-space: nowrap;
    border: none !important;
}

    [b-1paae51nrj] .user-phone-code:focus {
        box-shadow: none !important;
    }

/* SM-419: what the invitation will do with an address that already belongs to somebody.
   Informational, not a validation error — it explains the outcome rather than blocking it. */
.cu-email-outcome[b-1paae51nrj] {
    padding: 10px 12px;
    border: 1px solid #B6D4FE;
    border-radius: 6px;
    background: #EFF6FF;
    color: #084298;
    font-size: 13px;
    line-height: 1.4;
}
/* /Pages/Users/Components/UserDetailsSlider.razor.rz.scp.css */
.z-index-lower[b-jev0ktg3j3] {
  z-index: 1049 !important;
}

/* ── User details slider ─────────────────────────────────────────────────── */
.userDetailsSlider.right .modal-dialog[b-jev0ktg3j3] {
    position: fixed;
    margin: 0;
    right: 0;
    top: 0;
    height: 100%;
    max-width: 740px;
    width: 100%;
}

.userDetailsSlider.right .modal-content[b-jev0ktg3j3] {
    height: 100vh;
    border-radius: 0;
    display: flex;
    flex-direction: column;
    border: none;
}

.userDetailsSlider.right.fade .modal-dialog[b-jev0ktg3j3] {
    transform: translateX(100%);
    transition: transform 0.3s ease-out;
}

.userDetailsSlider.right.show .modal-dialog[b-jev0ktg3j3] {
    transform: translateX(0);
}
/* ── End user details slider ─────────────────────────────────────────────── */


/* ── Shell ───────────────────────────────────────────────────────────────── */
.uds-shell[b-jev0ktg3j3] {
    display: flex;
    flex-direction: column;
    height: 100vh;
    background: #F8FAFC;
}

/* ── Header ──────────────────────────────────────────────────────────────── */
.uds-header[b-jev0ktg3j3] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 16px 24px;
    background: #fff;
    border-bottom: 1px solid #EBECED;
    flex-shrink: 0;
    flex-wrap: wrap;
}

.uds-header-identity[b-jev0ktg3j3] {
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 0;
    flex: 1;
}

    .uds-header-identity > div[b-jev0ktg3j3] {
        min-width: 0;
    }

.uds-name[b-jev0ktg3j3] {
    font-size: 18px;
    font-weight: 800;
    color: #1E293B;
    margin: 0 0 2px;
    letter-spacing: -0.2px;
    line-height: 24px;
    word-break: break-word;
    overflow-wrap: break-word;
}

.uds-role[b-jev0ktg3j3] {
	font-size: 13px;
	font-weight: 600;
	color: #5F6E85;
	line-height: 20px;
	letter-spacing: -0.2px;
	margin: 0;
}

/* Header action buttons */
.uds-header-actions[b-jev0ktg3j3] {
    display: flex;
    align-items: center;
    gap: 1rem;
    flex-shrink: 0;
}

/* ── Body ────────────────────────────────────────────────────────────────── */
.uds-body[b-jev0ktg3j3] {
    flex: 1;
    overflow-y: auto;
    padding: 16px 24px;
    background: #fff;
}

/* ── Details grid ────────────────────────────────────────────────────────── */
.uds-grid[b-jev0ktg3j3] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}

.uds-detail-item[b-jev0ktg3j3] {
    background: #F1F5F9;
    border: none;
    border-radius: 16px;
    padding: 16px;
    display: flex;
    flex-direction: column;
    gap: 6px;
    max-width: 338px;
}

.uds-detail-label[b-jev0ktg3j3] {
	font-size: 13px;
	font-weight: 700;
	color: #1E293B;
	line-height: 20px;
	letter-spacing: -0.2px;
}

.uds-detail-value[b-jev0ktg3j3] {
    font-size: 13px;
    font-weight: 500;
    color: #475569;
    margin: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    line-height: 20px;
    letter-spacing: -0.2px;
}

/* ── Status badge inside grid ────────────────────────────────────────────── */
.uds-status-badge[b-jev0ktg3j3] {
    display: inline-block;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 600;
    white-space: nowrap;
    width: max-content;
}
/* /Pages/Users/Users.razor.rz.scp.css */
/* Import and Export sit next to "New user" in the title bar, and have to beat
   `.main-content .main-title button` in style.css, which paints every button there
   as the primary purple action. Same treatment the locations toolbar gives them. */
.users-secondary-button[b-03idncdxnz] {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    text-align: center !important;
    gap: 2px !important;
    padding: 8px 10px !important;
    border: 1px solid #1E293B0F !important;
    border-radius: 10px !important;
    outline: none !important;
    height: 40px !important;
    width: max-content !important;
    background: #F1F5F9CC !important;
    box-shadow: 0px 1px 1px -0.5px #1E293B08 !important;
    color: var(--dark-txt) !important;
}

    .users-secondary-button img[b-03idncdxnz] {
        height: 18px !important;
    }

    .users-secondary-button p[b-03idncdxnz] {
        font-size: 13px !important;
        font-weight: 600 !important;
        line-height: 24px !important;
        letter-spacing: -0.2px !important;
        color: var(--dark-txt) !important;
        padding: 0 4px !important;
        margin: 0 !important;
    }

    .users-secondary-button:hover[b-03idncdxnz] {
        opacity: 0.8 !important;
    }

/* ── Filter dropdowns ────────────────────────────────────────────────────── */
.users-filter-group[b-03idncdxnz] {
    flex-shrink: 0;
}

.users-filter-dropdown[b-03idncdxnz] {
    width: 140px;
}

/* ── Table layout ────────────────────────────────────────────────────────── */
.users-table[b-03idncdxnz] {
    table-layout: fixed;
    width: 100%;
}

.users-table thead th[b-03idncdxnz] {
    text-transform: uppercase;
}

/* ── Avatar circle ───────────────────────────────────────────────────────── */
.users-avatar[b-03idncdxnz] {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    overflow: hidden;
    background-clip: padding-box; 
    box-sizing: border-box;
}

.user-avtar-blue[b-03idncdxnz] {
    background-image: linear-gradient(180deg, #5263FF 0%, rgba(82, 99, 255, 0.2) 100%);
    border: 1px solid rgba(82, 99, 255, 0.3);
}

.user-avtar-orange[b-03idncdxnz] {
    background-image: linear-gradient(180deg, #F74E03 0%, rgba(247, 78, 3, 0.2) 100%);
    border: 1px solid rgba(247, 78, 3, 0.3);
}

.user-avtar-pink[b-03idncdxnz] {
    background-image: linear-gradient(180deg, #F83CE9 0%, rgba(248, 60, 233, 0.2) 100%);
    border: 1px solid rgba(248, 60, 233, 0.3);
}

.user-avtar-green[b-03idncdxnz] {
    background-image: linear-gradient(180deg, #337C33 0%, rgba(64, 155, 63, 0.2) 100%);
    border: 1px solid rgba(64, 155, 63, 0.3);
}

.users-avatar-initials[b-03idncdxnz] {
    color: #FFFFFF;
    font-size: 12px;
    font-weight: 600;
    line-height: 16px;
    letter-spacing: -0.2px;
}

.users-avatar-fallback[b-03idncdxnz] {
    width: 20px;
    height: 20px;
    object-fit: contain;
}

/* ── Name & role ─────────────────────────────────────────────────────────── */
.users-name[b-03idncdxnz] {
    font-size: 14px;
    font-weight: 600;
    color: #1E293B;
    line-height: 20px;
    word-break: break-word;
    overflow-wrap: break-word;
}

.users-role[b-03idncdxnz] {
    font-size: 12px;
    font-weight: 600;
    color: #475569;
    line-height: 18px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* ── Muted cells ─────────────────────────────────────────────────────────── */
.users-cell-muted[b-03idncdxnz] {
    font-size: 13px;
    font-weight: 500;
    color: var(--dark-txt);
    word-break: break-word;
    overflow-wrap: break-word;
}

/* ── Status badge ────────────────────────────────────────────────────────── */
.users-status-badge[b-03idncdxnz],
.users-status-badge-clickable[b-03idncdxnz] {
    display: inline-block;
    height: 26px;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 600;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
    vertical-align: middle;
}

.users-status-badge-clickable[b-03idncdxnz] {
    cursor: pointer;
}

.users-status-badge-clickable:hover[b-03idncdxnz] {
    opacity: 0.8;
}

.users-status-badge-clickable.disabled[b-03idncdxnz] {
    cursor: not-allowed;
    pointer-events: none;
}

/* ── Origin badge ────────────────────────────────────────────────────────── */
.users-origin-badge[b-03idncdxnz],
.users-origin-badge-alter[b-03idncdxnz],
.users-origin-badge-external[b-03idncdxnz] {
    display: inline-block;
    height: 26px;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 600;
    background-color: #EEF0FF;
    color: #4F46E5;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
    vertical-align: middle;
}

.users-origin-badge-alter[b-03idncdxnz] {
    background-color: #F1F5F9CC;
    border: 1px solid #1E293B08;
    color: #1E293B;
}

/* SM-420: somebody working here on a granted membership. Reads as a state of the person, not as
   a business name, because the business behind them is deliberately not shown. */
.users-origin-badge-external[b-03idncdxnz] {
    background-color: #FFF7E6;
    border: 1px solid #F0C36D66;
    color: #8A5A00;
    cursor: default;
}

/* ── Action cell ─────────────────────────────────────────────────────────── */
.users-action-cell[b-03idncdxnz] {
    text-align: center;
}

.users-view-btn[b-03idncdxnz] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    padding: 0;
}

/* ── Multi-select ────────────────────────────────────────────────────────────
   The tick box and the selection bar are the invoice list's, in this page's
   colours: the same 16px square, the same header state for "some of this page",
   and the same bar that only exists while something is picked. */
.users-check[b-03idncdxnz] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 16px;
    height: 16px;
    padding: 0;
    background: #ffffff;
    border: 1px solid #cbd5e1;
    border-radius: 5px;
    cursor: pointer;
}

    .users-check.checked[b-03idncdxnz],
    .users-check.indeterminate[b-03idncdxnz] {
        background: #5263ff;
        border-color: #5263ff;
    }

    .users-check.checked[b-03idncdxnz]::after {
        content: "";
        width: 5px;
        height: 9px;
        margin-top: -2px;
        border: solid #ffffff;
        border-width: 0 2px 2px 0;
        transform: rotate(45deg);
    }

    .users-check.indeterminate[b-03idncdxnz]::after {
        content: "";
        width: 9px;
        height: 2px;
        background: #ffffff;
        border-radius: 1px;
    }

.users-table tr.selected[b-03idncdxnz] {
    background: #F5F6FF;
}

.users-selected-bar[b-03idncdxnz] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    min-height: 72px;
    padding: 12px 16px;
    border-top: 1px solid rgba(30, 41, 59, .09);
}

.users-selected-count[b-03idncdxnz],
.users-selected-actions[b-03idncdxnz] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.users-selected-count[b-03idncdxnz] {
    color: #5F6E85;
    font-size: 15px;
    font-weight: 700;
}

    .users-selected-count button[b-03idncdxnz] {
        padding: 0;
        background: transparent;
        border: 0;
    }

.users-bulk-invite[b-03idncdxnz] {
    gap: 6px;
    height: 40px;
    padding: 8px 14px;
    border: 0;
    border-radius: 10px;
    background: #5263ff;
    color: #ffffff;
}

    .users-bulk-invite img[b-03idncdxnz] {
        height: 18px;
    }

    .users-bulk-invite p[b-03idncdxnz] {
        margin: 0;
        font-size: 13px;
        font-weight: 600;
        line-height: 24px;
        letter-spacing: -0.2px;
        color: #ffffff;
    }

    .users-bulk-invite.disabled[b-03idncdxnz] {
        opacity: .5;
        cursor: not-allowed;
    }

@media (max-width: 900px) {
    .users-selected-bar[b-03idncdxnz] {
        align-items: stretch;
        flex-direction: column;
    }

    .users-selected-actions[b-03idncdxnz] {
        justify-content: flex-start;
    }
}

/* The row's remove action. Quiet until hovered: it sits on every row, and a column of red
   icons would read as a warning about the users rather than as an action on them. */
.users-row-action[b-03idncdxnz] {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 28px;
	height: 28px;
	padding: 0;
	border: none;
	border-radius: 6px;
	background: transparent;
	opacity: 0.45;
	transition: opacity 0.15s, background-color 0.15s;
}

	.users-row-action:hover[b-03idncdxnz] {
		opacity: 1;
		background-color: #FEE2E2;
	}

	.users-row-action img[b-03idncdxnz] {
		width: 16px;
		height: 16px;
	}
/* /Pages/ZoneMap/Components/ZoneListCard.razor.rz.scp.css */
.zm-zone-card[b-r3erxi9vhx] {
	border: 1px solid #1E293B17;
	box-shadow: 0px 1px 1px -0.5px #1E293B08;
	border-radius: 24px;
	padding: 16px;
	background: #FFFFFF;
	cursor: pointer;
	transition: box-shadow 0.15s;
}

	.zm-zone-card:hover[b-r3erxi9vhx] {
		box-shadow: 0px 3px 6px -1px #1E293B12;
	}

.zm-zone-card--expanded[b-r3erxi9vhx] {
	border-color: #1E293B1F;
}

/* ── Zone header row ── */
.zm-zone-row[b-r3erxi9vhx] {
	display: flex;
	align-items: center;
	gap: 10px;
}

.zm-zone-dot[b-r3erxi9vhx] {
	width: 14px;
	height: 14px;
	border-radius: 50%;
	flex-shrink: 0;
}

.zm-zone-name[b-r3erxi9vhx] {
	flex: 1;
	font-size: 15px;
	font-weight: 700;
	color: #1E293B;
	line-height: 24px;
	letter-spacing: -0.2px;
}

/* ── Action buttons ── */
.zm-zone-actions[b-r3erxi9vhx] {
	display: flex;
	align-items: center;
	gap: 4px;
	flex-shrink: 0;
}

.zm-icon-btn[b-r3erxi9vhx] {
	background: none;
	border: none;
	cursor: pointer;
	border-radius: 8px;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #5F6E85;
	line-height: 1;
	width: 24px;
	height: 24px;
}

	.zm-icon-btn:hover[b-r3erxi9vhx] {
		background: #F1F5F9;
	}

.zm-loc-badge[b-r3erxi9vhx] {
	background: #5263FF1F;
	color: #363AF5;
	font-size: 12px;
	font-weight: 600;
	border-radius: 8px;
	width: 24px;
	height: 24px;
	text-align: center;
	line-height: 16px;
	letter-spacing: -0.2px;
	align-items: center;
	justify-content: center;
	display: flex;
}

.zm-btn-chevron[b-r3erxi9vhx] {
	background: none;
	border: none;
	cursor: pointer;
	border-radius: 8px;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: transform 0.2s ease;
	width: 24px;
	height: 24px;
}

	.zm-btn-chevron:hover[b-r3erxi9vhx] {
		background: #F1F5F9;
	}

.zm-btn-chevron--up svg[b-r3erxi9vhx] {
	transform: rotate(180deg);
}

/* ── Expanded location sub-list ── */
.zm-loc-sublist[b-r3erxi9vhx] {
	margin-top: 12px;
}

.zm-loc-empty[b-r3erxi9vhx] {
	padding: 10px 12px;
	font-size: 12px;
	color: #94A3B8;
	border-top: 1px solid #F1F5F9;
	margin-top: 12px;
}

.zm-loc-item[b-r3erxi9vhx] {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	padding: 10px 8px;
	cursor: pointer;
	transition: background 0.1s;
	border-radius: 16px;
}

	.zm-loc-item:last-child[b-r3erxi9vhx] {
		border-bottom: none;
	}

	.zm-loc-item:hover[b-r3erxi9vhx] {
		background: #5263FF1F;
	}

.zm-loc-item--active[b-r3erxi9vhx] {
	background: #EFF6FF;
}

.zm-loc-icon[b-r3erxi9vhx] {
	flex-shrink: 0;
	margin-top: 1px;
}

.zm-loc-text[b-r3erxi9vhx] {
	display: flex;
	flex-direction: column;
	gap: 2px;
	min-width: 0;
	font-size: 13px;
	font-weight: 700;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	line-height: 20px;
	letter-spacing: -0.2px;
}

.zm-loc-addr[b-r3erxi9vhx] {
	font-size: 13px;
}

.zm-loc-sub[b-r3erxi9vhx] {
	color: #475569;
	display: flex;
	align-items: center;
	gap: 6px;
}

/* The subcontractor's own colour, so the list row and its pin on the map match. */
.zm-loc-sub-dot[b-r3erxi9vhx] {
	width: 8px;
	height: 8px;
	border-radius: 50%;
	flex-shrink: 0;
	box-shadow: 0 0 0 1px rgba(15, 23, 42, 0.12);
}

/* ── Dots dropdown menu ── */
.zm-dropdown-menu[b-r3erxi9vhx] {
	min-width: 96px;
	padding: 8px;
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.zm-menu-item[b-r3erxi9vhx] {
	display: flex;
	align-items: center;
	gap: 5px;
	padding: 4px 10px;
	font-size: 13px;
	font-weight: 500;
	border: none;
	border-radius: 16px;
	background: transparent;
	cursor: pointer;
	text-align: left;
	transition: background 0.12s;
	white-space: nowrap;
	height:40px;
}

.zm-menu-item--gray[b-r3erxi9vhx] {
	color: #475569;
}

	.zm-menu-item--gray:hover[b-r3erxi9vhx] {
		background-color: #5263FF1F;
	}

.zm-menu-item--red[b-r3erxi9vhx] {
	color: #B82213;
}

	.zm-menu-item--red:hover[b-r3erxi9vhx] {
		background: #fff5f5;
	}

/* ── Route rows (road routes whose line touches the zone) ── */
.zm-route-line[b-r3erxi9vhx] {
	display: block;
	width: 18px;
	height: 4px;
	border-radius: 2px;
	margin-top: 8px;
}
/* /Pages/ZoneMap/ZoneMap.razor.rz.scp.css */
.zm-main-content[b-mwh15683e2] {
	height: 100vh;
	display: flex;
	flex-direction: column;
}

/* Fullscreen (via the map's fullscreen button). The fullscreen target stays
   .zm-main-content so the create/edit and delete popups — which render inside
   it but outside .zm-layout — keep working; these rules restyle it so only the
   map shows edge-to-edge, with the zone panel floating on top. */
.zm-main-content:fullscreen[b-mwh15683e2] {
	background: #F8FAFC;
}

	.zm-main-content:fullscreen .main-titlee[b-mwh15683e2] {
		display: none;
	}

	/* Stand in for Bootstrap's backdrop, which lives on <body> and therefore
	   doesn't render while an inner element is fullscreen. */
	.zm-main-content:fullscreen[b-mwh15683e2]  .modal.show {
		background: rgba(30, 41, 59, 0.4);
	}

/* ── Map-filled layout, live-dispatch style: the map IS the page and the zone
   list floats over it as a translucent panel (mirrors .dl-layout/.dl-left-panel
   on the Dispatch Live Map). ── */
.zm-layout[b-mwh15683e2] {
	/* The zone panel's width, named because the map area spans the whole layout — it runs
	   underneath the panel, not beside it — so anything anchored to the map's visible
	   top-left has to step past the panel by hand. */
	--zm-panel-width: 374px;
	position: relative;
	flex: 1;
	min-height: 0;
	overflow: hidden;
}

/* ── Left panel: floats over the map ── */
.zm-left-panel[b-mwh15683e2] {
	position: absolute;
	top: 16px;
	left: 16px;
	bottom: 16px;
	/* Above the map canvas and its built-in controls, below WMMap's popups. */
	z-index: 5;
	width: var(--zm-panel-width);
	max-width: calc(100% - 32px);
	display: flex;
	flex-direction: column;
	overflow: hidden;
	background-color: #FFFFFFB8;
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
	border: 1px solid #1E293B17;
	border-radius: 16px;
	box-shadow: 0 8px 24px -8px #1E293B33;
}

.zm-panel-top[b-mwh15683e2] {
	padding: 16px;
	flex-shrink: 0;
	gap: 10px;
	border-bottom: 1px solid #1E293B17;
}

/* The address search sits in the panel's flow under the New zone button, not floating over the
   map, so it undoes the overlay's absolute corner placement. */
.zm-panel-top[b-mwh15683e2]  .zm-address-search {
	position: relative;
	top: auto;
	left: auto;
	width: 100%;
	max-width: 100%;
	margin-top: 10px;
}

.zm-state-center[b-mwh15683e2] {
	flex: 1;
	min-height: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #5263FF;
}

.zm-map-loading[b-mwh15683e2] {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	background: #F8FAFC;
	border-radius: 16px;
	color: #5263FF;
}

/* ── Zone list ── */
.zm-zone-list[b-mwh15683e2] {
	flex: 1;
	overflow-y: auto;
	padding: 12px;
	display: flex;
	flex-direction: column;
	gap: 12px;
	scrollbar-width: none;
}

.zm-zone-card[b-mwh15683e2] {
	overflow: hidden;
	background: #FFFFFF;
	border: 1px solid #1E293B17;
	box-shadow: 0px 3px 3px -1.5px #1E293B08;
	border-radius: 16px;
	padding: 16px;
}

.zm-zone-row[b-mwh15683e2] {
	display: flex;
	align-items: center;
	gap: 10px;
}

.zm-zone-dot[b-mwh15683e2] {
	width: 10px;
	height: 10px;
	border-radius: 50%;
	flex-shrink: 0;
}

.zm-zone-name[b-mwh15683e2] {
	flex: 1;
	font-size: 14px;
	font-weight: 500;
	color: #1E293B;
	line-height: 1.4;
}

.zm-zone-actions[b-mwh15683e2] {
	display: flex;
	align-items: center;
	gap: 4px;
	flex-shrink: 0;
}

.zm-icon-btn[b-mwh15683e2] {
	background: none;
	border: none;
	cursor: pointer;
	padding: 4px;
	border-radius: 4px;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #5F6E85;
	line-height: 1;
	height:24px;
	width:24px;
}

	.zm-icon-btn:hover[b-mwh15683e2] {
		background: #F1F5F9;
	}

.zm-loc-badge[b-mwh15683e2] {
	background: #F1F5F9;
	color: #475569;
	font-size: 12px;
	font-weight: 600;
	border-radius: 99px;
	padding: 2px 8px;
	min-width: 24px;
	text-align: center;
	line-height: 1.6;
	gap: 2px;
	padding: 4px 6px;
}

/* ── Location sub-list ── */
.zm-loc-sublist[b-mwh15683e2] {
	border-top: 1px solid #F1F5F9;
}

.zm-loc-empty[b-mwh15683e2] {
	padding: 10px 12px;
	font-size: 12px;
	color: #94A3B8;
	border-top: 1px solid #F1F5F9;
}

.zm-loc-item[b-mwh15683e2] {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	padding: 10px 12px;
	cursor: pointer;
	transition: background 0.1s;
	border-bottom: 1px solid #F8FAFC;
}

	.zm-loc-item:last-child[b-mwh15683e2] {
		border-bottom: none;
	}

	.zm-loc-item:hover[b-mwh15683e2] {
		background: #F8FAFC;
	}

.zm-loc-item--active[b-mwh15683e2] {
	background: #EFF6FF;
}

.zm-loc-icon[b-mwh15683e2] {
	flex-shrink: 0;
	margin-top: 1px;
}

.zm-loc-text[b-mwh15683e2] {
	display: flex;
	flex-direction: column;
	gap: 2px;
	min-width: 0;
}

.zm-loc-addr[b-mwh15683e2] {
	font-size: 13px;
	color: #1E293B;
	font-weight: 500;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.zm-loc-sub[b-mwh15683e2] {
	font-size: 12px;
	color: #5F6E85;
}

/* ── Map: fills the layout, panel floats above it ── */
.zm-map-area[b-mwh15683e2] {
	position: absolute;
	inset: 0;
	overflow: hidden;
}

	/* Cascade 100% height into WMMap's wrapper chain */
	.zm-map-area[b-mwh15683e2]  .wm-map-wrapper,
	.zm-map-area[b-mwh15683e2]  .wm-map-wrapper > div {
		height: 100%;
	}

	.zm-map-area[b-mwh15683e2]  .wm-map-container {
		border-radius: 0;
	}

/* ── Location detail card ── */
.zm-detail-card[b-mwh15683e2] {
	position: absolute;
	top: 16px;
	right: 16px;
	width: 280px;
	background: #fff;
	border-radius: 12px;
	box-shadow: 0 4px 24px rgba(30, 41, 59, 0.14);
	z-index: 10;
	overflow: hidden;
}

.zm-detail-header[b-mwh15683e2] {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 12px 16px;
	font-weight: 600;
	font-size: 14px;
	color: #1E293B;
	border-bottom: 1px solid #EBECED;
}

.zm-detail-close[b-mwh15683e2] {
	background: none;
	border: none;
	cursor: pointer;
	padding: 4px;
	border-radius: 4px;
	display: flex;
	align-items: center;
}

	.zm-detail-close:hover[b-mwh15683e2] {
		background: #F1F5F9;
	}

.zm-detail-body[b-mwh15683e2] {
	padding: 12px 16px;
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.zm-detail-section[b-mwh15683e2] {
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.zm-detail-label[b-mwh15683e2] {
	font-size: 12px;
	color: #5F6E85;
}

.zm-detail-name[b-mwh15683e2] {
	font-size: 14px;
	font-weight: 600;
	color: #1E293B;
}

.zm-detail-addr[b-mwh15683e2] {
	font-size: 13px;
	color: #475569;
}

.zm-detail-value[b-mwh15683e2] {
	font-size: 13px;
	font-weight: 500;
	color: #1E293B;
}

.zm-detail-zones[b-mwh15683e2] {
	display: flex;
	flex-direction: column;
	gap: 4px;
	margin-top: 2px;
}

.zm-detail-zone-row[b-mwh15683e2] {
	display: flex;
	align-items: center;
	gap: 6px;
}

.zm-detail-zone-dot[b-mwh15683e2] {
	width: 8px;
	height: 8px;
	border-radius: 50%;
	flex-shrink: 0;
}

/* ── Inline create-zone overlays (on the main map) ── */
.zm-create-overlay[b-mwh15683e2] {
	position: absolute;
	z-index: 10;
}

.zm-create-form-overlay[b-mwh15683e2] {
	bottom: 10px;
	right: 10px;
	/* Never wider than the map area — on narrow screens the panel must shrink,
	   not slide under the zone list panel to the left. */
	max-width: calc(100% - 20px);
}

	.zm-create-form-overlay[b-mwh15683e2]  .wm-colour-picker {
		flex-shrink: 0;
	}

	/* Compact swatch-only color button: just the color with padding, no chevron. */
	.zm-create-form-overlay[b-mwh15683e2]  .wm-cp-btn {
		width: 40px !important;
		padding: 0 !important;
		justify-content: center !important;
		flex-shrink: 0;
	}

	.zm-create-form-overlay[b-mwh15683e2]  .wm-cp-btn .bi {
		display: none;
	}

	.zm-create-form-overlay[b-mwh15683e2]  .wm-cp-swatch-preview {
		width: 24px !important;
		height: 24px !important;
		border-radius: 6px !important;
	}

.zm-create-form-panel[b-mwh15683e2] {
	background-color: #FFFFFFB8;
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
	border: 1px solid #1E293B17;
	border-radius: 16px;
	box-shadow: 0 8px 24px -8px #1E293B33;
	padding: 14px 16px;
	display: flex;
	align-items: flex-end;
	gap: 12px;
}

.zm-create-form-field[b-mwh15683e2] {
	flex: 1;
	display: flex;
	flex-direction: column;
	gap: 4px;
	min-width: 0;
}

.zm-create-form-label[b-mwh15683e2] {
	font-size: 13px;
	color: #475569;
	font-weight: 600;
	letter-spacing: -0.2px;
	line-height: 20px;
}

.zm-create-name-input[b-mwh15683e2] {
	border: 1px solid #E2E8F0;
	border-radius: 6px;
	padding: 7px 10px;
	font-size: 14px;
	color: #1E293B;
	outline: none;
	transition: border-color 0.15s;
	width: 100%;
	min-width: 120px;
	height: 40px;
}

	.zm-create-name-input:focus[b-mwh15683e2] {
		box-shadow: 0 0 0 0.2rem #dce0ff;
	}

.zm-create-name-input--invalid[b-mwh15683e2] {
	border-color: #ED3030;
}

.zm-create-action-btn[b-mwh15683e2] {
	height: 40px;
	margin: 0;
	white-space: nowrap;
	flex-shrink: 0;
}

.zm-dropdown-menu[b-mwh15683e2] {
	min-width: 96px;
	padding: 8px;
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.zm-menu-item[b-mwh15683e2] {
	display: flex;
	align-items: center;
	gap: 5px;
	padding: 10px;
	font-size: 13px;
	font-weight: 500;
	border: none;
	border-radius: 16px;
	background: transparent;
	cursor: pointer;
	text-align: left;
	transition: background 0.12s;
	white-space: nowrap;
	height: 40px;
	width: 89px;
}

.zm-menu-item--gray[b-mwh15683e2] {
	color: #475569;
}

	.zm-menu-item--gray:hover[b-mwh15683e2] {
		background-color: #5263FF1F;
	}

.zm-menu-item--red[b-mwh15683e2] {
	color: #ef4444;
}

	.zm-menu-item--red:hover[b-mwh15683e2] {
		background: #fff5f5;
	}

/* ── Map legend: one row per company with a pin on the map ──
   Bottom-right, because the zone list runs the full height of the left edge and
   the map's own controls sit top-right; the offset from the bottom clears
   Mapbox's attribution strip. */
.zm-legend[b-mwh15683e2] {
	position: absolute;
	right: 16px;
	bottom: 34px;
	z-index: 5;
	max-width: 220px;
	display: flex;
	flex-direction: column;
	/* Long subcontractor lists scroll rather than growing over the map. */
	max-height: 40%;
	padding: 8px 12px 10px;
	background: rgba(255, 255, 255, 0.95);
	border: 1px solid #E2E8F0;
	border-radius: 12px;
	box-shadow: 0 2px 8px rgba(15, 23, 42, 0.08);
}

/* The header stays put while the company rows scroll under it, and is the whole
   hit area for folding the key away. */
.zm-legend-header[b-mwh15683e2] {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	width: 100%;
	flex-shrink: 0;
	padding: 2px 0 4px;
	background: none;
	border: 0;
	cursor: pointer;
}

.zm-legend-chevron[b-mwh15683e2] {
	flex-shrink: 0;
	transition: transform .15s;
}

	.zm-legend-chevron--collapsed[b-mwh15683e2] {
		transform: rotate(-90deg);
	}

.zm-legend-body[b-mwh15683e2] {
	overflow-y: auto;
	min-height: 0;
	padding-top: 2px;
}

.zm-legend-title[b-mwh15683e2] {
	font-size: 11px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color: #64748B;
	text-align: left;
}

.zm-legend-heading[b-mwh15683e2] {
	display: flex;
	align-items: center;
	gap: 6px;
	min-width: 0;
}

/* How many companies are left on the map. Only shown while some are switched off, so the
   legend cannot hide a filter behind its own folded header. */
.zm-legend-count[b-mwh15683e2] {
	font-size: 10px;
	font-weight: 700;
	color: #5263FF;
	background: #EEF0FF;
	border-radius: 8px;
	padding: 1px 6px;
	flex-shrink: 0;
}

.zm-legend-row[b-mwh15683e2] {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 2px 0;
}

	/* Switched off: the row stays where it is, in its colour, greyed. It is how the company
	   comes back, so it must not disappear along with its pins. */
	.zm-legend-row--off .zm-legend-dot[b-mwh15683e2],
	.zm-legend-row--off .zm-legend-name[b-mwh15683e2] {
		opacity: 0.4;
	}

.zm-legend-check[b-mwh15683e2] {
	width: 13px;
	height: 13px;
	margin: 0;
	flex-shrink: 0;
	accent-color: #5263FF;
	cursor: pointer;
}

.zm-legend-show-all[b-mwh15683e2] {
	margin-top: 4px;
	padding: 0;
	background: none;
	border: 0;
	font-size: 11px;
	font-weight: 600;
	color: #5263FF;
	cursor: pointer;
}

	.zm-legend-show-all:hover[b-mwh15683e2] {
		text-decoration: underline;
	}

.zm-legend-dot[b-mwh15683e2] {
	width: 10px;
	height: 10px;
	border-radius: 50%;
	flex-shrink: 0;
	box-shadow: 0 0 0 1px rgba(15, 23, 42, 0.12);
}

.zm-legend-name[b-mwh15683e2] {
	font-size: 12px;
	color: #1E293B;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	min-width: 0;
	padding: 0;
	background: none;
	border: 0;
	text-align: left;
	cursor: pointer;
}

	.zm-legend-name:hover[b-mwh15683e2] {
		color: #5263FF;
	}

/* ── The "show the picked address's drawing" option ──
   Top-left of the map: the only free corner. Same card as the key in the opposite
   corner, so the two overlays read as one family. */
.zm-drawings-toggle[b-mwh15683e2] {
	position: absolute;
	top: 16px;
	/* Clear of the zone panel: the map area is the whole layout, so left:16px would put this
	   on top of the panel's own header rather than on the map. */
	left: calc(var(--zm-panel-width) + 32px);
	z-index: 5;
	display: flex;
	align-items: center;
	gap: 8px;
	margin: 0;
	padding: 7px 12px;
	background: rgba(255, 255, 255, 0.95);
	border: 1px solid #E2E8F0;
	border-radius: 12px;
	box-shadow: 0 2px 8px rgba(15, 23, 42, 0.08);
	cursor: pointer;
	user-select: none;
}

.zm-drawings-check[b-mwh15683e2] {
	width: 14px;
	height: 14px;
	flex-shrink: 0;
	accent-color: #5263FF;
	cursor: pointer;
}

.zm-drawings-label[b-mwh15683e2] {
	font-size: 12px;
	font-weight: 600;
	color: #1E293B;
	white-space: nowrap;
}