/* /Components/AgentPicker.razor.rz.scp.css */
/* Inline "who attended" panel (sits with the attendants on the dashboard) */
.ap-panel[b-k2q510j11h] {
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius-sm);
    background: var(--wm-surface);
    padding: 8px 10px;
}
.ap-head[b-k2q510j11h] {
    font-family: var(--wm-mono);
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: .08em;
    color: var(--wm-ink-faint);
    margin-bottom: 6px;
}
.ap-row[b-k2q510j11h] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    padding: 4px 0;
    font-size: 0.88rem;
}
.ap-role[b-k2q510j11h] { color: var(--wm-ink-soft); flex: 0 0 110px; }

/* Dropdown fills the rest of the row (dynamic width). */
.ap-select[b-k2q510j11h] {
    flex: 1 1 auto;
    min-width: 0;
    padding: 6px 8px;
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius-sm);
    background: var(--wm-surface);
    font-size: 0.9rem;
}
.ap-select:focus[b-k2q510j11h] { outline: none; border-color: var(--wm-navy); box-shadow: 0 0 0 3px rgba(44, 62, 107, .12); }

.ap-att[b-k2q510j11h] { display: inline-flex; align-items: center; gap: 5px; font-size: 0.82rem; color: var(--wm-ink-soft); flex: 0 0 auto; }

/* Inline "add new agent" (replaces the dropdown in that row while adding). */
.ap-add[b-k2q510j11h] { flex: 1 1 auto; display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.ap-add input[b-k2q510j11h], .ap-add select[b-k2q510j11h] {
    flex: 1 1 120px;
    min-width: 0;
    padding: 5px 7px;
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius-sm);
    font-size: 0.88rem;
}
.ap-add-actions[b-k2q510j11h] { display: flex; gap: 6px; flex: 0 0 auto; }
.ap-err[b-k2q510j11h] { color: #b8420c; font-size: 0.8rem; flex: 1 1 100%; }
.mini-save[b-k2q510j11h] {
    background: var(--wm-navy); color: #fff; border: none;
    border-radius: var(--wm-radius-sm); padding: 5px 12px; cursor: pointer;
}
.mini-cancel[b-k2q510j11h] {
    background: var(--wm-surface); border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius-sm); padding: 5px 12px; cursor: pointer;
}

.ap-actions[b-k2q510j11h] { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-top: 8px; }
.ap-manage[b-k2q510j11h] { font-size: 0.82rem; color: var(--wm-navy); text-decoration: none; }
.ap-manage:hover[b-k2q510j11h] { text-decoration: underline; }
/* /Components/BookingCalendar.razor.rz.scp.css */
/* Calendar fills the height it's given (Home sets it) so the grid stretches down. */
.cal-wrap[b-3rz0t7gvei] {
    position: relative;
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
}

.cal-timegrid[b-3rz0t7gvei] {
    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 0;
}

/* Week nav in the top-left corner cell (above the hour gutter). */
.cal-arrow[b-3rz0t7gvei],
.cal-week[b-3rz0t7gvei] {
    cursor: pointer;
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius-sm);
    background: var(--wm-surface);
    line-height: 1.15;
    padding: 1px 4px;
}

.cal-arrow[b-3rz0t7gvei] { font-size: 95%; }

.cal-week[b-3rz0t7gvei] {
    font-size: 74%;
    font-weight: bold;
    color: #2c3e6b;
}

.cal-week:hover[b-3rz0t7gvei],
.cal-arrow:hover[b-3rz0t7gvei] { background: var(--wm-inset); }

/* ── Header: corner (week nav) + 7 day columns ── */
.cal-head[b-3rz0t7gvei] {
    display: flex;
    flex: 0 0 auto;
}

.cal-corner[b-3rz0t7gvei] {
    flex: 0 0 52px;
    width: 52px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 2px;
    padding: 3px 2px;
}

.cal-dayhead[b-3rz0t7gvei] {
    flex: 1 1 0;
    min-width: 0;
    text-align: center;
    padding: 4px 2px;
    border-left: 1px solid var(--wm-line);
    background: var(--wm-surface-2);
    font-family: var(--wm-mono);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.cal-dayhead.today[b-3rz0t7gvei] { background: #fffde7; }

.cal-dow[b-3rz0t7gvei] {
    display: block;
    font-size: 11px;
    font-weight: bold;
    color: var(--wm-ink-soft);
}

.cal-dayhead.today .cal-dow[b-3rz0t7gvei] { color: var(--wm-navy); }

.cal-dom[b-3rz0t7gvei] {
    display: block;
    font-size: 10px;
    color: var(--wm-ink-faint);
}

/* ── Body: hour gutter + 7 day columns (scrolls vertically if tall) ── */
.cal-body[b-3rz0t7gvei] {
    display: flex;
    /* Fill most of one screen; the rows divide THIS height, so the grid never scrolls and
       can't overflow onto Panel 2 below. (A fixed-px grid height used to overflow under zoom,
       which is why viewport-pinning was reverted before — percentage rows fix that.) */
    height: 62dvh;
    min-height: 320px;
    overflow: hidden;
    border-top: 1px solid var(--wm-line);
}

.cal-gutter[b-3rz0t7gvei] {
    flex: 0 0 52px;
    width: 52px;
    display: flex;
    flex-direction: column;
}

.cal-hourlabel[b-3rz0t7gvei] {
    box-sizing: border-box;
    flex: 1 1 0;          /* rows divide the grid height equally */
    min-height: 0;
    text-align: right;
    padding: 1px 6px 0 0;
    font-size: 10px;
    color: var(--wm-ink-faint);
    font-family: var(--wm-mono);
    border-top: 1px solid transparent;
}

.cal-daycol[b-3rz0t7gvei] {
    position: relative;
    flex: 1 1 0;
    min-width: 0;
    display: flex;
    flex-direction: column;   /* hour bands flex to fill; blocks overlay absolutely */
    border-left: 1px solid var(--wm-line);
}

.cal-daycol.today[b-3rz0t7gvei] { background: #fffdf3; }

/* Clickable hour bands form the grid lines behind the blocks. */
.cal-band[b-3rz0t7gvei] {
    box-sizing: border-box;
    flex: 1 1 0;          /* equal share of the day column's height */
    min-height: 0;
    border-top: 1px solid var(--wm-line);
    cursor: pointer;
}

.cal-band:hover[b-3rz0t7gvei] { background: var(--wm-inset); }

/* A booking, positioned by time and spanning its duration. */
.cal-block[b-3rz0t7gvei] {
    position: absolute;
    box-sizing: border-box;
    min-height: 40px;   /* readable even when a short booking's % height is tiny */
    border-radius: var(--wm-radius-sm);
    color: #fff;
    padding: 2px 5px;
    overflow: hidden;
    cursor: pointer;
    font-size: 11px;
    line-height: 1.22;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
    border: 1px solid rgba(255, 255, 255, 0.4);
}

.cal-block-time[b-3rz0t7gvei] {
    display: block;
    font-size: 9.5px;
    opacity: 0.9;
}

.cal-block-label[b-3rz0t7gvei] {
    display: block;
    font-weight: bold;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    padding-right: 16px;   /* clear the ✉ resend button in the top-right corner */
}

.cal-block-client[b-3rz0t7gvei] {
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    opacity: 0.95;
}

.cal-block-link[b-3rz0t7gvei] {
    position: absolute;
    top: 1px;
    right: 1px;
    background: rgba(255, 255, 255, 0.25);
    border: none;
    color: #fff;
    cursor: pointer;
    border-radius: 4px;
    font-size: 10px;
    line-height: 1;
    padding: 1px 3px;
}

.cal-block-link:hover[b-3rz0t7gvei] { background: rgba(255, 255, 255, 0.5); }

/* Slim one-line legend under the calendar. */
.legend-strip[b-3rz0t7gvei] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 2px 6px;
    font-size: 78%;
    color: var(--wm-ink-soft);
    padding: 4px 2px 0;
}

.legend-strip .dot[b-3rz0t7gvei] {
    display: inline-block;
    width: 11px;
    height: 11px;
    border-radius: 3px;
    margin: 0 3px 0 10px;
    vertical-align: middle;
}

.status-booked[b-3rz0t7gvei] { background: #43a047; }
.status-inspected[b-3rz0t7gvei] { background: #2196f3; }
.status-reportgenerated[b-3rz0t7gvei] { background: #e53935; }

/* ── Booking modal ── */
.modal-overlay[b-3rz0t7gvei] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    z-index: 999;
    display: flex;
    align-items: flex-start;
    justify-content: center;
}

.modal-box[b-3rz0t7gvei] {
    background: var(--wm-surface);
    width: 820px;
    max-width: 94%;
    max-height: 92vh;          /* never taller than the screen … */
    margin: 3vh 0;
    border-radius: var(--wm-radius);
    box-shadow: var(--wm-shadow);
    display: flex;             /* … fields scroll, footer stays put */
    flex-direction: column;
    overflow: hidden;          /* keep rounded corners over the scroll area */
}

/* Header + fields scroll here so tall content can never bury the buttons. */
.modal-scroll[b-3rz0t7gvei] {
    overflow-y: auto;
    padding: 20px;
}

.actions[b-3rz0t7gvei] {
    flex-shrink: 0;            /* fixed footer, always visible below the scroll area */
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    padding: 12px 20px;
    background: var(--wm-surface);
    border-top: 1px solid var(--wm-line);
}

.actions button[b-3rz0t7gvei] {
    padding: 7px 16px;
    cursor: pointer;
}

/* Pushes Discard to the far left, everything else to the right. */
.actions-spacer[b-3rz0t7gvei] { flex: 1 1 auto; }

.booking-discard[b-3rz0t7gvei] {
    color: #a33;
    background: none;
    border: 1px solid #e0b4b0;
    border-radius: var(--wm-radius-sm);
}

.booking-discard:hover[b-3rz0t7gvei] { background: #fdecea; }

.booking-head[b-3rz0t7gvei] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
}

.booking-autosave[b-3rz0t7gvei] {
    font-size: 0.8rem;
    color: var(--wm-ink-soft);
    font-style: italic;
    white-space: nowrap;
}

.booking-error[b-3rz0t7gvei] {
    color: #a33;
    background: #fdecea;
    border: 1px solid #a33;
    border-radius: var(--wm-radius-sm);
    padding: 8px 12px;
    margin-top: 12px;
    font-size: 90%;
}

/* ── Booking wizard: 3 steps, larger readable fields ── */
.booking-steps[b-3rz0t7gvei] {
    display: flex;
    gap: 6px;
    margin: 4px 0 18px;
}

.booking-step[b-3rz0t7gvei] {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 9px 10px;
    border: 1px solid var(--wm-line);
    background: var(--wm-surface-2);
    border-radius: var(--wm-radius-sm);
    cursor: pointer;
    font-size: 0.95rem;
    color: var(--wm-ink-soft);
    white-space: nowrap;
}

.booking-step .step-num[b-3rz0t7gvei] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: var(--wm-line);
    color: var(--wm-ink-soft);
    font-size: 0.85rem;
    font-weight: 700;
    flex-shrink: 0;
}

.booking-step.active[b-3rz0t7gvei] {
    background: var(--wm-navy);
    border-color: var(--wm-navy);
    color: #fff;
    font-weight: 600;
}

.booking-step.active .step-num[b-3rz0t7gvei] { background: rgba(255,255,255,.25); color: #fff; }

.booking-step.done[b-3rz0t7gvei] { border-color: var(--wm-navy); color: var(--wm-navy); }
.booking-step.done .step-num[b-3rz0t7gvei] { background: var(--wm-navy); color: #fff; }

.booking-step-body[b-3rz0t7gvei] { min-height: 180px; }

/* Enlarge the shared InspectionFields to a readable size inside the booking modal only.
   ::deep reaches into the child component's DOM; the default 11px labels are unreadable,
   and the 3-step split leaves room to size them up. */
.booking-modal[b-3rz0t7gvei]  .tile-body label { font-size: 0.95rem; }
.booking-modal[b-3rz0t7gvei]  .tile-body input,
.booking-modal[b-3rz0t7gvei]  .tile-body select,
.booking-modal[b-3rz0t7gvei]  .tile-body textarea {
    font-size: 1rem;
    padding: 8px 10px;
}
.booking-modal[b-3rz0t7gvei]  .tile-header { font-size: 1.05rem; }

/* ── Save & send booking link panel ── */
.booking-link-intro[b-3rz0t7gvei] {
    color: #4b5563;
    margin: 6px 0 12px;
}

.booking-link-row[b-3rz0t7gvei] {
    display: flex;
    gap: 6px;
    margin-bottom: 12px;
}

.booking-link-input[b-3rz0t7gvei] {
    flex: 1;
    min-width: 0;
    padding: 8px 10px;
    border: 1px solid #cfd6e0;
    border-radius: 7px;
    background: #f5f7fb;
    font-size: 90%;
    color: #4b5563;
}

.booking-link-copy[b-3rz0t7gvei] {
    border: 1px solid #cfd6e0;
    background: #fff;
    color: #2c3e6b;
    border-radius: 7px;
    padding: 8px 14px;
    cursor: pointer;
    white-space: nowrap;
}

.booking-link-send[b-3rz0t7gvei] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.booking-link-btn[b-3rz0t7gvei] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 9px 16px;
    background: #2c3e6b;
    color: #fff;
    text-decoration: none;
    border-radius: 8px;
    font-weight: 600;
    font-size: 92%;
}

.booking-link-btn:hover[b-3rz0t7gvei] { filter: brightness(1.08); }
/* /Components/BookingLinkPanel.razor.rz.scp.css */
.blp[b-l3pjowut3p] { margin-top: 10px; }

.blp-trigger[b-l3pjowut3p] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: #2c3e6b;
    color: #fff;
    border: none;
    border-radius: var(--wm-radius-sm);
    padding: 7px 14px;
    font-size: 0.85rem;
    font-weight: 600;
    cursor: pointer;
}
.blp-trigger:hover[b-l3pjowut3p] { background: #24325a; }

.blp-panel[b-l3pjowut3p] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.blp-link[b-l3pjowut3p] {
    width: 100%;
    box-sizing: border-box;
    padding: 6px 8px;
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius-sm);
    font-size: 0.8rem;
    color: var(--wm-ink);
    background: var(--wm-surface-2);
}

.blp-actions[b-l3pjowut3p] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    align-items: center;
}

.blp-btn[b-l3pjowut3p] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    background: var(--wm-surface);
    color: #2c3e6b;
    text-decoration: none;
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius-sm);
    padding: 5px 10px;
    font-size: 0.8rem;
    cursor: pointer;
}
.blp-btn:hover[b-l3pjowut3p] { background: var(--wm-inset); border-color: #2c3e6b; }

.blp-done[b-l3pjowut3p] {
    margin-left: auto;
    background: none;
    border: none;
    color: var(--wm-ink-soft);
    font-size: 0.8rem;
    cursor: pointer;
    text-decoration: underline;
}
/* /Components/ContentBlockEditor.razor.rz.scp.css */
/* Collapsible mode (report setup): the heading row is a clickable toggle. */
.ce-frame-head.ce-clickable[b-b5b9qa4ijp] {
    cursor: pointer;
    user-select: none;
    display: flex;
    align-items: center;
    gap: 8px;
}

.ce-frame-head.ce-clickable:hover .ce-label[b-b5b9qa4ijp] {
    color: var(--wm-navy);
}

.ce-chevron[b-b5b9qa4ijp] {
    flex: 0 0 auto;
    font-size: 0.7rem;
    color: var(--wm-ink-faint);
    width: 0.9em;
    text-align: center;
}

/* Collapsed block is just the heading row — trim the frame so it reads as a compact bar. */
.ce-frame.collapsed[b-b5b9qa4ijp] {
    padding-bottom: 0;
}
/* /Components/DocumentsPanel.razor.rz.scp.css */
.docs-panel[b-d6ea5iea8x] {
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius);
    background: var(--wm-surface);
    box-shadow: var(--wm-shadow);
    padding: 14px 16px;
}

.docs-heading[b-d6ea5iea8x] {
    font-family: var(--wm-serif);
    font-weight: 600;
    font-size: 1.05rem;
    color: var(--wm-ink);
    margin: 0 0 10px;
}

.docs-loading[b-d6ea5iea8x] {
    color: var(--wm-ink-faint);
    font-style: italic;
    margin: 0;
}

.docs-list[b-d6ea5iea8x] {
    display: flex;
    flex-direction: column;
}

.doc-row[b-d6ea5iea8x] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 9px 0;
    border-top: 1px solid var(--wm-line-soft);
}

.doc-row:first-child[b-d6ea5iea8x] { border-top: none; }

.doc-name[b-d6ea5iea8x] {
    flex: 0 0 auto;
    min-width: 150px;
    font-weight: 600;
    color: var(--wm-ink);
    font-size: 0.92rem;
}

.doc-state[b-d6ea5iea8x] {
    flex: 1 1 auto;
    font-size: 0.85rem;
    display: flex;
    flex-direction: column;
    gap: 1px;
}

.doc-issued[b-d6ea5iea8x] { color: var(--wm-navy); font-weight: 600; }
.doc-notissued[b-d6ea5iea8x] { color: var(--wm-ink-faint); }
.doc-sent[b-d6ea5iea8x] { color: #1f7a3d; font-weight: 600; }
.doc-notsent[b-d6ea5iea8x] { color: var(--wm-ink-faint); }

.doc-actions[b-d6ea5iea8x] {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    gap: 8px;
}

.doc-btn[b-d6ea5iea8x] {
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius-sm);
    background: var(--wm-surface);
    color: var(--wm-navy);
    padding: 5px 12px;
    font-size: 0.82rem;
    text-decoration: none;
    cursor: pointer;
    white-space: nowrap;
}

.doc-btn:hover[b-d6ea5iea8x] { background: var(--wm-inset); }

.doc-btn.primary[b-d6ea5iea8x] {
    background: #2c3e6b;
    color: #fff;
    border-color: #2c3e6b;
}

.doc-btn.primary:hover[b-d6ea5iea8x] { background: #24325a; }

.doc-soon[b-d6ea5iea8x] {
    font-size: 0.8rem;
    color: var(--wm-ink-faint);
    font-style: italic;
    white-space: nowrap;
}

/* ── Uploaded-for-this-inspection section ── */
.docs-sub[b-d6ea5iea8x] {
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--wm-ink-faint);
    margin: 0 0 6px;
}

.docs-sub-spaced[b-d6ea5iea8x] { margin-top: 16px; }

.docs-upload-row[b-d6ea5iea8x] {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
    padding: 4px 0 2px;
}

/* Hide the InputFile's native control; the wrapping label is the button.
   ::deep is required — InputFile renders its <input> as a child component, so the
   scoped selector wouldn't otherwise reach it. */
.doc-add[b-d6ea5iea8x]  input[type="file"] { display: none; }
.doc-add[b-d6ea5iea8x] { font-weight: 600; cursor: pointer; }

.docs-drop-hint[b-d6ea5iea8x] {
    font-size: 0.8rem;
    color: var(--wm-ink-faint);
    font-style: italic;
}

.docs-err-inline[b-d6ea5iea8x] { font-size: 0.82rem; color: #a33; }

.docs-uploaded .doc-name a[b-d6ea5iea8x] {
    color: var(--wm-navy);
    text-decoration: none;
}
.docs-uploaded .doc-name a:hover[b-d6ea5iea8x] { text-decoration: underline; }

/* Whole panel is a drop target — highlight while dragging files over it. */
.docs-panel.drag-over[b-d6ea5iea8x] {
    border-color: #2c3e6b;
    box-shadow: 0 0 0 2px rgba(44, 62, 107, 0.25);
}

/* ── Send confirm dialog ── */
.docs-overlay[b-d6ea5iea8x] {
    position: fixed;
    inset: 0;
    background: rgba(20, 24, 35, 0.45);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 60;
    padding: 20px;
}

.docs-dialog[b-d6ea5iea8x] {
    background: var(--wm-surface);
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius);
    box-shadow: var(--wm-shadow);
    padding: 20px 22px;
    width: 100%;
    max-width: 440px;
}

.docs-dialog h3[b-d6ea5iea8x] {
    font-family: var(--wm-serif);
    font-size: 1.15rem;
    margin: 0 0 12px;
    color: var(--wm-ink);
}

.docs-to[b-d6ea5iea8x] { margin: 0 0 6px; color: var(--wm-ink); }
.docs-hint[b-d6ea5iea8x] { margin: 0 0 10px; font-size: 0.85rem; color: var(--wm-ink-soft); }
.docs-ok[b-d6ea5iea8x] { color: #1f7a3d; font-weight: 600; margin: 4px 0 0; }
.docs-err[b-d6ea5iea8x] { color: #a33; margin: 4px 0 0; }

.docs-dialog-actions[b-d6ea5iea8x] {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    margin-top: 16px;
}

.docs-dialog-actions button[b-d6ea5iea8x] {
    padding: 7px 16px;
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius-sm);
    background: var(--wm-surface);
    cursor: pointer;
    font-size: 0.9rem;
}

.docs-dialog-actions button:hover[b-d6ea5iea8x] { background: var(--wm-inset); }

.docs-dialog-actions button.primary[b-d6ea5iea8x] {
    background: #2c3e6b;
    color: #fff;
    border-color: #2c3e6b;
}

.docs-dialog-actions button.primary:disabled[b-d6ea5iea8x] {
    background: var(--wm-line);
    border-color: var(--wm-line);
    color: var(--wm-ink-faint);
    cursor: default;
}
/* /Components/FieldModeToggle.razor.rz.scp.css */
/* Field-mode switch, styled to sit in the dark nav sidebar next to the EN/FR buttons.
   Full-width pill; clearly "live" (green) when on so it reads at a glance on a tablet. */
.fieldmode-toggle[b-gpe284krz4] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 100%;
    padding: 6px 10px;
    font-size: 0.76rem;
    font-weight: 700;
    letter-spacing: .03em;
    color: #cfd4e0;
    text-decoration: none;
    border: 1px solid rgba(255, 255, 255, 0.22);
    border-radius: 5px;
    background: rgba(255, 255, 255, 0.05);
    white-space: nowrap;
    box-sizing: border-box;
}

.fieldmode-toggle:hover[b-gpe284krz4] { background: rgba(255, 255, 255, 0.14); color: #fff; }

.fm-dot[b-gpe284krz4] {
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.35);
    flex: 0 0 auto;
}

/* On — reads as a live, engaged mode. */
.fieldmode-toggle.on[b-gpe284krz4] {
    background: #1f7a4d;
    border-color: #2e9e6b;
    color: #fff;
}

.fieldmode-toggle.on .fm-dot[b-gpe284krz4] { background: #7ef0b0; }

/* Comfortable tap target on touch devices (this control lives on the tablet). */
@media (pointer: coarse) {
    .fieldmode-toggle[b-gpe284krz4] { padding: 9px 12px; font-size: 0.82rem; }
}
/* /Components/InspectionFields.razor.rz.scp.css */
/* Every section header and field is a tile on a 12-column grid. Tile widths come from
   an inline `grid-column: span N`; the grid auto-flows so tiles never overlap. */
.field-grid[b-inqkaxai9c] {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    gap: 5px 8px;
    align-items: end;
}

.tile[b-inqkaxai9c] {
    position: relative;
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.tile-header[b-inqkaxai9c] {
    justify-content: flex-end;
}

.tile-header h3[b-inqkaxai9c] {
    margin: 8px 0 2px;
    font-family: var(--wm-mono);
    font-size: 12.5px;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: #2c3e6b;
    border-bottom: 1px solid var(--wm-line-soft);
    padding-bottom: 2px;
}

.tile-body[b-inqkaxai9c] {
    min-width: 0;
}

.tile-body label[b-inqkaxai9c] {
    display: flex;
    flex-direction: column;
    font-family: var(--wm-mono);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-size: 12.5px;
    color: var(--wm-ink-faint);
    gap: 3px;
}

.tile-body input[b-inqkaxai9c],
.tile-body select[b-inqkaxai9c],
.tile-body textarea[b-inqkaxai9c] {
    width: 100%;
    box-sizing: border-box;
    padding: 6px 8px;
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius-sm);
    font-family: var(--wm-sans);
    font-size: 15px;
    text-transform: none;
    letter-spacing: 0;
    color: var(--wm-ink);
}

.tile-body input:focus[b-inqkaxai9c],
.tile-body select:focus[b-inqkaxai9c],
.tile-body textarea:focus[b-inqkaxai9c] {
    outline: none;
    border-color: var(--wm-navy);
    box-shadow: 0 0 0 3px rgba(44, 62, 107, 0.12);
}

/* "Client address" — a sub-heading (not a full section header), so it reads as part of
   the Client block while still being clearly labelled as the client's own address. */
.tile-header h3.if-subhead[b-inqkaxai9c] {
    text-transform: none;
    letter-spacing: 0;
    font-family: var(--wm-sans);
    font-size: 13px;
    font-weight: 700;
    color: var(--wm-ink-soft);
    border-bottom-style: dashed;
}
/* Distinct look from the inspection address: the client-address inputs get a soft tint. */
.tile-body label.if-caddr input[b-inqkaxai9c] { background: var(--wm-inset); }

/* Extra fee lines (Fee 1 / Fee 2): an editable caption-style name above the amount. */
.tile-body .if-fee[b-inqkaxai9c] {
    display: flex;
    flex-direction: column;
    gap: 3px;
}
.tile-body .if-fee .if-fee-name[b-inqkaxai9c] {
    font-family: var(--wm-mono);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-size: 12.5px;
    color: var(--wm-ink-faint);
    padding: 3px 6px;
    border: 1px dashed var(--wm-line);
}
.tile-body .if-fee .if-fee-name:focus[b-inqkaxai9c] {
    color: var(--wm-ink);
}
.tile-body input.if-num[b-inqkaxai9c] {
    text-align: right;
    font-variant-numeric: tabular-nums;
}

/* No-tax agreement toggle — an inline checkbox row, not the stacked caption style */
.tile-body label.if-notax[b-inqkaxai9c] {
    flex-direction: row;
    align-items: center;
    gap: 8px;
    text-transform: none;
    letter-spacing: 0;
    font-size: 13px;
    color: var(--wm-ink);
}
.tile-body label.if-notax input[b-inqkaxai9c] {
    width: 16px;
    height: 16px;
    flex: none;
}

/* No-tax checkbox (left) + Payment method (right) on one row. */
.tile-body .if-notax-row[b-inqkaxai9c] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    width: 100%;
}
.tile-body .if-notax-row label.if-notax[b-inqkaxai9c] { flex: 0 1 auto; }
.tile-body label.if-payment[b-inqkaxai9c] {
    flex-direction: row;
    align-items: center;
    gap: 6px;
    text-transform: none;
    letter-spacing: 0;
    font-size: 13px;
    color: var(--wm-ink);
    white-space: nowrap;
}
.tile-body label.if-payment select[b-inqkaxai9c] {
    width: auto;
    min-width: 130px;
}

.tile-body textarea.if-note[b-inqkaxai9c] {
    font: inherit;
    font-family: var(--wm-sans);
    font-size: 15px;
    text-transform: none;
    letter-spacing: 0;
    resize: vertical;
}

.if-note-hint[b-inqkaxai9c] {
    font-weight: 400;
    font-size: 82%;
    color: var(--wm-ink-faint);
    text-transform: none;
    letter-spacing: 0;
}

.if-attendants[b-inqkaxai9c] {
    display: flex;
    flex-wrap: wrap;
    gap: 5px 14px;
}

.if-attendant[b-inqkaxai9c] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-family: var(--wm-sans);
    text-transform: none;
    letter-spacing: 0;
    font-size: 82%;
    color: var(--wm-ink-soft);
    white-space: nowrap;
}

.if-attendant input[b-inqkaxai9c] {
    width: auto;
}

/* "✎ Edit list…" link shown after the Attendants checkboxes. */
.opt-edit-link[b-inqkaxai9c] {
    background: none;
    border: none;
    color: #2c3e6b;
    cursor: pointer;
    font-size: 78%;
    text-decoration: underline;
    padding: 0;
    white-space: nowrap;
}

/* "🏢 Real-estate agents…" opener shown after the Attendants checkboxes (detail page). */
.if-agents-link[b-inqkaxai9c] {
    background: none;
    border: 1px solid #2c3e6b;
    color: #2c3e6b;
    cursor: pointer;
    font-size: 78%;
    border-radius: 999px;
    padding: 1px 9px;
    white-space: nowrap;
}

.if-agents-link:hover[b-inqkaxai9c] {
    background: #2c3e6b;
    color: #fff;
}

/* Popup editor for a dropdown's option list. */
.opt-overlay[b-inqkaxai9c] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.5);
    z-index: 1000;
    display: flex;
    align-items: flex-start;
    justify-content: center;
}

.opt-editor[b-inqkaxai9c] {
    background: var(--wm-surface);
    width: 460px;
    max-width: 92%;
    margin-top: 8vh;
    border-radius: var(--wm-radius);
    padding: 18px 20px;
    box-shadow: var(--wm-shadow);
}

.opt-editor h3[b-inqkaxai9c] {
    margin: 0 0 4px;
    font-size: 1rem;
    color: #2c3e6b;
}

.opt-hint[b-inqkaxai9c] {
    margin: 0 0 10px;
    font-size: 82%;
    color: var(--wm-ink-faint);
}

.opt-error[b-inqkaxai9c] {
    margin: 0 0 10px;
    padding: 8px 10px;
    font-size: 85%;
    color: #8a2020;
    background: #fdeaea;
    border: 1px solid #e6b8b8;
    border-radius: var(--wm-radius-sm);
}

/* Row-based inline list editor: each option is directly editable (single-click to rename). */
.opt-rows[b-inqkaxai9c] {
    display: flex;
    flex-direction: column;
    gap: 5px;
    max-height: 48vh;
    overflow-y: auto;
}
.opt-row[b-inqkaxai9c] {
    display: flex;
    align-items: center;
    gap: 6px;
}
.opt-row-input[b-inqkaxai9c] {
    flex: 1 1 auto;
    min-width: 0;
    padding: 6px 8px;
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius-sm);
    font: inherit;
    font-size: 92%;
}
.opt-row-input:focus[b-inqkaxai9c] {
    outline: none;
    border-color: var(--wm-navy);
    box-shadow: 0 0 0 3px rgba(44, 62, 107, 0.12);
}
.opt-row-del[b-inqkaxai9c] {
    flex: 0 0 auto;
    background: none;
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius-sm);
    color: var(--wm-ink-soft);
    font-size: 1.1rem;
    line-height: 1;
    padding: 2px 9px;
    cursor: pointer;
}
.opt-row-del:hover[b-inqkaxai9c] { color: #c0392b; border-color: #c0392b; }
.opt-add-row[b-inqkaxai9c] { margin-top: 4px; border-top: 1px dashed var(--wm-line); padding-top: 8px; }
.opt-row-add[b-inqkaxai9c] {
    flex: 0 0 auto;
    background: var(--wm-surface-2);
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius-sm);
    color: var(--wm-navy);
    font-weight: 600;
    padding: 6px 14px;
    cursor: pointer;
}
.opt-row-add:hover[b-inqkaxai9c] { background: var(--wm-inset); }

.opt-actions[b-inqkaxai9c] {
    margin-top: 14px;
    display: flex;
    justify-content: flex-end;
    gap: 8px;
}

.opt-actions button[b-inqkaxai9c] {
    padding: 7px 16px;
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius-sm);
    background: var(--wm-surface);
    cursor: pointer;
}

.opt-actions button.primary[b-inqkaxai9c] {
    background: #2c3e6b;
    color: #fff;
    border-color: #2c3e6b;
}

/* ── Layout edit mode: draggable + resizable tiles ── */
.field-grid.editing .tile[b-inqkaxai9c] {
    outline: 1px dashed var(--wm-line);
    border-radius: var(--wm-radius-sm);
    padding: 2px 10px 3px 4px;
}

/* Fields are locked ONLY while arranging (Edit layout on) so a drag never lands in an
   input; in normal use they're fully editable. */
.field-grid.editing .tile-body input[b-inqkaxai9c],
.field-grid.editing .tile-body select[b-inqkaxai9c],
.field-grid.editing .tile-body textarea[b-inqkaxai9c] {
    pointer-events: none;
    background: var(--wm-inset);
}

.tile-grip[b-inqkaxai9c] {
    cursor: grab;
    font-size: 70%;
    color: var(--wm-ink-faint);
    user-select: none;
    line-height: 1;
    margin-bottom: 1px;
}

.tile-grip:active[b-inqkaxai9c] {
    cursor: grabbing;
}

.tile-resize[b-inqkaxai9c] {
    position: absolute;
    top: 0;
    bottom: 0;
    right: -1px;
    width: 9px;
    cursor: col-resize;
    touch-action: none;
}

.tile-resize[b-inqkaxai9c]::after {
    content: "";
    position: absolute;
    right: 3px;
    top: 50%;
    transform: translateY(-50%);
    width: 3px;
    height: 55%;
    background: var(--wm-line);
    border-radius: 2px;
}

.tile-resize:hover[b-inqkaxai9c]::after {
    background: #2c3e6b;
}

/* ── "Find contact" picker (Client 1) ── */
.if-client-h[b-inqkaxai9c] { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.if-find[b-inqkaxai9c] {
    font-size: 0.72rem;
    font-weight: 600;
    color: var(--wm-navy);
    background: var(--wm-surface-2);
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius-sm);
    padding: 2px 8px;
    cursor: pointer;
}
.if-find:hover[b-inqkaxai9c] { border-color: var(--wm-navy); background: var(--wm-inset); }
.if-find-panel[b-inqkaxai9c] { width: 460px; max-width: 96vw; }
.if-find-search[b-inqkaxai9c] {
    width: 100%;
    box-sizing: border-box;
    padding: 8px 10px;
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius-sm);
    margin-bottom: 8px;
}
.if-find-search:focus[b-inqkaxai9c] { outline: none; border-color: var(--wm-navy); box-shadow: 0 0 0 3px rgba(44, 62, 107, .12); }
.if-find-results[b-inqkaxai9c] { max-height: 46vh; overflow-y: auto; display: flex; flex-direction: column; gap: 2px; }
.if-find-row[b-inqkaxai9c] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    text-align: left;
    border-radius: var(--wm-radius-sm);
    padding: 6px 9px;
}
.if-find-row:hover[b-inqkaxai9c] { background: var(--wm-surface-2); }
.if-find-info[b-inqkaxai9c] { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.if-find-name[b-inqkaxai9c] { font-weight: 600; color: var(--wm-ink); }
.if-find-sub[b-inqkaxai9c] { font-size: 0.8rem; color: var(--wm-ink-soft); }
/* Per-row role targets: fill Client 1 or Client 2 from this contact. */
.if-find-into[b-inqkaxai9c] { display: flex; gap: 6px; flex: 0 0 auto; }
.if-find-into button[b-inqkaxai9c] {
    white-space: nowrap;
    font-size: 0.8rem;
    padding: 4px 9px;
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius-sm);
    background: var(--wm-surface);
    color: var(--wm-navy);
    cursor: pointer;
}
.if-find-into button:hover[b-inqkaxai9c] { border-color: var(--wm-navy); background: var(--wm-inset); }
/* Undo-fill button next to the Client 1 heading (amber to read as a revert). */
.if-undo[b-inqkaxai9c] { border-color: #c2410c !important; color: #c2410c !important; }
.if-undo:hover[b-inqkaxai9c] { background: #ffe9dc !important; }
/* /Components/InspectionStatusPicker.razor.rz.scp.css */
.isp[b-pqfujam9b1] {
    position: relative;
    display: inline-block;
}

.isp-pill[b-pqfujam9b1] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    border: none;
    cursor: pointer;
    font-size: 82%;
    padding: 2px 10px;
    border-radius: 10px;
    font-weight: 600;
}

.isp-caret[b-pqfujam9b1] { font-size: 90%; opacity: 0.7; }

.isp-pill.status-booked[b-pqfujam9b1] { background: #eef1f6; color: #3d5a8a; }
.isp-pill.status-inspected[b-pqfujam9b1] { background: #fdf1dd; color: #8a5a00; }
.isp-pill.status-reportissued[b-pqfujam9b1] { background: #e3f4e8; color: #1d6b39; }

/* Full-screen catcher so clicking anywhere else closes the menu. */
.isp-backdrop[b-pqfujam9b1] {
    position: fixed;
    inset: 0;
    z-index: 40;
}

.isp-menu[b-pqfujam9b1] {
    position: absolute;
    top: calc(100% + 4px);
    left: 0;
    z-index: 41;
    background: var(--wm-surface);
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius-sm);
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.18);
    padding: 4px;
    min-width: 172px;
}

.isp-opt[b-pqfujam9b1] {
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
    background: none;
    border: none;
    cursor: pointer;
    padding: 7px 9px;
    border-radius: var(--wm-radius-sm);
    font-size: 0.88rem;
    color: var(--wm-ink);
    text-align: left;
}

.isp-opt:hover[b-pqfujam9b1] { background: var(--wm-surface-2); }
.isp-opt.current[b-pqfujam9b1] { font-weight: 600; }

.isp-opt-label[b-pqfujam9b1] { flex: 1; }

.isp-dot[b-pqfujam9b1] {
    width: 9px;
    height: 9px;
    border-radius: 50%;
    flex-shrink: 0;
}

.isp-dot.status-booked[b-pqfujam9b1] { background: #3d5a8a; }
.isp-dot.status-inspected[b-pqfujam9b1] { background: #8a5a00; }
.isp-dot.status-reportissued[b-pqfujam9b1] { background: #1d6b39; }

.isp-check[b-pqfujam9b1] { color: var(--wm-navy); }
/* /Components/Layout/MainLayout.razor.rz.scp.css */
.page[b-d20z6001cw] {
    position: relative;
    display: flex;
    flex-direction: column;
}

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

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

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

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

    article[b-d20z6001cw] {
        padding-left: 2rem !important;
        padding-right: 1.5rem !important;
    }
}

/* ── Off-canvas nav (Field mode OR desktop nav-collapsed) ──────────────────────
   Off by default (below stays inert). When the sidebar should be hidden — Field mode,
   or the desktop collapse toggle — pull the 250px column off-screen so <main> reflows
   full-width; a floating control slides it back as an overlay drawer. The floating glyph
   differs by mode (hamburger = Field mode, sidebar-panel = desktop) so it doubles as a
   mode indicator. */
.fieldnav-toggle[b-d20z6001cw],
.fieldnav-burger[b-d20z6001cw],
.fieldnav-backdrop[b-d20z6001cw] { display: none; }

@media (min-width: 641px) {
    /* Slide the sidebar off to the LEFT; because it becomes position:fixed it leaves the
       flex flow, so <main> (flex:1) immediately fills the whole width. Overlay, not push —
       peeking it back doesn't reshrink the content. */
    .page.field-mode .sidebar[b-d20z6001cw],
    .page.nav-collapsed .sidebar[b-d20z6001cw] {
        position: fixed;
        top: 0;
        left: -260px;
        width: 250px;
        height: 100vh;
        z-index: 1002;
        transition: left .2s ease;
        box-shadow: 2px 0 14px rgba(0, 0, 0, 0.4);
    }
    .page.field-mode .fieldnav-toggle:checked ~ .sidebar[b-d20z6001cw],
    .page.nav-collapsed .fieldnav-toggle:checked ~ .sidebar[b-d20z6001cw] { left: 0; }

    /* Shared floating control box (positioned here; which glyph shows is set per-mode). */
    .page.field-mode .fieldnav-burger[b-d20z6001cw],
    .page.nav-collapsed .fieldnav-burger[b-d20z6001cw] {
        position: fixed;
        top: 10px;
        left: 10px;
        z-index: 1003;
        width: 42px;
        height: 42px;
        align-items: center;
        justify-content: center;
        background: #052767;
        border-radius: 8px;
        cursor: pointer;
        box-shadow: 0 1px 5px rgba(0, 0, 0, 0.35);
        color: #fff;
    }

    /* Which glyph floats: hamburger in Field mode, sidebar-panel on desktop-collapsed.
       Field mode wins if somehow both are set. */
    .page.field-mode .fieldnav-burger-field[b-d20z6001cw] { display: flex; }
    .page.nav-collapsed:not(.field-mode) .fieldnav-burger-desk[b-d20z6001cw] { display: flex; }

    /* Hamburger glyph (Field mode). */
    .page.field-mode .fieldnav-burger-field span[b-d20z6001cw] { position: relative; }
    .page.field-mode .fieldnav-burger-field span[b-d20z6001cw],
    .page.field-mode .fieldnav-burger-field span[b-d20z6001cw]::before,
    .page.field-mode .fieldnav-burger-field span[b-d20z6001cw]::after {
        display: block;
        width: 22px;
        height: 2px;
        background: #fff;
        border-radius: 2px;
    }
    .page.field-mode .fieldnav-burger-field span[b-d20z6001cw]::before,
    .page.field-mode .fieldnav-burger-field span[b-d20z6001cw]::after {
        content: "";
        position: absolute;
        left: 0;
    }
    .page.field-mode .fieldnav-burger-field span[b-d20z6001cw]::before { top: -7px; }
    .page.field-mode .fieldnav-burger-field span[b-d20z6001cw]::after  { top: 7px; }

    /* Backdrop appears only while the drawer is open; tapping it closes the drawer. */
    .page.field-mode .fieldnav-toggle:checked ~ .fieldnav-backdrop[b-d20z6001cw],
    .page.nav-collapsed .fieldnav-toggle:checked ~ .fieldnav-backdrop[b-d20z6001cw] {
        display: block;
        position: fixed;
        inset: 0;
        z-index: 1001;
        background: rgba(0, 0, 0, 0.35);
    }

    /* Nudge content right so the floating control never sits on top of the page title. */
    .page.field-mode article[b-d20z6001cw],
    .page.nav-collapsed article[b-d20z6001cw] {
        padding-left: 3.75rem !important;
    }
}

#blazor-error-ui[b-d20z6001cw] {
    color-scheme: light only;
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    box-sizing: border-box;
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

    #blazor-error-ui .dismiss[b-d20z6001cw] {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }
/* /Components/Layout/NavMenu.razor.rz.scp.css */
.navbar-toggler[b-gu3q1iqv8g] {
    appearance: none;
    cursor: pointer;
    width: 3.5rem;
    height: 2.5rem;
    color: white;
    position: absolute;
    top: 0.5rem;
    right: 1rem;
    border: 1px solid rgba(255, 255, 255, 0.1);
    background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 0.55%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") no-repeat center/1.75rem rgba(255, 255, 255, 0.1);
}

.navbar-toggler:checked[b-gu3q1iqv8g] {
    background-color: rgba(255, 255, 255, 0.5);
}

.top-row[b-gu3q1iqv8g] {
    min-height: 3.5rem;
    background-color: rgba(0,0,0,0.4);
}

.navbar-brand[b-gu3q1iqv8g] {
    display: inline-flex;
    align-items: baseline;
    gap: 1px;
    max-width: 100%;
    overflow: hidden;
}

/* Product name — the constant, in the title-case serif brand style. */
.navbar-brand .brand-name[b-gu3q1iqv8g] {
    font-family: var(--wm-serif);
    font-size: 1.4rem;
    font-weight: 600;
    letter-spacing: .2px;
    white-space: nowrap;
}

/* Optional instance label (WM_SITE_PREFIX) — small mono tag so it fits the frame
   and reads as a qualifier, not part of the product name. */
.navbar-brand .brand-prefix[b-gu3q1iqv8g] {
    font-family: var(--wm-mono);
    font-size: .62rem;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
    opacity: .7;
    align-self: center;
    white-space: nowrap;
}

/* Mono uppercase section labels grouping the nav links (matches the report look). */
.nav-group-label[b-gu3q1iqv8g] {
    font-family: var(--wm-mono);
    font-size: 10px;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: #8593bd;
    padding: 14px 1.25rem 5px;
}

.nav-count-badge[b-gu3q1iqv8g] {
    background: #c0392b;
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    padding: 1px 7px;
    border-radius: 10px;
    margin-left: 6px;
}

.bi[b-gu3q1iqv8g] {
    display: inline-block;
    position: relative;
    width: 1.25rem;
    height: 1.25rem;
    margin-right: 0.75rem;
    top: -1px;
    background-size: cover;
}

.bi-house-door-fill-nav-menu[b-gu3q1iqv8g] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-house-door-fill' viewBox='0 0 16 16'%3E%3Cpath d='M6.5 14.5v-3.505c0-.245.25-.495.5-.495h2c.25 0 .5.25.5.5v3.5a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5v-7a.5.5 0 0 0-.146-.354L13 5.793V2.5a.5.5 0 0 0-.5-.5h-1a.5.5 0 0 0-.5.5v1.293L8.354 1.146a.5.5 0 0 0-.708 0l-6 6A.5.5 0 0 0 1.5 7.5v7a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5Z'/%3E%3C/svg%3E");
}

.bi-plus-square-fill-nav-menu[b-gu3q1iqv8g] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-plus-square-fill' viewBox='0 0 16 16'%3E%3Cpath d='M2 0a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2H2zm6.5 4.5v3h3a.5.5 0 0 1 0 1h-3v3a.5.5 0 0 1-1 0v-3h-3a.5.5 0 0 1 0-1h3v-3a.5.5 0 0 1 1 0z'/%3E%3C/svg%3E");
}

.bi-list-nested-nav-menu[b-gu3q1iqv8g] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-list-nested' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M4.5 11.5A.5.5 0 0 1 5 11h10a.5.5 0 0 1 0 1H5a.5.5 0 0 1-.5-.5zm-2-4A.5.5 0 0 1 3 7h10a.5.5 0 0 1 0 1H3a.5.5 0 0 1-.5-.5zm-2-4A.5.5 0 0 1 1 3h10a.5.5 0 0 1 0 1H1a.5.5 0 0 1-.5-.5z'/%3E%3C/svg%3E");
}

.bi-person-badge-nav-menu[b-gu3q1iqv8g] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' viewBox='0 0 16 16'%3E%3Cpath d='M6.5 2a.5.5 0 0 0 0 1h3a.5.5 0 0 0 0-1h-3zM11 8a3 3 0 1 1-6 0 3 3 0 0 1 6 0z'/%3E%3Cpath d='M4.5 0A2.5 2.5 0 0 0 2 2.5V14a2 2 0 0 0 2 2h8a2 2 0 0 0 2-2V2.5A2.5 2.5 0 0 0 11.5 0h-7zM3 2.5A1.5 1.5 0 0 1 4.5 1h7A1.5 1.5 0 0 1 13 2.5v10.795a4.2 4.2 0 0 0-.885-.696A5.74 5.74 0 0 0 8 12a5.74 5.74 0 0 0-4.115 1.599 4.2 4.2 0 0 0-.885.696V2.5z'/%3E%3C/svg%3E");
}

.bi-sliders-nav-menu[b-gu3q1iqv8g] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M11.5 2a1.5 1.5 0 1 0 0 3 1.5 1.5 0 0 0 0-3zM9.05 3a2.5 2.5 0 0 1 4.9 0H16v1h-2.05a2.5 2.5 0 0 1-4.9 0H0V3h9.05zM4.5 7a1.5 1.5 0 1 0 0 3 1.5 1.5 0 0 0 0-3zM2.05 8a2.5 2.5 0 0 1 4.9 0H16v1H6.95a2.5 2.5 0 0 1-4.9 0H0V8h2.05zm9.45 4a1.5 1.5 0 1 0 0 3 1.5 1.5 0 0 0 0-3zm-2.45 1a2.5 2.5 0 0 1 4.9 0H16v1h-2.05a2.5 2.5 0 0 1-4.9 0H0v-1h9.05z'/%3E%3C/svg%3E");
}

.bi-book-nav-menu[b-gu3q1iqv8g] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' viewBox='0 0 16 16'%3E%3Cpath d='M1 2.828c.885-.37 2.154-.769 3.388-.893 1.33-.134 2.458.063 3.112.752v9.746c-.935-.53-2.12-.603-3.213-.493-1.18.12-2.37.461-3.287.811V2.828zm7.5-.141c.654-.689 1.782-.886 3.112-.752 1.234.124 2.503.523 3.388.893v9.923c-.918-.35-2.107-.692-3.287-.81-1.094-.111-2.278-.039-3.213.492V2.687zM8 1.783C7.015.936 5.587.81 4.287.94c-1.514.153-3.042.672-3.994 1.105A.5.5 0 0 0 0 2.5v11a.5.5 0 0 0 .707.455c.882-.4 2.303-.881 3.68-1.02 1.409-.142 2.59.087 3.223.877a.5.5 0 0 0 .78 0c.633-.79 1.814-1.019 3.222-.877 1.378.139 2.8.62 3.681 1.02A.5.5 0 0 0 16 13.5v-11a.5.5 0 0 0-.293-.455c-.952-.433-2.48-.952-3.994-1.105C10.413.809 8.985.936 8 1.783z'/%3E%3C/svg%3E");
}

.bi-people-nav-menu[b-gu3q1iqv8g] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' viewBox='0 0 16 16'%3E%3Cpath d='M15 14s1 0 1-1-1-4-5-4-5 3-5 4 1 1 1 1h8Zm-7.978-1A.261.261 0 0 1 7 12.996c.001-.264.167-1.03.76-1.72C8.312 10.629 9.282 10 11 10c1.717 0 2.687.63 3.24 1.276.593.69.758 1.457.76 1.72l-.008.002a.274.274 0 0 1-.014.002H7.022ZM11 7a2 2 0 1 0 0-4 2 2 0 0 0 0 4Zm3-2a3 3 0 1 1-6 0 3 3 0 0 1 6 0ZM6.936 9.28a5.88 5.88 0 0 0-1.23-.247A7.35 7.35 0 0 0 5 9c-4 0-5 3-5 4 0 .667.333 1 1 1h4.216A2.238 2.238 0 0 1 5 13c0-1.01.377-2.042 1.09-2.904.243-.294.526-.569.846-.816ZM4.92 10A5.493 5.493 0 0 0 4 13H1c0-.26.164-1.03.76-1.724.545-.636 1.492-1.256 3.16-1.275ZM1.5 5.5a3 3 0 1 1 6 0 3 3 0 0 1-6 0Zm3-2a2 2 0 1 0 0 4 2 2 0 0 0 0-4Z'/%3E%3C/svg%3E");
}

.bi-graph-up-nav-menu[b-gu3q1iqv8g] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M0 0h1v15h15v1H0V0Zm14.817 3.113a.5.5 0 0 1 .07.704l-4.5 5.5a.5.5 0 0 1-.74.037L7.06 6.767l-3.656 5.027a.5.5 0 0 1-.808-.588l4-5.5a.5.5 0 0 1 .758-.06l2.609 2.61 4.15-5.073a.5.5 0 0 1 .704-.07Z'/%3E%3C/svg%3E");
}

.bi-file-text-nav-menu[b-gu3q1iqv8g] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' viewBox='0 0 16 16'%3E%3Cpath d='M5 4a.5.5 0 0 0 0 1h6a.5.5 0 0 0 0-1H5Zm-.5 2.5A.5.5 0 0 1 5 6h6a.5.5 0 0 1 0 1H5a.5.5 0 0 1-.5-.5ZM5 8a.5.5 0 0 0 0 1h6a.5.5 0 0 0 0-1H5Zm0 2a.5.5 0 0 0 0 1h3a.5.5 0 0 0 0-1H5Z'/%3E%3Cpath d='M2 2a2 2 0 0 1 2-2h8a2 2 0 0 1 2 2v12a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V2Zm10-1H4a1 1 0 0 0-1 1v12a1 1 0 0 0 1 1h8a1 1 0 0 0 1-1V2a1 1 0 0 0-1-1Z'/%3E%3C/svg%3E");
}

.bi-book-nav-menu[b-gu3q1iqv8g] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' viewBox='0 0 16 16'%3E%3Cpath d='M1 2.828c.885-.37 2.154-.769 3.388-.893 1.33-.134 2.458.063 3.112.752v9.746c-.935-.53-2.12-.603-3.213-.493-1.18.12-2.37.461-3.287.811V2.828zm7.5-.141c.654-.689 1.782-.886 3.112-.752 1.234.124 2.503.523 3.388.893v9.923c-.918-.35-2.107-.692-3.287-.81-1.094-.111-2.278-.039-3.213.492V2.687zM8 1.783C7.015.936 5.587.81 4.287.94c-1.514.153-3.042.672-3.994 1.105A.5.5 0 0 0 0 2.5v11a.5.5 0 0 0 .707.455c.882-.4 2.303-.881 3.68-1.02 1.409-.142 2.59.087 3.223.877a.5.5 0 0 0 .78 0c.633-.79 1.814-1.019 3.222-.877 1.378.139 2.8.62 3.681 1.02A.5.5 0 0 0 16 13.5v-11a.5.5 0 0 0-.293-.455c-.952-.433-2.48-.952-3.994-1.105C10.413.809 8.985.936 8 1.783z'/%3E%3C/svg%3E");
}

.bi-gear-nav-menu[b-gu3q1iqv8g] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' viewBox='0 0 16 16'%3E%3Cpath d='M8 4.754a3.246 3.246 0 1 0 0 6.492 3.246 3.246 0 0 0 0-6.492zM5.754 8a2.246 2.246 0 1 1 4.492 0 2.246 2.246 0 0 1-4.492 0z'/%3E%3Cpath d='M9.796 1.343c-.527-1.79-3.065-1.79-3.592 0l-.094.319a.873.873 0 0 1-1.255.52l-.292-.16c-1.64-.892-3.433.902-2.54 2.541l.159.292a.873.873 0 0 1-.52 1.255l-.319.094c-1.79.527-1.79 3.065 0 3.592l.319.094a.873.873 0 0 1 .52 1.255l-.16.292c-.892 1.64.901 3.434 2.541 2.54l.292-.159a.873.873 0 0 1 1.255.52l.094.319c.527 1.79 3.065 1.79 3.592 0l.094-.319a.873.873 0 0 1 1.255-.52l.292.16c1.64.893 3.434-.902 2.54-2.541l-.159-.292a.873.873 0 0 1 .52-1.255l.319-.094c1.79-.527 1.79-3.065 0-3.592l-.319-.094a.873.873 0 0 1-.52-1.255l.16-.292c.893-1.64-.902-3.433-2.541-2.54l-.292.159a.873.873 0 0 1-1.255-.52l-.094-.319zm-2.633.283c.246-.835 1.428-.835 1.674 0l.094.319a1.873 1.873 0 0 0 2.693 1.115l.291-.16c.764-.415 1.6.42 1.184 1.185l-.159.292a1.873 1.873 0 0 0 1.116 2.692l.318.094c.835.246.835 1.428 0 1.674l-.319.094a1.873 1.873 0 0 0-1.115 2.693l.16.291c.415.764-.42 1.6-1.185 1.184l-.291-.159a1.873 1.873 0 0 0-2.693 1.116l-.094.318c-.246.835-1.428.835-1.674 0l-.094-.319a1.873 1.873 0 0 0-2.692-1.115l-.292.16c-.764.415-1.6-.42-1.184-1.185l.159-.291A1.873 1.873 0 0 0 1.945 8.93l-.319-.094c-.835-.246-.835-1.428 0-1.674l.319-.094A1.873 1.873 0 0 0 3.06 4.377l-.16-.292c-.415-.764.42-1.6 1.185-1.184l.292.159a1.873 1.873 0 0 0 2.692-1.115l.094-.319z'/%3E%3C/svg%3E");
}

.bi-inbox-nav-menu[b-gu3q1iqv8g] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' viewBox='0 0 16 16'%3E%3Cpath d='M4.98 4a.5.5 0 0 0-.39.188L1.54 8H6a.5.5 0 0 1 .5.5 1.5 1.5 0 0 0 3 0A.5.5 0 0 1 10 8h4.46l-3.05-3.812A.5.5 0 0 0 11.02 4H4.98zm-1.17-.437A1.5 1.5 0 0 1 4.98 3h6.04a1.5 1.5 0 0 1 1.17.563l3.7 4.625a.5.5 0 0 1 .106.374l-.39 3.124A1.5 1.5 0 0 1 14.117 13H1.883a1.5 1.5 0 0 1-1.489-1.314l-.39-3.124a.5.5 0 0 1 .106-.374l3.7-4.625z'/%3E%3C/svg%3E");
}

.bi-question-circle-nav-menu[b-gu3q1iqv8g] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' viewBox='0 0 16 16'%3E%3Cpath d='M8 15A7 7 0 1 1 8 1a7 7 0 0 1 0 14zm0 1A8 8 0 1 0 8 0a8 8 0 0 0 0 16z'/%3E%3Cpath d='M5.255 5.786a.237.237 0 0 0 .241.247h.825c.138 0 .248-.113.266-.25.09-.656.54-1.134 1.342-1.134.686 0 1.314.343 1.314 1.168 0 .635-.374.927-.965 1.371-.673.489-1.206 1.06-1.168 1.987l.003.217a.25.25 0 0 0 .25.246h.811a.25.25 0 0 0 .25-.25v-.105c0-.718.273-.927 1.01-1.486.609-.463 1.244-.977 1.244-2.056 0-1.511-1.276-2.241-2.673-2.241-1.267 0-2.655.59-2.75 2.286zm1.557 5.763c0 .533.425.927 1.01.927.609 0 1.028-.394 1.028-.927 0-.552-.42-.94-1.029-.94-.584 0-1.009.388-1.009.94z'/%3E%3C/svg%3E");
}

/* Help search box, tucked under the Help link. Icon sits inside the field. */
.nav-help-search[b-gu3q1iqv8g] {
    margin-top: 2px;
}

.nav-help-search form[b-gu3q1iqv8g] {
    display: flex;
    align-items: center;
    gap: 6px;
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.15);
    border-radius: 6px;
    padding: 4px 8px;
}

.nav-help-search form:focus-within[b-gu3q1iqv8g] {
    border-color: rgba(255, 255, 255, 0.45);
    background: rgba(255, 255, 255, 0.12);
}

.nav-help-search-btn[b-gu3q1iqv8g] {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    padding: 0;
    background: transparent;
    border: none;
    cursor: pointer;
}

.nav-help-search .bi-search-nav-menu[b-gu3q1iqv8g] {
    width: 14px;
    height: 14px;
    flex: 0 0 14px;
    margin: 0;
    top: 0;
    opacity: 0.7;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' viewBox='0 0 16 16'%3E%3Cpath d='M11.742 10.344a6.5 6.5 0 1 0-1.397 1.398h-.001q.044.06.098.115l3.85 3.85a1 1 0 0 0 1.415-1.414l-3.85-3.85a1 1 0 0 0-.115-.1zM12 6.5a5.5 5.5 0 1 1-11 0 5.5 5.5 0 0 1 11 0'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center;
}

.nav-help-search input[b-gu3q1iqv8g] {
    flex: 1 1 auto;
    min-width: 0;
    background: transparent;
    border: none;
    outline: none;
    color: #fff;
    font-size: 0.85rem;
    padding: 0;
}

.nav-help-search input[b-gu3q1iqv8g]::placeholder {
    color: rgba(255, 255, 255, 0.55);
}

/* Footer block: pushed to the bottom of the (flex-column) sidebar on wide screens,
   set off by a subtle divider — the low-emphasis mirror of .nav-top. */
/* Help + search pushed to the very bottom of the sidebar; the footer (Contact/Feedback)
   then sits directly under them, its divider line separating the two. */
.nav-util[b-gu3q1iqv8g] {
    margin-top: auto;
}

.nav-foot[b-gu3q1iqv8g] {
    padding: 0.6rem 1rem 0.8rem;
    border-top: 1px solid rgba(255, 255, 255, 0.12);
}

.nav-foot-link[b-gu3q1iqv8g] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 4px 0;
    color: rgba(255, 255, 255, 0.7);
    text-decoration: none;
    font-size: 0.82rem;
}

.nav-foot-link:hover[b-gu3q1iqv8g] {
    color: #fff;
}

.nav-foot-link .bi[b-gu3q1iqv8g] {
    width: 14px;
    height: 14px;
    margin: 0;
    top: 0;
    opacity: 0.75;
}

.nav-foot-version[b-gu3q1iqv8g] {
    margin-top: 6px;
    font-size: 0.68rem;
    letter-spacing: 0.04em;
    color: rgba(255, 255, 255, 0.4);
}

.bi-envelope-nav-menu[b-gu3q1iqv8g] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' viewBox='0 0 16 16'%3E%3Cpath d='M0 4a2 2 0 0 1 2-2h12a2 2 0 0 1 2 2v8a2 2 0 0 1-2 2H2a2 2 0 0 1-2-2zm2-1a1 1 0 0 0-1 1v.217l7 4.2 7-4.2V4a1 1 0 0 0-1-1zm13 2.383-4.708 2.825L15 11.105zm-.034 6.876-5.64-3.471L8 9.583l-1.326-.795-5.64 3.47A1 1 0 0 0 2 13h12a1 1 0 0 0 .966-.741M1 11.105l4.708-2.897L1 5.383z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center;
}

.bi-chat-nav-menu[b-gu3q1iqv8g] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' viewBox='0 0 16 16'%3E%3Cpath d='M2.678 11.894a1 1 0 0 1 .287.801 11 11 0 0 1-.398 2c1.395-.323 2.247-.697 2.634-.893a1 1 0 0 1 .71-.074A8 8 0 0 0 8 14c3.996 0 7-2.807 7-6s-3.004-6-7-6-7 2.808-7 6c0 1.468.617 2.83 1.678 3.894m-.493 3.905a22 22 0 0 1-.713.129c-.2.032-.352-.176-.273-.362a10 10 0 0 0 .244-.637l.003-.01c.248-.72.45-1.548.524-2.319C.743 11.37 0 9.76 0 8c0-3.866 3.582-7 8-7s8 3.134 8 7-3.582 7-8 7a9 9 0 0 1-2.347-.306c-.52.263-1.639.742-3.468 1.105'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center;
}

/* App-wide language switch, pinned under the nav links. */
/* Account + language pinned at the top of the sidebar, set off from the nav below
   by extra space + a subtle divider. */
.nav-top[b-gu3q1iqv8g] {
    margin-bottom: 1.5rem;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.12);
}

/* Internal divider inside nav-top: under EN/FR + Hide menu, above Sign out + Field mode. */
.nav-top-sep[b-gu3q1iqv8g] {
    border-top: 1px solid rgba(255, 255, 255, 0.14);
    margin: 0.55rem 1rem 0.15rem;
}

.nav-lang[b-gu3q1iqv8g] {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 0.4rem 1rem 0.3rem;
}

.nav-lang-label[b-gu3q1iqv8g] {
    flex: 0 0 auto;
    font-size: 0.62rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: rgba(255, 255, 255, 0.6);
    white-space: nowrap;
}

.nav-lang-btn[b-gu3q1iqv8g] {
    flex: 1;
    text-align: center;
    padding: 4px 0;
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: .05em;
    color: #cfd4e0;
    text-decoration: none;
    border: 1px solid rgba(255, 255, 255, 0.22);
    border-radius: 5px;
    background: rgba(255, 255, 255, 0.05);
}

.nav-lang-btn:hover[b-gu3q1iqv8g] {
    background: rgba(255, 255, 255, 0.14);
    color: #fff;
}

.nav-lang-btn.active[b-gu3q1iqv8g] {
    background: #fff;
    color: #2c3e6b;
    border-color: #fff;
}

/* Field-mode toggle row — sits just under the language switch in the nav-top block. */
.nav-field[b-gu3q1iqv8g] {
    padding: 0.1rem 1rem 0.35rem;
}

/* Desktop sidebar collapse toggle row — sits just under the Field-mode row. */
.nav-collapse[b-gu3q1iqv8g] {
    padding: 0 1rem 0.4rem;
}

/* Signed-in user block, now at the top of the sidebar (above the language switch). */
.nav-user[b-gu3q1iqv8g] {
    padding: 0.75rem 1rem 0.4rem;
    color: #d7d7d7;
    font-size: 0.85rem;
}

.nav-user-name[b-gu3q1iqv8g] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    flex-wrap: wrap;
    margin-bottom: 0.5rem;
}

.nav-user-name .bi-person-circle[b-gu3q1iqv8g] {
    display: inline-block;
    width: 1rem;
    height: 1rem;
    background-size: cover;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%23d7d7d7' viewBox='0 0 16 16'%3E%3Cpath d='M11 6a3 3 0 1 1-6 0 3 3 0 0 1 6 0z'/%3E%3Cpath fill-rule='evenodd' d='M0 8a8 8 0 1 1 16 0A8 8 0 0 1 0 8zm8-7a7 7 0 0 0-5.468 11.37C3.242 11.226 4.805 10 8 10s4.757 1.225 5.468 2.37A7 7 0 0 0 8 1z'/%3E%3C/svg%3E");
}

.nav-user-role[b-gu3q1iqv8g] {
    font-size: 0.65rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .05em;
    background: #c2410c;
    color: #fff;
    border-radius: 4px;
    padding: 1px 6px;
}

.nav-logout-btn[b-gu3q1iqv8g] {
    width: 100%;
    padding: 0.4rem;
    border: 1px solid rgba(255,255,255,0.25);
    border-radius: 5px;
    background: rgba(255,255,255,0.06);
    color: #eee;
    font-size: 0.8rem;
    cursor: pointer;
}

.nav-logout-btn:hover[b-gu3q1iqv8g] {
    background: rgba(255,255,255,0.15);
}

.nav-item[b-gu3q1iqv8g] {
    font-size: 0.9rem;
    padding-bottom: 0.85rem;
}

    .nav-item:first-of-type[b-gu3q1iqv8g] {
        padding-top: 1.4rem;
    }

    .nav-item:last-of-type[b-gu3q1iqv8g] {
        padding-bottom: 1rem;
    }

    .nav-item[b-gu3q1iqv8g]  .nav-link {
        color: #d7d7d7;
        background: none;
        border: none;
        border-radius: 4px;
        height: 3rem;
        display: flex;
        align-items: center;
        line-height: 3rem;
        width: 100%;
    }

.nav-item[b-gu3q1iqv8g]  a.active {
    background-color: rgba(255,255,255,0.37);
    color: white;
}

.nav-item[b-gu3q1iqv8g]  .nav-link:hover {
    background-color: rgba(255,255,255,0.1);
    color: white;
}

/* Destinations (Home / Library / Admin) read as matching "cards" — a faint framed
   button, brighter when it's the active page. Utility links (Help/Search) stay plain. */
.nav-dest[b-gu3q1iqv8g]  .nav-link {
    background: rgba(255, 255, 255, 0.07);
    border: 1px solid rgba(255, 255, 255, 0.10);
}

.nav-dest[b-gu3q1iqv8g]  .nav-link:hover {
    background: rgba(255, 255, 255, 0.15);
}

.nav-scrollable[b-gu3q1iqv8g] {
    display: none;
}

.navbar-toggler:checked ~ .nav-scrollable[b-gu3q1iqv8g] {
    display: block;
}

@media (min-width: 641px) {
    .navbar-toggler[b-gu3q1iqv8g] {
        display: none;
    }

    .nav-scrollable[b-gu3q1iqv8g] {
        /* Never collapse the sidebar for wide screens */
        display: flex;
        flex-direction: column;

        /* Allow sidebar to scroll for tall menus */
        height: calc(100vh - 3.5rem);
        overflow-y: auto;
    }
}

/* ── Dynamic page-scoped actions ─────────────────────────────────────────
   Indented under the destination they belong to. Left = "go somewhere",
   indented + lighter = "do something on this page", so a click here never
   feels like it will navigate the sidebar away. */
.nav-actions[b-gu3q1iqv8g] {
    /* Generous top+bottom gaps set the current-inspection cluster clearly apart from
       Home (above) and Library (below) — ~3x the old spacing. */
    margin: 1.1rem 0 1.1rem 0;
    padding: 0.35rem 0.75rem 0.4rem 1.6rem;   /* extra left inset = the indent */
    display: flex;
    flex-direction: column;
    gap: 2px;
    border-left: 2px solid rgba(255,255,255,0.14);
    margin-left: 1.25rem;
}

.nav-actions-label[b-gu3q1iqv8g] {
    font-size: 0.66rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: rgba(255,255,255,0.45);
    padding: 0 0 0.15rem 0.55rem;
}

/* Inspection-cluster header: a small kicker over the report NUMBER (the title), with a
   divider under it — so everything below reads as "about this inspection". */
.nav-insp-head[b-gu3q1iqv8g] {
    padding: 0 0 0.35rem 0.55rem;
    margin-bottom: 0.4rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.20);
}

.nav-insp-kicker[b-gu3q1iqv8g] {
    font-size: 0.58rem;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    color: rgba(255, 255, 255, 0.45);
    line-height: 1.5;
}

.nav-insp-title[b-gu3q1iqv8g] {
    font-family: var(--wm-serif);
    font-size: 1.05rem;
    font-weight: 700;
    color: #fff;
    line-height: 1.2;
}

.nav-actions .nav-action[b-gu3q1iqv8g] {
    display: block;
    color: rgba(255,255,255,0.82);
    text-decoration: none;
    font-size: 0.86rem;
    line-height: 1.9;
    padding: 0 0.55rem;
    border-radius: 4px;
    text-align: center;                        /* center-aligned per the agreed sketch */
}

.nav-actions .nav-action:hover[b-gu3q1iqv8g] {
    background-color: rgba(255,255,255,0.1);
    color: white;
}

.nav-actions .nav-action.primary[b-gu3q1iqv8g] {
    color: #fff;
    background-color: rgba(255,255,255,0.12);
    font-weight: 600;
}

.nav-actions .nav-action.primary:hover[b-gu3q1iqv8g] {
    background-color: rgba(255,255,255,0.22);
}

/* Print disclosure inside the rail — mirrors the page print menu, relocated. */
.nav-print[b-gu3q1iqv8g] {
    text-align: center;
}

.nav-print > summary[b-gu3q1iqv8g] {
    list-style: none;
    cursor: pointer;
    color: rgba(255,255,255,0.82);
    font-size: 0.86rem;
    line-height: 1.9;
    padding: 0 0.55rem;
    border-radius: 4px;
}

.nav-print > summary[b-gu3q1iqv8g]::-webkit-details-marker { display: none; }
.nav-print > summary:hover[b-gu3q1iqv8g] { background-color: rgba(255,255,255,0.1); color: white; }

.nav-print-items[b-gu3q1iqv8g] {
    display: flex;
    flex-direction: column;
    gap: 1px;
    padding: 0.15rem 0 0.15rem 0.4rem;
}

.nav-print-items a[b-gu3q1iqv8g] {
    display: block;
    color: rgba(255,255,255,0.7);
    text-decoration: none;
    font-size: 0.8rem;
    line-height: 1.75;
    padding: 0 0.5rem;
    border-radius: 4px;
    text-align: left;
}

.nav-print-items a:hover[b-gu3q1iqv8g] { background-color: rgba(255,255,255,0.1); color: white; }

/* Nameplate-helpers launcher, restyled to sit as a nav item (its native styling
   targets a light toolbar). Left-aligned like the destinations above it. */
.nav-tool-item[b-gu3q1iqv8g]  .np-launch {
    background: transparent;
    border: none;
    color: #d7d7d7;
    width: 100%;
    text-align: left;
    height: 3rem;
    line-height: 3rem;
    padding: 0 1rem;
    border-radius: 4px;
    font-size: 1rem;
    cursor: pointer;
}

.nav-tool-item[b-gu3q1iqv8g]  .np-launch:hover {
    background-color: rgba(255,255,255,0.1);
    color: white;
}
/* /Components/Layout/ReconnectModal.razor.rz.scp.css */
.components-reconnect-first-attempt-visible[b-7a4d22tzl8],
.components-reconnect-repeated-attempt-visible[b-7a4d22tzl8],
.components-reconnect-failed-visible[b-7a4d22tzl8],
.components-pause-visible[b-7a4d22tzl8],
.components-resume-failed-visible[b-7a4d22tzl8],
.components-rejoining-animation[b-7a4d22tzl8] {
    display: none;
}

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


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

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

}

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

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

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

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

    100% {
        opacity: 1;
    }
}

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

    100% {
        opacity: 0;
    }
}

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

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

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

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

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

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

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

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

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

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

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

    100% {
        top: 0px;
        left: 0px;
        width: 80px;
        height: 80px;
        opacity: 0;
    }
}
/* /Components/NameplateHelpers.razor.rz.scp.css */
.np-launch[b-al2c2vsd56] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 6px 12px;
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius-sm);
    background: var(--wm-surface-2);
    color: var(--wm-navy);
    font-size: 0.85rem;
    font-weight: 600;
    cursor: pointer;
    white-space: nowrap;
}

.np-launch:hover[b-al2c2vsd56] { background: var(--wm-inset); border-color: var(--wm-navy); }

.np-overlay[b-al2c2vsd56] {
    position: fixed;
    inset: 0;
    z-index: 1000;
    background: rgba(20, 26, 43, .35);
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: 8vh 16px 16px;
}

.np-modal[b-al2c2vsd56] {
    background: var(--wm-surface);
    border-radius: var(--wm-radius);
    box-shadow: var(--wm-shadow);
    width: 640px;
    max-width: 96%;
    max-height: 84vh;
    overflow-y: auto;
}

.np-modal-head[b-al2c2vsd56] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 16px;
    border-bottom: 1px solid var(--wm-line);
}

.np-modal-head h3[b-al2c2vsd56] { margin: 0; font-size: 1.05rem; }

.np-close[b-al2c2vsd56] {
    background: none;
    border: none;
    font-size: 1.4rem;
    line-height: 1;
    cursor: pointer;
    color: var(--wm-ink-soft);
    padding: 0 4px;
}

.np-close:hover[b-al2c2vsd56] { color: var(--wm-ink); }

.np-body[b-al2c2vsd56] {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    padding: 16px;
}

.np-tool[b-al2c2vsd56] { flex: 1 1 260px; min-width: 0; }

.np-tool h4[b-al2c2vsd56] { margin: 0 0 6px; font-size: 0.95rem; color: var(--wm-ink); }

.np-note[b-al2c2vsd56] {
    font-size: 0.78rem;
    color: var(--wm-ink-soft);
    margin: 0 0 8px;
    line-height: 1.35;
}

.np-row[b-al2c2vsd56] { display: flex; gap: 10px; align-items: flex-end; }

.np-row label[b-al2c2vsd56] {
    display: flex;
    flex-direction: column;
    gap: 3px;
    font-size: 0.8rem;
    color: var(--wm-ink-soft);
    flex: 1 1 auto;
}

.np-row input[b-al2c2vsd56],
.np-row select[b-al2c2vsd56] {
    padding: 7px 9px;
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius-sm);
    font-size: 0.95rem;
}

.np-out[b-al2c2vsd56] { margin-top: 10px; font-size: 1.05rem; }
.np-out .np-sub[b-al2c2vsd56] { color: var(--wm-ink-soft); font-size: 0.85rem; margin-left: 6px; }

.np-assess[b-al2c2vsd56] { display: block; margin-top: 4px; font-size: 0.85rem; font-weight: 600; }

/* Green within life, amber approaching, orange beyond - the app's status hues. */
.np-ok[b-al2c2vsd56]   { color: #1f7a3d; }
.np-warn[b-al2c2vsd56] { color: #b8420c; }
.np-over[b-al2c2vsd56] { color: #c0392b; }

/* ── Data-plate identify tool (age + capacity) ── */
.np-body.np-stack[b-al2c2vsd56] { flex-direction: column; gap: 14px; }
.np-tool-full[b-al2c2vsd56] { flex: 1 1 100%; }

.np-idblock[b-al2c2vsd56] {
    margin-top: 10px;
    padding-top: 10px;
    border-top: 1px dashed var(--wm-line);
}

.np-row-tight[b-al2c2vsd56] { margin-top: 8px; align-items: center; }
.np-row-tight label[b-al2c2vsd56] { flex: 0 0 150px; }
.np-verdict-cell[b-al2c2vsd56] { flex: 1 1 auto; }

.np-rule[b-al2c2vsd56] {
    font-size: 0.78rem;
    color: var(--wm-ink-soft);
    margin-top: 3px;
    line-height: 1.35;
}
.np-verify[b-al2c2vsd56] { color: #b8420c; font-weight: 600; }
.np-manual-hint[b-al2c2vsd56] { font-style: italic; }

.np-secondary[b-al2c2vsd56] {
    border-top: 1px solid var(--wm-line);
    padding-top: 14px;
}

/* Unverified best-effort decode: stronger warning than the routine "verify". */
.np-unverified[b-al2c2vsd56] {
    color: #fff;
    background: #c0392b;
    font-weight: 700;
    padding: 0 6px;
    border-radius: 4px;
    font-size: 0.72rem;
}

/* "Add to report" action (shown only when opened from a system checklist) */
.np-addrow[b-al2c2vsd56] { display: flex; align-items: center; gap: 10px; }
.np-add-btn[b-al2c2vsd56] {
    background: var(--wm-navy);
    color: #fff;
    border: none;
    border-radius: var(--wm-radius-sm);
    padding: 8px 14px;
    font-size: 0.9rem;
    font-weight: 600;
    cursor: pointer;
}
.np-add-btn:disabled[b-al2c2vsd56] { opacity: 0.5; cursor: not-allowed; }
.np-add-btn:not(:disabled):hover[b-al2c2vsd56] { filter: brightness(1.1); }

/* Pin the "Fill nameplate fields" row to the bottom of the scrolling modal so it's always
   reachable no matter how tall the tools above get. */
.np-applyrow[b-al2c2vsd56] {
    position: sticky;
    bottom: 0;
    background: var(--wm-surface);
    margin: 4px -18px -14px;
    padding: 12px 18px;
    border-top: 1px solid var(--wm-line);
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}
.np-added[b-al2c2vsd56] { color: #1f7a3d; font-weight: 600; font-size: 0.85rem; }
.np-nomatch[b-al2c2vsd56] { color: #b8420c; font-size: 0.8rem; font-style: italic; }

/* Unit picker (shown when a subsystem holds several units of the same equipment type) */
.np-picker[b-al2c2vsd56] { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.np-picker-title[b-al2c2vsd56] { font-size: 0.85rem; font-weight: 600; color: var(--wm-ink); width: 100%; }
.np-unit-btn[b-al2c2vsd56] {
    background: var(--wm-surface-2);
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius-sm);
    padding: 6px 12px;
    cursor: pointer;
    font-size: 0.85rem;
    color: var(--wm-navy);
}
.np-unit-btn:not(:disabled):hover[b-al2c2vsd56] { border-color: var(--wm-navy); background: var(--wm-inset); }
.np-unit-btn:disabled[b-al2c2vsd56] { opacity: 0.5; cursor: not-allowed; }
.np-unit-state[b-al2c2vsd56] { color: var(--wm-ink-soft); font-size: 0.78rem; }
.np-unit-add[b-al2c2vsd56] { border-style: dashed; font-weight: 600; }
.np-unit-cancel[b-al2c2vsd56] {
    background: none;
    border: none;
    color: var(--wm-ink-soft);
    cursor: pointer;
    font-size: 0.85rem;
    text-decoration: underline;
}

.np-mismatch[b-al2c2vsd56] { color: #b8420c; font-weight: 600; font-size: 0.82rem; margin-top: 4px; }
/* /Components/NameplateLauncher.razor.rz.scp.css */
.np-launch[b-mteu0su247] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 6px 12px;
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius-sm);
    background: var(--wm-surface-2);
    color: var(--wm-navy);
    font-size: 0.85rem;
    font-weight: 600;
    cursor: pointer;
    white-space: nowrap;
}

.np-launch:hover[b-mteu0su247] { background: var(--wm-inset); border-color: var(--wm-navy); }
/* /Components/NavCollapseToggle.razor.rz.scp.css */
/* Sidebar collapse toggle in the dark nav — neutral (it's a layout control, not a mode),
   distinct from the green Field-mode pill. Full-width to match the language / field rows. */
.navcollapse-toggle[b-1uq1p296xo] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 100%;
    padding: 6px 10px;
    font-size: 0.76rem;
    font-weight: 600;
    letter-spacing: .02em;
    color: #cfd4e0;
    text-decoration: none;
    border: 1px solid rgba(255, 255, 255, 0.22);
    border-radius: 5px;
    background: rgba(255, 255, 255, 0.05);
    white-space: nowrap;
    box-sizing: border-box;
}

.navcollapse-toggle:hover[b-1uq1p296xo] { background: rgba(255, 255, 255, 0.14); color: #fff; }

.navcollapse-glyph[b-1uq1p296xo] { flex: 0 0 auto; opacity: 0.9; }

/* Comfortable tap target on touch devices. */
@media (pointer: coarse) {
    .navcollapse-toggle[b-1uq1p296xo] { padding: 9px 12px; font-size: 0.82rem; }
}
/* /Components/Pages/AdminUsers.razor.rz.scp.css */
.muted[b-ozhrr4r1ex] {
    color: var(--wm-ink-soft);
    font-size: 14px;
    max-width: 720px;
}

.admin-grid[b-ozhrr4r1ex] {
    display: grid;
    grid-template-columns: 320px 1fr;
    gap: 24px;
    align-items: start;
    margin-top: 12px;
}

@media (max-width: 900px) {
    .admin-grid[b-ozhrr4r1ex] { grid-template-columns: 1fr; }
}

.admin-panel[b-ozhrr4r1ex] {
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius);
    padding: 18px 20px;
    background: var(--wm-surface);
    box-shadow: var(--wm-shadow);
}

.admin-panel h2[b-ozhrr4r1ex] {
    margin: 0 0 14px;
    font-size: 17px;
    color: #2c3e6b;
}

.field[b-ozhrr4r1ex] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    margin-bottom: 12px;
}

.field label[b-ozhrr4r1ex] {
    font-family: var(--wm-mono);
    text-transform: uppercase;
    letter-spacing: .08em;
    font-size: 11px;
    font-weight: 600;
    color: var(--wm-ink-faint);
}

.field input[b-ozhrr4r1ex] {
    padding: 8px 10px;
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius-sm);
    font-size: 14px;
}

.field input:focus[b-ozhrr4r1ex] {
    outline: none;
    border-color: var(--wm-navy);
    box-shadow: 0 0 0 3px rgba(44, 62, 107, .12);
}

.btn-primary[b-ozhrr4r1ex] {
    padding: 9px 16px;
    border: none;
    border-radius: var(--wm-radius-sm);
    background: #2c3e6b;
    color: #fff;
    font-weight: 700;
    cursor: pointer;
}

.btn-primary.sm[b-ozhrr4r1ex] { padding: 5px 12px; font-size: 13px; }
.btn-primary:hover[b-ozhrr4r1ex] { background: #24345c; }
.btn-primary:disabled[b-ozhrr4r1ex] { opacity: .6; cursor: default; }

.btn-link[b-ozhrr4r1ex] {
    border: none;
    background: none;
    color: #2c3e6b;
    cursor: pointer;
    padding: 2px 6px;
    font-size: 13px;
    text-decoration: underline;
}

.ok-msg[b-ozhrr4r1ex] { margin-top: 10px; color: #1a7f45; font-size: 13px; }
.err-msg[b-ozhrr4r1ex] { margin-top: 10px; color: #b3261e; font-size: 13px; }

.users-table[b-ozhrr4r1ex] {
    width: 100%;
    border-collapse: collapse;
    font-size: 14px;
}

.users-table th[b-ozhrr4r1ex], .users-table td[b-ozhrr4r1ex] {
    text-align: left;
    padding: 8px 10px;
    border-bottom: 1px solid var(--wm-line-soft);
    vertical-align: top;
}

.users-table th[b-ozhrr4r1ex] {
    background: var(--wm-surface-2);
    font-family: var(--wm-mono);
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: .08em;
    color: var(--wm-ink-faint);
}

.users-table tbody tr:nth-child(even):not(.reset-row)[b-ozhrr4r1ex] { background: var(--wm-surface-2); }
.users-table tbody tr:not(.reset-row):hover[b-ozhrr4r1ex] { background: var(--wm-inset); }

.users-table .sub[b-ozhrr4r1ex] { color: var(--wm-ink-soft); font-size: 12px; }
.row-inactive[b-ozhrr4r1ex] { opacity: .55; }
.row-actions[b-ozhrr4r1ex] { white-space: nowrap; }

.row-actions .btn-link[b-ozhrr4r1ex] {
    text-decoration: none;
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius-sm);
    padding: 3px 10px;
    margin-right: 4px;
    font-size: 12px;
    line-height: 1.6;
    background: var(--wm-surface);
    color: #2c3e6b;
}

.row-actions .btn-link:hover[b-ozhrr4r1ex] { background: var(--wm-inset); border-color: var(--wm-line); }

/* Destructive "Disable" gets a muted amber tone, distinct from the neutral navy actions. */
.row-actions .btn-link.btn-danger[b-ozhrr4r1ex] {
    color: #9a6a12;
    border-color: #e3c48a;
    background: #fdf7ec;
}

.row-actions .btn-link.btn-danger:hover[b-ozhrr4r1ex] { background: #f9edd6; border-color: #d8b26a; }
.reset-row td[b-ozhrr4r1ex] { background: var(--wm-surface-2); }
.reset-row input[b-ozhrr4r1ex] { padding: 5px 8px; border: 1px solid var(--wm-line); border-radius: var(--wm-radius-sm); margin: 0 6px; }
/* /Components/Pages/Booking.razor.rz.scp.css */
.portal[b-4jr249w2c9] {
    min-height: 100vh;
    background: #eef1f6;
    padding: 24px 16px 48px;
    display: flex;
    justify-content: center;
    font-family: system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
    color: #1f2937;
}

.portal-loading[b-4jr249w2c9] {
    color: #6b7280;
    margin-top: 40px;
}

.portal-card[b-4jr249w2c9] {
    width: 100%;
    max-width: 640px;
    background: #fff;
    border: 1px solid #dfe3ea;
    border-radius: 14px;
    box-shadow: 0 2px 10px rgba(20, 30, 60, .06);
    padding: 20px 22px 22px;
}

.portal-head[b-4jr249w2c9] {
    border-bottom: 1px solid #eceff4;
    padding-bottom: 12px;
    margin-bottom: 2px;
}

.portal-company[b-4jr249w2c9] {
    font-size: 13px;
    letter-spacing: .04em;
    text-transform: uppercase;
    color: #2c3e6b;
    font-weight: 700;
    margin-bottom: 6px;
}

.portal-card h1[b-4jr249w2c9] {
    font-size: 22px;
    margin: 0 0 6px;
    color: #1b2a4a;
}

.portal-sub[b-4jr249w2c9] {
    color: #4b5563;
    margin: 0;
    font-size: 15px;
}

.portal-section[b-4jr249w2c9] {
    margin-top: 15px;
}

.portal-section h2[b-4jr249w2c9] {
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: .06em;
    color: #6b7280;
    margin: 0 0 8px;
}

.portal-grid[b-4jr249w2c9] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 9px 11px;
}

.portal-grid > label[b-4jr249w2c9] { grid-column: span 1; }
.portal-grid .span2[b-4jr249w2c9] { grid-column: span 2; }
.portal-grid .span4[b-4jr249w2c9] { grid-column: 1 / -1; }

.portal-grid label[b-4jr249w2c9] {
    display: flex;
    flex-direction: column;
    font-size: 12px;
    font-weight: 600;
    color: #4b5563;
    gap: 4px;
}

.portal-grid input[b-4jr249w2c9] {
    padding: 9px 10px;
    border: 1px solid #cfd6e0;
    border-radius: 7px;
    font-size: 15px;
    font-weight: 400;
    color: #1f2937;
}

.portal-grid input:focus[b-4jr249w2c9] {
    outline: none;
    border-color: #2c3e6b;
    box-shadow: 0 0 0 3px rgba(44, 62, 107, .12);
}

.portal-seg[b-4jr249w2c9] {
    display: flex;
    gap: 8px;
}

.portal-seg-btn[b-4jr249w2c9] {
    flex: 1;
    padding: 11px 10px;
    border: 1px solid #cfd6e0;
    border-radius: 9px;
    background: #fff;
    color: #4b5563;
    font-size: 13.5px;
    font-weight: 600;
    line-height: 1.25;
    cursor: pointer;
}

.portal-seg-btn.on[b-4jr249w2c9] {
    border-color: #2c3e6b;
    background: #2c3e6b;
    color: #fff;
}

.portal-hp[b-4jr249w2c9] {
    position: absolute;
    left: -9999px;
    width: 1px;
    height: 1px;
    opacity: 0;
}

.portal-send[b-4jr249w2c9] {
    margin-top: 20px;
    width: 100%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    background: #2c3e6b;
    color: #fff;
    border: none;
    border-radius: 10px;
    padding: 13px 22px;
    font-size: 15.5px;
    font-weight: 600;
    cursor: pointer;
}

.portal-send:hover[b-4jr249w2c9] { filter: brightness(1.08); }
.portal-send:disabled[b-4jr249w2c9] { opacity: .6; cursor: default; }
.portal-send-svg[b-4jr249w2c9] { flex: none; }

.portal-btn-secondary[b-4jr249w2c9] {
    background: #fff;
    color: #2c3e6b;
    border: 1px solid #cfd6e0;
    border-radius: 8px;
    padding: 10px 18px;
    font-size: 14px;
    cursor: pointer;
    margin-top: 12px;
}

.portal-privacy[b-4jr249w2c9] {
    color: #9099a6;
    font-size: 12px;
    margin: 14px 0 0;
    text-align: center;
}

.portal-done h1[b-4jr249w2c9], .portal-invalid h1[b-4jr249w2c9] { color: #1b2a4a; }
.portal-done p[b-4jr249w2c9], .portal-invalid p[b-4jr249w2c9] { color: #4b5563; font-size: 15px; }

@media (max-width: 560px) {
    .portal[b-4jr249w2c9] { padding: 12px 10px 32px; }
    .portal-card[b-4jr249w2c9] { padding: 16px 15px 18px; }
    .portal-grid[b-4jr249w2c9] { grid-template-columns: repeat(2, 1fr); }
    .portal-grid .span2[b-4jr249w2c9], .portal-grid .span4[b-4jr249w2c9] { grid-column: 1 / -1; }
}
/* /Components/Pages/Contact.razor.rz.scp.css */
.subtitle[b-2ptafsvcdu] {
    color: var(--wm-ink-soft);
    max-width: 760px;
}

.contact-grid[b-2ptafsvcdu] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 12px;
    max-width: 900px;
    margin-top: 18px;
    align-items: start;
}

.contact-card[b-2ptafsvcdu] {
    padding: 16px 18px;
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius);
    background: var(--wm-surface);
    box-shadow: var(--wm-shadow);
}

.contact-label[b-2ptafsvcdu] {
    font-family: var(--wm-mono);
    text-transform: uppercase;
    letter-spacing: .08em;
    font-size: 11px;
    color: var(--wm-ink-faint);
    margin-bottom: 10px;
}

.contact-line[b-2ptafsvcdu] {
    display: block;
    color: var(--wm-navy);
    font-weight: 600;
    text-decoration: none;
    margin: 4px 0;
}

.contact-line:hover[b-2ptafsvcdu] {
    text-decoration: underline;
}

.contact-note[b-2ptafsvcdu] {
    color: var(--wm-ink-soft);
    font-size: 88%;
    margin: 10px 0 0;
}

.contact-field[b-2ptafsvcdu] {
    display: block;
    margin-bottom: 12px;
}

.contact-field > span[b-2ptafsvcdu] {
    display: block;
    font-size: 12px;
    color: var(--wm-ink-soft);
    margin-bottom: 4px;
}

.contact-field select[b-2ptafsvcdu],
.contact-field textarea[b-2ptafsvcdu],
.contact-field input[b-2ptafsvcdu] {
    width: 100%;
    padding: 8px 10px;
    border: 1px solid var(--wm-line);
    border-radius: 6px;
    background: var(--wm-surface);
    color: var(--wm-ink);
    font: inherit;
}

.contact-field textarea[b-2ptafsvcdu] {
    resize: vertical;
}

.contact-submit[b-2ptafsvcdu] {
    padding: 8px 18px;
    border: none;
    border-radius: 6px;
    background: var(--wm-navy);
    color: #fff;
    font-weight: 600;
    cursor: pointer;
}

.contact-submit:hover[b-2ptafsvcdu] {
    filter: brightness(1.08);
}

.contact-ok[b-2ptafsvcdu] {
    padding: 10px 14px;
    border-radius: 6px;
    background: #e7f5ec;
    border: 1px solid #b7dfc6;
    color: #1c6b3a;
}

.contact-fail[b-2ptafsvcdu] {
    padding: 10px 14px;
    border-radius: 6px;
    background: #fdecea;
    border: 1px solid #f5c2bd;
    color: #8a2a1e;
    margin-bottom: 12px;
}

.contact-fail a[b-2ptafsvcdu] {
    color: inherit;
    font-weight: 600;
}

.validation-message[b-2ptafsvcdu] {
    display: block;
    color: #c0392b;
    font-size: 85%;
    margin-top: 3px;
}
/* /Components/Pages/Contacts.razor.rz.scp.css */
.subtitle[b-ebe8kwuyji] {
    color: var(--wm-ink-soft);
    max-width: 720px;
}

/* ── Tabs ──────────────────────────────────────────────────────────── */
.tab-row[b-ebe8kwuyji] {
    display: flex;
    gap: 4px;
    margin: 18px 0 14px;
    border-bottom: 1px solid var(--wm-line);
    max-width: 1000px;
}

.tab[b-ebe8kwuyji] {
    background: none;
    border: none;
    border-bottom: 2px solid transparent;
    padding: 8px 14px;
    cursor: pointer;
    font-size: 95%;
    color: var(--wm-ink-soft);
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.tab:hover[b-ebe8kwuyji] {
    color: var(--wm-navy);
}

.tab.active[b-ebe8kwuyji] {
    color: var(--wm-navy);
    border-bottom-color: var(--wm-navy);
    font-weight: 600;
}

.tab-count[b-ebe8kwuyji] {
    font-family: var(--wm-mono);
    font-size: 11px;
    background: var(--wm-surface-2);
    color: var(--wm-ink-faint);
    border-radius: 10px;
    padding: 1px 7px;
}

/* ── Toolbar ───────────────────────────────────────────────────────── */
.toolbar[b-ebe8kwuyji] {
    display: flex;
    gap: 10px;
    align-items: center;
    margin-bottom: 14px;
    max-width: 1000px;
    flex-wrap: wrap;
}

.search[b-ebe8kwuyji] {
    flex: 1;
    min-width: 200px;
    padding: 7px 10px;
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius-sm);
    box-sizing: border-box;
}

.search:focus[b-ebe8kwuyji] {
    outline: none;
    border-color: var(--wm-navy);
    box-shadow: 0 0 0 3px rgba(44, 62, 107, .12);
}

.add-btn[b-ebe8kwuyji] {
    background: var(--wm-navy);
    color: #fff;
    border: none;
    border-radius: var(--wm-radius-sm);
    padding: 8px 14px;
    cursor: pointer;
    font-size: 90%;
    white-space: nowrap;
}

.add-btn:hover[b-ebe8kwuyji] {
    filter: brightness(1.08);
}

/* ── Editor ────────────────────────────────────────────────────────── */
.editor[b-ebe8kwuyji] {
    max-width: 1000px;
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius);
    background: var(--wm-surface);
    box-shadow: var(--wm-shadow);
    padding: 14px 16px;
    margin-bottom: 16px;
}

.editor-title[b-ebe8kwuyji] {
    font-weight: 600;
    color: var(--wm-navy);
    margin-bottom: 12px;
}

.grid[b-ebe8kwuyji] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 10px 14px;
}

.grid .span2[b-ebe8kwuyji] {
    grid-column: 1 / -1;
}

.editor label[b-ebe8kwuyji] {
    display: block;
    font-family: var(--wm-mono);
    text-transform: uppercase;
    letter-spacing: .08em;
    font-size: 11px;
    color: var(--wm-ink-faint);
    margin-bottom: 3px;
}

.editor input[b-ebe8kwuyji],
.editor select[b-ebe8kwuyji] {
    width: 100%;
    box-sizing: border-box;
    padding: 6px;
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius-sm);
    background: var(--wm-surface);
}

.editor input:focus[b-ebe8kwuyji],
.editor select:focus[b-ebe8kwuyji] {
    outline: none;
    border-color: var(--wm-navy);
    box-shadow: 0 0 0 3px rgba(44, 62, 107, .12);
}

.editor-actions[b-ebe8kwuyji] {
    display: flex;
    gap: 8px;
    margin-top: 14px;
}

.save[b-ebe8kwuyji] {
    background: var(--wm-navy);
    color: #fff;
    border: none;
    border-radius: var(--wm-radius-sm);
    padding: 7px 16px;
    cursor: pointer;
}

.cancel[b-ebe8kwuyji] {
    background: var(--wm-surface);
    color: var(--wm-ink-soft);
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius-sm);
    padding: 7px 16px;
    cursor: pointer;
}

.issued-warning[b-ebe8kwuyji] {
    margin-top: 14px;
    padding: 10px 12px;
    border: 1px solid #d9a441;
    background: #fdf6e8;
    border-radius: var(--wm-radius-sm);
}

.issued-warning .iw-text[b-ebe8kwuyji] {
    display: block;
    color: #8a5a00;
    font-size: 90%;
    margin-bottom: 10px;
}

.issued-warning .editor-actions[b-ebe8kwuyji] {
    margin-top: 0;
}

.form-error[b-ebe8kwuyji],
.row-error[b-ebe8kwuyji] {
    color: #a33;
    font-size: 88%;
    margin-top: 8px;
}

.row-error[b-ebe8kwuyji] {
    max-width: 1000px;
    margin: 0 0 12px;
}

.empty[b-ebe8kwuyji] {
    color: var(--wm-ink-faint);
}

/* ── Table ─────────────────────────────────────────────────────────── */
.table-card[b-ebe8kwuyji] {
    max-width: 1000px;
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius);
    background: var(--wm-surface);
    box-shadow: var(--wm-shadow);
    overflow-x: auto;
}

table.contact-table[b-ebe8kwuyji] {
    border-collapse: collapse;
    width: 100%;
    /* Fixed layout so every column (incl. the Edit/Delete actions) always fits within the card —
       no column can grow to push others off-screen. Widths are drag-adjustable (see table-resize.js). */
    table-layout: fixed;
}

table.contact-table th[b-ebe8kwuyji],
table.contact-table td[b-ebe8kwuyji] {
    border-bottom: 1px solid var(--wm-line-soft);
    padding: 8px 10px;
    text-align: left;
    font-size: 90%;
}

/* With table-layout:fixed, content must wrap within its column — break only genuinely unbreakable
   tokens so a stray blob can't overflow. */
table.contact-table th[b-ebe8kwuyji],
table.contact-table td[b-ebe8kwuyji] { overflow-wrap: break-word; }

/* Column widths are drag-adjustable at each header's right edge (table-resize.js sets the cursor
   and handles the drag — no extra DOM, so Blazor doesn't strip it). */
table.contact-table th[b-ebe8kwuyji] { position: relative; }

/* ── Inline "Type" (category) cell ── */
.type-cell[b-ebe8kwuyji] { cursor: pointer; border-bottom: 1px dashed var(--wm-line); }
.type-cell:hover[b-ebe8kwuyji] { color: var(--wm-navy); border-bottom-color: var(--wm-navy); }
.type-edit[b-ebe8kwuyji] {
    width: 100%;
    box-sizing: border-box;
    padding: 4px 6px;
    border: 1px solid var(--wm-navy);
    border-radius: var(--wm-radius-sm);
    background: var(--wm-surface);
}
.type-edit:focus[b-ebe8kwuyji] { outline: none; box-shadow: 0 0 0 3px rgba(44, 62, 107, .12); }

/* Type manager (Edit types) */
.type-list[b-ebe8kwuyji] { display: flex; flex-direction: column; gap: 6px; margin-bottom: 10px; max-width: 420px; }
.type-row[b-ebe8kwuyji] { display: flex; align-items: center; gap: 6px; }
.type-row input[b-ebe8kwuyji] {
    flex: 1 1 auto;
    padding: 5px 8px;
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius-sm);
    background: var(--wm-surface);
}
.type-remove[b-ebe8kwuyji] {
    background: var(--wm-surface);
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius-sm);
    color: #a33;
    cursor: pointer;
    padding: 3px 9px;
    line-height: 1;
}
.type-add[b-ebe8kwuyji] { display: flex; gap: 6px; align-items: center; max-width: 420px; }
.type-add input[b-ebe8kwuyji] {
    flex: 1 1 auto;
    padding: 5px 8px;
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius-sm);
    background: var(--wm-surface);
}

table.contact-table th[b-ebe8kwuyji] {
    background: var(--wm-surface-2);
    font-family: var(--wm-mono);
    text-transform: uppercase;
    letter-spacing: .08em;
    font-size: 11px;
    color: var(--wm-ink-faint);
}

table.contact-table th.sortable[b-ebe8kwuyji] {
    cursor: pointer;
    user-select: none;
    white-space: nowrap;
}

table.contact-table th.sortable:hover[b-ebe8kwuyji] {
    color: var(--wm-navy);
    background: var(--wm-surface);
}

table.contact-table th.sorted[b-ebe8kwuyji] {
    color: var(--wm-navy);
}

table.contact-table th .arr[b-ebe8kwuyji] {
    font-size: 13px;
    line-height: 1;
}

table.contact-table th.num[b-ebe8kwuyji],
table.contact-table td.num[b-ebe8kwuyji] {
    text-align: right;
    white-space: nowrap;
}

table.contact-table td.strong[b-ebe8kwuyji] {
    font-weight: 600;
}

table.contact-table tbody tr:last-child td[b-ebe8kwuyji] {
    border-bottom: none;
}

td.actions[b-ebe8kwuyji] {
    white-space: nowrap;
    text-align: right;
}

td.actions .edit[b-ebe8kwuyji],
td.actions .delete[b-ebe8kwuyji] {
    background: var(--wm-surface);
    border-radius: var(--wm-radius-sm);
    padding: 4px 10px;
    cursor: pointer;
    margin-left: 6px;
}

td.actions .edit[b-ebe8kwuyji] {
    color: var(--wm-navy);
    border: 1px solid var(--wm-line);
}

td.actions .delete[b-ebe8kwuyji] {
    color: #a33;
    border: 1px solid #a33;
}

/* ── Contact import (vCard / CSV) ── */
.import-btn[b-ebe8kwuyji] { margin-left: 8px; }
.import-panel .subtitle[b-ebe8kwuyji] { margin: 2px 0 12px; }
.import-top[b-ebe8kwuyji] { display: flex; align-items: center; gap: 10px; margin: 12px 0 6px; }
.import-top button[b-ebe8kwuyji] { padding: 4px 10px; border: 1px solid var(--wm-line); border-radius: var(--wm-radius-sm); background: var(--wm-surface); cursor: pointer; font-size: 0.82rem; }
.import-count[b-ebe8kwuyji] { font-size: 0.82rem; color: var(--wm-ink-soft); }
.import-scroll[b-ebe8kwuyji] { max-height: 46vh; overflow-y: auto; border: 1px solid var(--wm-line); border-radius: var(--wm-radius-sm); }
.import-table[b-ebe8kwuyji] { width: 100%; border-collapse: collapse; font-size: 0.88rem; }
.import-table th[b-ebe8kwuyji], .import-table td[b-ebe8kwuyji] { text-align: left; padding: 5px 8px; border-bottom: 1px solid var(--wm-line-soft); }
.import-table thead th[b-ebe8kwuyji] { position: sticky; top: 0; background: var(--wm-surface-2); font-size: 0.78rem; color: var(--wm-ink-soft); }
.import-table tr.dup[b-ebe8kwuyji] { background: #fdf6ec; }
.import-table select[b-ebe8kwuyji] { padding: 3px 6px; border: 1px solid var(--wm-line); border-radius: var(--wm-radius-sm); }
.dup-flag[b-ebe8kwuyji] { font-size: 0.72rem; color: #b8420c; background: #fdf1e9; border: 1px solid #f0c9b0; border-radius: 3px; padding: 0 5px; margin-left: 6px; }
.import-actions[b-ebe8kwuyji] { display: flex; align-items: center; gap: 10px; margin-top: 12px; }
.import-done[b-ebe8kwuyji] { color: #1f7a3d; font-weight: 600; margin: 8px 0; }
/* /Components/Pages/FindCondition.razor.rz.scp.css */
.sub[b-j62faybax5] {
    color: var(--wm-ink-faint);
    margin-top: -6px;
    margin-bottom: 14px;
}

.search-row[b-j62faybax5] {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 18px;
    flex-wrap: wrap;
}

.search-row input[b-j62faybax5] {
    flex: 1 1 360px;
    max-width: 760px;
    padding: 9px 12px;
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius-sm);
    font-size: 1rem;
}

.search-row input:focus[b-j62faybax5] {
    outline: none;
    border-color: var(--wm-navy);
    box-shadow: 0 0 0 3px rgba(44, 62, 107, .12);
}

.btn[b-j62faybax5] {
    padding: 9px 18px;
    background: #2c3e6b;
    color: #fff;
    border: none;
    border-radius: var(--wm-radius-sm);
    cursor: pointer;
    font-size: 0.95rem;
}

.btn:hover[b-j62faybax5] { background: #24325a; }

.count[b-j62faybax5] {
    color: var(--wm-ink-faint);
    font-size: 0.85rem;
}

.empty[b-j62faybax5] {
    color: var(--wm-ink-faint);
    font-style: italic;
}

.hits[b-j62faybax5] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(360px, 1fr));
    gap: 10px;
}

@media (max-width: 900px) {
    .hits[b-j62faybax5] { grid-template-columns: 1fr; }
}

.hit[b-j62faybax5] {
    display: block;
    border: 1px solid var(--wm-line);
    border-left: 3px solid #2c3e6b;
    border-radius: var(--wm-radius);
    padding: 10px 14px;
    background: var(--wm-surface);
    box-shadow: var(--wm-shadow);
    text-decoration: none;
    color: inherit;
    cursor: pointer;
    transition: box-shadow .12s, border-color .12s;
}

.hit:hover[b-j62faybax5] {
    border-color: #2c3e6b;
    box-shadow: 0 2px 8px rgba(44, 62, 107, 0.14);
}

.hit.inactive[b-j62faybax5] {
    background: var(--wm-surface-2);
    border-left-color: var(--wm-line);
    opacity: 0.85;
}

.hit-head[b-j62faybax5] {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 4px;
}

.crumb[b-j62faybax5] {
    font-family: var(--wm-mono);
    font-size: 0.76rem;
    color: var(--wm-ink-faint);
    text-transform: uppercase;
    letter-spacing: 0.1em;
}

.rank[b-j62faybax5] {
    background: #2c3e6b;
    color: #fff;
    font-size: 0.72rem;
    font-weight: 700;
    border-radius: 10px;
    padding: 1px 8px;
}

.type-chip[b-j62faybax5] {
    font-size: 0.7rem;
    font-weight: 600;
    border-radius: 10px;
    padding: 1px 8px;
    border: 1px solid transparent;
}

.filter-banner[b-j62faybax5] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    background: var(--wm-inset);
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius-sm);
    padding: 8px 12px;
    margin-bottom: 12px;
    font-size: 0.9rem;
}

.clear-filter[b-j62faybax5] {
    color: #2c3e6b;
    font-weight: 600;
    white-space: nowrap;
}

.edit-hint[b-j62faybax5] {
    margin-left: auto;
    font-size: 0.78rem;
    font-weight: 600;
    color: #2c3e6b;
    text-decoration: none;
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius-sm);
    padding: 1px 8px;
}

.hit:hover .edit-hint[b-j62faybax5] {
    background: var(--wm-inset);
    border-color: #2c3e6b;
}

.type-chip.char[b-j62faybax5] {
    background: #d3efe9;
    color: #0f766e;
    border-color: #8fd6ca;
}

.type-chip.obs[b-j62faybax5] {
    background: #ffe4d0;
    color: #b8420c;
    border-color: #f4a97a;
}

.tag-inactive[b-j62faybax5] {
    background: var(--wm-inset);
    color: var(--wm-ink-faint);
    font-size: 0.7rem;
    border-radius: 10px;
    padding: 1px 8px;
}

.hit-name[b-j62faybax5] {
    font-weight: 600;
    color: var(--wm-ink);
}

.hit-fr[b-j62faybax5] {
    color: #2c3e6b;
    font-size: 0.92rem;
    margin-top: 1px;
}

.hit-expl[b-j62faybax5] {
    color: var(--wm-ink-soft);
    font-size: 0.88rem;
    margin-top: 5px;
    /* Clamp to 2 lines so tiled cards keep a uniform height. */
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.hit-action[b-j62faybax5] {
    color: #1f7a3d;
    font-size: 0.85rem;
    margin-top: 4px;
    font-weight: 600;
}

/* ── Header + back link (matches the recycle bin / inactive pages) ── */
.fc-head[b-j62faybax5] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
}

.fc-head .back-link[b-j62faybax5] {
    color: #2c3e6b;
    font-weight: 600;
    white-space: nowrap;
    padding-top: 6px;
}

/* ── Facet + sort bar over the results ── */
.fc-facets[b-j62faybax5] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin: 10px 0 4px;
}

.fc-facets select[b-j62faybax5] {
    padding: 6px 9px;
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius-sm);
    font-size: 0.88rem;
    background: var(--wm-surface);
}

.fc-facets select:disabled[b-j62faybax5] { opacity: 0.5; }

.fc-chips[b-j62faybax5] { display: inline-flex; gap: 4px; }

.fc-chip[b-j62faybax5] {
    padding: 5px 11px;
    border: 1px solid var(--wm-line);
    border-radius: 999px;
    background: var(--wm-surface);
    font-size: 0.82rem;
    cursor: pointer;
}

.fc-chip.on[b-j62faybax5] {
    background: var(--wm-navy);
    color: #fff;
    border-color: var(--wm-navy);
}

.fc-count[b-j62faybax5] {
    font-size: 0.82rem;
    color: var(--wm-ink-soft);
    margin: 4px 0 10px;
}
/* /Components/Pages/Help.razor.rz.scp.css */
.subtitle[b-exrj2fswc0] {
    color: var(--wm-ink-soft);
    max-width: 760px;
}

.help-noresult[b-exrj2fswc0] {
    color: var(--wm-ink-soft);
    max-width: 760px;
    margin: 6px 0 0;
}

.help-results[b-exrj2fswc0] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    max-width: 900px;
}

.help-result[b-exrj2fswc0] {
    display: block;
    padding: 12px 14px;
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius);
    background: var(--wm-surface);
    box-shadow: var(--wm-shadow);
    text-decoration: none;
    color: inherit;
}

.help-result:hover[b-exrj2fswc0] {
    border-color: var(--wm-navy);
    background: var(--wm-surface-2);
}

.help-result-crumb[b-exrj2fswc0] {
    font-weight: 600;
    color: var(--wm-navy);
    font-size: 92%;
}

.help-result-sep[b-exrj2fswc0] {
    color: var(--wm-ink-faint);
    margin: 0 2px;
}

.help-result-snippet[b-exrj2fswc0] {
    color: var(--wm-ink-soft);
    font-size: 87%;
    margin-top: 3px;
    line-height: 1.45;
}

.help-note[b-exrj2fswc0] {
    max-width: 900px;
    margin: 14px 0 4px;
    padding: 10px 14px;
    border-left: 4px solid var(--wm-navy);
    border-radius: 0 var(--wm-radius) var(--wm-radius) 0;
    background: var(--wm-surface-2);
    color: var(--wm-ink-soft);
    font-size: 90%;
}

.help-group[b-exrj2fswc0] {
    margin-top: 24px;
    max-width: 1000px;
}

.help-group-label[b-exrj2fswc0] {
    font-family: var(--wm-mono);
    text-transform: uppercase;
    letter-spacing: .08em;
    font-size: 11px;
    color: var(--wm-ink-faint);
    margin-bottom: 8px;
}

.help-cards[b-exrj2fswc0] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 10px;
}

.help-card[b-exrj2fswc0] {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 14px 16px;
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius);
    background: var(--wm-surface);
    box-shadow: var(--wm-shadow);
    text-decoration: none;
    color: inherit;
}

.help-card:hover[b-exrj2fswc0] {
    border-color: var(--wm-navy);
    background: var(--wm-surface-2);
}

.help-icon[b-exrj2fswc0] {
    font-size: 22px;
    line-height: 1.1;
}

.help-title[b-exrj2fswc0] {
    font-weight: 600;
    color: var(--wm-navy);
}

.help-desc[b-exrj2fswc0] {
    color: var(--wm-ink-soft);
    font-size: 90%;
    margin-top: 2px;
}

.help-tips[b-exrj2fswc0] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: 10px;
}

.help-tip[b-exrj2fswc0] {
    padding: 14px 16px;
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius);
    background: var(--wm-surface);
    box-shadow: var(--wm-shadow);
}

.help-tip-title[b-exrj2fswc0] {
    font-weight: 600;
    color: var(--wm-navy);
    margin-bottom: 6px;
}

.help-tip p[b-exrj2fswc0] {
    color: var(--wm-ink-soft);
    font-size: 90%;
    margin: 0;
    line-height: 1.5;
}
/* /Components/Pages/Home.razor.rz.scp.css */
/* Library links tucked right-aligned on the ribbon lines (SystemRibbons ExtraX slots). */
.lib-link[b-1bv5jnlpnh] {
    font-size: 82%;
    font-weight: 600;
    color: #2c3e6b;
    text-decoration: none;
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius-sm);
    padding: 3px 10px;
    background: var(--wm-surface-2);
    white-space: nowrap;
}

.lib-link:hover[b-1bv5jnlpnh] {
    background: var(--wm-inset);
}

.row-label[b-1bv5jnlpnh] {
    font-weight: bold;
    width: 110px;
    flex-shrink: 0;
    font-size: 85%;
}

/* Home layout: inspection fields stacked on the LEFT, calendar on the RIGHT.
   Wraps to stacked on narrow screens. */
.home-dashboard[b-1bv5jnlpnh] {
    margin-top: 12px;
    display: flex;
    /* stretch = the details card and the calendar card take equal height, so the two
       sides look balanced instead of the details ending short. */
    align-items: stretch;
    gap: 22px;
    flex-wrap: wrap;
}

/* ── Page header (consistency with the rest of the app) ── */
.home-header[b-1bv5jnlpnh] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
    margin: 2px 0 12px;
}
.home-eyebrow[b-1bv5jnlpnh] {
    font-family: var(--wm-mono);
    font-size: 11px;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--wm-ink-faint);
}
.home-title[b-1bv5jnlpnh] {
    font-family: var(--wm-serif);
    font-weight: 600;
    font-size: 1.5rem;
    letter-spacing: -.01em;
    color: var(--wm-ink);
    margin: 2px 0 0;
}

.home-summary[b-1bv5jnlpnh] {
    /* Grow with the viewport (from ~560px up to ~760px) while leaving the calendar room. */
    flex: 1 1 560px;
    min-width: 560px;
    max-width: 760px;
    margin-top: 0;
    /* Carded to match the rest of the app. */
    background: var(--wm-surface);
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius);
    box-shadow: var(--wm-shadow);
    padding: 18px 20px;
}

/* Empty state as a soft card instead of a bare italic note. */
.home-empty[b-1bv5jnlpnh] {
    border: 1px dashed var(--wm-line);
    border-radius: var(--wm-radius-sm);
    background: var(--wm-surface-2);
    padding: 22px;
    color: var(--wm-ink-soft);
}
.home-empty-title[b-1bv5jnlpnh] {
    font-family: var(--wm-serif);
    font-size: 1.15rem;
    color: var(--wm-ink);
    margin-bottom: 4px;
}

.home-calendar[b-1bv5jnlpnh] {
    /* Low flex-basis so it fits beside Panel 1 and then grows into the leftover width;
       min-width sets the point below which it wraps under Panel 1 instead of squishing. */
    flex: 1 1 380px;
    min-width: 380px;
    display: flex;
    flex-direction: column;
    /* NO viewport-pinned height. It used to be height: calc(100vh - 200px) so the calendar
       stretched to the bottom of the screen - but browser zoom shrinks 100vh while enlarging
       content, so the fixed box became too short for the calendar + legend + Panel 2 and they
       overlapped. min-height gives a floor (the calendar still fills to a decent size via
       cal-wrap's flex:1 on normal screens); above the floor the column grows with its content,
       so any zoom just reflows taller instead of crumbling. */
    min-height: 440px;
    /* Carded to match the summary panel. */
    background: var(--wm-surface);
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius);
    box-shadow: var(--wm-shadow);
    padding: 14px 16px;
}

/* ── Read-only inspection summary on the dashboard ──
   The single edit surface for these fields is /inspection/{id}; Home only shows a
   glanceable summary + "Open inspection", so the same fields are never editable twice. */
.home-ro[b-1bv5jnlpnh] {
    display: flex;
    gap: 18px;
    align-items: flex-start;
    flex-wrap: wrap;
}

.home-ro-photo[b-1bv5jnlpnh] {
    display: block;
    flex: 0 0 auto;
    width: 220px;
    max-width: 42%;
    border-radius: var(--wm-radius-sm);
    overflow: hidden;
    border: 1px solid var(--wm-line);
    box-shadow: var(--wm-shadow-sm);
}

.home-ro-photo img[b-1bv5jnlpnh] {
    display: block;
    width: 100%;
    aspect-ratio: 4 / 3;
    object-fit: cover;
}

.home-ro-body[b-1bv5jnlpnh] {
    flex: 1 1 300px;
    min-width: 260px;
}

.home-ro-addr[b-1bv5jnlpnh] { margin-bottom: 14px; }

.ro-addr1[b-1bv5jnlpnh] {
    font-family: var(--wm-serif);
    font-weight: 600;
    font-size: 1.15rem;
    line-height: 1.25;
    color: var(--wm-ink);
}

.ro-addr2[b-1bv5jnlpnh],
.ro-city[b-1bv5jnlpnh] {
    color: var(--wm-ink-soft);
    font-size: 0.95rem;
}

.home-ro-grid[b-1bv5jnlpnh] {
    margin: 0 0 18px;
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 6px 16px;
}

.home-ro-grid dt[b-1bv5jnlpnh] {
    font-family: var(--wm-mono);
    font-size: 10px;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--wm-ink-faint);
    align-self: center;
}

.home-ro-grid dd[b-1bv5jnlpnh] {
    margin: 0;
    color: var(--wm-ink);
    font-size: 0.95rem;
}

/* Editable day-of block (Temp / Weather / Attendants) under the read-only summary. */
.home-dayof[b-1bv5jnlpnh] {
    margin-top: 18px;
    padding-top: 16px;
    border-top: 1px solid var(--wm-line);
}

.dayof-error[b-1bv5jnlpnh] {
    margin-top: 6px;
    color: #a33;
    font-size: 85%;
}

/* Calendar-on-the-left swaps the two columns' visual order. */
.home-dashboard.cal-left .home-summary[b-1bv5jnlpnh] {
    order: 2;
}

.home-dashboard.cal-left .home-calendar[b-1bv5jnlpnh] {
    order: 1;
}

.last-inspection[b-1bv5jnlpnh] {
    max-width: 520px;
    margin-bottom: 26px;
}

.home-calendar h2[b-1bv5jnlpnh] {
    text-align: center;
    margin-bottom: 12px;
}

.is-toolbar[b-1bv5jnlpnh] {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
    margin-bottom: 8px;
    padding-bottom: 6px;
    border-bottom: 1px solid var(--wm-line);
}

/* One compact line: eyebrow + label + status picker + booking pill sit inline instead of
   stacking into 4 rows. Wraps only if the width is very tight. */
.is-toolbar-title[b-1bv5jnlpnh] {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    min-width: 0;
}

.is-eyebrow[b-1bv5jnlpnh] {
    font-family: var(--wm-mono);
    font-size: 10px;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--wm-ink-faint);
}

.is-toolbar-label[b-1bv5jnlpnh] {
    font-family: var(--wm-serif);
    font-weight: 600;
    font-size: 1.05rem;
    color: var(--wm-ink);
}

.is-toolbar-links[b-1bv5jnlpnh] {
    display: flex;
    gap: 8px;
    align-items: center;
    margin-left: auto;
    flex-wrap: wrap;
}

.is-toolbar-links a.is-action[b-1bv5jnlpnh] {
    color: #2c3e6b;
    text-decoration: none;
    font-size: 0.85rem;
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius-sm);
    padding: 5px 11px;
    background: var(--wm-surface);
    white-space: nowrap;
}

.is-toolbar-links a.is-action:hover[b-1bv5jnlpnh] {
    background: var(--wm-inset);
    border-color: #2c3e6b;
}

.is-toolbar-links a.is-action.primary[b-1bv5jnlpnh] {
    background: #2c3e6b;
    color: #fff;
    border-color: #2c3e6b;
}

.is-toolbar-links a.is-action.primary:hover[b-1bv5jnlpnh] { background: #24325a; }

.empty-note[b-1bv5jnlpnh] {
    color: var(--wm-ink-faint);
    font-style: italic;
}

/* Panel 2 (under the calendar) eyebrow so it doesn't read as orphaned. */
.panel2-eyebrow[b-1bv5jnlpnh] {
    font-family: var(--wm-mono);
    font-size: 10px;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--wm-ink-faint);
    margin-bottom: 8px;
}

.report-link[b-1bv5jnlpnh] {
    font-weight: bold;
    font-size: 110%;
}

.date-range[b-1bv5jnlpnh] {
    font-size: 70%;
    font-weight: normal;
    color: var(--wm-ink-soft);
}

th.today[b-1bv5jnlpnh],
td.today[b-1bv5jnlpnh] {
    background: #fffde7;
}

.slot-label[b-1bv5jnlpnh] {
    font-weight: bold;
    background: var(--wm-surface-2);
}

.view-full[b-1bv5jnlpnh] {
    text-align: right;
    margin-top: 8px;
}

.view-full a[b-1bv5jnlpnh] {
    color: #2c3e6b;
}

.is-toolbar-links .error-msg[b-1bv5jnlpnh] {
    color: #a33;
    font-size: 85%;
}

/* Dashboard "client details to review" nudge */
.review-nudge[b-1bv5jnlpnh] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin: 0 0 14px;
    padding: 10px 14px;
    border: 1px solid #d9a441;
    background: #fdf6e8;
    border-radius: 8px;
}

.review-nudge-icon[b-1bv5jnlpnh] { font-size: 16px; }

.review-nudge-text[b-1bv5jnlpnh] {
    font-weight: 600;
    color: #8a5a00;
}

.review-nudge-link[b-1bv5jnlpnh] {
    display: inline-block;
    padding: 2px 10px;
    background: #fff;
    border: 1px solid #d9a441;
    border-radius: 12px;
    color: #8a5a00;
    text-decoration: none;
    font-weight: 600;
    font-size: 90%;
}

.review-nudge-link:hover[b-1bv5jnlpnh] { background: #2c3e6b; color: #fff; border-color: #2c3e6b; }

/* All-inspections browse + search on the dashboard */
.home-all-open[b-1bv5jnlpnh] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius-sm);
    background: var(--wm-surface);
    color: var(--wm-navy);
    font-size: 90%;
    cursor: pointer;
    text-decoration: none;
    box-shadow: var(--wm-shadow-sm);
}

.home-all-open:hover[b-1bv5jnlpnh] { background: var(--wm-surface-2); }

/* /Components/Pages/InactiveRecords.razor.rz.scp.css */
.ir-head[b-sats8p73zi] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
}

.ir-head h1[b-sats8p73zi] { margin: 0; }

.ir-head .sub[b-sats8p73zi] {
    color: var(--wm-ink-soft);
    font-size: 0.9rem;
    margin: 4px 0 0;
    max-width: 78ch;
}

.back-link[b-sats8p73zi] {
    flex-shrink: 0;
    color: #2c3e6b;
    font-weight: 600;
    text-decoration: none;
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius-sm);
    padding: 6px 12px;
    background: var(--wm-surface-2);
    white-space: nowrap;
}

.ir-toolbar[b-sats8p73zi] { margin: 16px 0 8px; }

.ir-count[b-sats8p73zi] {
    font-family: var(--wm-mono);
    font-size: 11px;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--wm-ink-faint);
}

.ir-notice[b-sats8p73zi] {
    background: var(--wm-inset);
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius-sm);
    padding: 8px 12px;
    margin: 8px 0;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    gap: 12px;
    color: #204a6b;
}

.ir-table-wrap[b-sats8p73zi] { overflow-x: auto; }

.ir-table[b-sats8p73zi] {
    width: 100%;
    border-collapse: collapse;
    background: var(--wm-surface);
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius);
    overflow: hidden;
    box-shadow: var(--wm-shadow);
}

.ir-table th[b-sats8p73zi] {
    text-align: left;
    background: var(--wm-surface-2);
    font-family: var(--wm-mono);
    font-size: 10.5px;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--wm-ink-faint);
    padding: 9px 12px;
    border-bottom: 1px solid var(--wm-line);
    white-space: nowrap;
}

.ir-table td[b-sats8p73zi] {
    padding: 9px 12px;
    border-bottom: 1px solid var(--wm-line-soft);
    vertical-align: top;
}

.ir-table tbody tr:hover[b-sats8p73zi] { background: var(--wm-surface-2); }

.ir-name[b-sats8p73zi] {
    font-weight: 600;
    max-width: 480px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.ir-path[b-sats8p73zi] { color: var(--wm-ink-soft); font-size: 0.85rem; }

.ir-uses[b-sats8p73zi] {
    white-space: nowrap;
    color: var(--wm-ink-soft);
    font-variant-numeric: tabular-nums;
}

.ir-kind[b-sats8p73zi] {
    font-family: var(--wm-mono);
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: .06em;
    padding: 2px 8px;
    border-radius: 10px;
    border: 1px solid var(--wm-line);
    background: var(--wm-inset);
    color: var(--wm-ink-soft);
    white-space: nowrap;
}

.ir-actions[b-sats8p73zi] { white-space: nowrap; }

.reactivate[b-sats8p73zi] {
    border: 1px solid #2c7a3f;
    color: #2c7a3f;
    background: var(--wm-surface);
    border-radius: var(--wm-radius-sm);
    padding: 5px 12px;
    cursor: pointer;
    font-size: 0.85rem;
}

.reactivate:hover[b-sats8p73zi] { background: #eaf5ec; }
.reactivate:disabled[b-sats8p73zi] { opacity: .6; cursor: default; }

.ir-actions[b-sats8p73zi] { display: flex; gap: 6px; flex-wrap: wrap; }

.purge[b-sats8p73zi] {
    border: 1px solid #c0392b;
    color: #c0392b;
    background: var(--wm-surface);
    border-radius: var(--wm-radius-sm);
    padding: 5px 12px;
    cursor: pointer;
    font-size: 0.85rem;
}

.purge:hover[b-sats8p73zi] { background: #fbecea; }

.purge.confirm[b-sats8p73zi] {
    background: #c0392b;
    color: #fff;
    font-weight: 600;
}

.cancel[b-sats8p73zi] {
    border: 1px solid var(--wm-line);
    color: var(--wm-ink-soft);
    background: var(--wm-surface);
    border-radius: var(--wm-radius-sm);
    padding: 5px 10px;
    cursor: pointer;
    font-size: 0.85rem;
}

.purge:disabled[b-sats8p73zi], .cancel:disabled[b-sats8p73zi] { opacity: .6; cursor: default; }

.empty[b-sats8p73zi] { color: var(--wm-ink-soft); font-style: italic; margin-top: 16px; }

.ir-foot[b-sats8p73zi] {
    margin-top: 12px;
    font-size: 0.82rem;
    color: var(--wm-ink-faint);
}
/* /Components/Pages/Insights.razor.rz.scp.css */
.cards[b-14ttmx3n2f] {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    margin: 18px 0 16px;
}

.card[b-14ttmx3n2f] {
    flex: 1 1 170px;
    min-width: 160px;
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius);
    padding: 14px 16px;
    background: var(--wm-surface);
    box-shadow: var(--wm-shadow);
    text-decoration: none;
    color: inherit;
    display: block;
    transition: box-shadow .12s, transform .12s;
}

a.card:hover[b-14ttmx3n2f] {
    box-shadow: 0 2px 8px rgba(44, 62, 107, 0.15);
    transform: translateY(-1px);
}

.card-value[b-14ttmx3n2f] {
    font-size: 1.4rem;
    font-weight: 700;
    font-family: var(--wm-serif);
    color: #2c3e6b;
    line-height: 1.1;
}

.card-label[b-14ttmx3n2f] {
    margin-top: 4px;
    font-family: var(--wm-mono);
    text-transform: uppercase;
    letter-spacing: .1em;
    font-size: 11px;
    color: var(--wm-ink-faint);
}

.card-sub[b-14ttmx3n2f] {
    margin-top: 3px;
    font-size: 0.76rem;
    color: var(--wm-ink-faint);
}

.chart-grid[b-14ttmx3n2f] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 22px 30px;
}

.chart h3[b-14ttmx3n2f] {
    font-family: var(--wm-mono);
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: var(--wm-ink-faint);
    border-bottom: 1px solid var(--wm-line);
    padding-bottom: 4px;
    margin: 0 0 10px;
}

.bar-row[b-14ttmx3n2f] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 5px;
    font-size: 0.82rem;
}

.bar-label[b-14ttmx3n2f] {
    flex: 0 0 44px;
    color: var(--wm-ink-soft);
    text-align: right;
}

.bar-label.wide[b-14ttmx3n2f] {
    flex-basis: 150px;
    text-align: right;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.bar-track[b-14ttmx3n2f] {
    flex: 1 1 auto;
    height: 16px;
    background: var(--wm-inset);
    border-radius: var(--wm-radius-sm);
    overflow: hidden;
}

.bar-fill[b-14ttmx3n2f] {
    display: block;
    height: 100%;
    background: #2c3e6b;
    border-radius: 3px;
    min-width: 2px;
}

.bar-fill.rev[b-14ttmx3n2f] { background: #1f7a3d; }
.bar-fill.st-booked[b-14ttmx3n2f] { background: #43a047; }
.bar-fill.st-inspected[b-14ttmx3n2f] { background: #2196f3; }
.bar-fill.st-report[b-14ttmx3n2f] { background: #e53935; }

.bar-value[b-14ttmx3n2f] {
    flex: 0 0 auto;
    min-width: 56px;
    color: #333;
    font-variant-numeric: tabular-nums;
}

.note[b-14ttmx3n2f] {
    margin-top: 22px;
    color: var(--wm-ink-faint);
    font-size: 0.8rem;
    font-style: italic;
}
/* /Components/Pages/InspectionChecklist.razor.rz.scp.css */
/* Compact one-line header bar: small heading + subtitle inline on the left,
   the EN/FR toggle pinned right, so the system ribbons sit higher. */
.checklist-header[b-z1t0smfmh4] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px 12px;
    max-width: none;
    margin: 0 0 6px;
}

.checklist-header > div:first-child[b-z1t0smfmh4] {
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 4px 10px;
    min-width: 0;
}

.checklist-header h1[b-z1t0smfmh4] {
    font-size: 1.15rem;
    margin: 0;
    line-height: 1.2;
}

.subtitle[b-z1t0smfmh4] {
    color: var(--wm-ink-faint);
    margin: 0;
    font-family: var(--wm-mono);
    text-transform: uppercase;
    letter-spacing: .1em;
    font-size: 11px;
}

/* Frozen top block: report#/client header + status badge + Inspection link + the
   systems bar all stay pinned together while the checklist scrolls beneath. */
.checklist-frozen[b-z1t0smfmh4] {
    position: sticky;
    top: 0;
    z-index: 30;
    background: var(--wm-surface);
    padding-top: 6px;
}
.checklist-frozen[b-z1t0smfmh4]  .system-ribbons {
    position: static;
    top: auto;
}

.ch-title[b-z1t0smfmh4] { min-width: 0; }

.ch-meta[b-z1t0smfmh4] {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-shrink: 0;
}

.ch-status[b-z1t0smfmh4] {
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    padding: 2px 9px;
    border-radius: 999px;
    white-space: nowrap;
}
.ch-status-booked[b-z1t0smfmh4] { background: #e6edf7; color: #2c3e6b; }
.ch-status-inspected[b-z1t0smfmh4] { background: #fff3d6; color: #8a6100; }
.ch-status-reportissued[b-z1t0smfmh4] { background: #e3f5e6; color: #1c7c3a; }

.ch-inspection-link[b-z1t0smfmh4] {
    color: var(--wm-navy);
    text-decoration: none;
    font-size: 13px;
    white-space: nowrap;
}
.ch-inspection-link:hover[b-z1t0smfmh4] { text-decoration: underline; }

.system-tabs[b-z1t0smfmh4] {
    max-width: none;
    margin: 16px 0 0;
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    border-bottom: 2px solid var(--wm-line);
    padding-bottom: 10px;
}

/* Single-line variant: all system tabs on one row, horizontal scroll if needed. */
.system-tabs.single-line[b-z1t0smfmh4] {
    max-width: none;
    flex-wrap: nowrap;
    overflow-x: auto;
    scrollbar-width: thin;
}

.system-tabs.single-line .tab[b-z1t0smfmh4] {
    flex: 0 0 auto;
    white-space: nowrap;
}

/* "SUMMARY" link sits under the tabs row. */
.summary-link[b-z1t0smfmh4] {
    margin: 8px 0 16px;
}

.summary-link a[b-z1t0smfmh4] {
    font-weight: bold;
    letter-spacing: 1px;
    font-size: 88%;
    text-decoration: none;
    color: var(--wm-navy);
}

.summary-link a:hover[b-z1t0smfmh4] {
    text-decoration: underline;
}

.tab[b-z1t0smfmh4] {
    padding: 8px 14px;
    border: 1px solid var(--wm-line);
    background: var(--wm-surface-2);
    border-radius: var(--wm-radius-sm);
    cursor: pointer;
    font-size: 90%;
}

.tab.active[b-z1t0smfmh4] {
    background: var(--wm-navy);
    color: #fff;
    border-color: var(--wm-navy);
}

.tab .badge[b-z1t0smfmh4] {
    display: inline-block;
    background: #e53935;
    color: #fff;
    border-radius: 10px;
    padding: 1px 7px;
    font-size: 80%;
    margin-left: 6px;
}

.tab.active .badge[b-z1t0smfmh4] {
    background: #fff;
    color: var(--wm-navy);
}

.checklist-body[b-z1t0smfmh4] {
    max-width: none;
    margin: 20px 0;
    padding-bottom: 24px;
    /* Mirror the Defects page: subsystem CARDS in a max-3-column grid (drops to 2
       then 1 as the screen narrows), each card a single column of components. */
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(max(300px, (100% - 32px) / 3), 1fr));
    row-gap: 10px;
    column-gap: 16px;
    align-items: start;
}

/* Multi-column flow: component cards pack into as many vertical columns as the
   frame width allows (~1 per 300px). Each card stays whole; the subsystem
   heading spans the full width above them. */
.subsystem-section[b-z1t0smfmh4] {
    /* One subsystem = one framed card, a single inner column of components — same
       shape as the Defects tiles (navy scheme here vs the Defects orange). */
    column-count: 1;
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius);
    box-shadow: var(--wm-shadow-sm);
    background: var(--wm-surface);
    overflow: hidden;
    padding: 0 8px 8px;
    margin-bottom: 0;
}

/* Nameplate groups carry ~9 wide labeled fields; trapped in a 300px density column
   they render cramped with dead space beside them. Let the whole group span the full
   frame width (drop the column restriction for it) and flow its fields into rows. */
.subsystem-section .nameplate-block[b-z1t0smfmh4] {
    column-span: all;
    -webkit-column-span: all;
}

.nameplate-block .condition-list[b-z1t0smfmh4] {
    display: flex;
    flex-wrap: wrap;
    gap: 2px 28px;
}

.nameplate-block .cond-text[b-z1t0smfmh4] {
    flex: 1 1 300px;
}

.nameplate-block .cond-text-input[b-z1t0smfmh4] {
    max-width: none;
}

.subsystem-section h3[b-z1t0smfmh4] {
    /* Subsystem name as a navy band across the top of the framed tile (mirrors the
       Defects orange band). */
    background: var(--wm-navy);
    color: #fff;
    font-size: 1.02rem;
    line-height: 1.25;
    padding: 6px 10px;
    border-radius: 0;
    margin: 0 -8px 8px;
    column-span: all;
}

/* Clickable subsystem header (expand/collapse), mirroring the Defects page. */
.subsystem-section h3.subsystem-head[b-z1t0smfmh4] {
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 8px;
    user-select: none;
}

.subsystem-section h3.subsystem-head:hover[b-z1t0smfmh4] {
    background: #1f2d54;
}

.subsystem-chevron[b-z1t0smfmh4] {
    font-size: 72%;
    color: rgba(255, 255, 255, 0.85);
    width: 12px;
    flex-shrink: 0;
}

/* Expand-all / Collapse-all toolbar above the checklist. */
.expand-toolbar[b-z1t0smfmh4] {
    display: flex;
    gap: 10px;
    margin: 4px 0 0;
}

.expand-toolbar .add-link[b-z1t0smfmh4] {
    background: none;
    border: none;
    color: #2c3e6b;
    cursor: pointer;
    font-size: 90%;
    padding: 4px 0;
}

.expand-toolbar .add-link:hover[b-z1t0smfmh4] {
    text-decoration: underline;
}

/* Each component is a framed card - border + soft shadow so it reads as a
   distinct tile within its column. */
.component-block[b-z1t0smfmh4] {
    /* Unframed: the subsystem card is the frame now; each component is a sub-section
       (name + item list), matching the Defects page. */
    display: contents;
}

/* Component name as a navy-text sub-header within the subsystem card (mirrors the
   Defects page, where the subsystem — not the component — carries the coloured band). */
.component-block h4[b-z1t0smfmh4] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    font-size: 0.9rem;
    font-weight: 700;
    color: var(--wm-navy);
    margin: 8px 0 3px;
    padding: 0 0 3px;
    border-bottom: 1px solid var(--wm-line-soft);
    letter-spacing: 0.02em;
    line-height: 1.25;
}

/* Clickable component title (expand/collapse its item list). */
.comp-collapse[b-z1t0smfmh4] {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    cursor: pointer;
    user-select: none;
    min-width: 0;
    flex: 1 1 auto;
}

.comp-chevron[b-z1t0smfmh4] {
    font-size: 66%;
    opacity: 0.85;
    flex-shrink: 0;
}

.comp-collapse:hover .comp-title-text[b-z1t0smfmh4] {
    text-decoration: underline;
}

.comp-collapse.locked[b-z1t0smfmh4] {
    cursor: default;
}

.comp-collapse.locked:hover .comp-title-text[b-z1t0smfmh4] {
    text-decoration: none;
}

/* Big "+" on the title band, right-aligned, to add a condition inline */
.add-cond-btn[b-z1t0smfmh4] {
    flex: 0 0 auto;
    width: 22px;
    height: 22px;
    padding: 0;
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius-sm);
    background: none;
    color: var(--wm-navy);
    font-size: 1.15rem;
    font-weight: 700;
    line-height: 1;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.add-cond-btn:hover[b-z1t0smfmh4] {
    background: var(--wm-inset);
    border-color: var(--wm-navy);
}

/* Add-condition popup - floats on top of the column layout so it's always
   fully visible (an inline form gets overlapped by neighbouring columns). */
.add-modal-backdrop[b-z1t0smfmh4] {
    position: fixed;
    inset: 0;
    background: rgba(15, 20, 40, 0.42);
    z-index: 1000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 16px;
}

.add-modal[b-z1t0smfmh4] {
    background: var(--wm-surface);
    border-radius: var(--wm-radius);
    padding: 18px 20px 16px;
    width: 460px;
    max-width: 94vw;
    box-shadow: 0 16px 48px rgba(0, 0, 0, 0.32);
}

.add-modal-title[b-z1t0smfmh4] {
    margin: 0 0 14px;
    font-size: 1rem;
    color: var(--wm-navy);
}

.add-modal .actions[b-z1t0smfmh4] {
    text-align: right;
    margin-top: 14px;
}

.add-modal .actions button[b-z1t0smfmh4] {
    margin-left: 8px;
    padding: 7px 18px;
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius-sm);
    background: var(--wm-surface-2);
    cursor: pointer;
}

.add-modal .actions .btn-primary[b-z1t0smfmh4] {
    background: var(--wm-navy);
    border-color: var(--wm-navy);
    color: #fff;
    font-weight: 600;
}

.condition-list[b-z1t0smfmh4] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-left: 0;
}

/* Clickable option tile (replaces per-line checkboxes) - dense, all options
   visible at once, no dropdowns. Click toggles; edit pencil shows on hover. */
.cond-chip[b-z1t0smfmh4] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 5px 11px;
    border: 1px solid var(--wm-line);
    border-radius: 4px;
    background: var(--wm-surface);
    cursor: default;
    font-size: 0.86rem;
    line-height: 1.2;
    user-select: none;
}

.cond-chip:hover[b-z1t0smfmh4] {
    border-color: var(--wm-navy);
    background: var(--wm-inset);
}

/* Explicit checkbox = the single-click choose control (the chip no longer toggles as a whole);
   the narrative label is double-click-to-edit only, so choosing and editing never collide. */
.cond-check[b-z1t0smfmh4] { flex: 0 0 auto; width: 15px; height: 15px; margin: 0; cursor: pointer; accent-color: var(--wm-navy); }
.cond-chip .chip-label[b-z1t0smfmh4], .cond-text-label[b-z1t0smfmh4] { cursor: text; }

/* Inline narrative editor (opened by double-click). */
.cond-chip .cell-edit-inline[b-z1t0smfmh4], .cond-text .cell-edit-inline[b-z1t0smfmh4] {
    font: inherit;
    padding: 2px 6px;
    min-width: 12em;
    max-width: 100%;
    box-sizing: border-box;
    border: 1px solid var(--wm-navy);
    border-radius: 4px;
}

/* ── Field mode: on-site tablet layout ─────────────────────────────────────────
   Toggled per-device via FieldModeToggle (localStorage). Scoped to
   .capture-page.field-mode, so the desktop view (toggle off) is unchanged. Designed
   to the Galaxy A7 landscape width as the floor. */
.capture-page.field-mode .checklist-body[b-z1t0smfmh4] { grid-template-columns: 1fr; }
.capture-page.field-mode .cond-chip[b-z1t0smfmh4] {
    min-height: 44px;
    padding: 10px 15px;
    font-size: 1rem;
    gap: 7px;
}
.capture-page.field-mode .add-link.add-plus[b-z1t0smfmh4] {
    min-width: 48px;
    min-height: 48px;
    font-size: 1.5rem;
}
/* Roomier text entry; 16px stops mobile browsers zooming on focus. */
.capture-page.field-mode input[type="text"][b-z1t0smfmh4],
.capture-page.field-mode textarea[b-z1t0smfmh4],
.capture-page.field-mode select[b-z1t0smfmh4] { min-height: 42px; font-size: 16px; }

/* Checked = keep the base chip look (same fill + ink as unchecked) and signal
   completion with a left frame + italic + underline. A full colour fill used to
   collide with the navy system header, so the "done" state now reads as an
   annotation on the original chip rather than a recoloured one. */
.cond-chip.checked[b-z1t0smfmh4] {
    font-style: italic;
    font-weight: 600;
    background: var(--wm-inset);
    border-left: 3px solid var(--wm-navy);
    padding-left: 9px;
}

/* Defects only ever render in the Observations view (the checklist filters by
   IsDefect), so the orange stays a defect-severity cue and never mixes into
   Characteristics. Carried as the frame + text colour under the new scheme. */
.cond-chip.defect.checked[b-z1t0smfmh4] {
    background: #fbe9e2;
    border-left-color: #c2410c;
    color: #c2410c;
}

/* "Inspection-only" badge: purple, deliberately off the status (green/blue/red/grey)
   and record-type (teal/amber) palettes so it can't be mistaken for either. */
.custom-tag[b-z1t0smfmh4] {
    background: #6c5ce7;
    color: #fff;
    font-size: 0.68rem;
    font-weight: 600;
    padding: 1px 7px;
    border-radius: 9px;
    white-space: nowrap;
}

/* Compact marker (replaces the verbose "For this inspection only" badge). Full meaning
   is in the hover tooltip / aria-label. */
.io-marker[b-z1t0smfmh4] {
    color: #6c5ce7;
    font-size: 0.55rem;
    line-height: 1;
    cursor: help;
    user-select: none;
}

.chip-edit[b-z1t0smfmh4] {
    background: none;
    border: none;
    color: inherit;
    cursor: pointer;
    font-size: 0.85em;
    padding: 0;
    /* Visible by default (tablets have no hover) - emphasized on hover. */
    opacity: 0.4;
}

.cond-chip:hover .chip-edit[b-z1t0smfmh4] {
    opacity: 0.75;
}

.chip-edit:hover[b-z1t0smfmh4] {
    opacity: 1;
}

/* Text-entry (nameplate) field: full-width labeled input instead of a toggle chip */
.cond-text[b-z1t0smfmh4] {
    flex: 1 1 260px;
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 3px 0;
}

.cond-text-label[b-z1t0smfmh4] {
    flex: 0 0 auto;
    min-width: 150px;
    font-size: 0.86rem;
    color: var(--wm-ink);
}

.cond-text-input[b-z1t0smfmh4] {
    flex: 1;
    min-width: 0;
    max-width: 320px;
    padding: 4px 8px;
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius-sm);
    font: inherit;
    background: #fffef4;
}

.cond-text.filled .cond-text-input[b-z1t0smfmh4] {
    background: #eef7ee;
    border-color: #9ec7a0;
}

.cond-text-input:focus[b-z1t0smfmh4] {
    outline: none;
    border-color: var(--wm-navy);
    box-shadow: 0 0 0 3px rgba(44, 62, 107, .12);
    background: var(--wm-surface);
}

.cond-text .chip-edit[b-z1t0smfmh4] {
    color: var(--wm-ink-soft);
    opacity: 0.5;
}

.cond-text .chip-edit:hover[b-z1t0smfmh4] {
    opacity: 1;
}

.mode-note[b-z1t0smfmh4] {
    max-width: none;
    margin: 12px 0 0;
    color: var(--wm-ink-soft);
    font-size: 90%;
}

.empty-note[b-z1t0smfmh4] {
    max-width: none;
    margin: 20px 0;
    color: var(--wm-ink-faint);
    font-style: italic;
}

.summary-system-block[b-z1t0smfmh4] {
    grid-column: 1 / -1;   /* a whole system spans the full grid width */
    max-width: none;
    margin: 0 0 16px;
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius);
    padding: 10px 14px;
    background: var(--wm-surface);
    box-shadow: var(--wm-shadow);
}

/* Summary mode density: match edit mode. Flow the read-only condition names
   into as many columns as fit (~1 per 220px) instead of one item per line,
   and tighten the vertical rhythm. */
.summary-system-block .subsystem-section[b-z1t0smfmh4] {
    margin-bottom: 14px;
}

.summary-system-block .condition-list[b-z1t0smfmh4] {
    display: block;
    column-width: 220px;
    column-gap: 18px;
}

.summary-system-header[b-z1t0smfmh4] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 2px solid var(--wm-navy);
    padding-bottom: 8px;
    margin-bottom: 10px;
}

.summary-system-header h2[b-z1t0smfmh4] {
    margin: 0;
    font-size: 120%;
}

.edit-link[b-z1t0smfmh4] {
    background: var(--wm-navy);
    color: #fff;
    border: none;
    border-radius: var(--wm-radius-sm);
    padding: 6px 14px;
    cursor: pointer;
    font-size: 85%;
}

.condition-item-readonly[b-z1t0smfmh4] {
    padding: 2px 0;
    margin-left: 0;
    break-inside: avoid;
    -webkit-column-break-inside: avoid;
}

.condition-item-readonly.defect[b-z1t0smfmh4] {
    color: #c2410c;
    font-weight: bold;
}

.back-to-summary[b-z1t0smfmh4] {
    background: none;
    border: none;
    color: var(--wm-navy);
    cursor: pointer;
    font-size: 95%;
    padding: 0;
    text-decoration: underline;
}

.condition-check[b-z1t0smfmh4] {
    display: flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
}

.icon-btn[b-z1t0smfmh4] {
    background: none;
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius-sm);
    width: 24px;
    height: 24px;
    cursor: pointer;
    font-size: 85%;
    margin-left: 6px;
}

.icon-btn.danger[b-z1t0smfmh4] {
    color: #a33;
    border-color: #a33;
}

.condition-edit-form[b-z1t0smfmh4] {
    border: 1px solid var(--wm-navy);
    border-radius: var(--wm-radius-sm);
    padding: 10px;
    margin: 6px 0;
    background: var(--wm-surface);
    box-shadow: var(--wm-shadow);
}

.row2[b-z1t0smfmh4] {
    display: flex;
    gap: 8px;
    margin-bottom: 6px;
}

.row2 > input[b-z1t0smfmh4],
.row2 > textarea[b-z1t0smfmh4] {
    flex: 1;
    padding: 6px;
    box-sizing: border-box;
}

.row2 > textarea[b-z1t0smfmh4] {
    min-height: 50px;
    resize: vertical;
}

.defect-toggle[b-z1t0smfmh4] {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 90%;
    color: var(--wm-ink-soft);
}

.type-chip[b-z1t0smfmh4] {
    font-size: 80%;
    font-weight: 600;
    border-radius: 10px;
    padding: 2px 10px;
    align-self: center;
    border: 1px solid transparent;
}

.type-chip.char[b-z1t0smfmh4] {
    background: #d3efe9;
    color: #0f766e;
    border-color: #8fd6ca;
}

.type-chip.obs[b-z1t0smfmh4] {
    background: #ffe4d0;
    color: #b8420c;
    border-color: #f4a97a;
}

.condition-edit-form .actions[b-z1t0smfmh4] {
    text-align: right;
}

.condition-edit-form .actions button[b-z1t0smfmh4] {
    margin-left: 6px;
}

.add-link[b-z1t0smfmh4] {
    background: none;
    border: none;
    color: var(--wm-navy);
    cursor: pointer;
    font-size: 90%;
    padding: 4px 0;
}

.add-link:hover[b-z1t0smfmh4] {
    text-decoration: underline;
}

.custom-tag[b-z1t0smfmh4] {
    background: #6c5ce7;
    color: #fff;
    font-size: 75%;
    padding: 2px 8px;
    border-radius: 10px;
}

.override-note[b-z1t0smfmh4] {
    font-size: 82%;
    color: var(--wm-ink-soft);
    font-style: italic;
    margin: 0 0 8px;
}

/* Note 4: the bottom cluster — three isolated quick-check groups (Restrictions, Notes &
   Comments, Assessment Summary) frequently used, plus the collapsed report-content panel —
   frozen at the bottom while the checklist scrolls above it. A solid navy line separates
   it; it caps at ~55vh and scrolls internally so it never buries the checklist. */
.system-bottom.bottom-sticky[b-z1t0smfmh4] {
    /* Pinned to the bottom of the main area. sticky;bottom:0 didn't hold because the
       page (body) scrolls and this is the last child, so it just sat at content-end.
       Fixed to the viewport bottom (right of the 250px sidebar) keeps it always
       visible; .checklist-body reserves matching bottom space so nothing hides behind. */
    position: fixed;
    left: 250px;
    right: 0;
    bottom: 0;
    z-index: 15;
    background: var(--wm-surface);
    border-top: 2px solid var(--wm-navy);
    max-height: 55vh;
    overflow-y: auto;
    box-shadow: 0 -4px 10px rgba(0, 0, 0, 0.06);
    padding-left: 2rem;
    padding-right: 1.5rem;
}

@media (max-width: 640px) {
    .system-bottom.bottom-sticky[b-z1t0smfmh4] { left: 0; }
}

/* The three isolated quick-check groups sit collapsed on one line (3 columns) to keep the
   frozen band short; an opened group spans the full width so its chips + editor aren't
   cramped into a third of the width. */
.system-bottom .special-row[b-z1t0smfmh4] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 6px;
    padding: 6px;
}

.special-row > details.special-group[b-z1t0smfmh4] {
    min-width: 0;
}

.special-row > details.special-group[open][b-z1t0smfmh4] {
    grid-column: 1 / -1;
}

/* Control-band styling so the frozen bottom is clearly distinct from the scrollable
   checklist above: the quick-check trio = filled navy bars, bold white. */
.system-bottom .special-group > summary[b-z1t0smfmh4] {
    background: var(--wm-navy);
    color: #fff;
    font-weight: 700;
    letter-spacing: .02em;
    font-size: 90%;
    padding: 7px 10px;
    border-radius: var(--wm-radius-sm);
    cursor: pointer;
}

.system-bottom .special-group[open] > summary[b-z1t0smfmh4] {
    border-radius: var(--wm-radius-sm) var(--wm-radius-sm) 0 0;
}

.system-bottom .special-body[b-z1t0smfmh4] {
    padding: 8px 10px 12px;
    border: 1px solid var(--wm-navy);
    border-top: none;
    border-radius: 0 0 var(--wm-radius-sm) var(--wm-radius-sm);
}

/* Report content = navy OUTLINE (related to the trio, but visually its own thing). */
.system-bottom > details.system-content-editor[b-z1t0smfmh4] {
    margin: 0 6px 6px;
    border: 1px solid var(--wm-navy);
    border-radius: var(--wm-radius-sm);
}

.system-bottom > details.system-content-editor > summary[b-z1t0smfmh4] {
    background: var(--wm-inset);
    color: var(--wm-navy);
    font-weight: 700;
    padding: 7px 10px;
    cursor: pointer;
}

/* Summary mode collapses to a single column on tablets/phones - never causes
   horizontal page scroll. (Edit-mode column packing is left untouched.) */
@media (max-width: 900px) {
    .summary-system-block .subsystem-section[b-z1t0smfmh4],
    .summary-system-block .condition-list[b-z1t0smfmh4] {
        column-width: auto;
        column-count: 1;
    }
}

.nameplate-note[b-z1t0smfmh4] { font-size: 0.72rem; font-style: italic; color: var(--wm-ink-soft, #667); line-height: 1.35; margin: 0 0 8px; padding: 0 2px; }

/* Inline "Add an item" form (was a modal popup) — expands below the component. */
.condition-edit-form.add-inline[b-z1t0smfmh4] { margin-top: 8px; }
.add-inline-title[b-z1t0smfmh4] { margin: 0 0 8px; font-size: 0.92rem; font-weight: 700; color: var(--wm-navy); }
/* Quiet "save to library" toggle in the add-item form — small, low-key, no big button. */
.add-lib-opt[b-z1t0smfmh4] { display: inline-flex; align-items: center; gap: 6px; font-size: 0.8rem; color: var(--wm-ink-soft); margin: 6px 0 2px; cursor: pointer; }
.add-lib-opt input[b-z1t0smfmh4] { margin: 0; }

/* ─────────────────────────────────────────────────────────────────────────
   Group 4 special sections: their own home. A distinct right rail on desktop,
   a slide-in drawer in field mode. Replaces the old fixed bottom band.
   ───────────────────────────────────────────────────────────────────────── */
.checklist-layout[b-z1t0smfmh4] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 340px;
    gap: 20px;
    align-items: start;
}
.checklist-layout.rail-collapsed[b-z1t0smfmh4] { grid-template-columns: minmax(0, 1fr); }
.checklist-main[b-z1t0smfmh4] { min-width: 0; }

/* Group-3 report-content editor now lives at the foot of the main column (was in the
   fixed band). Keep the navy-outline look it had. */
.checklist-main > details.system-content-editor[b-z1t0smfmh4] {
    margin: 12px 0 0;
    border: 1px solid var(--wm-navy);
    border-radius: var(--wm-radius-sm);
}
.checklist-main > details.system-content-editor > summary[b-z1t0smfmh4] {
    background: var(--wm-inset);
    color: var(--wm-navy);
    font-weight: 700;
    padding: 7px 10px;
    cursor: pointer;
}

/* The rail itself — sticky beside the checklist on desktop. */
.special-rail[b-z1t0smfmh4] {
    position: sticky;
    top: 12px;
    align-self: start;
    max-height: calc(100vh - 24px);
    overflow-y: auto;
    background: var(--wm-surface);
    border: 1px solid var(--wm-navy);
    border-radius: var(--wm-radius-sm);
}
/* Desktop: collapsing hides the rail and reveals the floating reopen button. */
.rail-collapsed .special-rail[b-z1t0smfmh4] { display: none; }

.special-rail-head[b-z1t0smfmh4] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 8px 10px;
    background: var(--wm-navy);
    color: #fff;
    position: sticky;
    top: 0;
    z-index: 1;
}
.special-rail-title[b-z1t0smfmh4] { font-weight: 700; font-size: 0.85rem; letter-spacing: .02em; }
.special-rail-toggle[b-z1t0smfmh4] {
    background: none; border: none; color: #fff;
    font-size: 1.3rem; line-height: 1; cursor: pointer; padding: 0 4px;
}
.special-rail-body[b-z1t0smfmh4] { padding: 8px; display: flex; flex-direction: column; gap: 8px; }

/* Navy quick-check groups — same visual language as the old band, now stacked. */
.special-rail .special-group[b-z1t0smfmh4] { min-width: 0; }
.special-rail .special-summary[b-z1t0smfmh4] {
    display: flex;
    align-items: center;
    gap: 6px;
    background: var(--wm-navy);
    color: #fff;
    font-weight: 700;
    letter-spacing: .02em;
    font-size: 90%;
    padding: 7px 10px;
    border-radius: var(--wm-radius-sm) var(--wm-radius-sm) 0 0;
    cursor: pointer;
    user-select: none;
}
.special-rail .special-group.collapsed .special-summary[b-z1t0smfmh4] { border-radius: var(--wm-radius-sm); }
.special-rail .special-summary .comp-chevron[b-z1t0smfmh4] { font-size: 11px; }
.special-rail .special-body[b-z1t0smfmh4] {
    padding: 8px 10px 12px;
    border: 1px solid var(--wm-navy);
    border-top: none;
    border-radius: 0 0 var(--wm-radius-sm) var(--wm-radius-sm);
}

/* Narrow rail: the add-item form's two-column rows stack so the French field never clips. */
.special-rail .row2[b-z1t0smfmh4] { display: flex; flex-direction: column; gap: 6px; }
.special-rail .row2 > input[b-z1t0smfmh4],
.special-rail .row2 > textarea[b-z1t0smfmh4] { width: 100%; box-sizing: border-box; }
.special-rail .condition-edit-form input[b-z1t0smfmh4],
.special-rail .condition-edit-form textarea[b-z1t0smfmh4] { width: 100%; box-sizing: border-box; }

/* Floating reopen button — hidden while the rail is open on desktop. */
.special-rail-fab[b-z1t0smfmh4] {
    display: none;
    position: fixed;
    right: 16px;
    bottom: 16px;
    z-index: 16;
    background: var(--wm-navy);
    color: #fff;
    border: none;
    border-radius: 20px;
    padding: 10px 18px;
    font-weight: 700;
    font-size: 0.9rem;
    box-shadow: var(--wm-shadow);
    cursor: pointer;
}
.rail-collapsed .special-rail-fab[b-z1t0smfmh4] { display: inline-flex; align-items: center; }
.special-rail-backdrop[b-z1t0smfmh4] { display: none; }

/* Narrow, non-field screens: stack the rail full-width below the checklist (no drawer). */
@media (max-width: 1024px) {
    .capture-page:not(.field-mode) .checklist-layout[b-z1t0smfmh4],
    .capture-page:not(.field-mode) .checklist-layout.rail-collapsed[b-z1t0smfmh4] { grid-template-columns: minmax(0, 1fr); }
    .capture-page:not(.field-mode) .special-rail[b-z1t0smfmh4] {
        position: static;
        max-height: none;
        width: auto;
        margin-top: 16px;
    }
}

/* Field mode: the rail becomes a right-side slide-in drawer. Higher specificity than the
   desktop .rail-collapsed rule so it stays in the DOM (off-canvas) rather than display:none. */
.capture-page.field-mode .checklist-layout[b-z1t0smfmh4],
.capture-page.field-mode .checklist-layout.rail-collapsed[b-z1t0smfmh4] { grid-template-columns: minmax(0, 1fr); }
.capture-page.field-mode .checklist-layout .special-rail[b-z1t0smfmh4] {
    display: block;
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    width: min(360px, 88vw);
    max-height: none;
    border-radius: 0;
    z-index: 40;
    transform: translateX(100%);
    transition: transform .2s ease;
    box-shadow: var(--wm-shadow);
}
.capture-page.field-mode .checklist-layout.rail-open .special-rail[b-z1t0smfmh4] { transform: translateX(0); }
.capture-page.field-mode .special-rail-fab[b-z1t0smfmh4] { display: inline-flex; align-items: center; }
.capture-page.field-mode .checklist-layout.rail-open .special-rail-fab[b-z1t0smfmh4] { display: none; }
.capture-page.field-mode .checklist-layout.rail-open .special-rail-backdrop[b-z1t0smfmh4] {
    display: block;
    position: fixed;
    inset: 0;
    background: rgba(20, 26, 43, .35);
    z-index: 39;
}
/* /Components/Pages/InspectionDetail.razor.rz.scp.css */
.detail-table[b-mx3q4n66zw] {
    border-collapse: collapse;
    max-width: 600px;
}

.detail-table td[b-mx3q4n66zw] {
    padding: 6px 10px;
    border-bottom: 1px solid var(--wm-line-soft);
}

/* ── Frozen header block: breadcrumb/status bar + systems ribbon freeze together ──
   One sticky wrapper (instead of two overlapping sticky layers) so scrolling can never tuck
   half the ribbon behind the topbar. z-index above page content; the status dropdown (inside)
   still paints over the ribbon since the ribbon no longer forms its own stacking layer here. */
.detail-frozen[b-mx3q4n66zw] {
    position: sticky;
    top: 0;
    z-index: 30;
    background: var(--wm-surface);
}
.detail-frozen .detail-topbar[b-mx3q4n66zw] { position: static; z-index: auto; }
.detail-frozen[b-mx3q4n66zw]  .system-ribbons { position: static; top: auto; z-index: auto; margin-bottom: 0; }

/* ── Compact top bar (breadcrumb + status + action links) ── */
.detail-topbar[b-mx3q4n66zw] {
    background: var(--wm-surface);
    border-bottom: 1px solid var(--wm-line);
    padding: 8px 0 10px;
    margin-bottom: 16px;
}

.topbar-crumb[b-mx3q4n66zw] {
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 6px 10px;
    margin-bottom: 8px;
}

.topbar-crumb a[b-mx3q4n66zw] {
    font-size: 88%;
    white-space: nowrap;
}

.crumb-label[b-mx3q4n66zw] {
    font-size: 1.05rem;
    font-weight: 600;
    color: var(--wm-navy);
}

.action-links[b-mx3q4n66zw] {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 0;
}

.action-link[b-mx3q4n66zw] {
    display: inline-block;
    background: var(--wm-surface-2);
    color: var(--wm-ink) !important;
    padding: 8px 16px;
    border-radius: var(--wm-radius-sm);
    text-decoration: none;
    border: none;
    font: inherit;
    cursor: pointer;
}

.action-link.primary[b-mx3q4n66zw] {
    background: var(--wm-navy);
    color: #fff !important;
}

.action-link:hover[b-mx3q4n66zw] {
    opacity: 0.9;
}

/* ── Two-column body layout ── */
.detail-grid[b-mx3q4n66zw] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 24px;
    align-items: start;
}

@media (max-width: 900px) {
    .detail-grid[b-mx3q4n66zw] {
        grid-template-columns: 1fr;
    }
}

.detail-col-right[b-mx3q4n66zw] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.detail-card[b-mx3q4n66zw] {
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius);
    background: var(--wm-surface);
    box-shadow: var(--wm-shadow);
    padding: 12px 16px 14px;
}

/* The grouped field cards down the left column (client / property+inspection / fees / note). */
.detail-fieldcard[b-mx3q4n66zw] { margin-bottom: 14px; }
.detail-fieldcard-h[b-mx3q4n66zw] {
    margin: 0 0 6px;
    font-family: var(--wm-mono);
    font-size: 12.5px;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: #2c3e6b;
    border-bottom: 1px solid var(--wm-line-soft);
    padding-bottom: 2px;
}

.advance-status-btn[b-mx3q4n66zw] {
    margin-top: 4px;
}

.attachments-heading[b-mx3q4n66zw] {
    margin-top: 12px;
}

.detail-card > .attachments-heading:first-child[b-mx3q4n66zw] {
    margin-top: 0;
}

.empty-note[b-mx3q4n66zw] {
    color: var(--wm-ink-faint);
    font-style: italic;
}

.note[b-mx3q4n66zw] {
    margin-top: 20px;
    color: var(--wm-ink-soft);
    font-style: italic;
}

/* Agent-picker styles moved to AgentPicker.razor.css (component now lives on the dashboard). */

/* ── Edit details form ── */
.detail-toolbar[b-mx3q4n66zw] {
    margin: 6px 0 10px;
}

.edit-details-btn[b-mx3q4n66zw] {
    background: var(--wm-navy);
    color: #fff;
    border: none;
    border-radius: var(--wm-radius-sm);
    padding: 6px 14px;
    cursor: pointer;
    font-size: 90%;
}

.edit-details-form[b-mx3q4n66zw] {
    max-width: 900px;
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius);
    padding: 12px 16px;
    background: var(--wm-surface);
    box-shadow: var(--wm-shadow);
    margin-bottom: 12px;
}

.edit-details-form h3[b-mx3q4n66zw] {
    margin: 12px 0 6px;
    font-size: 100%;
    color: var(--wm-navy);
    border-bottom: 1px solid var(--wm-line-soft);
    padding-bottom: 4px;
}

.edit-details-form h3:first-child[b-mx3q4n66zw] {
    margin-top: 0;
}

.edit-grid[b-mx3q4n66zw] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 8px 14px;
}

.edit-grid label[b-mx3q4n66zw] {
    display: flex;
    flex-direction: column;
    font-size: 82%;
    color: var(--wm-ink-soft);
    gap: 3px;
}

.edit-grid label.wide[b-mx3q4n66zw] {
    grid-column: span 2;
}

.edit-grid input[b-mx3q4n66zw],
.edit-grid select[b-mx3q4n66zw] {
    padding: 5px 6px;
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius-sm);
    font-size: 92%;
}

.edit-grid input:focus[b-mx3q4n66zw],
.edit-grid select:focus[b-mx3q4n66zw] {
    border-color: var(--wm-navy);
    box-shadow: 0 0 0 3px rgba(44, 62, 107, .12);
}

.edit-actions[b-mx3q4n66zw] {
    margin-top: 14px;
    display: flex;
    gap: 8px;
}

.edit-actions button[b-mx3q4n66zw] {
    padding: 7px 16px;
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius-sm);
    background: var(--wm-surface);
    cursor: pointer;
}

.edit-actions button.primary[b-mx3q4n66zw] {
    background: var(--wm-navy);
    color: #fff;
    border-color: var(--wm-navy);
}

.error-msg[b-mx3q4n66zw] {
    color: #a33;
    font-size: 88%;
    margin: 8px 0 0;
}

/* ── Edit-in-place save flash ── */
.detail-fields[b-mx3q4n66zw] {
    margin-bottom: 18px;
}

.detail-save-row[b-mx3q4n66zw] {
    min-height: 18px;
    margin-bottom: 4px;
}

.saved-flash[b-mx3q4n66zw] {
    color: #1f7a3d;
    font-weight: 600;
    font-size: 85%;
}

/* ── Property photo (frame IS the file picker) ── */
.main-photo-section[b-mx3q4n66zw] {
    margin-bottom: 14px;
}

.photo-frame[b-mx3q4n66zw] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 240px;
    height: 150px;
    max-width: 100%;
    border: 2px dashed var(--wm-line);
    border-radius: var(--wm-radius-sm);
    background: var(--wm-surface-2);
    cursor: pointer;
    overflow: hidden;
    position: relative;
    margin-bottom: 6px;
}

.photo-frame.has-photo[b-mx3q4n66zw] {
    border-style: solid;
    border-color: var(--wm-line);
    background: var(--wm-surface);
}

.photo-frame:hover[b-mx3q4n66zw] {
    border-color: var(--wm-navy);
}

.photo-placeholder[b-mx3q4n66zw] {
    color: var(--wm-ink-faint);
    font-size: 95%;
    font-weight: 600;
}

/* Hide the native file input (rendered inside the InputFile child component, so it
   needs ::deep to pierce the scope); clicking the label/frame still opens the picker. */
.photo-frame[b-mx3q4n66zw]  .photo-input {
    position: absolute;
    width: 1px;
    height: 1px;
    opacity: 0;
    pointer-events: none;
}

.main-photo-preview[b-mx3q4n66zw] {
    display: block;
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
}

.del-photo[b-mx3q4n66zw] {
    background: #fff;
    border: 1px solid #a33;
    color: #a33;
    border-radius: 4px;
    padding: 4px 10px;
    cursor: pointer;
    font-size: 85%;
    margin-bottom: 6px;
}

.photo-error[b-mx3q4n66zw] {
    color: #a33;
    font-size: 85%;
    margin-top: 4px;
}

.aibq-docs[b-mx3q4n66zw] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin: 6px 0 4px;
}

.aibq-doc-row[b-mx3q4n66zw] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
}

.aibq-doc-link[b-mx3q4n66zw] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 9px 14px;
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius-sm);
    background: var(--wm-surface-2);
    color: var(--wm-navy);
    text-decoration: none;
    font-weight: 600;
    font-size: 92%;
}

.aibq-doc-link:hover[b-mx3q4n66zw] {
    background: var(--wm-inset);
    border-color: var(--wm-navy);
}

.aibq-doc-sub[b-mx3q4n66zw] {
    font-weight: 400;
    color: var(--wm-ink-soft);
    font-size: 90%;
}

.aibq-doc-email[b-mx3q4n66zw] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-left: auto;
    padding: 6px 12px;
    border: 1px solid var(--wm-navy);
    border-radius: var(--wm-radius-sm);
    background: var(--wm-surface);
    color: var(--wm-navy);
    text-decoration: none;
    font-size: 88%;
    font-weight: 600;
    white-space: nowrap;
}

.aibq-doc-email:hover[b-mx3q4n66zw] {
    background: var(--wm-navy);
    color: #fff;
}

.aibq-email-warn[b-mx3q4n66zw] {
    color: #8a5a00;
    font-style: normal;
}

/* ── Client booking portal card ── */
.portal-gen-btn[b-mx3q4n66zw] {
    background: var(--wm-navy);
    color: #fff;
    border: none;
    border-radius: var(--wm-radius-sm);
    padding: 8px 16px;
    cursor: pointer;
}

.portal-link-row[b-mx3q4n66zw] {
    display: flex;
    gap: 6px;
    margin: 6px 0;
}

.portal-link-input[b-mx3q4n66zw] {
    flex: 1;
    min-width: 0;
    padding: 6px 8px;
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius-sm);
    background: var(--wm-surface-2);
    font-size: 85%;
    color: var(--wm-ink-soft);
}

.portal-copy-btn[b-mx3q4n66zw] {
    background: var(--wm-surface);
    border: 1px solid var(--wm-line);
    color: var(--wm-navy);
    border-radius: var(--wm-radius-sm);
    padding: 6px 12px;
    cursor: pointer;
    white-space: nowrap;
}

.portal-send-row[b-mx3q4n66zw] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 4px 0 10px;
}

.portal-send-link[b-mx3q4n66zw] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    border: 1px solid var(--wm-navy);
    border-radius: var(--wm-radius-sm);
    background: var(--wm-navy);
    color: #fff;
    text-decoration: none;
    font-size: 88%;
}

.portal-send-link:hover[b-mx3q4n66zw] { filter: brightness(1.08); }

.portal-cal-row[b-mx3q4n66zw] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 8px 0 2px;
}

.portal-cal-btn[b-mx3q4n66zw] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius-sm);
    background: var(--wm-surface);
    color: var(--wm-navy);
    text-decoration: none;
    font-size: 88%;
}

.portal-cal-btn:hover[b-mx3q4n66zw] { border-color: var(--wm-navy); background: var(--wm-surface-2); }

.portal-status-row[b-mx3q4n66zw] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 8px;
    font-size: 90%;
}

.portal-status-label[b-mx3q4n66zw] { color: var(--wm-ink-faint); }

.portal-status-badge[b-mx3q4n66zw] {
    padding: 2px 10px;
    border-radius: 10px;
    font-size: 85%;
    font-weight: 600;
}

.portal-status-badge.status-confirmed[b-mx3q4n66zw] { background: #e3f4e8; color: #1d6b39; }
.portal-status-badge.status-pending[b-mx3q4n66zw] { background: #fdf1dd; color: #8a5a00; }
.portal-status-badge.status-none[b-mx3q4n66zw] { background: var(--wm-surface-2); color: var(--wm-ink-faint); }

.portal-status-when[b-mx3q4n66zw] { color: var(--wm-ink-faint); font-size: 85%; }

.portal-review[b-mx3q4n66zw] {
    margin-top: 12px;
    padding: 12px;
    border: 1px solid #d9a441;
    background: #fdf6e8;
    border-radius: var(--wm-radius-sm);
}

.portal-review-head[b-mx3q4n66zw] {
    font-weight: 600;
    color: #8a5a00;
    font-size: 90%;
    margin-bottom: 8px;
}

.portal-review-list[b-mx3q4n66zw] {
    list-style: none;
    padding: 0;
    margin: 0 0 10px;
    font-size: 90%;
}

.portal-review-list li[b-mx3q4n66zw] {
    padding: 2px 0;
    color: var(--wm-ink-soft);
}

.portal-merge-btn[b-mx3q4n66zw] {
    background: var(--wm-navy);
    color: #fff;
    border: none;
    border-radius: var(--wm-radius-sm);
    padding: 7px 16px;
    cursor: pointer;
}

.aibq-email-hint[b-mx3q4n66zw] {
    color: var(--wm-ink-faint);
    font-size: 88%;
    font-style: italic;
    margin: 6px 0 0;
}

/* ── Full-width Client booking bar (spans under both columns; masks their uneven heights) ──
   Frozen to the bottom of the viewport (sticky) so it stays visible while the form scrolls.
   Sticky (not fixed) keeps it in the content flow → correct width/offset even when the nav
   sidebar is collapsed. */
.booking-bar[b-mx3q4n66zw] {
    position: sticky;
    bottom: 0;
    z-index: 20;
    margin-top: 14px;
    border: 1px solid var(--wm-line);
    border-bottom: none;
    border-radius: var(--wm-radius) var(--wm-radius) 0 0;
    background: var(--wm-surface);
    box-shadow: 0 -3px 12px rgba(20, 24, 35, 0.10);
    padding: 12px 18px;
}

.booking-bar-title[b-mx3q4n66zw] {
    font-family: var(--wm-serif);
    font-weight: 600;
    font-size: 1.05rem;
    color: var(--wm-ink);
    margin: 0 0 10px;
}

/* Split the contents into columns so the bar stays short instead of stacking into rows. */
.booking-cols[b-mx3q4n66zw] {
    display: grid;
    grid-template-columns: 1.1fr 1fr 1.2fr;
    gap: 22px;
    align-items: start;
}

.booking-col[b-mx3q4n66zw] {
    min-width: 0;
    font-size: 0.9rem;
    color: var(--wm-ink);
}

.booking-col-label[b-mx3q4n66zw] {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--wm-ink-faint);
    margin-bottom: 5px;
}

.booking-when[b-mx3q4n66zw] { font-size: 0.8rem; color: var(--wm-ink-faint); margin-top: 5px; }
.booking-cal[b-mx3q4n66zw] { font-size: 0.78rem; color: #1f7a3d; margin-top: 8px; }
.booking-cal-off[b-mx3q4n66zw] { font-size: 0.78rem; color: var(--wm-ink-soft); margin-top: 8px; }
.booking-msg[b-mx3q4n66zw] { color: var(--wm-ink-soft); margin: 0; }

.booking-kv[b-mx3q4n66zw] { margin-bottom: 3px; line-height: 1.4; }
.booking-kv span[b-mx3q4n66zw] { color: var(--wm-ink-faint); margin-right: 4px; }

/* Stack the three columns on narrow screens. */
@media (max-width: 900px) {
    .booking-cols[b-mx3q4n66zw] { grid-template-columns: 1fr; gap: 12px; }
}

/* ── Duplicate-inspection dialog ── */
.modal-overlay[b-mx3q4n66zw] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.5);
    z-index: 999;
    display: flex;
    align-items: flex-start;
    justify-content: center;
}

.modal-box.dup-modal[b-mx3q4n66zw] {
    background: var(--wm-surface);
    width: 540px;
    max-width: 94%;
    margin: 8vh 0;
    border-radius: var(--wm-radius);
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
    padding: 20px 22px;
}

.dup-modal h3[b-mx3q4n66zw] {
    margin: 0 0 14px;
}

.dup-choice[b-mx3q4n66zw] {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-bottom: 16px;
}

.dup-choice label[b-mx3q4n66zw] {
    display: flex;
    align-items: baseline;
    gap: 8px;
    font-size: 0.92rem;
    color: var(--wm-ink);
    cursor: pointer;
}

.dup-number label[b-mx3q4n66zw] {
    display: block;
    font-weight: 600;
    font-size: 0.85rem;
    margin-bottom: 4px;
}

.dup-number input[b-mx3q4n66zw] {
    width: 100%;
    padding: 7px 9px;
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius-sm);
    font-size: 0.95rem;
}

.dup-number input:focus[b-mx3q4n66zw] {
    border-color: var(--wm-navy);
    box-shadow: 0 0 0 3px rgba(44, 62, 107, .12);
}

.dup-hint[b-mx3q4n66zw] {
    color: var(--wm-ink-soft);
    font-size: 0.8rem;
    margin: 8px 0 0;
}

.dup-modal .actions[b-mx3q4n66zw] {
    text-align: right;
    margin-top: 18px;
}

.dup-modal .actions button[b-mx3q4n66zw] {
    padding: 7px 16px;
    margin-left: 8px;
    cursor: pointer;
}

.dup-modal .actions .primary[b-mx3q4n66zw] {
    background: var(--wm-navy);
    color: #fff;
    border: 1px solid var(--wm-navy);
    border-radius: var(--wm-radius-sm);
}

/* (Agents popup styles moved to AgentPicker.razor.css.) */
/* /Components/Pages/InspectionList.razor.rz.scp.css */
.list-toolbar[b-2as2onsj8p] {
    display: flex;
    align-items: center;
    gap: 16px;
    flex-wrap: wrap;
    margin: 4px 0 12px;
}

.list-toolbar h1[b-2as2onsj8p] {
    margin: 0;
    font-size: 20px;
    white-space: nowrap;
}

.list-toolbar .back-link[b-2as2onsj8p] {
    margin-left: auto;
    white-space: nowrap;
    font-size: 90%;
}

.controls[b-2as2onsj8p] {
    display: flex;
    gap: 8px;
    align-items: center;
    flex: 1;
    min-width: 260px;
}

.controls input[b-2as2onsj8p] {
    flex: 1;
    padding: 8px;
    min-width: 0;
}

@media (max-width: 900px) {
    .list-toolbar .back-link[b-2as2onsj8p] {
        margin-left: 0;
    }
}

.controls button[b-2as2onsj8p] {
    padding: 8px 16px;
    cursor: pointer;
}

.controls .clear[b-2as2onsj8p] {
    background: var(--wm-surface-2);
}

table.inspection-table[b-2as2onsj8p] {
    border-collapse: collapse;
    width: 100%;
}

table.inspection-table th[b-2as2onsj8p],
table.inspection-table td[b-2as2onsj8p] {
    border-bottom: 1px solid var(--wm-line-soft);
    padding: 10px;
    text-align: left;
}

table.inspection-table th[b-2as2onsj8p] {
    background: var(--wm-surface-2);
    cursor: pointer;
    user-select: none;
    white-space: nowrap;
    position: sticky;
    top: 0;
    z-index: 1;
    font-family: var(--wm-mono);
    text-transform: uppercase;
    letter-spacing: .1em;
    font-size: 11px;
    color: var(--wm-ink-faint);
}

table.inspection-table th:hover[b-2as2onsj8p] {
    background: var(--wm-inset);
}

table.inspection-table tbody tr:nth-child(even)[b-2as2onsj8p] {
    background: var(--wm-surface-2);
}

table.inspection-table tr.row-link:nth-child(even):hover[b-2as2onsj8p] {
    background: var(--wm-inset);
}

tr.row-link[b-2as2onsj8p] {
    cursor: pointer;
}

tr.row-link:hover[b-2as2onsj8p] {
    background: var(--wm-inset);
}

.empty-row[b-2as2onsj8p] {
    text-align: center;
    color: var(--wm-ink-faint);
    padding: 30px;
}

.status-badge[b-2as2onsj8p] {
    display: inline-block;
    padding: 3px 10px;
    border-radius: 10px;
    font-size: 85%;
    color: #fff;
}

.status-booked[b-2as2onsj8p] {
    background: #43a047;
}

.status-inspected[b-2as2onsj8p] {
    background: #2196f3;
}

.status-reportissued[b-2as2onsj8p] {
    background: #e53935;
}

.pagination[b-2as2onsj8p] {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-top: 16px;
}

.pagination button[b-2as2onsj8p] {
    padding: 6px 14px;
    cursor: pointer;
}

.pagination button:disabled[b-2as2onsj8p] {
    cursor: default;
    opacity: 0.5;
}

.page-size-label[b-2as2onsj8p] {
    margin-left: auto;
    font-size: 90%;
    color: var(--wm-ink-soft);
}

.page-size-label select[b-2as2onsj8p] {
    padding: 4px;
    margin: 0 4px;
}
/* /Components/Pages/InspectionObservations.razor.rz.scp.css */
/* Click-to-edit Location / Recommended Action (per-inspection override). */
.ov-editable[b-kchkaiyyym] {
    cursor: pointer;
    border-bottom: 1px dashed var(--wm-line);
    padding-bottom: 1px;
}

.ov-editable:hover[b-kchkaiyyym] {
    color: #2c3e6b;
    border-bottom-color: #2c3e6b;
    background: var(--wm-inset);
}

.ov-editable[b-kchkaiyyym]::after {
    content: " \270E";   /* ✎ pencil hint */
    font-size: 85%;
    color: var(--wm-ink-faint);
}

/* Marks a value that differs from the library default for this inspection. */
.ov-badge[b-kchkaiyyym] {
    display: inline-block;
    margin-left: 6px;
    padding: 0 6px;
    font-size: 72%;
    font-weight: 600;
    color: #8a5a00;
    background: #fff3d6;
    border: 1px solid #e6c983;
    border-radius: 9px;
    vertical-align: middle;
}

.checklist-header[b-kchkaiyyym] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    max-width: none;
    margin: 0;
}

.checklist-header h1[b-kchkaiyyym] {
    margin-bottom: 2px;
}

.subtitle[b-kchkaiyyym] {
    color: var(--wm-ink-soft);
    margin-bottom: 4px;
}

/* Frozen top block: report#/client header + status badge + Inspection link + the
   systems bar all stay pinned together while the checklist scrolls beneath. */
.checklist-frozen[b-kchkaiyyym] {
    position: sticky;
    top: 0;
    z-index: 30;
    background: var(--wm-surface);
    padding-top: 6px;
}
/* The ribbons carry their own sticky; inside the frozen wrapper they ride with it. */
.checklist-frozen[b-kchkaiyyym]  .system-ribbons {
    position: static;
    top: auto;
}

.ch-title[b-kchkaiyyym] { min-width: 0; }

.ch-meta[b-kchkaiyyym] {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-shrink: 0;
}

.ch-status[b-kchkaiyyym] {
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    padding: 2px 9px;
    border-radius: 999px;
    white-space: nowrap;
}
.ch-status-booked[b-kchkaiyyym] { background: #e6edf7; color: #2c3e6b; }
.ch-status-inspected[b-kchkaiyyym] { background: #fff3d6; color: #8a6100; }
.ch-status-reportissued[b-kchkaiyyym] { background: #e3f5e6; color: #1c7c3a; }

.ch-inspection-link[b-kchkaiyyym] {
    color: var(--wm-navy);
    text-decoration: none;
    font-size: 13px;
    white-space: nowrap;
}
.ch-inspection-link:hover[b-kchkaiyyym] { text-decoration: underline; }

.mode-note[b-kchkaiyyym] {
    font-size: 85%;
    color: var(--wm-ink-faint);
}

.mode-note a[b-kchkaiyyym] {
    color: #2c3e6b;
}

.system-tabs[b-kchkaiyyym] {
    max-width: 1100px;
    margin: 16px auto 0;
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    border-bottom: 2px solid var(--wm-line);
    padding-bottom: 10px;
}

/* Single-line variant: all system tabs on one row, horizontal scroll if needed. */
.system-tabs.single-line[b-kchkaiyyym] {
    max-width: none;
    flex-wrap: nowrap;
    overflow-x: auto;
    scrollbar-width: thin;
}

.system-tabs.single-line .tab[b-kchkaiyyym] {
    flex: 0 0 auto;
    white-space: nowrap;
}

/* "SUMMARY" link sits under the tabs row. */
.summary-link[b-kchkaiyyym] {
    margin: 8px 0 16px;
}

.summary-link a[b-kchkaiyyym] {
    font-weight: bold;
    letter-spacing: 1px;
    font-size: 88%;
    text-decoration: none;
    color: #2c3e6b;
}

.summary-link a:hover[b-kchkaiyyym] {
    text-decoration: underline;
}

.tab[b-kchkaiyyym] {
    padding: 8px 14px;
    border: 1px solid var(--wm-line);
    background: var(--wm-surface-2);
    border-radius: var(--wm-radius-sm);
    cursor: pointer;
    font-size: 90%;
}

.tab.active[b-kchkaiyyym] {
    background: #2c3e6b;
    color: #fff;
    border-color: #2c3e6b;
}

.tab .badge[b-kchkaiyyym] {
    display: inline-block;
    background: #e53935;
    color: #fff;
    border-radius: 10px;
    padding: 1px 7px;
    font-size: 80%;
    margin-left: 6px;
}

.tab.active .badge[b-kchkaiyyym] {
    background: #fff;
    color: #2c3e6b;
}

.empty-note[b-kchkaiyyym] {
    max-width: none;
    margin: 20px 0;
    color: var(--wm-ink-faint);
    font-style: italic;
}

.checklist-body[b-kchkaiyyym] {
    max-width: none;
    margin: 20px 0;
}

.subsystem-section[b-kchkaiyyym] {
    margin-bottom: 24px;
}

.subsystem-section h3[b-kchkaiyyym] {
    background: var(--wm-inset);
    padding: 8px 12px;
    border-radius: var(--wm-radius-sm);
    margin-bottom: 10px;
}

.component-block[b-kchkaiyyym] {
    margin: 10px 0 16px 16px;
}

.component-block h4[b-kchkaiyyym] {
    font-size: 100%;
    color: #444;
    margin-bottom: 6px;
}

.observation-card[b-kchkaiyyym] {
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius);
    padding: 12px 14px;
    margin: 0 0 10px 12px;
    background: var(--wm-surface);
    box-shadow: var(--wm-shadow-sm);
}

.observation-card.defect[b-kchkaiyyym] {
    border-left: 4px solid #c2410c;
}

.observation-title[b-kchkaiyyym] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-weight: bold;
    cursor: pointer;
    margin-bottom: 6px;
}

.obs-field[b-kchkaiyyym] {
    font-size: 90%;
    color: #444;
    margin: 1px 0 1px 22px;
}

.observation-title.readonly[b-kchkaiyyym] {
    cursor: default;
}

/* One-line titles: truncate long names with an ellipsis; the full text shows on hover
   (title attribute) and when the card is expanded. */
.observation-title[b-kchkaiyyym] {
    min-width: 0;
}

.obs-title-text[b-kchkaiyyym] {
    flex: 1;
    min-width: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.observation-card.expanded .obs-title-text[b-kchkaiyyym] {
    white-space: normal;
    overflow: visible;
}

/* Compact marker (replaces the verbose "For this inspection only" badge, which crowded
   out the title). Full meaning is in the hover tooltip / aria-label. */
.io-marker[b-kchkaiyyym] {
    flex: 0 0 auto;
    color: #6c5ce7;
    font-size: 0.55rem;
    line-height: 1;
    cursor: help;
    user-select: none;
}

.summary-system-block[b-kchkaiyyym] {
    max-width: none;
    margin: 0 0 30px;
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius);
    padding: 14px 18px;
    background: var(--wm-surface);
    box-shadow: var(--wm-shadow);
}

.summary-system-header[b-kchkaiyyym] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 2px solid #2c3e6b;
    padding-bottom: 8px;
    margin-bottom: 10px;
}

.summary-system-header h2[b-kchkaiyyym] {
    margin: 0;
    font-size: 120%;
}

.edit-link[b-kchkaiyyym] {
    background: #2c3e6b;
    color: #fff;
    border: none;
    border-radius: var(--wm-radius-sm);
    padding: 6px 14px;
    cursor: pointer;
    font-size: 85%;
}

.back-to-summary[b-kchkaiyyym] {
    background: none;
    border: none;
    color: #2c3e6b;
    cursor: pointer;
    font-size: 95%;
    padding: 0;
    text-decoration: underline;
}

.obs-header[b-kchkaiyyym] {
    display: flex;
    align-items: center;
    gap: 4px;
    margin-bottom: 6px;
}

.obs-header .observation-title[b-kchkaiyyym] {
    flex: 1;
    margin-bottom: 0;
}

.icon-btn[b-kchkaiyyym] {
    background: none;
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius-sm);
    width: 24px;
    height: 24px;
    cursor: pointer;
    font-size: 85%;
}

.icon-btn.danger[b-kchkaiyyym] {
    color: #a33;
    border-color: #a33;
}

.condition-edit-form[b-kchkaiyyym] {
    border: 1px solid #2c3e6b;
    border-radius: var(--wm-radius-sm);
    padding: 10px;
    margin: 0 0 10px 12px;
    background: var(--wm-surface);
}

.row2[b-kchkaiyyym] {
    display: flex;
    gap: 8px;
    margin-bottom: 6px;
}

.row2 > input[b-kchkaiyyym],
.row2 > textarea[b-kchkaiyyym] {
    flex: 1;
    padding: 6px;
    box-sizing: border-box;
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius-sm);
}

.row2 > input:focus[b-kchkaiyyym],
.row2 > textarea:focus[b-kchkaiyyym] {
    outline: none;
    border-color: var(--wm-navy);
    box-shadow: 0 0 0 3px rgba(44, 62, 107, .12);
}

.row2 > textarea[b-kchkaiyyym] {
    min-height: 50px;
    resize: vertical;
}

.defect-toggle[b-kchkaiyyym] {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 90%;
    color: #444;
}

.type-chip[b-kchkaiyyym] {
    font-size: 80%;
    font-weight: 600;
    border-radius: 10px;
    padding: 2px 10px;
    align-self: center;
    border: 1px solid transparent;
}

.type-chip.char[b-kchkaiyyym] {
    background: #d3efe9;
    color: #0f766e;
    border-color: #8fd6ca;
}

.type-chip.obs[b-kchkaiyyym] {
    background: #ffe4d0;
    color: #b8420c;
    border-color: #f4a97a;
}

.condition-edit-form .actions[b-kchkaiyyym] {
    text-align: right;
}

.condition-edit-form .actions button[b-kchkaiyyym] {
    margin-left: 6px;
}

.add-link[b-kchkaiyyym] {
    background: none;
    border: none;
    color: #2c3e6b;
    cursor: pointer;
    font-size: 90%;
    padding: 4px 0 4px 12px;
}

.add-link:hover[b-kchkaiyyym] {
    text-decoration: underline;
}

/* Compact "+" add button (replaces the "+ Add observation" text) */
.add-link.add-plus[b-kchkaiyyym] {
    padding: 0;
    width: 22px;
    height: 22px;
    line-height: 20px;
    text-align: center;
    font-size: 16px;
    font-weight: 700;
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius-sm);
    margin: 2px 0 4px;
}
.add-link.add-plus:hover[b-kchkaiyyym] {
    text-decoration: none;
    background: var(--wm-inset);
    border-color: #c2410c;
    color: #c2410c;
}

.custom-tag[b-kchkaiyyym] {
    background: #6c5ce7;
    color: #fff;
    font-size: 75%;
    padding: 2px 8px;
    border-radius: 10px;
}

.override-note[b-kchkaiyyym] {
    font-size: 82%;
    color: var(--wm-ink-soft);
    font-style: italic;
    margin: 0 0 8px;
}

.photo-section[b-kchkaiyyym] {
    margin-top: 10px;
    border-top: 1px dashed var(--wm-line);
    padding-top: 8px;
}

.photo-gallery[b-kchkaiyyym] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 8px;
}

.photo-thumb[b-kchkaiyyym] {
    position: relative;
    width: 80px;
    height: 80px;
}

.photo-thumb img[b-kchkaiyyym] {
    width: 80px;
    height: 80px;
    object-fit: cover;
    border-radius: var(--wm-radius-sm);
    border: 1px solid var(--wm-line);
}

.photo-delete[b-kchkaiyyym] {
    position: absolute;
    top: -6px;
    right: -6px;
    background: #a33;
    color: #fff;
    border: none;
    border-radius: 50%;
    width: 20px;
    height: 20px;
    font-size: 80%;
    cursor: pointer;
    line-height: 1;
}

.photo-upload-input[b-kchkaiyyym] {
    font-size: 85%;
}

.photo-error[b-kchkaiyyym] {
    display: block;
    color: #a33;
    font-size: 82%;
    margin-top: 4px;
}

/* ── Collapsible subsystem headers ── */
.subsystem-header[b-kchkaiyyym] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    cursor: pointer;
    user-select: none;
    background: var(--wm-inset);
    padding: 8px 12px;
    border-radius: var(--wm-radius-sm);
    margin-bottom: 10px;
}

.subsystem-header:hover[b-kchkaiyyym] {
    background: #dde3f0;
}

.subsystem-chevron[b-kchkaiyyym] {
    font-size: 80%;
    color: var(--wm-ink-soft);
    flex-shrink: 0;
    margin-left: 8px;
}

/* ── Translate row inside edit/add forms ── */
.translate-row[b-kchkaiyyym] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px 10px;
    margin-bottom: 8px;
    padding: 6px 8px;
    background: var(--wm-inset);
    border-radius: var(--wm-radius-sm);
    border: 1px dashed var(--wm-line);
}

.translate-label[b-kchkaiyyym] {
    font-size: 82%;
    color: var(--wm-ink-soft);
    font-weight: 600;
    white-space: nowrap;
}

.translate-btn[b-kchkaiyyym] {
    display: flex;
    align-items: center;
    gap: 5px;
    padding: 4px 12px;
    background: #2c3e6b;
    color: #fff;
    border: none;
    border-radius: var(--wm-radius-sm);
    cursor: pointer;
    font-size: 85%;
    white-space: nowrap;
}

.translate-btn:disabled[b-kchkaiyyym] {
    background: #8a9cc0;
    cursor: not-allowed;
}

.translate-btn:hover:not(:disabled)[b-kchkaiyyym] {
    background: #1e2d52;
}

.translate-spinner[b-kchkaiyyym] {
    animation: spin-b-kchkaiyyym 1s linear infinite;
    display: inline-block;
}

@keyframes spin-b-kchkaiyyym {
    from { transform: rotate(0deg); }
    to   { transform: rotate(360deg); }
}

.translate-error[b-kchkaiyyym] {
    font-size: 82%;
    color: #a33;
    flex-basis: 100%;
}

/* ── Copy-to panel ── */
.copy-panel[b-kchkaiyyym] {
    border-color: #6c5ce7;
    background: #f8f7ff;
}

.dest-chooser[b-kchkaiyyym] {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    margin-bottom: 8px;
}

.dest-option[b-kchkaiyyym] {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 90%;
    color: #333;
    cursor: pointer;
}

.dest-hint[b-kchkaiyyym] {
    color: var(--wm-ink-faint);
    font-size: 88%;
}

.dest-selects[b-kchkaiyyym] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 8px;
}

.dest-selects select[b-kchkaiyyym] {
    flex: 1;
    min-width: 160px;
    padding: 6px;
    box-sizing: border-box;
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius-sm);
}

.dest-selects select:focus[b-kchkaiyyym] {
    outline: none;
    border-color: var(--wm-navy);
    box-shadow: 0 0 0 3px rgba(44, 62, 107, .12);
}

.dest-selects select:disabled[b-kchkaiyyym] {
    background: var(--wm-inset);
    color: var(--wm-ink-faint);
}

.copy-error[b-kchkaiyyym] {
    color: #a33;
    font-size: 85%;
    margin: 4px 0;
}

.copy-result[b-kchkaiyyym] {
    max-width: none;
    margin: 14px 0 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    background: #eafaf1;
    border: 1px solid #59b287;
    color: #1c6b45;
    border-radius: 4px;
    padding: 8px 14px;
    font-size: 90%;
}

.copy-result-dismiss[b-kchkaiyyym] {
    background: none;
    border: none;
    color: #1c6b45;
    font-size: 130%;
    line-height: 1;
    cursor: pointer;
    padding: 0 2px;
}

/* ── Media galleries + bottom action row (Photo left, Diagram right) ── */
/* Two columns: photos wrap side-by-side on the left (over the Photo button),
   diagrams wrap side-by-side on the right (over the Diagram button). */
.media-galleries[b-kchkaiyyym] {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    margin-top: 10px;
}

.gallery-col[b-kchkaiyyym] {
    min-width: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

/* Photos take the rest of the row. */
.gallery-left[b-kchkaiyyym] {
    flex: 1 1 auto;
    justify-content: flex-start;
}

/* Diagrams are sparse (usually 1-2) - reserve just enough for two 90px
   thumbnails (90 + 8 gap + 90 = 188px); a 3rd wraps below, still right-aligned. */
.gallery-right[b-kchkaiyyym] {
    flex: 0 0 188px;
    max-width: 188px;
    justify-content: flex-end;
}

/* No diagrams attached: collapse the reserved right column so media-less cards
   stay compact (both a marker class and :empty, for robustness). */
.gallery-right.empty[b-kchkaiyyym],
.gallery-right:empty[b-kchkaiyyym] {
    flex-basis: 0;
    max-width: 0;
    padding: 0;
    margin: 0;
}

.media-actions[b-kchkaiyyym] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 12px;
    margin-top: 10px;
    border-top: 1px dashed var(--wm-line);
    padding-top: 8px;
}

.media-left[b-kchkaiyyym], .media-right[b-kchkaiyyym] {
    display: flex;
    align-items: center;
    gap: 8px;
}

/* Button-styled label wrapping a hidden file input (no "No file chosen" text). */
.media-btn[b-kchkaiyyym] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: #2c3e6b;
    color: #fff;
    border: none;
    border-radius: var(--wm-radius-sm);
    padding: 6px 14px;
    font-size: 88%;
    cursor: pointer;
}

.media-btn:hover[b-kchkaiyyym] { background: #1e2d52; }

.media-btn .hidden-file[b-kchkaiyyym] { display: none; }

/* The camera capture button — accent it so it reads as the primary on-site action. */
.media-btn.media-cam[b-kchkaiyyym] { background: #1c7a4f; }
.media-btn.media-cam:hover[b-kchkaiyyym] { background: #155f3d; }

/* ── Field mode: on-site tablet layout ─────────────────────────────────────────
   Toggled per-device via FieldModeToggle (localStorage). Everything below is scoped
   to .capture-page.field-mode, so desktop (toggle off) is completely unchanged.
   Designed to the Galaxy A7 landscape width (~800px) as the floor. */
.capture-page.field-mode .media-actions[b-kchkaiyyym] { flex-wrap: wrap; gap: 8px; }
.capture-page.field-mode .media-btn[b-kchkaiyyym] {
    min-height: 44px;
    padding: 10px 18px;
    font-size: 100%;
}
.capture-page.field-mode .add-link.add-plus[b-kchkaiyyym] {
    min-width: 48px;
    min-height: 48px;
    font-size: 1.5rem;
}
.capture-page.field-mode .photo-delete[b-kchkaiyyym] {
    width: 30px;
    height: 30px;
    font-size: 1.2rem;
}
/* Bigger checkboxes / photo thumbs for gloved or in-a-hurry taps. */
.capture-page.field-mode input[type="checkbox"][b-kchkaiyyym] { width: 22px; height: 22px; }
.capture-page.field-mode .photo-thumb img[b-kchkaiyyym] { width: 84px; height: 84px; }
/* Roomier text inputs so on-screen-keyboard entry is comfortable. */
.capture-page.field-mode input[type="text"][b-kchkaiyyym],
.capture-page.field-mode textarea[b-kchkaiyyym],
.capture-page.field-mode select[b-kchkaiyyym] { min-height: 42px; font-size: 16px; }  /* 16px stops iOS/Android zoom-on-focus */

/* One big, readable column on-site (drop the 2/3-up packing) so each observation gets
   full width for touch + the on-screen keyboard. */
.capture-page.field-mode .checklist-body[b-kchkaiyyym],
.capture-page.field-mode .summary-system-block[b-kchkaiyyym] { grid-template-columns: 1fr; }

/* Highlight an observation card while dragging a photo over it. */
.observation-card.drag-over[b-kchkaiyyym] {
    outline: 2px dashed #2c3e6b;
    outline-offset: 2px;
    background: #eef3ff;
}

/* ── Compact density: smaller bars/fonts from subsystem level down, to fit
   more lines per printed sheet. Selectors match existing specificity and come
   later in the file, so they win. ── */
.subsystem-section[b-kchkaiyyym] {
    margin-bottom: 12px;
}

.subsystem-section h3[b-kchkaiyyym],
.subsystem-header[b-kchkaiyyym] {
    padding: 4px 10px;
    margin-bottom: 6px;
    font-size: 0.95rem;
}

.component-block[b-kchkaiyyym] {
    margin: 6px 0 8px 14px;
}

.component-block h4[b-kchkaiyyym] {
    font-size: 86%;
    margin-bottom: 3px;
}

.observation-card[b-kchkaiyyym] {
    padding: 2px 8px;
    margin: 0 0 2px 10px;
}

.observation-title[b-kchkaiyyym] {
    font-size: 90%;
    margin-bottom: 3px;
    gap: 6px;
}

.obs-header[b-kchkaiyyym] {
    gap: 3px;
    margin-bottom: 1px;
}

.obs-field[b-kchkaiyyym] {
    font-size: 80%;
    margin: 2px 0 2px 20px;
}

.icon-btn[b-kchkaiyyym] {
    width: 20px;
    height: 20px;
    font-size: 78%;
}

.custom-tag[b-kchkaiyyym] {
    font-size: 70%;
    padding: 1px 6px;
}

/* ── Two-level density: tile the subsystems into a responsive grid (2+ side by side),
   and within each subsystem flow its observation cards into columns too — so a system
   reads as several compact subsystem tiles, each packing its cards. Many items per screen.
   Edit view: subsystems are direct children of .checklist-body. Summary view: each system
   spans full width and tiles its own subsystems. Component headings, active edit/add
   forms, and the add button span the subsystem width; cards stay whole. ── */
.checklist-body[b-kchkaiyyym] {
    display: grid;
    /* Up to 3 columns filling the row; drops to 2 then 1 as the screen narrows.
       The max() floor (300px) sets the drop points; the (100%-32px)/3 term caps it
       at 3 so a wide monitor never packs in 4+. */
    grid-template-columns: repeat(auto-fill, minmax(max(300px, (100% - 32px) / 3), 1fr));
    row-gap: 8px;
    column-gap: 16px;
    align-items: start;
}

.summary-system-block[b-kchkaiyyym] {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(max(300px, (100% - 32px) / 3), 1fr));
    row-gap: 8px;
    column-gap: 16px;
    align-items: start;
}

.summary-system-header[b-kchkaiyyym] {
    grid-column: 1 / -1;
}

.subsystem-section[b-kchkaiyyym] {
    /* Single inner column so each condition uses the full card width (was
       column-width:210px → cards split into 2 inner columns, truncating the wording). */
    column-count: 1;
    column-gap: 14px;
    /* Frame each subsystem tile. Defects use the orange severity scheme (NOT the navy
       of the Characteristics view) - same polished framed look, different colour. */
    border: 1px solid #e0b5a0;
    border-radius: var(--wm-radius);
    box-shadow: var(--wm-shadow-sm);
    background: var(--wm-surface);
    overflow: hidden;
    padding: 0 8px 8px;
    margin-bottom: 0;
}

.component-block[b-kchkaiyyym] {
    display: contents;
}

.subsystem-section > .subsystem-header[b-kchkaiyyym],
.subsystem-section h4[b-kchkaiyyym],
.condition-edit-form[b-kchkaiyyym],
.component-block .add-link[b-kchkaiyyym] {
    column-span: all;
}

/* Subsystem name as an orange band across the top of the framed tile. */
.subsystem-section > .subsystem-header[b-kchkaiyyym] {
    background: #c2410c;
    color: #fff;
    margin: 0 -8px 8px;
    padding: 6px 10px;
    border-radius: 0;
}

.subsystem-section > .subsystem-header:hover[b-kchkaiyyym] {
    background: #a8380b;
}

.subsystem-section > .subsystem-header .subsystem-chevron[b-kchkaiyyym] {
    color: #fff;
}

.subsystem-section h4[b-kchkaiyyym] {
    margin-top: 4px;
    margin-bottom: 1px;
    color: #c2410c;
}

/* Clickable content rects: less round, flat inside the frame, and filled (increased
   opacity) when checked/recorded. */
.observation-card[b-kchkaiyyym] {
    break-inside: avoid;
    -webkit-column-break-inside: avoid;
    page-break-inside: avoid;
    margin-left: 0;
    border-radius: 3px;
    box-shadow: none;
    /* Shave the full border - inside the framed subsystem it just adds clutter. Keep
       only the orange defect left-edge (below) plus the checked fill for definition. */
    border: none;
}

.observation-card.checked[b-kchkaiyyym] {
    background: #f7ddd0;
}

/* Collapsed cards show only the checkbox + title. The copy / copy-to / edit actions and
   the per-card expand arrow appear only when the card is expanded (click the title to
   expand). The subsystem collapse chevron is a separate element (.subsystem-chevron) and
   is intentionally NOT affected. */
.observation-card:not(.expanded) .obs-header .icon-btn[b-kchkaiyyym] {
    display: none;
}

/* Collapse to a single column on narrow tablets/phones - no horizontal page scroll. */
@media (max-width: 700px) {
    .checklist-body[b-kchkaiyyym],
    .summary-system-block[b-kchkaiyyym] {
        grid-template-columns: 1fr;
    }
    .subsystem-section[b-kchkaiyyym] {
        column-width: auto;
        column-count: 1;
    }
}

/* ── Keyword search: locate an observation ── */
.obs-search[b-kchkaiyyym] {
    position: relative;
    max-width: 520px;
    margin: 4px 0 10px;
}

.obs-search-input[b-kchkaiyyym] {
    width: 100%;
    padding: 9px 32px 9px 12px;
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius-sm);
    font-size: 0.95rem;
    background: var(--wm-surface);
}

.obs-search-input:focus[b-kchkaiyyym] {
    outline: none;
    border-color: var(--wm-navy);
    box-shadow: 0 0 0 3px var(--wm-inset);
}

.obs-search-clear[b-kchkaiyyym] {
    position: absolute;
    right: 6px;
    top: 7px;
    border: none;
    background: none;
    font-size: 1.2rem;
    line-height: 1;
    color: var(--wm-ink-faint);
    cursor: pointer;
    padding: 2px 6px;
}

.obs-search-clear:hover[b-kchkaiyyym] { color: var(--wm-ink); }

/* Suggestions dropdown floats over the list. */
.obs-suggest[b-kchkaiyyym] {
    position: absolute;
    z-index: 30;
    top: calc(100% + 3px);
    left: 0;
    right: 0;
    max-height: 340px;
    overflow-y: auto;
    background: var(--wm-surface);
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius-sm);
    box-shadow: var(--wm-shadow);
}

.obs-suggest-item[b-kchkaiyyym] {
    display: flex;
    flex-direction: column;
    gap: 1px;
    width: 100%;
    text-align: left;
    padding: 8px 12px;
    border: none;
    border-bottom: 1px solid var(--wm-line-soft);
    background: none;
    cursor: pointer;
}

.obs-suggest-item:last-child[b-kchkaiyyym] { border-bottom: none; }
.obs-suggest-item:hover[b-kchkaiyyym] { background: var(--wm-inset); }

.obs-suggest-name[b-kchkaiyyym] { font-size: 0.9rem; color: var(--wm-ink); }
.obs-suggest-path[b-kchkaiyyym] { font-size: 0.76rem; color: var(--wm-ink-soft); }

.obs-suggest-empty[b-kchkaiyyym] {
    padding: 10px 12px;
    color: var(--wm-ink-soft);
    font-size: 0.9rem;
}

/* Brief highlight when the search jumps to an observation (JS adds .focus-flash). */
.observation-card.focus-flash[b-kchkaiyyym] {
    animation: obs-flash-b-kchkaiyyym 1.6s ease-out;
}

@keyframes obs-flash-b-kchkaiyyym {
    0%   { box-shadow: 0 0 0 3px #f4c86a, 0 0 0 6px rgba(244, 200, 106, .35); }
    100% { box-shadow: 0 0 0 3px transparent, 0 0 0 6px transparent; }
}

/* Tag on a hit that matched the explanation/consequences rather than the name, so a
   description match reads as intentional, not noise. */
.obs-suggest-src[b-kchkaiyyym] {
    font-style: italic;
    color: var(--wm-plum);
    margin-left: 4px;
}

/* "+N more" reveals the rest of the matches below the top ones. */
.obs-suggest-more[b-kchkaiyyym] {
    display: block;
    width: 100%;
    text-align: center;
    padding: 7px;
    border: none;
    border-top: 1px solid var(--wm-line);
    background: var(--wm-surface-2);
    color: var(--wm-navy);
    font-size: 0.82rem;
    font-weight: 600;
    cursor: pointer;
}

.obs-suggest-more:hover[b-kchkaiyyym] { background: var(--wm-inset); }

/* ── Double-click-to-edit cell (per-field inline editing) ── */
.obs-cell .cell-view[b-kchkaiyyym] {
    cursor: text;
    border-radius: var(--wm-radius-sm);
    padding: 1px 3px;
    /* Hint that the text is editable on hover without shouting for attention. */
    transition: background .1s ease;
}
.obs-cell .cell-view:hover[b-kchkaiyyym] { background: var(--wm-inset); }
.obs-cell.editing[b-kchkaiyyym] { display: block; }
.cell-edit[b-kchkaiyyym] {
    display: block;
    width: 100%;
    margin-top: 3px;
    min-height: 3.2em;
    box-sizing: border-box;
    font: inherit;
    padding: 6px 8px;
    border: 1px solid var(--wm-navy);
    border-radius: var(--wm-radius-sm);
    resize: vertical;
}
/* The title/name is a single line — override the textarea defaults. */
.cell-edit-inline[b-kchkaiyyym] {
    display: inline-block;
    width: auto;
    min-width: 16em;
    max-width: 100%;
    margin-top: 0;
    min-height: 0;
    padding: 2px 6px;
    resize: none;
}

/* ── Per-defect Location / Recommended-Action dropdowns ── */
.obs-field.obs-pick[b-kchkaiyyym] { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.obs-pick-select[b-kchkaiyyym] {
    flex: 1 1 220px;
    min-width: 160px;
    padding: 5px 8px;
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius-sm);
    background: var(--wm-surface);
    font-size: 0.9rem;
}
.obs-pick-select:focus[b-kchkaiyyym] { outline: none; border-color: var(--wm-navy); box-shadow: 0 0 0 3px rgba(44, 62, 107, .12); }

/* ── Inline one-off entry (fast, this-inspection-only Location/Action) ── */
.obs-oneoff[b-kchkaiyyym] { display: flex; align-items: center; gap: 6px; flex: 1 1 100%; margin-top: 4px; }
.obs-oneoff-input[b-kchkaiyyym] {
    flex: 1 1 auto;
    min-width: 160px;
    padding: 5px 8px;
    border: 1px solid var(--wm-navy);
    border-radius: var(--wm-radius-sm);
    background: var(--wm-surface);
}
.obs-oneoff-input:focus[b-kchkaiyyym] { outline: none; box-shadow: 0 0 0 3px rgba(44, 62, 107, .12); }
.obs-oneoff-save[b-kchkaiyyym], .obs-oneoff-cancel[b-kchkaiyyym] {
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius-sm);
    background: var(--wm-surface);
    cursor: pointer;
    padding: 4px 9px;
    line-height: 1;
}
.obs-oneoff-save[b-kchkaiyyym] { color: #1f7a3d; border-color: #1f7a3d; }
.obs-oneoff-cancel[b-kchkaiyyym] { color: var(--wm-ink-soft); }

/* ── Inline "Edit list…" popup ── */
.obs-listedit-overlay[b-kchkaiyyym] {
    position: fixed;
    inset: 0;
    background: rgba(20, 26, 43, .35);
    z-index: 1000;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: 8vh 16px 16px;
}
.obs-listedit[b-kchkaiyyym] {
    background: var(--wm-surface);
    border-radius: var(--wm-radius);
    box-shadow: var(--wm-shadow);
    width: 560px;
    max-width: 96%;
    max-height: 80vh;
    overflow-y: auto;
    padding: 18px 20px;
}
.obs-listedit h3[b-kchkaiyyym] { margin: 0 0 4px; font-size: 1.05rem; }
.obs-listedit-hint[b-kchkaiyyym] { margin: 0 0 12px; font-size: 0.82rem; color: var(--wm-ink-soft); }
.obs-listedit-rows[b-kchkaiyyym] { display: flex; flex-direction: column; gap: 6px; }
.obs-listedit-row[b-kchkaiyyym] { display: flex; gap: 6px; align-items: center; }
.obs-listedit-row input[b-kchkaiyyym] {
    flex: 1 1 0;
    min-width: 0;
    padding: 6px 8px;
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius-sm);
    font-size: 0.9rem;
}
.obs-listedit-del[b-kchkaiyyym] {
    flex: 0 0 auto;
    background: none;
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius-sm);
    color: var(--wm-ink-soft);
    font-size: 1.1rem;
    line-height: 1;
    padding: 2px 8px;
    cursor: pointer;
}
.obs-listedit-del:hover[b-kchkaiyyym] { color: #c0392b; border-color: #c0392b; }
.obs-listedit-add[b-kchkaiyyym] { margin-top: 8px; border-top: 1px dashed var(--wm-line); padding-top: 10px; }
.obs-listedit-addbtn[b-kchkaiyyym] {
    flex: 0 0 auto;
    background: var(--wm-surface-2);
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius-sm);
    color: var(--wm-navy);
    font-weight: 600;
    padding: 6px 14px;
    cursor: pointer;
}
.obs-listedit-addbtn:hover[b-kchkaiyyym] { background: var(--wm-inset); }
.obs-listedit-actions[b-kchkaiyyym] { display: flex; justify-content: flex-end; margin-top: 16px; }
.obs-listedit-actions .primary[b-kchkaiyyym] {
    background: var(--wm-navy);
    color: #fff;
    border: none;
    border-radius: var(--wm-radius-sm);
    padding: 8px 18px;
    font-weight: 600;
    cursor: pointer;
}
/* /Components/Pages/InspectionReport.razor.rz.scp.css */
.toolbar[b-xsrk6gmtln] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 24px;
    background: #f5f5f5;
    border-bottom: 1px solid #ddd;
    position: sticky;
    top: 0;
}

.lang-toggle button[b-xsrk6gmtln] {
    padding: 5px 12px;
    border: 1px solid #ccc;
    background: #fff;
    cursor: pointer;
}

.lang-toggle button.active[b-xsrk6gmtln] {
    background: #333;
    color: #fff;
}

.print-btn[b-xsrk6gmtln] {
    padding: 7px 16px;
    background: #2c3e6b;
    color: #fff;
    border: none;
    border-radius: 4px;
    cursor: pointer;
}

.print-btn:disabled[b-xsrk6gmtln] {
    opacity: 0.6;
    cursor: default;
}

.issued-badge[b-xsrk6gmtln] {
    color: #1f7a3d;
    font-weight: 700;
}

.issued-history[b-xsrk6gmtln] {
    max-width: 800px;
    margin: 0 auto 10px;
    padding: 6px 30px;
    font-size: 13px;
    color: #444;
}

.issued-chip[b-xsrk6gmtln] {
    display: inline-block;
    margin: 3px 6px 0 0;
    padding: 3px 10px;
    background: #eef1f8;
    border: 1px solid #d5dcec;
    border-radius: 12px;
}

.issued-date[b-xsrk6gmtln] {
    color: #777;
}

.report-page[b-xsrk6gmtln] {
    max-width: 820px;
    margin: 0 auto;
    padding: 44px;                 /* (1) roomier margins on the generated sheet */
    /* Clean sans-serif to match the sample report (was Georgia serif). */
    font-family: Arial, 'Helvetica Neue', Helvetica, 'Segoe UI', sans-serif;
    font-size: 13.5px;
    line-height: 1.55;             /* a touch more leading for readability */
    color: #222;
}

.report-page h1[b-xsrk6gmtln] {
    text-align: center;
    border-bottom: 2px solid #2c3e6b;
    padding-bottom: 10px;
}

.summary-table[b-xsrk6gmtln] {
    width: 100%;
    margin: 20px 0 30px;
    border-collapse: collapse;
}

.summary-table td[b-xsrk6gmtln] {
    padding: 4px 8px;
    border-bottom: 1px solid #eee;
}

.empty-note[b-xsrk6gmtln] {
    color: #888;
    font-style: italic;
}

.system-section[b-xsrk6gmtln] {
    margin-bottom: 26px;
}

.system-section h2[b-xsrk6gmtln] {
    background: #eef1f8;
    padding: 6px 10px;
    border-radius: 3px;
}

.system-section h3[b-xsrk6gmtln] {
    font-size: 105%;
    color: #444;
    margin: 14px 0 6px;
}

.finding-list[b-xsrk6gmtln] {
    list-style: none;
    padding-left: 0;
    margin: 0 0 10px;
}

.finding-list li[b-xsrk6gmtln] {
    margin-bottom: 10px;
    padding-left: 4px;
}

.finding-list li.defect .finding-name[b-xsrk6gmtln] {
    color: #c2410c;
}

.finding-name[b-xsrk6gmtln] {
    font-weight: bold;
}

.detail[b-xsrk6gmtln] {
    font-size: 90%;
    color: #444;
    margin-left: 14px;
    text-align: justify;
}

.standing-section[b-xsrk6gmtln] {
    margin-top: 30px;
}

.standing-section h2[b-xsrk6gmtln] {
    border-bottom: 1px solid #ccc;
    padding-bottom: 6px;
}

.section-content[b-xsrk6gmtln] {
    white-space: pre-wrap;
    text-align: justify;
}

.attached-doc-note[b-xsrk6gmtln] {
    font-size: 90%;
}

.page-break[b-xsrk6gmtln] {
    page-break-before: always;
}

@media print {
    .no-print[b-xsrk6gmtln] {
        display: none !important;
    }

    .report-page[b-xsrk6gmtln] {
        padding: 0;
    }
}

/* On-screen only: tighten the generous print margins so the preview scrolls less,
   and render the report as a paper sheet with every forced page break shown as a
   labelled divider — so the inspector sees where pages split BEFORE issuing/printing.
   Print output is unchanged. (Automatic content overflow within a section isn't split
   into separate on-screen sheets; that only happens on paper / in the PDF.) */
@media screen {
    .cover-block[b-xsrk6gmtln] { margin: 14px 0; }
    .cover-conducted[b-xsrk6gmtln] { margin-top: 20px; padding-top: 14px; }
    .system-section[b-xsrk6gmtln], .report-section[b-xsrk6gmtln] { margin-bottom: 14px; }
    .standing-section[b-xsrk6gmtln] { margin-top: 16px; }

    /* Paper-sheet look for the report body; number the pages via a counter. */
    .report-page[b-xsrk6gmtln] {
        background: #fff;
        border: 1px solid #e2e6ef;
        box-shadow: 0 2px 12px rgba(28, 40, 74, 0.12);
        margin: 18px auto 44px;
        counter-reset: preview-page 0;   /* cover is unnumbered; first content page = PAGE 1 */
    }

    /* Each forced break starts a new page; its divider is labelled with the
       page number the next page begins. */
    .page-break[b-xsrk6gmtln] {
        border-top: 2px dashed #c4ccdd;
        margin-top: 32px;
        padding-top: 2px;
        position: relative;
        counter-increment: preview-page;
    }

    .page-break[b-xsrk6gmtln]::before {
        content: "PAGE " counter(preview-page);
        position: absolute;
        top: -9px;
        left: 50%;
        transform: translateX(-50%);
        padding: 2px 12px;
        background: #eef1f8;
        border: 1px solid #d5dcec;
        border-radius: 12px;
        font: 600 9px/1 'Cascadia Code', 'SF Mono', Consolas, monospace;
        letter-spacing: 0.14em;
        color: #7b839b;
        white-space: nowrap;
    }
}

/* ── Diagrams under a finding ── */
.finding-diagrams[b-xsrk6gmtln] {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px;
    margin: 8px 0 4px;
}

.finding-diagram[b-xsrk6gmtln] {
    max-width: 320px;
    max-height: 240px;
    object-fit: contain;
    border: 1px solid #bbb;
    border-radius: 4px;
    break-inside: avoid;
    page-break-inside: avoid;
}

/* ── Photos under a finding ── */
.finding-photos[b-xsrk6gmtln] {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px;
    margin: 8px 0 4px;
}

.finding-photo[b-xsrk6gmtln] {
    max-width: 260px;
    max-height: 220px;
    object-fit: contain;
    border: 1px solid #bbb;
    border-radius: 4px;
    break-inside: avoid;
    page-break-inside: avoid;
}

/* ── Cover page ── */
.cover-page[b-xsrk6gmtln] {
    page: cover;              /* tight, footer-less named print page (see app.css) */
    padding: 6px 0 12px;      /* trimmed so the cover fits on one page */
}

.cover-title-row[b-xsrk6gmtln] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    border-bottom: 3px solid #2c3e6b;
    padding-bottom: 12px;
    margin-bottom: 8px;
}

.cover-page .cover-title[b-xsrk6gmtln] {
    text-align: left;
    border: none;
    padding: 0;
    margin: 0;
    font-size: 200%;
    letter-spacing: 1px;
    color: #2c3e6b;
}

.cover-report-number[b-xsrk6gmtln] {
    text-align: right;
    min-width: 150px;
}

.cover-report-number .crn-label[b-xsrk6gmtln] {
    font-size: 80%;
    color: #666;
}

.cover-report-number .crn-value[b-xsrk6gmtln] {
    font-size: 135%;
    font-weight: bold;
    color: #a33;
}

.cover-block[b-xsrk6gmtln] {
    margin: 15px 0;
}

.cover-block h2[b-xsrk6gmtln] {
    font-size: 95%;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: #2c3e6b;
    border-bottom: 1px solid #cdd6ea;
    padding-bottom: 4px;
    margin: 0 0 8px;
}

.cover-address[b-xsrk6gmtln] {
    line-height: 1.5;
    margin-left: 12px;
}

.cover-address.indented[b-xsrk6gmtln] {
    margin-left: 24px;
    color: #444;
    font-size: 95%;
}

.cover-kv[b-xsrk6gmtln] {
    display: flex;
    gap: 12px;
    margin: 4px 0 4px 12px;
    line-height: 1.5;
}

.cover-kv .k[b-xsrk6gmtln] {
    min-width: 150px;
    color: #555;
}

.cover-kv .v[b-xsrk6gmtln] {
    font-weight: bold;
}

/* Property-details caption + missing-fields note (now shown in §1 Property Details). */
.cover-detail-src[b-xsrk6gmtln] {
    font-size: 80%;
    font-style: italic;
    color: #777;
    margin: 2px 0 5px 12px;
}

.cover-detail-note[b-xsrk6gmtln] {
    font-size: 88%;
    color: #555;
    margin: 7px 0 0 12px;
}

.cover-conducted[b-xsrk6gmtln] {
    display: flex;
    justify-content: space-between;
    gap: 40px;
    margin-top: 22px;
    border-top: 1px solid #cdd6ea;
    padding-top: 14px;
}

.cover-company[b-xsrk6gmtln], .cover-inspector[b-xsrk6gmtln] {
    flex: 1;
    line-height: 1.6;
}

.cover-company h2[b-xsrk6gmtln], .cover-inspector h2[b-xsrk6gmtln] {
    font-size: 95%;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: #2c3e6b;
    margin: 0 0 8px;
}

.company-legal[b-xsrk6gmtln] {
    font-weight: bold;
}

.company-name[b-xsrk6gmtln] {
    font-weight: bold;
    color: #2c3e6b;
}

.cover-inspector .inspector-name[b-xsrk6gmtln] {
    font-weight: bold;
    font-size: 110%;
    margin-bottom: 18px;
}

.cover-inspector .sig-label[b-xsrk6gmtln] {
    font-size: 85%;
    color: #555;
    margin-top: 14px;
}

.cover-inspector .sig-line[b-xsrk6gmtln],
.cover-inspector .sig-date[b-xsrk6gmtln] {
    border-bottom: 1px solid #888;
    height: 26px;
    margin-top: 2px;
}

/* Company logo beside the company name/address in the conducted-by block */
.cover-company .company-body[b-xsrk6gmtln] {
    display: flex;
    gap: 16px;
    align-items: flex-start;
}

.cover-company .company-logo[b-xsrk6gmtln] {
    flex: 0 0 auto;
    max-width: 175px;
    max-height: 105px;
    object-fit: contain;
}

.cover-company .company-text[b-xsrk6gmtln] {
    flex: 1;
}

.cover-inspector .inspector-title[b-xsrk6gmtln],
.cover-inspector .inspector-license[b-xsrk6gmtln] {
    font-size: 88%;
    color: #444;
}

.cover-inspector .cover-signature[b-xsrk6gmtln] {
    display: block;
    max-width: 240px;
    max-height: 70px;
    object-fit: contain;
    margin: 4px 0 2px;
}

/* Main property photo on the cover */
.cover-main-photo[b-xsrk6gmtln] {
    text-align: center;
    margin: 10px 0 14px;
}

.cover-main-photo img[b-xsrk6gmtln] {
    max-width: 100%;
    max-height: 290px;         /* trimmed so the cover fits on one page */
    object-fit: contain;
    border: 1px solid #ccc;
}

/* ── Report sections (§1 + systems), sample layout ── */
.report-section[b-xsrk6gmtln] {
    margin-bottom: 20px;
}

/* Per-system running-header table: the <thead> (system title band) repeats atop
   every printed page the section spans. Cells carry no styling of their own. */
.sys-runtable[b-xsrk6gmtln] {
    width: 100%;
    border-collapse: collapse;
}

.sys-runtable > thead[b-xsrk6gmtln] {
    display: table-header-group;
}

.sys-runtable > thead > tr > td[b-xsrk6gmtln],
.sys-runtable > tbody > tr > td[b-xsrk6gmtln] {
    padding: 0;
    vertical-align: top;
}

.section-header[b-xsrk6gmtln] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    border-bottom: 3px solid #2c3e6b;   /* (2) stronger header rule, navy */
    padding-bottom: 6px;
}

.section-header .sh-title[b-xsrk6gmtln] {
    font-size: 148%;                     /* (2) bigger + heavier page header */
    font-weight: 800;
    letter-spacing: 0.4px;
    color: #23345f;
}

.section-header .sh-num[b-xsrk6gmtln] {
    margin-right: 4px;
}

.section-header .sh-rn[b-xsrk6gmtln] {
    text-align: right;
    font-size: 82%;
    font-weight: bold;
    white-space: nowrap;
}

.section-header .sh-rn-label[b-xsrk6gmtln] {
    font-weight: normal;
    color: #555;
}

.section-subhead[b-xsrk6gmtln] {
    font-size: 80%;
    letter-spacing: 0.5px;
    color: #555;
    margin: 3px 0 14px;
}

.rc-block[b-xsrk6gmtln] {
    margin-bottom: 16px;
}

.rc-heading[b-xsrk6gmtln] {
    font-size: 105%;
    font-weight: 800;                    /* (4) bolder titles… */
    margin: 0 0 8px;
    letter-spacing: 0.3px;
    color: #23345f;
    border-bottom: 2px solid #cdd6ea;    /* …with a refined navy underline */
    padding-bottom: 3px;
}

.rc-body[b-xsrk6gmtln] {
    white-space: pre-wrap;
    text-align: justify;
}

.rc-body-p p[b-xsrk6gmtln] {
    margin: 0 0 8px;
    text-align: justify;
}

.rc-system-list[b-xsrk6gmtln] {
    margin: 8px 0 0 8px;
    padding-left: 20px;
}

.rc-system-list li[b-xsrk6gmtln] {
    margin-bottom: 2px;
}

/* ── Component Characteristics: two columns like the sample ──
   Left = this inspection's checked values; right = standing education essay. */
.cc-columns[b-xsrk6gmtln] {
    display: flex;
    gap: 28px;
    align-items: flex-start;
    margin-top: 8px;
}

/* (5) frame the checked characteristics as a soft panel, distinct from the
   education essay on the right. */
.cc-left[b-xsrk6gmtln] {
    flex: 0 0 37%;
    max-width: 37%;
    background: #f6f8fc;
    border: 1px solid #e1e7f3;
    border-radius: 8px;
    padding: 12px 14px;
    align-self: flex-start;
}

.cc-right[b-xsrk6gmtln] {
    flex: 1 1 auto;
    min-width: 0;
}

.cc-row[b-xsrk6gmtln] {
    margin-bottom: 9px;
    break-inside: avoid;
    page-break-inside: avoid;
}

.cc-label[b-xsrk6gmtln] {
    font-weight: bold;
    font-size: 87%;
    text-transform: uppercase;
    letter-spacing: 0.2px;
    color: #2c3e6b;
}

.cc-values[b-xsrk6gmtln] {
    margin: 1px 0 0 10px;
}

.cc-value[b-xsrk6gmtln] {
    font-size: 92%;
    color: #222;
}

.cc-right .rc-body[b-xsrk6gmtln] {
    font-size: 92%;
    color: #333;
}

/* ── Observations block (full width, below the columns) ── */
.obs-block[b-xsrk6gmtln] {
    margin-top: 8px;
}

.obs-subhead[b-xsrk6gmtln] {
    font-size: 100%;
    color: #444;
    margin: 12px 0 6px;
    border-bottom: 1px solid #e4e4e4;
    padding-bottom: 3px;
}

/* Note 2: consolidated Summary of Deficiencies section. */
.deficiency-summary .def-total[b-xsrk6gmtln] { color: #c2410c; }

.deficiency-summary .def-intro[b-xsrk6gmtln] {
    color: #444;
    font-size: 0.9rem;
    margin: 4px 0 12px;
}

.deficiency-summary .def-sys[b-xsrk6gmtln] {
    color: #2c3e6b;
    font-size: 0.95rem;
    margin: 16px 0 4px;
    border-bottom: 1px solid #dbe0ec;
    padding-bottom: 3px;
}

.deficiency-summary .def-list[b-xsrk6gmtln] {
    margin: 4px 0 0;
    padding-left: 22px;
}

.deficiency-summary .def-list li[b-xsrk6gmtln] {
    margin-bottom: 7px;
    break-inside: avoid;
}

.deficiency-summary .def-name[b-xsrk6gmtln] {
    font-weight: 700;
    color: #c2410c;
}

.deficiency-summary .def-loc[b-xsrk6gmtln] { color: #555; }

.deficiency-summary .def-action[b-xsrk6gmtln] {
    font-size: 0.86rem;
    color: #333;
    margin-top: 2px;
}

/* ── Summary Observations Report: at-a-glance stat tiles ── */
.sum-stats[b-xsrk6gmtln] {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin: 16px 0 22px;
}

.sum-stat[b-xsrk6gmtln] {
    flex: 1 1 120px;
    border: 1px solid #d8deec;
    border-radius: 10px;
    padding: 12px 14px;
    background: #fff;
    break-inside: avoid;
    page-break-inside: avoid;
}

.sum-stat .sum-n[b-xsrk6gmtln] {
    font-family: Georgia, 'Times New Roman', serif;
    font-size: 30px;
    line-height: 1;
    font-weight: 600;
    color: #2c3e6b;
}

.sum-stat.repair .sum-n[b-xsrk6gmtln] { color: #c0392b; }
.sum-stat.monitor .sum-n[b-xsrk6gmtln] { color: #a56412; }

.sum-stat .sum-l[b-xsrk6gmtln] {
    margin-top: 8px;
    font-family: 'Cascadia Code', 'SF Mono', Consolas, monospace;
    font-size: 10px;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: #7b839b;
}

.summary-report .sum-system[b-xsrk6gmtln] { margin-bottom: 12px; }
.summary-report .sum-picked-section[b-xsrk6gmtln] { margin-top: 14px; }
.summary-report .def-sys[b-xsrk6gmtln] {
    color: #2c3e6b;
    font-size: 0.95rem;
    margin: 16px 0 4px;
    border-bottom: 1px solid #dbe0ec;
    padding-bottom: 3px;
}

.cc-nameplate-note[b-xsrk6gmtln] { font-size: 0.7rem; font-style: italic; color: #555; line-height: 1.35; margin: 0 0 4px; }
/* /Components/Pages/Invoice.razor.rz.scp.css */
.toolbar[b-2az9355qyb] {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 10px 16px;
    border-bottom: 1px solid #ddd;
    margin-bottom: 16px;
}

.toolbar a[b-2az9355qyb] {
    text-decoration: none;
    color: #2c3e6b;
}

.print-btn[b-2az9355qyb] {
    margin-left: auto;
    background: #2c3e6b;
    color: #fff;
    border: none;
    border-radius: 5px;
    padding: 8px 18px;
    cursor: pointer;
    font-weight: 600;
}

/* ── Invoice sheet ── */
.invoice-page[b-2az9355qyb] {
    max-width: 850px;
    margin: 0 auto;
    padding: 8px 24px 16px;
    color: #1c1c1c;
    font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
    font-size: 12px;
    line-height: 1.3;
}

.inv-header[b-2az9355qyb] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 24px;
    padding-bottom: 8px;
    border-bottom: 2px solid #2c3e6b;
}

.inv-date[b-2az9355qyb] {
    font-weight: 600;
}

.inv-number[b-2az9355qyb] {
    margin-top: 6px;
}

.inv-logo[b-2az9355qyb] {
    display: block;
    margin-top: 8px;
    max-height: 58px;
    max-width: 200px;
    object-fit: contain;
}

.inv-header-right[b-2az9355qyb] {
    text-align: right;
}

.inv-title[b-2az9355qyb] {
    font-size: 30px;
    font-weight: 700;
    letter-spacing: 2px;
    color: #2c3e6b;
    margin-bottom: 8px;
}

.inv-title.callback[b-2az9355qyb] {
    font-size: 24px;
    letter-spacing: 1px;
}

.inv-co-legal[b-2az9355qyb] {
    font-weight: 700;
}

.inv-co-name[b-2az9355qyb] {
    font-weight: 600;
    margin-bottom: 3px;
}

/* ── Bill To ── */
.inv-billto[b-2az9355qyb] {
    margin: 10px 0;
    padding: 8px 12px;
    background: #f4f6fb;
    border: 1px solid #e2e6ef;
    border-radius: 5px;
}

.inv-billto-label[b-2az9355qyb] {
    margin-bottom: 6px;
}

.inv-billto-name[b-2az9355qyb] {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    font-weight: 600;
}

.inv-tax-inline[b-2az9355qyb] {
    display: flex;
    flex-direction: column;
    text-align: right;
    font-weight: 400;
    font-size: 12px;
    color: #444;
    white-space: nowrap;
}

/* ── Two-column info ── */
.inv-columns[b-2az9355qyb] {
    display: flex;
    gap: 20px;
    margin: 12px 0;
}

.inv-col[b-2az9355qyb] {
    flex: 1;
    border: 1px solid #dde1ea;
    border-radius: 6px;
    overflow: hidden;
}

.inv-col-head[b-2az9355qyb] {
    background: #2c3e6b;
    color: #fff;
    font-weight: 700;
    font-size: 12px;
    letter-spacing: 0.5px;
    padding: 6px 10px;
}

.inv-kv[b-2az9355qyb] {
    width: 100%;
    border-collapse: collapse;
}

.inv-kv td[b-2az9355qyb] {
    vertical-align: top;
    padding: 3px 10px;
    border-bottom: 1px solid #eef0f5;
}

.inv-kv td.k[b-2az9355qyb] {
    width: 38%;
    color: #555;
    font-weight: 600;
}

/* ── Fees ── */
.inv-fees[b-2az9355qyb] {
    margin: 14px auto;
    max-width: 560px;
    border: 1px solid #dde1ea;
    border-radius: 6px;
    overflow: hidden;
}

.inv-fees-title[b-2az9355qyb] {
    background: #eef1f8;
    text-align: center;
    font-weight: 700;
    padding: 6px;
    border-bottom: 1px solid #dde1ea;
}

.inv-fees-table[b-2az9355qyb] {
    width: 100%;
    border-collapse: collapse;
}

.inv-fees-table td[b-2az9355qyb] {
    padding: 4px 12px;
    border-bottom: 1px solid #f0f2f6;
}

.inv-fees-table .fee-label[b-2az9355qyb] {
    width: 45%;
}

.inv-fees-table .fee-amount[b-2az9355qyb] {
    text-align: right;
    width: 25%;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.inv-fees-table .fee-note[b-2az9355qyb] {
    color: #777;
    font-size: 11px;
    white-space: nowrap;
}

/* Editable amount input (call-back invoice) */
.fee-cur[b-2az9355qyb] {
    margin-right: 1px;
}

.fee-input[b-2az9355qyb] {
    width: 78px;
    text-align: right;
    font: inherit;
    padding: 2px 4px;
    border: 1px solid #c3ccdf;
    border-radius: 4px;
    background: #fffef4;
}

.fee-input:focus[b-2az9355qyb] {
    outline: none;
    border-color: #2c3e6b;
    background: #fff;
}

/* Editable Fee 1 / Fee 2 label */
.fee-label-input[b-2az9355qyb] {
    width: 100%;
    font: inherit;
    padding: 2px 4px;
    border: 1px solid #c3ccdf;
    border-radius: 4px;
    background: #fffef4;
}

.fee-label-input:focus[b-2az9355qyb] {
    outline: none;
    border-color: #2c3e6b;
    background: #fff;
}

/* ── Issued state (screen only) ── */
.issued-badge[b-2az9355qyb] {
    color: #1f7a3d;
    font-weight: 700;
}

.issued-history[b-2az9355qyb] {
    max-width: 850px;
    margin: 0 auto 10px;
    padding: 8px 24px;
    font-size: 13px;
    color: #444;
}

.issued-chip[b-2az9355qyb] {
    display: inline-block;
    margin: 3px 6px 0 0;
    padding: 3px 10px;
    background: #eef1f8;
    border: 1px solid #d5dcec;
    border-radius: 12px;
}

.issued-date[b-2az9355qyb] {
    color: #777;
}

.inv-fees-table .fee-total td[b-2az9355qyb] {
    border-top: 2px solid #2c3e6b;
    border-bottom: none;
    font-weight: 700;
    font-size: 14px;
    padding-top: 8px;
}

/* Payment already received — sits under the total, applied after tax */
.inv-fees-table .fee-paid td[b-2az9355qyb] {
    border-top: none;
    padding-top: 4px;
    color: #555;
}

/* Net amount due after subtracting the payment — the real balance owed */
.inv-fees-table .fee-netdue td[b-2az9355qyb] {
    color: #1c7c3a;
    font-size: 15px;
}

/* ── Sign-off row: "On behalf of" left, signature right (after totals, before notes) ── */
.inv-signoff[b-2az9355qyb] {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 24px;
    margin: 14px 0 8px;
}

.inv-onbehalf[b-2az9355qyb] {
    align-self: flex-end;
}

.inv-signature[b-2az9355qyb] {
    width: 260px;
    text-align: center;
}

.inv-sig-img[b-2az9355qyb] {
    max-height: 64px;
    max-width: 240px;
    object-fit: contain;
}

.inv-sig-name[b-2az9355qyb] {
    border-top: 1px solid #999;
    margin-top: 2px;
    padding-top: 3px;
    font-weight: 600;
}

.inv-sig-role[b-2az9355qyb] {
    font-size: 11px;
    color: #666;
}

/* ── Footer ── */
.inv-footer[b-2az9355qyb] {
    margin-top: 14px;
    padding-top: 8px;
    border-top: 1px solid #dde1ea;
    font-size: 11px;
    color: #333;
}

.inv-footer > div[b-2az9355qyb] {
    margin-bottom: 4px;
}

.inv-notes[b-2az9355qyb] {
    margin-bottom: 8px;
}

.inv-thanks[b-2az9355qyb] {
    margin-top: 10px;
    text-align: center;
    font-weight: 700;
    color: #2c3e6b;
    letter-spacing: 0.5px;
}

/* On-screen only: make the editable fee fields obviously editable and give the
   fee table room. Print output is unchanged (the @media print block strips it). */
@media screen {
    .fee-input[b-2az9355qyb], .fee-label-input[b-2az9355qyb] {
        background: #fffbe6;
        border: 1px solid #d4b96a;
        border-bottom: 2px solid #c8a13a;
    }
    .inv-fees[b-2az9355qyb] { max-width: 720px; }
}

@media print {
    .no-print[b-2az9355qyb] { display: none !important; }
    .invoice-page[b-2az9355qyb] { max-width: none; margin: 0; padding: 0; }
    /* Editable inputs print as plain values (no box) */
    .fee-input[b-2az9355qyb],
    .fee-label-input[b-2az9355qyb] {
        border: none;
        background: transparent;
        padding: 0;
        -webkit-appearance: none;
        appearance: none;
    }
    .fee-label-input[b-2az9355qyb] { width: auto; }
    /* Fee lines with no amount are hidden on the printed copy */
    .fee-empty[b-2az9355qyb] { display: none; }
}
/* /Components/Pages/LibraryCorrupted.razor.rz.scp.css */
.fc-head[b-e7loub3vpq] { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; margin-bottom: 8px; }
.fc-head h1[b-e7loub3vpq] { margin: 0; }
.sub[b-e7loub3vpq] { color: var(--wm-ink-soft); margin: 2px 0 0; max-width: 70ch; }
.back-link[b-e7loub3vpq] { color: var(--wm-navy); text-decoration: none; white-space: nowrap; }
.back-link:hover[b-e7loub3vpq] { text-decoration: underline; }

.filter-banner[b-e7loub3vpq] {
    display: flex; align-items: center; gap: 14px; flex-wrap: wrap;
    background: var(--wm-inset);
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius-sm);
    padding: 6px 12px;
    margin: 10px 0 14px;
    font-size: 14px;
}
.strip-all[b-e7loub3vpq] {
    background: #c2410c; color: #fff; border: none;
    border-radius: var(--wm-radius-sm); padding: 4px 14px; cursor: pointer; font-size: 13px;
}
.strip-all:hover[b-e7loub3vpq] { background: #a8380b; }
.strip-all:disabled[b-e7loub3vpq] { opacity: .6; cursor: default; }
.strip-done[b-e7loub3vpq] { color: #1c7c3a; font-size: 13px; font-weight: 600; }

.dup-group[b-e7loub3vpq] {
    border: 1px solid var(--wm-line); border-radius: var(--wm-radius);
    box-shadow: var(--wm-shadow-sm); overflow: hidden; background: var(--wm-surface);
}
.dup-table[b-e7loub3vpq] { width: 100%; border-collapse: collapse; }
.dup-table td[b-e7loub3vpq] { padding: 6px 10px; border-top: 1px solid var(--wm-line-soft); vertical-align: middle; font-size: 13.5px; }
.dup-table tr:first-child td[b-e7loub3vpq] { border-top: none; }
.dup-badge[b-e7loub3vpq] { white-space: nowrap; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; width: 1%; }
.dup-badge.def[b-e7loub3vpq] { color: #c2410c; }
.dup-badge.char[b-e7loub3vpq] { color: var(--wm-navy); }
.dup-loc[b-e7loub3vpq] { color: var(--wm-ink-soft); white-space: nowrap; }
.dup-name[b-e7loub3vpq] { width: 100%; }
.dup-actions[b-e7loub3vpq] { white-space: nowrap; text-align: right; }
.dup-edit[b-e7loub3vpq] { color: var(--wm-navy); text-decoration: none; font-size: 13px; }
.dup-edit:hover[b-e7loub3vpq] { text-decoration: underline; }
.dup-del[b-e7loub3vpq] { border: 1px solid #d99; background: #fff5f5; color: #b22; border-radius: var(--wm-radius-sm); padding: 2px 10px; cursor: pointer; font-size: 13px; }
.dup-del:hover[b-e7loub3vpq] { background: #ffe9e9; }
.dup-del:disabled[b-e7loub3vpq] { opacity: .5; cursor: default; }

.dup-edit-btn[b-e7loub3vpq] { background: none; border: 1px solid var(--wm-line); border-radius: var(--wm-radius-sm); color: var(--wm-navy); padding: 2px 10px; cursor: pointer; margin-right: 8px; font-size: 13px; }
.dup-edit-btn:hover[b-e7loub3vpq] { background: var(--wm-inset); }
.dup-edit-btn:disabled[b-e7loub3vpq] { opacity: .5; cursor: default; }

.dup-editing > td[b-e7loub3vpq] { background: #f5f8ff; }
.dup-edit-row > td[b-e7loub3vpq] { background: #f5f8ff; padding: 10px 14px; border-top: none; }
.dup-form[b-e7loub3vpq] { display: grid; grid-template-columns: 1fr 1fr; gap: 8px 14px; }
.dup-form label[b-e7loub3vpq] { display: flex; flex-direction: column; font-size: 12px; color: var(--wm-ink-soft); gap: 3px; }
.dup-form label.wide[b-e7loub3vpq] { grid-column: 1 / -1; }
.dup-form input[b-e7loub3vpq], .dup-form textarea[b-e7loub3vpq] { padding: 5px 8px; border: 1px solid var(--wm-line); border-radius: var(--wm-radius-sm); font: inherit; box-sizing: border-box; }
.dup-form textarea[b-e7loub3vpq] { min-height: 54px; resize: vertical; }
.dup-form-actions[b-e7loub3vpq] { grid-column: 1 / -1; display: flex; gap: 10px; align-items: center; margin-top: 4px; }
.dup-save[b-e7loub3vpq] { background: var(--wm-navy); color: #fff; border: none; border-radius: var(--wm-radius-sm); padding: 5px 18px; cursor: pointer; }
.dup-save:disabled[b-e7loub3vpq] { opacity: .6; cursor: default; }
.dup-cancel[b-e7loub3vpq] { background: none; border: 1px solid var(--wm-line); border-radius: var(--wm-radius-sm); padding: 5px 14px; cursor: pointer; }
.dup-editmsg[b-e7loub3vpq] { color: #b22; font-size: 13px; }
/* /Components/Pages/LibraryDuplicates.razor.rz.scp.css */
.fc-head[b-fdbwl8c8x7] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 16px;
    margin-bottom: 8px;
}
.fc-head h1[b-fdbwl8c8x7] { margin: 0; }
.sub[b-fdbwl8c8x7] { color: var(--wm-ink-soft); margin: 2px 0 0; max-width: 70ch; }
.back-link[b-fdbwl8c8x7] { color: var(--wm-navy); text-decoration: none; white-space: nowrap; }
.back-link:hover[b-fdbwl8c8x7] { text-decoration: underline; }

.filter-banner[b-fdbwl8c8x7] {
    background: var(--wm-inset);
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius-sm);
    padding: 6px 12px;
    margin: 10px 0 14px;
    font-size: 14px;
}

.dup-group[b-fdbwl8c8x7] {
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius);
    box-shadow: var(--wm-shadow-sm);
    overflow: hidden;
    margin-bottom: 12px;
    background: var(--wm-surface);
}
.dup-sys[b-fdbwl8c8x7] {
    background: var(--wm-navy);
    color: #fff;
    padding: 5px 12px;
    font-weight: 700;
    font-size: 13px;
}
.dup-table[b-fdbwl8c8x7] { width: 100%; border-collapse: collapse; }
.dup-table td[b-fdbwl8c8x7] {
    padding: 6px 10px;
    border-top: 1px solid var(--wm-line-soft);
    vertical-align: middle;
    font-size: 13.5px;
}
.dup-table tr:first-child td[b-fdbwl8c8x7] { border-top: none; }

.dup-badge[b-fdbwl8c8x7] {
    white-space: nowrap;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .04em;
    width: 1%;
}
.dup-badge.def[b-fdbwl8c8x7] { color: #c2410c; }
.dup-badge.char[b-fdbwl8c8x7] { color: var(--wm-navy); }
.dup-loc[b-fdbwl8c8x7] { color: var(--wm-ink-soft); white-space: nowrap; }
.dup-name[b-fdbwl8c8x7] { width: 100%; }
.dup-actions[b-fdbwl8c8x7] { white-space: nowrap; text-align: right; }

.dup-edit[b-fdbwl8c8x7] { color: var(--wm-navy); text-decoration: none; margin-right: 10px; font-size: 13px; }
.dup-edit:hover[b-fdbwl8c8x7] { text-decoration: underline; }
.dup-del[b-fdbwl8c8x7] {
    border: 1px solid #d99;
    background: #fff5f5;
    color: #b22;
    border-radius: var(--wm-radius-sm);
    padding: 2px 10px;
    cursor: pointer;
    font-size: 13px;
}
.dup-del:hover[b-fdbwl8c8x7] { background: #ffe9e9; }
.dup-del:disabled[b-fdbwl8c8x7] { opacity: .5; cursor: default; }

.dup-gone[b-fdbwl8c8x7] { opacity: .5; }
.dup-gone .dup-name[b-fdbwl8c8x7] { text-decoration: line-through; }
.dup-removed[b-fdbwl8c8x7] { color: #1c7c3a; font-size: 13px; font-weight: 600; }

.dup-edit-btn[b-fdbwl8c8x7] {
    background: none;
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius-sm);
    color: var(--wm-navy);
    padding: 2px 10px;
    cursor: pointer;
    margin-right: 8px;
    font-size: 13px;
}
.dup-edit-btn:hover[b-fdbwl8c8x7] { background: var(--wm-inset); }
.dup-edit-btn:disabled[b-fdbwl8c8x7] { opacity: .5; cursor: default; }

.dup-editing > td[b-fdbwl8c8x7] { background: #f5f8ff; }
.dup-edit-row > td[b-fdbwl8c8x7] { background: #f5f8ff; padding: 10px 14px; border-top: none; }
.dup-form[b-fdbwl8c8x7] { display: grid; grid-template-columns: 1fr 1fr; gap: 8px 14px; }
.dup-form label[b-fdbwl8c8x7] { display: flex; flex-direction: column; font-size: 12px; color: var(--wm-ink-soft); gap: 3px; }
.dup-form label.wide[b-fdbwl8c8x7] { grid-column: 1 / -1; }
.dup-form input[b-fdbwl8c8x7], .dup-form textarea[b-fdbwl8c8x7] {
    padding: 5px 8px;
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius-sm);
    font: inherit;
    box-sizing: border-box;
}
.dup-form textarea[b-fdbwl8c8x7] { min-height: 54px; resize: vertical; }
.dup-form-actions[b-fdbwl8c8x7] { grid-column: 1 / -1; display: flex; gap: 10px; align-items: center; margin-top: 4px; }
.dup-save[b-fdbwl8c8x7] { background: var(--wm-navy); color: #fff; border: none; border-radius: var(--wm-radius-sm); padding: 5px 18px; cursor: pointer; }
.dup-save:disabled[b-fdbwl8c8x7] { opacity: .6; cursor: default; }
.dup-cancel[b-fdbwl8c8x7] { background: none; border: 1px solid var(--wm-line); border-radius: var(--wm-radius-sm); padding: 5px 14px; cursor: pointer; }
.dup-editmsg[b-fdbwl8c8x7] { color: #b22; font-size: 13px; }
/* /Components/Pages/LibraryManager.razor.rz.scp.css */
.subtitle[b-l6b18xa7zf] {
    color: var(--wm-ink-soft);
}

/* Diagram add-button: same format as the systems' Observations page (.media-btn there);
   scoped CSS doesn't cross components, so the style is replicated here. */
.media-btn[b-l6b18xa7zf] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: #2c3e6b;
    color: #fff;
    border: none;
    border-radius: var(--wm-radius-sm);
    padding: 6px 14px;
    font-size: 88%;
    cursor: pointer;
}

.media-btn:hover[b-l6b18xa7zf] { background: #1e2d52; }

.lm-head[b-l6b18xa7zf] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
}

.recycle-link[b-l6b18xa7zf] {
    flex-shrink: 0;
    color: #2c3e6b;
    font-weight: 600;
    text-decoration: none;
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius-sm);
    padding: 6px 12px;
    background: var(--wm-surface-2);
    white-space: nowrap;
}

.recycle-link:hover[b-l6b18xa7zf] { background: #e6ecfb; }

/* Deep-link (?focus=) landing highlight on the opened edit form. */
.condition-edit-form.focus-flash[b-l6b18xa7zf] {
    animation: focusFlash-b-l6b18xa7zf 1.6s ease-out;
}

@keyframes focusFlash-b-l6b18xa7zf {
    0%   { box-shadow: 0 0 0 3px #ffd27a; background: #fff8e6; }
    100% { box-shadow: 0 0 0 0 transparent; background: transparent; }
}

/* Mode tabs and the "Manage Systems" toggle on the same row, flush to the left edge
   (aligned with the title, system tabs and tree — no centring). */
.mode-row[b-l6b18xa7zf] {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 8px;
    margin: 14px 0;
}

.mode-row .mode-toggle[b-l6b18xa7zf] {
    margin: 0;
}

.mode-toggle[b-l6b18xa7zf] {
    margin: 14px 0;
}

.mode-toggle button[b-l6b18xa7zf] {
    padding: 8px 18px;
    border: 1px solid var(--wm-line);
    background: var(--wm-surface-2);
    cursor: pointer;
    font-size: 95%;
}

.mode-toggle button:first-child[b-l6b18xa7zf] {
    border-radius: var(--wm-radius-sm) 0 0 var(--wm-radius-sm);
}

.mode-toggle button:last-child[b-l6b18xa7zf] {
    border-radius: 0 var(--wm-radius-sm) var(--wm-radius-sm) 0;
}

.mode-toggle button.active[b-l6b18xa7zf] {
    background: #2c3e6b;
    color: #fff;
    border-color: #2c3e6b;
}

.system-tabs[b-l6b18xa7zf] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    border-bottom: 2px solid var(--wm-line);
    padding-bottom: 10px;
    margin-bottom: 16px;
}

.tab[b-l6b18xa7zf] {
    padding: 8px 14px;
    border: 1px solid var(--wm-line);
    background: var(--wm-surface-2);
    border-radius: var(--wm-radius-sm);
    cursor: pointer;
    font-size: 90%;
}

.tab.active[b-l6b18xa7zf] {
    background: #2c3e6b;
    color: #fff;
    border-color: #2c3e6b;
}

/* ── Library chrome: plum on warm paper ──────────────────────────────────────────
   The layout deliberately mirrors the checklist so arranging the library previews the
   inspector's view - which leaves nothing to say WHERE you are. The frame carries that:
   plum accent + warm tint here, navy + cool paper there. Plum is already in :root (the
   sidebar's navy->plum gradient) and is the only hue in the palette carrying no content
   meaning - navy=Characteristics, orange=Defects, green=status, teal/amber=record type,
   purple=inspection-only, red=danger.
   The Characteristics/Defects ribbons stay navy/orange: those mean the same thing in both
   views and must look the same. Only the frame changes. */
.tree-body[b-l6b18xa7zf] {
    max-width: none;
    background: #f4f1f7;
    border-radius: var(--wm-radius);
    padding: 10px;
}

.subsystem-block[b-l6b18xa7zf] {
    border: 1px solid #e2d9e8;
    border-radius: var(--wm-radius);
    margin-bottom: 6px;
    overflow: hidden;
    background: var(--wm-surface);
}

.subsystem-block.adding[b-l6b18xa7zf] {
    padding: 12px;
    display: flex;
    gap: 8px;
    align-items: center;
}

/* Structural band, not a state: the checklist marks a subsystem heading the same way
   (.subsystem-section h3), in navy. Nothing here is checkable. */
.row-header[b-l6b18xa7zf] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 5px 12px;
    background: #f7f4f9;
    border-left: 4px solid var(--wm-plum);
    cursor: pointer;
}

.expand-arrow[b-l6b18xa7zf] {
    font-size: 80%;
    width: 14px;
    /* The arrow is now the toggle/collapse control (the header only expands), so make it read
       as clickable and give it a slightly bigger hit area. */
    cursor: pointer;
    padding: 2px 4px;
    border-radius: var(--wm-radius-sm);
}
.expand-arrow:hover[b-l6b18xa7zf] { background: var(--wm-inset); }

.row-header .name[b-l6b18xa7zf] {
    flex: 1;
    font-weight: bold;
}

/* Component collapse: the arrow+name+count is the click target; action buttons sit
   outside it so they don't toggle. */
.comp-toggle[b-l6b18xa7zf] {
    flex: 1;
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
    cursor: pointer;
}
.comp-toggle .name[b-l6b18xa7zf] { flex: 1; }
.comp-count[b-l6b18xa7zf] {
    flex: none;
    font-size: 78%;
    font-variant-numeric: tabular-nums;
    color: #6b6472;
    background: #efeaf3;
    border: 1px solid var(--wm-line);
    border-radius: 999px;
    padding: 0 7px;
    min-width: 20px;
    text-align: center;
}
/* Bulk expand/collapse toolbar spans all the masonry columns. */
.comp-bulk[b-l6b18xa7zf] {
    display: flex;
    gap: 12px;
    margin: 0 0 8px;
    column-span: all;
}
.comp-bulk .add-link[b-l6b18xa7zf] { font-size: 82%; }

.icon-btn[b-l6b18xa7zf] {
    background: none;
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius-sm);
    width: 22px;
    height: 22px;
    cursor: pointer;
    font-size: 85%;
}

.icon-btn.danger[b-l6b18xa7zf] {
    color: #a33;
    border-color: #a33;
}

/* Component cards pack into columns exactly as the checklist does (~1 per 300px),
   so arranging the library shows the layout the inspector will actually meet.
   Mirrors .subsystem-section in InspectionChecklist.razor.css - keep the two in step. */
.component-list[b-l6b18xa7zf] {
    padding: 6px 10px 8px 16px;
    column-width: 300px;
    column-gap: 24px;
    column-rule: 1px solid var(--wm-line-soft);
}

.component-block[b-l6b18xa7zf] {
    border: 1px solid #e2d9e8;
    border-radius: var(--wm-radius-sm);
    margin: 0 0 14px;
    background: var(--wm-surface);
    box-shadow: var(--wm-shadow-sm);
    /* Cards must never be split across a column boundary. */
    break-inside: avoid;
    -webkit-column-break-inside: avoid;
}

/* The card's title band - plum where the checklist's is navy. */
.component-block .row-header[b-l6b18xa7zf] {
    background: var(--wm-plum);
    color: #fff;
    border-left: none;
    cursor: default;
    /* The rename form lives in this header, and its two name inputs alone are wider than
       a 300px column. Without wrapping they overflowed into the next column, which painted
       over them and put Save/Cancel out of reach. Wrapping keeps the form inside its card
       (the card just gets taller) instead of spanning, which would rip it out of the flow. */
    flex-wrap: wrap;
}

.component-block .row-header input[b-l6b18xa7zf] {
    flex: 1 1 100%;
    min-width: 0;
}

.component-block .row-header .icon-btn[b-l6b18xa7zf] {
    color: #fff;
    border-color: rgba(255, 255, 255, .35);
}

.component-block .row-header .icon-btn:hover[b-l6b18xa7zf] {
    background: rgba(255, 255, 255, .15);
}

/* An edit/add form is tall inline content and would be sliced by a column boundary, so
   its card spans every column instead of packing. The copy panel is deliberately NOT in
   this list: it's a popup (position: absolute, below) and doesn't affect the card's
   height - spanning for it used to rip the whole card out of the flow and drop it at the
   bottom of the page, which read as "the button did nothing". */
.component-block.adding[b-l6b18xa7zf],
.component-block:has(.condition-edit-form)[b-l6b18xa7zf] {
    column-span: all;
}

.component-block.adding[b-l6b18xa7zf] {
    padding: 10px;
    display: flex;
    gap: 8px;
    align-items: center;
}

.move-label[b-l6b18xa7zf] {
    font-size: 85%;
    color: var(--wm-ink-soft);
    margin-left: 6px;
}

/* Mirrors .translate-btn in InspectionObservations.razor.css - Blazor scopes stylesheets
   per component, so the same look has to be restated here rather than shared. */
.translate-btn[b-l6b18xa7zf] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 4px 12px;
    background: #2c3e6b;
    color: #fff;
    border: none;
    border-radius: var(--wm-radius-sm);
    cursor: pointer;
    font-size: 85%;
    white-space: nowrap;
}

.translate-btn:disabled[b-l6b18xa7zf] {
    background: #8a9cc0;
    cursor: not-allowed;
}

.translate-btn:hover:not(:disabled)[b-l6b18xa7zf] {
    background: #1e2d52;
}

.translate-error[b-l6b18xa7zf] {
    font-size: 82%;
    color: #c2410c;
}

.condition-list[b-l6b18xa7zf] {
    padding: 5px 10px 8px 14px;
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

/* Mirrors .cond-chip in InspectionChecklist.razor.css. Deliberately NOT clickable and
   with no .checked state: this is an editor, not a picker, and a chip that looks tickable
   but isn't would teach the wrong habit. Keep the two files in step. */
.cond-chip[b-l6b18xa7zf] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 5px 11px;
    border: 1px solid var(--wm-line);
    border-radius: 4px;
    background: var(--wm-surface);
    font-size: 0.86rem;
    line-height: 1.2;
    position: relative;
    /* The body is the drag handle (click is unused here - this is an editor, not a picker).
       pan-y keeps a vertical swipe scrolling the page on touch instead of grabbing a chip;
       chip-reorder.js also waits for ~8px of movement before it treats a press as a drag. */
    cursor: grab;
    touch-action: pan-y;
    user-select: none;
}

.cond-chip.dragging[b-l6b18xa7zf] {
    cursor: grabbing;
    opacity: 0.55;
    border-color: var(--wm-plum);
    box-shadow: var(--wm-shadow);
}

.cond-chip:hover[b-l6b18xa7zf] {
    border-color: var(--wm-plum);
    background: #faf7fb;
}

/* No defect COLOUR/border rule on purpose. A left border on a chip means CHECKED in the
   checklist (.cond-chip.checked); reusing that idiom for "is a defect" would give one mark
   two meanings across two views built to look alike, and it would mark nothing anyway (the
   ribbon filters the tree). The ribbon is what says which category you're in. */

/* A defect DOES need a different LAYOUT, though: unlike a characteristic (just a name), it
   carries Consequences, Explanation and a Diagram button as chip children. The base
   inline-flex spread those across one row and buried the ✎ ⋯ actions. Give each defect its
   own full-width row, push the actions to the right of the name where they're visible, and
   stack the details below. Characteristics keep the compact inline chip. */
.cond-chip.defect[b-l6b18xa7zf] {
    flex-basis: 100%;
    flex-wrap: wrap;
    align-items: center;
    padding: 8px 11px;
}

.cond-chip.defect .chip-label[b-l6b18xa7zf] {
    flex: 1 1 auto;
    font-weight: 600;
}

.cond-chip.defect .chip-edit[b-l6b18xa7zf] {
    opacity: 0.65;          /* a big card needs the actions a touch more visible than 0.4 */
    font-size: 1.05em;
}

.cond-chip.defect .detail[b-l6b18xa7zf],
.cond-chip.defect .lib-diagrams[b-l6b18xa7zf],
.cond-chip.defect .copy-panel[b-l6b18xa7zf] {
    flex-basis: 100%;
    margin-top: 3px;
}

.cond-chip.defect .detail[b-l6b18xa7zf] {
    font-size: 0.85rem;
    color: var(--wm-ink-soft);
    line-height: 1.35;
}

.cond-chip .chip-label[b-l6b18xa7zf] {
    min-width: 0;
}

/* The ⋯ menu button is now the ONLY affordance on a chip, so it can't be as faint as the
   old dim pencil - it has to read as "there are actions here" at a glance, and be a real
   tap target on a tablet. Never hidden (a hover-only control vanishes on touch). */
.cond-chip .chip-edit[b-l6b18xa7zf] {
    background: none;
    border: none;
    color: var(--wm-ink-soft);
    cursor: pointer;
    font-size: 0.85em;
    padding: 0;
    opacity: 0.55;
}

.cond-chip:hover .chip-edit[b-l6b18xa7zf] {
    opacity: 0.85;
}

.cond-chip .chip-edit:hover[b-l6b18xa7zf] {
    opacity: 1;
}

/* The one menu button: a bit bigger and a proper tap target, boxed so it reads as a
   control rather than stray punctuation. */
.cond-chip .chip-menu-btn[b-l6b18xa7zf] {
    font-size: 1.15em;
    line-height: 1;
    min-width: 22px;
    height: 20px;
    border-radius: var(--wm-radius-sm);
    color: var(--wm-plum);
    flex-shrink: 0;
}

.cond-chip .chip-menu-btn:hover[b-l6b18xa7zf] {
    background: #efe6f3;
}

/* Invisible click-catcher: covers the viewport under the menu so any outside click (or a
   second click on the ⋯ button) dismisses it. z-index sits just below the menu. */
.chip-menu-backdrop[b-l6b18xa7zf] {
    position: fixed;
    inset: 0;
    z-index: 19;
    background: transparent;
}

/* Floats above the column flow so it isn't clipped by a neighbouring column. */
.chip-menu[b-l6b18xa7zf] {
    position: absolute;
    top: calc(100% + 4px);
    right: 0;
    z-index: 20;
    display: flex;
    flex-direction: column;
    min-width: 210px;
    background: var(--wm-surface);
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius-sm);
    box-shadow: var(--wm-shadow);
    overflow: hidden;
}

.chip-menu button[b-l6b18xa7zf] {
    background: none;
    border: none;
    text-align: left;
    padding: 7px 12px;
    font-size: 0.84rem;
    cursor: pointer;
    white-space: nowrap;
}

.chip-menu button:hover:not(:disabled)[b-l6b18xa7zf] {
    background: var(--wm-inset);
}

.chip-menu button:disabled[b-l6b18xa7zf] {
    opacity: 0.35;
    cursor: default;
}

.chip-menu button.danger[b-l6b18xa7zf] {
    color: #c2410c;
}

.condition-row[b-l6b18xa7zf] {
    padding: 3px 0;
    border-bottom: 1px solid var(--wm-line-soft);
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
}

.condition-row .name[b-l6b18xa7zf] {
    flex: 1 1 auto;
    min-width: 0;
}

.condition-row .detail[b-l6b18xa7zf] {
    flex-basis: 100%;
    font-size: 85%;
    color: var(--wm-ink-soft);
    margin-left: 4px;
}

.condition-edit-form[b-l6b18xa7zf] {
    border: 1px solid #2c3e6b;
    border-radius: var(--wm-radius-sm);
    padding: 10px;
    margin: 6px 0;
    background: var(--wm-surface);
}

.row2[b-l6b18xa7zf] {
    display: flex;
    gap: 8px;
    margin-bottom: 6px;
}

.row2 > input[b-l6b18xa7zf],
.row2 > textarea[b-l6b18xa7zf] {
    flex: 1;
    padding: 6px;
    box-sizing: border-box;
}

.row2 > textarea[b-l6b18xa7zf] {
    min-height: 50px;
    resize: vertical;
}

.condition-edit-form .actions[b-l6b18xa7zf] {
    text-align: right;
}

.condition-edit-form .actions button[b-l6b18xa7zf],
.condition-row button[b-l6b18xa7zf],
.row-header button[b-l6b18xa7zf],
.component-block.adding button[b-l6b18xa7zf],
.subsystem-block.adding button[b-l6b18xa7zf] {
    margin-left: 4px;
}

input[b-l6b18xa7zf],
select[b-l6b18xa7zf] {
    padding: 5px;
}

input[type="text"][b-l6b18xa7zf],
input:not([type])[b-l6b18xa7zf],
textarea[b-l6b18xa7zf],
select[b-l6b18xa7zf] {
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius-sm);
}

input[type="text"]:focus[b-l6b18xa7zf],
input:not([type]):focus[b-l6b18xa7zf],
textarea:focus[b-l6b18xa7zf],
select:focus[b-l6b18xa7zf] {
    outline: none;
    border-color: var(--wm-navy);
    box-shadow: 0 0 0 3px rgba(44, 62, 107, .12);
}

.add-link[b-l6b18xa7zf] {
    background: none;
    border: none;
    color: #2c3e6b;
    cursor: pointer;
    font-size: 90%;
    padding: 4px 0;
}

.add-link:hover[b-l6b18xa7zf] {
    text-decoration: underline;
}

.top-add[b-l6b18xa7zf] {
    display: block;
    width: fit-content;
    margin: 10px auto 0;   /* centred under the subsystem tree */
    font-size: 100%;
    font-weight: bold;
}

.error-msg[b-l6b18xa7zf] {
    color: #a33;
    background: #fdecea;
    border: 1px solid #a33;
    border-radius: 4px;
    padding: 8px 12px;
    margin-top: 12px;
    max-width: 1100px;
}

.defect-toggle[b-l6b18xa7zf] {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 90%;
    color: #444;
}

.category-tag[b-l6b18xa7zf] {
    font-size: 75%;
    padding: 2px 8px;
    border-radius: 10px;
    border: 1px solid transparent;
}

.category-tag.char[b-l6b18xa7zf] {
    background: #d3efe9;
    color: #0f766e;
    border-color: #8fd6ca;
}

.category-tag.obs[b-l6b18xa7zf] {
    background: #ffe4d0;
    color: #b8420c;
    border-color: #f4a97a;
}

/* Type indicator inside the add/edit form (replaces the old IsDefect checkbox;
   the type now follows the current mode — change type via Move). */
.type-chip[b-l6b18xa7zf] {
    font-size: 80%;
    padding: 3px 10px;
    border-radius: 10px;
    font-weight: 600;
    align-self: center;
    border: 1px solid transparent;
}

.type-chip.char[b-l6b18xa7zf] {
    background: #d3efe9;
    color: #0f766e;
    border-color: #8fd6ca;
}

.type-chip.obs[b-l6b18xa7zf] {
    background: #ffe4d0;
    color: #b8420c;
    border-color: #f4a97a;
}

.copy-btn[b-l6b18xa7zf] {
    background: var(--wm-inset);
    border: 1px solid #2c3e6b;
    color: #2c3e6b;
    border-radius: var(--wm-radius-sm);
    padding: 4px 10px;
    font-size: 80%;
    cursor: pointer;
    white-space: nowrap;
}

.copy-btn:hover[b-l6b18xa7zf] {
    background: #2c3e6b;
    color: #fff;
}

.copy-panel[b-l6b18xa7zf] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    background: var(--wm-surface);
    border: 1px solid #2c3e6b;
    border-radius: var(--wm-radius-sm);
    padding: 10px 14px;
    margin: 6px 0 10px 30px;
}

.copy-panel label[b-l6b18xa7zf] {
    font-size: 85%;
    font-weight: bold;
    color: #444;
}

.copy-panel select[b-l6b18xa7zf] {
    padding: 5px;
}

.copy-panel button[b-l6b18xa7zf] {
    padding: 5px 12px;
    cursor: pointer;
}

/* The per-chip copy panel is a popup anchored to the chip, exactly like .chip-menu -
   it opens where you clicked instead of pushing the card taller and shoving its
   neighbours around. Absolute keeps it above the column flow so an adjacent column
   can't clip it. */
.copy-panel.record[b-l6b18xa7zf] {
    position: absolute;
    top: calc(100% + 4px);
    right: 0;
    z-index: 25;
    margin: 0;
    width: max-content;
    max-width: 420px;
    border-color: var(--wm-plum);
    box-shadow: var(--wm-shadow);
}

/* Long subsystem names would otherwise stretch the popup off-screen. */
.copy-panel.record select[b-l6b18xa7zf] {
    max-width: 240px;
}

.copy-hint[b-l6b18xa7zf] {
    font-size: 80%;
    color: var(--wm-ink-faint);
    font-style: italic;
}

.copy-notice[b-l6b18xa7zf] {
    background: #e7f6ec;
    border: 1px solid #b6dec4;
    color: #1f7a3d;
    border-radius: 4px;
    padding: 8px 12px;
    margin-bottom: 10px;
    cursor: pointer;
}

/* ── Diagrams attached to a library condition ── */
.lib-diagrams[b-l6b18xa7zf] {
    margin-top: 8px;
    display: flex;
    flex-direction: column;
    gap: 6px;
    align-items: flex-start;
}

/* ── Pick-list management panel (Recommended Actions + Locations) ── */
.lists-panel[b-l6b18xa7zf] {
    max-width: 1100px;
    margin: 10px auto 0;
}

/* The two system-specific pick-lists sit at the bottom, centred and narrower than the
   tree (visually distinct); their toggle bars are equal length. */
/* Report content + Recommended Actions + Locations frozen at the bottom with a solid
   separation line. Collapsed = thin frozen toggles; expanded caps at 45vh and scrolls.
   Report content spans full width on top; Actions + Locations sit side by side below. */
.picklists-bottom[b-l6b18xa7zf] {
    position: sticky;
    bottom: 0;
    z-index: 15;
    background: var(--wm-surface);
    max-width: none;
    margin: 26px 0 0;
    padding: 10px 0 6px;
    border-top: 3px solid var(--wm-plum);
    box-shadow: 0 -4px 10px rgba(0, 0, 0, 0.07);
    display: flex;
    flex-direction: column;
    gap: 10px;
    max-height: 32vh;
    overflow-y: auto;
}

/* 32vh fits three collapsed toggles, but an OPEN panel's options got trapped inside it -
   you had to scroll within the band to see them, which reads as content hidden behind the
   frozen pane. Give it room when something is actually open. */
.picklists-bottom:has(.special-group.open)[b-l6b18xa7zf],
.picklists-bottom:has(.report-content-panel.open)[b-l6b18xa7zf] {
    max-height: 70vh;
}

.picklists-row[b-l6b18xa7zf] {
    display: flex;
    gap: 12px;
}

.picklists-bottom .lists-panel[b-l6b18xa7zf] {
    max-width: none;
    margin: 0;
}

.picklists-row .lists-panel[b-l6b18xa7zf] {
    flex: 1 1 0;
}

.picklists-bottom .lists-toggle[b-l6b18xa7zf] {
    display: block;
    width: 100%;
    text-align: center;
}

/* The three isolated quick-check sections sit collapsed on one line (3 columns) above the
   report-content panel; an opened one spans the full width. Mirrors the inspection
   checklist's frozen band. */
.picklists-bottom .special-row[b-l6b18xa7zf] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 8px;
    margin-top: 10px;
}

.picklists-bottom .special-row > .special-group[b-l6b18xa7zf] {
    max-width: none;
    margin: 0;
    min-width: 0;
}

.picklists-bottom .special-row > .special-group.open[b-l6b18xa7zf] {
    grid-column: 1 / -1;
}

/* Control-band distinction: quick-check trio = filled bars (bold white), so the frozen
   bottom stands out. Plum here, navy on the checklist - this is library chrome, not the
   Characteristics/Defects coding, which stays navy/orange in both views. */
.picklists-bottom .special-group .lists-toggle[b-l6b18xa7zf] {
    background: var(--wm-plum);
    color: #fff;
    border-color: var(--wm-plum);
}

/* ── Manage Systems panel ── */
.systems-panel[b-l6b18xa7zf] {
    max-width: 1100px;
    margin: 10px auto 0;
}

.systems-manage[b-l6b18xa7zf] {
    margin-top: 10px;
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius);
    padding: 10px 12px;
    background: var(--wm-surface);
}

.sys-hint[b-l6b18xa7zf] {
    margin: 0 0 8px;
    font-size: 12px;
    color: var(--wm-ink-faint);
}

.sys-row[b-l6b18xa7zf] {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 4px 0;
    border-bottom: 1px solid var(--wm-line-soft);
    flex-wrap: wrap;
}

.sys-row.add[b-l6b18xa7zf] {
    border-bottom: none;
    margin-top: 6px;
}

.sys-name[b-l6b18xa7zf] {
    flex: 1;
    min-width: 220px;
}

.sys-full[b-l6b18xa7zf] {
    color: #2c3e6b;
    margin-left: 4px;
}

.sys-excluded[b-l6b18xa7zf] {
    color: #a33;
    font-size: 85%;
    margin-left: 6px;
}

.sys-edit[b-l6b18xa7zf] {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
    align-items: center;
    width: 100%;
}

.sys-edit input[type="text"][b-l6b18xa7zf],
.sys-edit input:not([type])[b-l6b18xa7zf],
.sys-row.add input[b-l6b18xa7zf] {
    padding: 4px 6px;
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius-sm);
    min-width: 150px;
}

.sys-check[b-l6b18xa7zf] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 90%;
    color: #444;
    white-space: nowrap;
}

.lists-toggle[b-l6b18xa7zf] {
    background: #f7f4f9;
    border: 1px solid #e2d9e8;
    border-radius: var(--wm-radius-sm);
    padding: 6px 12px;
    cursor: pointer;
    font-weight: 600;
    color: var(--wm-plum);
}

.lists-grid[b-l6b18xa7zf] {
    display: flex;
    gap: 20px;
    margin-top: 10px;
    flex-wrap: wrap;
}

.list-col[b-l6b18xa7zf] {
    flex: 1 1 340px;
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius);
    padding: 10px 12px;
    background: var(--wm-surface);
}

.list-col h4[b-l6b18xa7zf] {
    margin: 0 0 8px;
    font-size: 95%;
}

.list-scope[b-l6b18xa7zf] {
    color: var(--wm-ink-faint);
    font-weight: normal;
    font-size: 88%;
}

.list-row[b-l6b18xa7zf] {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 3px 0;
    border-bottom: 1px solid var(--wm-line-soft);
}

.list-row .list-text[b-l6b18xa7zf] {
    flex: 1;
    font-size: 90%;
}

.list-row input[b-l6b18xa7zf] {
    flex: 1;
    padding: 4px 6px;
    min-width: 0;
}

.list-row.add[b-l6b18xa7zf] {
    border-bottom: none;
    margin-top: 6px;
}

/* Action/Location combobox rows in the condition edit/add forms */
.row2.combo[b-l6b18xa7zf] {
    align-items: center;
}

.row2.combo > input[b-l6b18xa7zf] {
    flex: 1;
    padding: 6px;
    box-sizing: border-box;
    min-width: 0;
}

.pick-add[b-l6b18xa7zf] {
    flex: 0 0 auto;
    padding: 5px 8px;
    font-size: 82%;
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius-sm);
    background: var(--wm-surface);
    cursor: pointer;
    white-space: nowrap;
}

/* ── Library header actions (Manage Systems beside Recycle bin) ── */
.lm-head-actions[b-l6b18xa7zf] {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    justify-content: flex-end;
}

/* Content-language toggle inline in the header. lang-scope + lang-toggle keep the styles
   they had on the ribbon; this just aligns the pair. */
.lib-lang[b-l6b18xa7zf] {
    display: inline-flex;
    align-items: center;
    margin-right: 4px;
}

.manage-systems-btn[b-l6b18xa7zf] {
    background: var(--wm-inset);
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius-sm);
    padding: 6px 12px;
    cursor: pointer;
    font-weight: 700;
    color: #2c3e6b;
    white-space: nowrap;
}

.manage-systems-btn.active[b-l6b18xa7zf],
.manage-systems-btn:hover[b-l6b18xa7zf] {
    background: #2c3e6b;
    color: #fff;
    border-color: #2c3e6b;
}

/* ── Two-ribbon system+mode selector, frozen at the top (bolder than the app ribbons) ── */
.lib-ribbons[b-l6b18xa7zf] {
    position: sticky;
    top: 0;
    z-index: 20;
    background: var(--wm-surface);
    padding: 8px 0;
    margin-bottom: 14px;
    border-bottom: 3px solid #2c3e6b;
}

.lib-ribbon-row[b-l6b18xa7zf] {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 3px 0;
}

.lib-ribbon-label[b-l6b18xa7zf] {
    font-weight: 800;
    width: 110px;
    flex-shrink: 0;
    font-size: 0.9rem;
    padding-top: 5px;
    color: #1c2a4d;
}

.lib-ribbon-links[b-l6b18xa7zf] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 5px;
    flex: 1 1 auto;
}

/* Content-language toggle, mirroring .ribbon-extra in SystemRibbons.razor.css - Blazor
   scopes stylesheets per component, so the same look is restated rather than shared. */
.lib-ribbon-extra[b-l6b18xa7zf] {
    display: flex;
    align-items: center;
    flex-shrink: 0;
    padding-top: 3px;
}

.lang-scope[b-l6b18xa7zf] {
    font-size: 0.68rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--wm-ink-faint);
    white-space: nowrap;
    margin-right: 8px;
}

.lang-toggle[b-l6b18xa7zf] {
    display: inline-flex;
    flex-shrink: 0;
}

.lang-toggle button[b-l6b18xa7zf] {
    padding: 3px 10px;
    border: 1px solid var(--wm-line);
    background: var(--wm-surface-2);
    cursor: pointer;
    font-size: 82%;
}

.lang-toggle button.active[b-l6b18xa7zf] {
    background: var(--wm-navy);
    color: #fff;
    border-color: var(--wm-navy);
}

.lang-toggle button:first-child[b-l6b18xa7zf] {
    border-radius: var(--wm-radius-sm) 0 0 var(--wm-radius-sm);
}

.lang-toggle button:last-child[b-l6b18xa7zf] {
    border-radius: 0 var(--wm-radius-sm) var(--wm-radius-sm) 0;
}

.lib-sys[b-l6b18xa7zf] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 96px;
    box-sizing: border-box;
    padding: 5px 10px;
    border: 1.5px solid var(--wm-line);
    border-radius: var(--wm-radius-sm);
    background: var(--wm-surface-2);
    color: #2c3e6b;
    font-size: 0.84rem;
    font-weight: 700;
    cursor: pointer;
    white-space: nowrap;
}

.lib-sys:hover[b-l6b18xa7zf] { background: #e2e8f5; }

.lib-sys.char.active[b-l6b18xa7zf] {
    background: #2c3e6b;
    color: #fff;
    border-color: #2c3e6b;
}

.lib-sys.obs[b-l6b18xa7zf] {
    background: #fff;
    border-color: #c2410c;
    color: #c2410c;
}

.lib-sys.obs:hover[b-l6b18xa7zf] { background: #ffe9dc; }

.lib-sys.obs.active[b-l6b18xa7zf] {
    background: #c2410c;
    color: #fff;
    border-color: #c2410c;
}

/* Divider before the Life Safety / Vertical Transportation group. */
.ribbon-divider[b-l6b18xa7zf] {
    flex: 0 0 auto;
    align-self: center;
    width: 3px;
    height: 24px;
    background: #8a93a8;
    margin: 0 9px;
    border-radius: 1px;
}

/* ── Delete confirmation dialog ── */
.del-overlay[b-l6b18xa7zf] {
    position: fixed;
    inset: 0;
    background: rgba(20, 26, 43, .45);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 100;
    padding: 20px;
}

.del-dialog[b-l6b18xa7zf] {
    background: var(--wm-surface);
    border-radius: var(--wm-radius);
    box-shadow: var(--wm-shadow);
    max-width: 460px;
    width: 100%;
    padding: 20px 22px;
}

.del-dialog h3[b-l6b18xa7zf] {
    margin: 0 0 12px;
    font-size: 1.05rem;
    color: var(--wm-ink);
}

.del-target[b-l6b18xa7zf] {
    background: var(--wm-inset);
    border-radius: var(--wm-radius-sm);
    padding: 9px 12px;
    margin: 0 0 12px;
    font-size: 0.92rem;
    color: var(--wm-ink);
    word-break: break-word;
}

.del-target .del-arrow[b-l6b18xa7zf] { color: var(--wm-ink-faint); margin: 0 4px; }

.del-scope[b-l6b18xa7zf] {
    font-size: 0.84rem;
    color: var(--wm-ink-soft);
    margin: 0 0 12px;
}

/* The predicted outcome, colour-keyed: bin = neutral, hidden = amber (kept, not gone),
   forked = amber (library loses it but inspections keep their copy). */
.del-effect[b-l6b18xa7zf] {
    font-size: 0.9rem;
    line-height: 1.45;
    border-left: 4px solid var(--wm-line);
    padding: 8px 12px;
    border-radius: 0 var(--wm-radius-sm) var(--wm-radius-sm) 0;
    background: var(--wm-surface-2);
    margin: 0 0 18px;
}

.del-effect.effect-bin[b-l6b18xa7zf]    { border-left-color: #6c7a94; }
.del-effect.effect-hidden[b-l6b18xa7zf] { border-left-color: #b8420c; background: #fdf3ec; }
.del-effect.effect-forked[b-l6b18xa7zf] { border-left-color: #b8420c; background: #fdf3ec; }

.del-actions[b-l6b18xa7zf] {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
}

.del-actions button[b-l6b18xa7zf] {
    border-radius: var(--wm-radius-sm);
    padding: 7px 16px;
    cursor: pointer;
    font-size: 0.88rem;
    font-weight: 600;
    border: 1px solid var(--wm-line);
}

.del-cancel[b-l6b18xa7zf] { background: var(--wm-surface); color: var(--wm-ink-soft); }
.del-cancel:hover:not(:disabled)[b-l6b18xa7zf] { background: var(--wm-inset); }

.del-confirm[b-l6b18xa7zf] {
    background: #c0392b;
    color: #fff;
    border-color: #c0392b;
}

.del-confirm:hover:not(:disabled)[b-l6b18xa7zf] { background: #a5311f; }
.del-actions button:disabled[b-l6b18xa7zf] { opacity: .55; cursor: default; }

/* Personal (per-workspace) library entries: an inspector's own additions, distinct from
   the shared master rows. A subtle left accent + a small tag so they're easy to spot. */
.cond-chip.personal[b-l6b18xa7zf] {
    border-left: 3px solid #6aa9ff;
}

.chip-personal[b-l6b18xa7zf] {
    display: inline-block;
    margin-left: 6px;
    padding: 0 6px;
    font-size: 0.68rem;
    line-height: 1.5;
    border-radius: 8px;
    background: #e7f0ff;
    color: #2b5fa8;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    vertical-align: middle;
}

@media (prefers-color-scheme: dark) {
    .chip-personal[b-l6b18xa7zf] { background: #1e3350; color: #a9c9ff; }
}

/* Suggested-for-shared-library badge (awaiting admin review). */
.chip-suggested[b-l6b18xa7zf] {
    display: inline-block;
    margin-left: 6px;
    padding: 0 6px;
    font-size: 0.68rem;
    line-height: 1.5;
    border-radius: 8px;
    background: #fff3d6;
    color: #8a5a00;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    vertical-align: middle;
}
@media (prefers-color-scheme: dark) {
    .chip-suggested[b-l6b18xa7zf] { background: #4a3a12; color: #f0c674; }
}
/* /Components/Pages/LibraryOverview.razor.rz.scp.css */
.sub[b-zqz9puyjwy] {
    color: var(--wm-ink-soft);
    margin-top: -6px;
    margin-bottom: 16px;
}

.cards[b-zqz9puyjwy] {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-bottom: 16px;
}

.card[b-zqz9puyjwy] {
    flex: 1 1 150px;
    min-width: 140px;
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius);
    padding: 12px 14px;
    background: var(--wm-surface);
    box-shadow: var(--wm-shadow);
    text-decoration: none;
    color: inherit;
    display: block;
    transition: box-shadow .12s, transform .12s;
}

a.card:hover[b-zqz9puyjwy] {
    box-shadow: 0 2px 8px rgba(44, 62, 107, 0.15);
    transform: translateY(-1px);
}

.stat-table td.n a[b-zqz9puyjwy] {
    color: #2c3e6b;
    font-weight: 600;
    text-decoration: none;
}

.stat-table td.n a:hover[b-zqz9puyjwy] { text-decoration: underline; }

.stat-table td.flag a[b-zqz9puyjwy] { color: #b5651d; }

/* Actionable "gap" cards stand out from the neutral count cards: bolder border + corner badge. */
.card.warn[b-zqz9puyjwy],
.card.stage[b-zqz9puyjwy] { position: relative; border-width: 2px; }

.card.warn[b-zqz9puyjwy] { background: #fff8f3; border-color: #dc8a4e; }
.card.stage[b-zqz9puyjwy] { background: #f4f6fd; border-color: #7f92c4; }

/* Language-neutral corner dot so the marker needs no translation. */
.card.warn[b-zqz9puyjwy]::after,
.card.stage[b-zqz9puyjwy]::after {
    content: "";
    position: absolute;
    top: 9px;
    right: 9px;
    width: 9px;
    height: 9px;
    border-radius: 50%;
}

.card.warn[b-zqz9puyjwy]::after { background: #b5651d; }
.card.stage[b-zqz9puyjwy]::after { background: #2c3e6b; }

.card .v[b-zqz9puyjwy] {
    font-size: 1.6rem;
    font-weight: 700;
    font-family: var(--wm-serif);
    color: #2c3e6b;
    line-height: 1.1;
}

.card.warn .v[b-zqz9puyjwy] { color: #b5651d; }

.card .l[b-zqz9puyjwy] {
    margin-top: 4px;
    font-family: var(--wm-mono);
    text-transform: uppercase;
    letter-spacing: .1em;
    font-size: 11px;
    color: var(--wm-ink-faint);
}

.card .s[b-zqz9puyjwy] {
    margin-top: 2px;
    font-size: 0.74rem;
    color: var(--wm-ink-faint);
}

h3[b-zqz9puyjwy] {
    font-family: var(--wm-mono);
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: var(--wm-ink-faint);
    border-bottom: 1px solid var(--wm-line);
    padding-bottom: 4px;
}

.stat-table[b-zqz9puyjwy] {
    border-collapse: collapse;
    width: 100%;
    margin-top: 10px;
}

.stat-table th[b-zqz9puyjwy],
.stat-table td[b-zqz9puyjwy] {
    padding: 7px 12px;
    border-bottom: 1px solid var(--wm-line-soft);
    font-size: 0.9rem;
}

.stat-table thead th[b-zqz9puyjwy] {
    text-align: left;
    background: var(--wm-surface-2);
    font-family: var(--wm-mono);
    color: var(--wm-ink-faint);
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.1em;
}

.stat-table th.n[b-zqz9puyjwy],
.stat-table td.n[b-zqz9puyjwy] {
    text-align: right;
    font-variant-numeric: tabular-nums;
}

.stat-table td.flag[b-zqz9puyjwy] {
    color: #b5651d;
    font-weight: 600;
}

.note[b-zqz9puyjwy] {
    margin-top: 20px;
    color: var(--wm-ink-faint);
    font-size: 0.82rem;
    font-style: italic;
}
/* /Components/Pages/LibrarySuggestions.razor.rz.scp.css */
.lsg-head[b-py5jv4llcp] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 12px;
}
.lsg-head h1[b-py5jv4llcp] { margin: 0; }
.lsg-head .subtitle[b-py5jv4llcp] { margin: 4px 0 0; color: var(--wm-ink-soft, #667); font-size: 0.9rem; max-width: 60ch; }
.back-link[b-py5jv4llcp] { white-space: nowrap; }

.empty-note[b-py5jv4llcp] { color: var(--wm-ink-soft, #667); font-style: italic; }

.lsg-list[b-py5jv4llcp] { display: flex; flex-direction: column; gap: 12px; }

.lsg-card[b-py5jv4llcp] {
    border: 1px solid var(--wm-line, #dcdce3);
    border-left: 3px solid #e0a800;
    border-radius: var(--wm-radius, 8px);
    padding: 12px 14px;
    background: var(--wm-surface, #fff);
}

.lsg-crumb[b-py5jv4llcp] {
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--wm-ink-soft, #778);
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}
.lsg-type[b-py5jv4llcp] { padding: 0 6px; border-radius: 8px; font-weight: 700; }
.lsg-type.defect[b-py5jv4llcp] { background: #fde2e1; color: #a3271f; }
.lsg-type.char[b-py5jv4llcp] { background: #e2ecff; color: #23407a; }
.lsg-ws[b-py5jv4llcp] { font-style: italic; text-transform: none; letter-spacing: 0; }

.lsg-name[b-py5jv4llcp] { font-weight: 600; margin: 6px 0; font-size: 1rem; }
.lsg-detail[b-py5jv4llcp] { font-size: 0.85rem; color: var(--wm-ink, #333); line-height: 1.4; margin: 2px 0; }

.lsg-actions[b-py5jv4llcp] { display: flex; gap: 10px; margin-top: 10px; }
.lsg-approve[b-py5jv4llcp], .lsg-dismiss[b-py5jv4llcp] {
    border: none;
    border-radius: var(--wm-radius-sm, 5px);
    padding: 7px 12px;
    font-size: 0.88rem;
    font-weight: 600;
    cursor: pointer;
}
.lsg-approve[b-py5jv4llcp] { background: #1f7a3d; color: #fff; }
.lsg-approve:hover:not(:disabled)[b-py5jv4llcp] { filter: brightness(1.1); }
.lsg-dismiss[b-py5jv4llcp] { background: var(--wm-surface-2, #eef); color: var(--wm-ink, #333); }
.lsg-dismiss:hover:not(:disabled)[b-py5jv4llcp] { background: var(--wm-inset, #dde); }
.lsg-approve:disabled[b-py5jv4llcp], .lsg-dismiss:disabled[b-py5jv4llcp] { opacity: 0.5; cursor: not-allowed; }
/* /Components/Pages/Manage.razor.rz.scp.css */
.subtitle[b-r7v3rggufk] {
    color: var(--wm-ink-soft);
    max-width: 760px;
}

.mg-group[b-r7v3rggufk] {
    margin-top: 22px;
    max-width: 1000px;
}

.mg-group-label[b-r7v3rggufk] {
    font-family: var(--wm-mono);
    text-transform: uppercase;
    letter-spacing: .08em;
    font-size: 11px;
    color: var(--wm-ink-faint);
    margin-bottom: 8px;
}

.mg-cards[b-r7v3rggufk] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 10px;
}

.mg-card[b-r7v3rggufk] {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 14px 16px;
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius);
    background: var(--wm-surface);
    box-shadow: var(--wm-shadow);
    text-decoration: none;
    color: inherit;
}

.mg-card:hover[b-r7v3rggufk] {
    border-color: var(--wm-navy);
    background: var(--wm-surface-2);
}

.mg-icon[b-r7v3rggufk] {
    font-size: 22px;
    line-height: 1.1;
}

.mg-title[b-r7v3rggufk] {
    font-weight: 600;
    color: var(--wm-navy);
}

.mg-desc[b-r7v3rggufk] {
    color: var(--wm-ink-soft);
    font-size: 90%;
    margin-top: 2px;
}

.mg-badge[b-r7v3rggufk] {
    display: inline-block;
    margin-top: 6px;
    background: #c0392b;
    color: #fff;
    border-radius: 10px;
    padding: 1px 9px;
    font-size: 78%;
    font-weight: 600;
}
/* /Components/Pages/RecycleBin.razor.rz.scp.css */
.rb-head[b-0fmz08y86u] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
}

.sub[b-0fmz08y86u] {
    color: var(--wm-ink-soft);
    margin-top: -6px;
}

.back-link[b-0fmz08y86u] {
    color: #2c3e6b;
    font-weight: 600;
    white-space: nowrap;
    padding-top: 6px;
}

.empty[b-0fmz08y86u] {
    color: var(--wm-ink-soft);
    background: var(--wm-surface-2);
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius);
    padding: 16px;
}

/* Filter + sort bar. Wraps on narrow screens; each control keeps a sensible min width. */
.rb-filters[b-0fmz08y86u] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px 10px;
    margin: 12px 0 6px;
}

.rb-filters select[b-0fmz08y86u],
.rb-search[b-0fmz08y86u] {
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius-sm);
    padding: 5px 9px;
    font-size: 0.85rem;
    background: var(--wm-surface);
}

.rb-search[b-0fmz08y86u] { flex: 1 1 180px; min-width: 140px; }

.rb-chips[b-0fmz08y86u] { display: flex; gap: 4px; flex-wrap: wrap; }

.rb-chip[b-0fmz08y86u] {
    border: 1px solid var(--wm-line);
    background: var(--wm-surface);
    border-radius: 20px;
    padding: 4px 12px;
    font-size: 0.8rem;
    cursor: pointer;
    white-space: nowrap;
}

.rb-chip:hover[b-0fmz08y86u] { border-color: var(--wm-navy); }

.rb-chip.on[b-0fmz08y86u] {
    background: var(--wm-navy);
    color: #fff;
    border-color: var(--wm-navy);
}

.rb-toolbar[b-0fmz08y86u] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 8px 0 12px;
}

.rb-count[b-0fmz08y86u] {
    color: var(--wm-ink-soft);
    font-size: 0.9rem;
}

.empty-btn[b-0fmz08y86u] {
    background: #fff;
    color: #a33;
    border: 1px solid #e0b4b4;
    border-radius: 4px;
    padding: 6px 12px;
    cursor: pointer;
    font-weight: 600;
}

.empty-btn:hover:not(:disabled)[b-0fmz08y86u] { background: #fdecea; }

.rb-notice[b-0fmz08y86u] {
    background: #eef3ff;
    border: 1px solid #c3d0f0;
    color: #2c3e6b;
    border-radius: 4px;
    padding: 8px 12px;
    margin-bottom: 10px;
    cursor: pointer;
}

.rb-list[b-0fmz08y86u] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.rb-row[b-0fmz08y86u] {
    display: flex;
    align-items: center;
    gap: 12px;
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius);
    padding: 8px 12px;
    background: var(--wm-surface);
    box-shadow: var(--wm-shadow-sm);
}

.rb-kind[b-0fmz08y86u] {
    flex-shrink: 0;
    font-family: var(--wm-mono);
    font-size: 0.68rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .1em;
    color: #fff;
    border-radius: 9px;
    padding: 2px 9px;
    min-width: 84px;
    text-align: center;
}

.kind-subsystem[b-0fmz08y86u]      { background: #2c3e6b; }
.kind-component[b-0fmz08y86u]      { background: #4a6b8a; }
/* Records split by category so the two are distinguishable at a glance - navy for a
   characteristic, orange for an observation, matching the ribbons. */
.kind-characteristic[b-0fmz08y86u] { background: #2c3e6b; }
.kind-observation[b-0fmz08y86u]    { background: #c2410c; }

.rb-main[b-0fmz08y86u] { flex: 1 1 auto; min-width: 0; }

.rb-name[b-0fmz08y86u] {
    font-weight: 600;
    color: #222;
}

.rb-path[b-0fmz08y86u] {
    font-size: 0.82rem;
    color: var(--wm-ink-soft);
    margin-top: 1px;
}

.rb-contents[b-0fmz08y86u] { color: var(--wm-ink-faint); }

/* When it was deleted — the column the user needs to line an item up against a session. */
.rb-when[b-0fmz08y86u] {
    flex-shrink: 0;
    font-family: var(--wm-mono);
    font-size: 0.76rem;
    color: var(--wm-ink-soft);
    white-space: nowrap;
    text-align: right;
    min-width: 92px;
}

.rb-actions[b-0fmz08y86u] {
    flex-shrink: 0;
    display: flex;
    gap: 6px;
}

.rb-actions button[b-0fmz08y86u] {
    border-radius: var(--wm-radius-sm);
    padding: 5px 11px;
    cursor: pointer;
    font-size: 0.82rem;
    border: 1px solid var(--wm-line);
    background: var(--wm-surface);
}

.rb-actions .restore[b-0fmz08y86u] {
    color: #1f7a3d;
    border-color: #b6dec4;
    font-weight: 600;
}

.rb-actions .restore:hover:not(:disabled)[b-0fmz08y86u] { background: #e7f6ec; }

.rb-actions .purge[b-0fmz08y86u] {
    color: #a33;
    border-color: #e0b4b4;
}

.rb-actions .purge:hover:not(:disabled)[b-0fmz08y86u] { background: #fdecea; }
/* /Components/Pages/Reports.razor.rz.scp.css */
.subtitle[b-dud3ufv09s] {
    color: var(--wm-ink-soft);
}

.report-menu[b-dud3ufv09s] {
    max-width: 1000px;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 12px;
    margin-top: 20px;
}

.report-menu-item[b-dud3ufv09s] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px;
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius);
    text-decoration: none;
    color: inherit;
    background: var(--wm-surface);
    box-shadow: var(--wm-shadow);
}

a.report-menu-item:hover[b-dud3ufv09s] {
    background: var(--wm-inset);
    border-color: #2c3e6b;
}

/* Demote the disabled tile: full-width, compact strip below the active tiles */
.report-menu-item.disabled[b-dud3ufv09s] {
    grid-column: 1 / -1;
    opacity: 0.55;
    cursor: default;
    padding: 8px 14px;
    background: var(--wm-surface-2);
    box-shadow: none;
}

.report-menu-item .icon[b-dud3ufv09s] {
    font-size: 26px;
}

.report-menu-item.disabled .icon[b-dud3ufv09s] {
    font-size: 18px;
}

.report-menu-item .title[b-dud3ufv09s] {
    font-weight: bold;
}

.report-menu-item.disabled .title[b-dud3ufv09s] {
    font-weight: normal;
}

.report-menu-item .desc[b-dud3ufv09s] {
    font-size: 90%;
    color: var(--wm-ink-soft);
}

@media (max-width: 900px) {
    .report-menu[b-dud3ufv09s] {
        grid-template-columns: 1fr;
    }
}
/* /Components/Pages/ReportSections.razor.rz.scp.css */
.subtitle[b-bbbyvpbpr2] {
    color: var(--wm-ink-soft);
    max-width: 700px;
}

.section-grid[b-bbbyvpbpr2] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
    max-width: 1400px;
    margin-bottom: 20px;
}

@media (max-width: 900px) {
    .section-grid[b-bbbyvpbpr2] {
        grid-template-columns: 1fr;
    }
}

.section-card[b-bbbyvpbpr2] {
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius);
    padding: 16px;
    background: var(--wm-surface);
    box-shadow: var(--wm-shadow);
}

.row2[b-bbbyvpbpr2] {
    display: flex;
    gap: 12px;
    margin-bottom: 10px;
}

.row2 > div[b-bbbyvpbpr2] {
    flex: 1;
}

.section-card label[b-bbbyvpbpr2] {
    display: block;
    font-family: var(--wm-mono);
    text-transform: uppercase;
    letter-spacing: .08em;
    font-size: 11px;
    color: var(--wm-ink-faint);
    margin-bottom: 3px;
}

.section-card input[b-bbbyvpbpr2],
.section-card textarea[b-bbbyvpbpr2] {
    width: 100%;
    box-sizing: border-box;
    padding: 6px;
    font-family: inherit;
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius-sm);
}

.section-card input:focus[b-bbbyvpbpr2],
.section-card textarea:focus[b-bbbyvpbpr2] {
    outline: none;
    border-color: var(--wm-navy);
    box-shadow: 0 0 0 3px rgba(44, 62, 107, .12);
}

.section-card textarea[b-bbbyvpbpr2] {
    resize: vertical;
    max-height: 160px;
}

.card-footer[b-bbbyvpbpr2] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 10px;
}

.active-toggle[b-bbbyvpbpr2] {
    font-weight: normal !important;
    display: flex !important;
    align-items: center;
    gap: 6px;
}

.card-actions[b-bbbyvpbpr2] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.card-actions button[b-bbbyvpbpr2] {
    padding: 6px 14px;
    cursor: pointer;
}

.card-actions .save[b-bbbyvpbpr2] {
    background: #2c3e6b;
    color: #fff;
    border: none;
    border-radius: var(--wm-radius-sm);
}

.card-actions .delete[b-bbbyvpbpr2] {
    background: var(--wm-surface);
    color: #a33;
    border: 1px solid #a33;
    border-radius: var(--wm-radius-sm);
}

.saved-msg[b-bbbyvpbpr2] {
    color: #2e7d32;
    font-size: 85%;
    min-width: 42px;
    text-align: right;
    white-space: nowrap;
}

.add-section[b-bbbyvpbpr2] {
    padding: 8px 18px;
    cursor: pointer;
    background: #2c3e6b;
    color: #fff;
    border: none;
    border-radius: var(--wm-radius-sm);
    font-weight: bold;
    font-size: 95%;
}

.add-section:hover[b-bbbyvpbpr2] {
    background: #24325a;
}

.pdf-row[b-bbbyvpbpr2] {
    margin: 10px 0;
}

.pdf-row label[b-bbbyvpbpr2] {
    display: block;
    font-family: var(--wm-mono);
    text-transform: uppercase;
    letter-spacing: .08em;
    font-size: 11px;
    color: var(--wm-ink-faint);
    margin-bottom: 4px;
}

.pdf-chip[b-bbbyvpbpr2] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: var(--wm-inset);
    border: 1px solid #2c3e6b;
    border-radius: var(--wm-radius-sm);
    padding: 4px 10px;
}

.pdf-chip a[b-bbbyvpbpr2] {
    color: #2c3e6b;
    text-decoration: none;
    font-weight: bold;
}

.remove-pdf[b-bbbyvpbpr2] {
    background: none;
    border: none;
    color: #a33;
    cursor: pointer;
    font-size: 110%;
    padding: 0;
}

.upload-error[b-bbbyvpbpr2] {
    display: block;
    color: #a33;
    font-size: 85%;
    margin-top: 4px;
}
/* /Components/Pages/ReportTemplateContent.razor.rz.scp.css */
.tc-head[b-8hbbtoiqah] {
    display: flex;
    align-items: center;
    gap: 16px;
    flex-wrap: wrap;
    margin-bottom: 4px;
}

.tc-head h1[b-8hbbtoiqah] { margin: 0; font-size: 1.4rem; flex: 1 1 auto; }

.tc-back[b-8hbbtoiqah] {
    font-size: 0.85rem;
    color: var(--wm-ink-soft);
    text-decoration: none;
    white-space: nowrap;
}
.tc-back:hover[b-8hbbtoiqah] { color: var(--wm-navy); text-decoration: underline; }

.tc-lang[b-8hbbtoiqah] { display: inline-flex; border: 1px solid var(--wm-line); border-radius: var(--wm-radius-sm); overflow: hidden; }
.tc-lang button[b-8hbbtoiqah] {
    border: none;
    background: var(--wm-surface);
    color: var(--wm-ink-soft);
    padding: 5px 12px;
    font-size: 0.8rem;
    font-weight: 600;
    cursor: pointer;
}
.tc-lang button.on[b-8hbbtoiqah] { background: var(--wm-navy); color: #fff; }

.subtitle[b-8hbbtoiqah] { color: var(--wm-ink-soft); font-size: 0.9rem; line-height: 1.4; max-width: 70ch; margin: 4px 0 16px; }
.empty[b-8hbbtoiqah] { color: var(--wm-ink-soft); font-style: italic; margin: 12px 0; }

.tc-copy[b-8hbbtoiqah] {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
    padding: 10px 14px;
    background: var(--wm-inset);
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius-sm);
    margin-bottom: 20px;
}
.tc-copy-btn[b-8hbbtoiqah] {
    background: var(--wm-surface-2);
    color: var(--wm-navy);
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius-sm);
    padding: 7px 14px;
    font-size: 0.85rem;
    font-weight: 600;
    cursor: pointer;
    white-space: nowrap;
}
.tc-copy-btn:hover[b-8hbbtoiqah] { background: var(--wm-inset); border-color: var(--wm-navy); }
.tc-copy-note[b-8hbbtoiqah] { font-size: 0.78rem; color: var(--wm-ink-soft); flex: 1 1 220px; line-height: 1.35; }
.tc-copy-msg[b-8hbbtoiqah] { color: #1f7a3d; font-weight: 600; font-size: 0.85rem; }

.tc-block[b-8hbbtoiqah] {
    margin-bottom: 28px;
    padding-top: 8px;
    border-top: 1px solid var(--wm-line);
}
.tc-block h2[b-8hbbtoiqah] { font-size: 1.05rem; margin: 8px 0 12px; color: var(--wm-navy); }

.tc-syspick[b-8hbbtoiqah] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    font-size: 0.82rem;
    color: var(--wm-ink-soft);
    max-width: 340px;
    margin-bottom: 16px;
}
.tc-syspick select[b-8hbbtoiqah] {
    padding: 7px 9px;
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius-sm);
    font-size: 0.95rem;
}

.tc-sub[b-8hbbtoiqah] {
    font-size: 0.92rem;
    color: var(--wm-ink);
    margin: 18px 0 8px;
    font-weight: 600;
}
/* /Components/Pages/ReportTemplates.razor.rz.scp.css */
.subtitle[b-4su4lgsrtf] {
    color: var(--wm-ink-soft);
    max-width: 760px;
}

.empty[b-4su4lgsrtf] { color: var(--wm-ink-faint); }

.tpl-list[b-4su4lgsrtf] {
    display: flex;
    flex-direction: column;
    gap: 14px;
    max-width: 1000px;
    margin-top: 16px;
}

.tpl-card[b-4su4lgsrtf] {
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius);
    background: var(--wm-surface);
    box-shadow: var(--wm-shadow);
    padding: 14px 16px;
}

.tpl-head[b-4su4lgsrtf] {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 12px;
}

.tpl-type[b-4su4lgsrtf] {
    font-weight: 700;
    font-size: 108%;
    color: var(--wm-navy);
}

.tpl-badge[b-4su4lgsrtf] {
    font-size: 80%;
    padding: 2px 10px;
    border-radius: 10px;
    background: #e3f4e8;
    color: #1d6b39;
    font-weight: 600;
}

.tpl-badge-default[b-4su4lgsrtf] {
    background: var(--wm-surface-2);
    color: var(--wm-ink-faint);
}

.tpl-grid[b-4su4lgsrtf] {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 10px 14px;
}

.tpl-grid label[b-4su4lgsrtf] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    font-family: var(--wm-mono);
    text-transform: uppercase;
    letter-spacing: .06em;
    font-size: 11px;
    color: var(--wm-ink-faint);
}

.tpl-grid input[b-4su4lgsrtf],
.tpl-grid select[b-4su4lgsrtf] {
    font-family: inherit;
    text-transform: none;
    letter-spacing: normal;
    font-size: 14px;
    color: var(--wm-ink);
    padding: 7px 8px;
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius-sm);
    background: var(--wm-surface);
}

.tpl-grid input:focus[b-4su4lgsrtf],
.tpl-grid select:focus[b-4su4lgsrtf] {
    outline: none;
    border-color: var(--wm-navy);
    box-shadow: 0 0 0 3px rgba(44, 62, 107, .12);
}

.tpl-actions[b-4su4lgsrtf] {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 12px;
}

.tpl-save[b-4su4lgsrtf] {
    background: var(--wm-navy);
    color: #fff;
    border: none;
    border-radius: var(--wm-radius-sm);
    padding: 7px 18px;
    cursor: pointer;
}

.tpl-saved[b-4su4lgsrtf] { color: #1d6b39; font-size: 90%; }

@media (max-width: 720px) {
    .tpl-grid[b-4su4lgsrtf] { grid-template-columns: 1fr; }
}
/* /Components/Pages/SampleReports.razor.rz.scp.css */
.subtitle[b-ofszywoitz] {
    color: var(--wm-ink-soft);
    max-width: 760px;
}

.empty[b-ofszywoitz] { color: var(--wm-ink-faint); }

.sr-toolbar[b-ofszywoitz] {
    margin: 16px 0 12px;
    max-width: 1000px;
}

.sr-search[b-ofszywoitz] {
    width: 100%;
    box-sizing: border-box;
    padding: 8px 10px;
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius-sm);
}

.sr-search:focus[b-ofszywoitz] {
    outline: none;
    border-color: var(--wm-navy);
    box-shadow: 0 0 0 3px rgba(44, 62, 107, .12);
}

.table-card[b-ofszywoitz] {
    max-width: 1000px;
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius);
    background: var(--wm-surface);
    box-shadow: var(--wm-shadow);
    overflow-x: auto;
}

table.sr-table[b-ofszywoitz] {
    border-collapse: collapse;
    width: 100%;
}

table.sr-table th[b-ofszywoitz],
table.sr-table td[b-ofszywoitz] {
    border-bottom: 1px solid var(--wm-line-soft);
    padding: 8px 10px;
    text-align: left;
    font-size: 90%;
}

table.sr-table th[b-ofszywoitz] {
    background: var(--wm-surface-2);
    font-family: var(--wm-mono);
    text-transform: uppercase;
    letter-spacing: .08em;
    font-size: 11px;
    color: var(--wm-ink-faint);
}

table.sr-table th.ctr[b-ofszywoitz], table.sr-table td.ctr[b-ofszywoitz] { text-align: center; }
table.sr-table td.strong[b-ofszywoitz] { font-weight: 600; }
table.sr-table td.strong a[b-ofszywoitz] { color: var(--wm-navy); text-decoration: none; }
table.sr-table tbody tr:last-child td[b-ofszywoitz] { border-bottom: none; }
table.sr-table tr.is-sample[b-ofszywoitz] { background: #e3f4e8; }

.sr-more[b-ofszywoitz] { color: var(--wm-ink-faint); font-size: 88%; margin-top: 8px; }
/* /Components/Pages/Settings.razor.rz.scp.css */
.subtitle[b-8f1ywpid8q] {
    color: var(--wm-ink-soft);
    margin-bottom: 16px;
}

.settings-help-hint[b-8f1ywpid8q] {
    margin-left: 8px;
    padding-left: 8px;
    border-left: 1px solid var(--wm-line);
    font-size: 90%;
    color: var(--wm-ink-faint);
}

.settings-help-hint a[b-8f1ywpid8q] {
    color: var(--wm-navy);
}

.field-hint[b-8f1ywpid8q] {
    color: var(--wm-ink-soft);
    font-size: 85%;
    margin: -6px 0 10px;
}

.settings-grid[b-8f1ywpid8q] {
    display: flex;
    gap: 20px;
    flex-wrap: wrap;
    max-width: 1160px;
}

.settings-card[b-8f1ywpid8q] {
    flex: 1 1 400px;
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius);
    padding: 14px 18px;
    background: var(--wm-surface);
    box-shadow: var(--wm-shadow);
}

.settings-card h2[b-8f1ywpid8q] {
    margin: 0 0 12px;
    font-size: 115%;
    color: #2c3e6b;
    border-bottom: 1px solid var(--wm-line-soft);
    padding-bottom: 6px;
}

.settings-card label[b-8f1ywpid8q] {
    display: flex;
    flex-direction: column;
    gap: 3px;
    font-family: var(--wm-mono);
    text-transform: uppercase;
    letter-spacing: .08em;
    font-size: 11px;
    color: var(--wm-ink-faint);
    margin-bottom: 10px;
}

.settings-card .two[b-8f1ywpid8q] {
    display: flex;
    gap: 12px;
}

.settings-card .two label[b-8f1ywpid8q] {
    flex: 1;
    min-width: 0;
}

@media (max-width: 560px) {
    .settings-card .two[b-8f1ywpid8q] {
        flex-direction: column;
        gap: 0;
    }
}

.settings-card input[b-8f1ywpid8q],
.settings-card textarea[b-8f1ywpid8q] {
    padding: 6px 8px;
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius-sm);
    font-size: 95%;
    box-sizing: border-box;
}

.settings-card input:focus[b-8f1ywpid8q],
.settings-card textarea:focus[b-8f1ywpid8q] {
    outline: none;
    border-color: var(--wm-navy);
    box-shadow: 0 0 0 3px rgba(44, 62, 107, .12);
}

.settings-card textarea[b-8f1ywpid8q] {
    resize: vertical;
}

.save-row[b-8f1ywpid8q] {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 4px 0 10px;
}

.save-row.card-footer[b-8f1ywpid8q] {
    margin: 14px 0 0;
    padding-top: 14px;
    border-top: 1px solid var(--wm-line-soft);
}

.save-row .primary[b-8f1ywpid8q] {
    background: #2c3e6b;
    color: #fff;
    border: none;
    border-radius: var(--wm-radius-sm);
    padding: 7px 16px;
    cursor: pointer;
}

.saved[b-8f1ywpid8q] {
    color: #1c6b45;
    font-size: 88%;
}

.img-field[b-8f1ywpid8q] {
    margin-top: 12px;
    border-top: 1px dashed var(--wm-line);
    padding-top: 12px;
}

.img-label[b-8f1ywpid8q] {
    font-family: var(--wm-mono);
    text-transform: uppercase;
    letter-spacing: .08em;
    font-size: 11px;
    color: var(--wm-ink-faint);
    font-weight: 600;
    margin-bottom: 6px;
}

.logo-preview[b-8f1ywpid8q] {
    display: block;
    max-width: 260px;
    max-height: 130px;
    object-fit: contain;
    border: 1px solid var(--wm-line);
    background: var(--wm-surface);
    padding: 4px;
    margin-bottom: 8px;
}

.sig-preview[b-8f1ywpid8q] {
    display: block;
    max-width: 260px;
    max-height: 90px;
    object-fit: contain;
    border: 1px solid var(--wm-line);
    background: var(--wm-surface);
    padding: 4px;
    margin-bottom: 8px;
}

.no-img[b-8f1ywpid8q] {
    display: block;
    color: var(--wm-ink-faint);
    font-style: italic;
    font-size: 88%;
    margin-bottom: 8px;
}

.err[b-8f1ywpid8q] {
    color: #a33;
    font-size: 85%;
    margin-top: 4px;
}
/* /Components/Pages/SupplementaryAttachments.razor.rz.scp.css */
.subtitle[b-0zltnq9ij6] {
    color: var(--wm-ink-soft);
    max-width: 700px;
}

.upload-box[b-0zltnq9ij6] {
    max-width: 1000px;
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius);
    padding: 12px 16px;
    margin: 16px 0 16px;
    background: var(--wm-surface);
    box-shadow: var(--wm-shadow);
}

.upload-box > summary[b-0zltnq9ij6] {
    cursor: pointer;
    font-weight: bold;
    font-size: 95%;
    color: #2c3e6b;
    list-style: none;
    user-select: none;
}

.upload-box > summary[b-0zltnq9ij6]::-webkit-details-marker {
    display: none;
}

/* Add breathing room between the summary and the fields only when expanded */
.upload-box[open] > summary[b-0zltnq9ij6] {
    margin-bottom: 12px;
}

.row2[b-0zltnq9ij6] {
    display: flex;
    gap: 12px;
    margin-bottom: 10px;
}

.row2 > div[b-0zltnq9ij6] {
    flex: 1;
}

.upload-box label[b-0zltnq9ij6] {
    display: block;
    font-family: var(--wm-mono);
    text-transform: uppercase;
    letter-spacing: .08em;
    font-size: 11px;
    color: var(--wm-ink-faint);
    margin-bottom: 3px;
}

.upload-box input[type="text"][b-0zltnq9ij6],
.upload-box input:not([type])[b-0zltnq9ij6] {
    width: 100%;
    box-sizing: border-box;
    padding: 6px;
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius-sm);
}

.upload-box input[type="text"]:focus[b-0zltnq9ij6],
.upload-box input:not([type]):focus[b-0zltnq9ij6] {
    outline: none;
    border-color: var(--wm-navy);
    box-shadow: 0 0 0 3px rgba(44, 62, 107, .12);
}

.upload-row[b-0zltnq9ij6] {
    margin-top: 8px;
}

.upload-error[b-0zltnq9ij6] {
    display: block;
    color: #a33;
    font-size: 85%;
    margin-top: 4px;
}

.empty[b-0zltnq9ij6] {
    color: var(--wm-ink-faint);
}

.table-card[b-0zltnq9ij6] {
    max-width: 1000px;
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius);
    background: var(--wm-surface);
    box-shadow: var(--wm-shadow);
    overflow-x: auto;
}

table.attachment-table[b-0zltnq9ij6] {
    border-collapse: collapse;
    width: 100%;
}

table.attachment-table th[b-0zltnq9ij6],
table.attachment-table td[b-0zltnq9ij6] {
    border-bottom: 1px solid var(--wm-line-soft);
    padding: 8px 10px;
    text-align: left;
    font-size: 90%;
}

table.attachment-table th[b-0zltnq9ij6] {
    background: var(--wm-surface-2);
    font-family: var(--wm-mono);
    text-transform: uppercase;
    letter-spacing: .08em;
    font-size: 11px;
    color: var(--wm-ink-faint);
}

table.attachment-table tbody tr:last-child td[b-0zltnq9ij6] {
    border-bottom: none;
}

table.attachment-table .delete[b-0zltnq9ij6] {
    background: var(--wm-surface);
    color: #a33;
    border: 1px solid #a33;
    border-radius: var(--wm-radius-sm);
    padding: 4px 10px;
    cursor: pointer;
}
/* /Components/ReportReadinessModal.razor.rz.scp.css */
.rr-overlay[b-mto5o3ud3i] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.5);
    z-index: 1200;
    display: flex;
    align-items: flex-start;
    justify-content: center;
}

.rr-box[b-mto5o3ud3i] {
    background: var(--wm-surface);
    width: 460px;
    max-width: 94%;
    margin: 12vh 0;
    border-radius: var(--wm-radius);
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
    padding: 20px 22px;
}

.rr-box h3[b-mto5o3ud3i] {
    margin: 0 0 8px;
    color: #b26a00;
}

.rr-intro[b-mto5o3ud3i] {
    margin: 0 0 12px;
    font-size: 0.92rem;
    color: var(--wm-ink-soft);
}

.rr-list[b-mto5o3ud3i] {
    margin: 0 0 6px;
    padding-left: 20px;
}

.rr-list li[b-mto5o3ud3i] {
    margin: 3px 0;
    font-weight: 600;
    color: var(--wm-ink);
}

.rr-actions[b-mto5o3ud3i] {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    margin-top: 18px;
}

.rr-actions button[b-mto5o3ud3i] {
    padding: 7px 16px;
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius-sm);
    background: var(--wm-surface);
    cursor: pointer;
}

.rr-actions .rr-proceed[b-mto5o3ud3i] {
    background: var(--wm-navy);
    color: #fff;
    border-color: var(--wm-navy);
}
/* /Components/RowMenu.razor.rz.scp.css */
/* Floating menu + full-screen close catcher for the reusable RowMenu component. */
.rm-backdrop[b-75xhlv86eq] { position: fixed; inset: 0; z-index: 40; }

.rm-menu[b-75xhlv86eq] {
    position: fixed;
    z-index: 41;
    background: var(--wm-surface);
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius-sm);
    box-shadow: var(--wm-shadow);
    padding: 4px;
    min-width: 180px;
    display: flex;
    flex-direction: column;
}

.rm-menu button[b-75xhlv86eq] {
    background: none;
    border: none;
    text-align: left;
    padding: 8px 10px;
    cursor: pointer;
    border-radius: var(--wm-radius-sm);
    font-size: 0.9rem;
    color: var(--wm-ink);
}

.rm-menu button:hover[b-75xhlv86eq] { background: var(--wm-surface-2); }
.rm-menu button.danger[b-75xhlv86eq] { color: #a33; }
.rm-menu button.danger:hover[b-75xhlv86eq] { background: #fbeaea; }
/* /Components/SystemRibbons.razor.rz.scp.css */
.system-ribbons[b-lm7c9belv2] {
    margin-bottom: 12px;
    /* Freeze the ribbons at the top while scrolling the (often long) checklist below. */
    position: sticky;
    top: 0;
    z-index: 20;
    background: var(--wm-surface);
    padding-top: 6px;
    padding-bottom: 6px;
    border-bottom: 1px solid var(--wm-line);
    /* Chip rows on the left take all remaining width; the content-language toggle sits in its own
       column on the right, spanning both rows — so it no longer narrows the system-chip area. */
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

.ribbon-rows[b-lm7c9belv2] { flex: 1 1 auto; min-width: 0; }
.ribbon-lang[b-lm7c9belv2] { flex: 0 0 auto; display: flex; align-items: center; }

.ribbon-row[b-lm7c9belv2] {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    padding: 3px 0;
}

.ribbon-label[b-lm7c9belv2] {
    font-weight: bold;
    width: 104px;
    flex-shrink: 0;
    font-size: 85%;
    padding-top: 4px;
}

.ribbon-links[b-lm7c9belv2] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 4px;
    flex: 1 1 auto;
}

/* Right-aligned slot (Home: Library links). */
.ribbon-extra[b-lm7c9belv2] {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    padding-top: 2px;
}

/* Uniform tag size: every system tag is the same fixed width regardless of screen size;
   what flexes with the viewport is the gap between the tag block and the Library link
   (ribbon-links is flex:1, so the empty space after the tags absorbs the width change). */
.sys-link[b-lm7c9belv2] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    min-width: 92px;
    box-sizing: border-box;
    padding: 3px 8px;
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius-sm);
    background: var(--wm-surface-2);
    text-decoration: none;
    color: #2c3e6b;
    font-size: 82%;
    white-space: nowrap;
}

/* Library links (built into the ribbon so they show on every page that hosts it). */
/* Content-language toggle (relocated from the page header into the ribbon, where the
   misplaced Library Overview link used to be). The caption names the current view. */
.lang-scope[b-lm7c9belv2] {
    font-size: 0.68rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--wm-ink-faint);
    white-space: nowrap;
    margin-right: 8px;
}

.lang-toggle[b-lm7c9belv2] {
    display: inline-flex;
    flex-shrink: 0;
}

.lang-toggle button[b-lm7c9belv2] {
    padding: 3px 10px;
    border: 1px solid var(--wm-line);
    background: var(--wm-surface-2);
    cursor: pointer;
    font-size: 82%;
}

.lang-toggle button.active[b-lm7c9belv2] {
    background: var(--wm-navy);
    color: #fff;
    border-color: var(--wm-navy);
}

.lang-toggle button:first-child[b-lm7c9belv2] {
    border-radius: var(--wm-radius-sm) 0 0 var(--wm-radius-sm);
}

.lang-toggle button:last-child[b-lm7c9belv2] {
    border-radius: 0 var(--wm-radius-sm) var(--wm-radius-sm) 0;
}

.lib-link[b-lm7c9belv2] {
    font-size: 82%;
    font-weight: 600;
    color: #2c3e6b;
    text-decoration: none;
    border: 1px solid var(--wm-line);
    border-radius: var(--wm-radius-sm);
    padding: 3px 10px;
    background: var(--wm-surface-2);
    white-space: nowrap;
}

.lib-link:hover[b-lm7c9belv2] {
    background: var(--wm-inset);
}

.sys-link:hover[b-lm7c9belv2] {
    background: var(--wm-inset);
}

/* Sets the Life Safety / Vertical Transportation group apart: space + line + space. */
.ribbon-divider[b-lm7c9belv2] {
    flex: 0 0 auto;
    align-self: center;
    width: 2px;
    height: 22px;
    background: var(--wm-line);
    margin: 0 8px;
    border-radius: 1px;
}

/* Characteristics = neutral navy; active fills navy. */
.sys-link.char.active[b-lm7c9belv2] {
    background: #2c3e6b;
    color: #fff;
    border-color: #2c3e6b;
}

/* Defects = amber (matches the record-type Defect colour, off the status palette). */
.sys-link.obs[b-lm7c9belv2] {
    border-color: #c2410c;
    color: #c2410c;
    background: #fff;
}

.sys-link.obs:hover[b-lm7c9belv2] {
    background: #ffe9dc;
}

.sys-link.obs.active[b-lm7c9belv2] {
    background: #c2410c;
    color: #fff;
    border-color: #c2410c;
}

.sys-link.disabled[b-lm7c9belv2] {
    color: var(--wm-ink-faint);
    border-color: var(--wm-line);
    background: var(--wm-surface-2);
    cursor: default;
}

.rib-badge[b-lm7c9belv2] {
    display: inline-block;
    margin-left: 5px;
    /* Fixed width that fits 1-, 2- or 3-digit counts, so every tag is the same size
       and the Characteristics and Defects rows line up. */
    min-width: 22px;
    box-sizing: border-box;
    padding: 0 4px;
    font-size: 82%;
    font-weight: 700;
    line-height: 15px;
    text-align: center;
    border-radius: 8px;
    background: rgba(0, 0, 0, 0.13);
    color: inherit;
    font-variant-numeric: tabular-nums;
}

/* Count of 0: keep the slot (so both rows align) but show no pill. */
.rib-badge.empty[b-lm7c9belv2] {
    background: transparent;
}
/* /Components/TestWatermark.razor.rz.scp.css */
/* Tiled diagonal "TEST / TRIAL" stamp. The SVG tile keeps it repeating across
   every printed page (a single fixed element would only stamp one page cleanly). */
.test-watermark[b-d52wo81k2n] {
    position: fixed;
    inset: 0;
    z-index: 9999;
    pointer-events: none;
    background-repeat: repeat;
    background-position: center;
    background-image: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='340'%20height='230'%3E%3Ctext%20x='170'%20y='120'%20fill='rgba(200,0,0,0.12)'%20font-size='36'%20font-family='Arial,sans-serif'%20font-weight='bold'%20text-anchor='middle'%20transform='rotate(-30%20170%20120)'%3ETEST%20/%20TRIAL%3C/text%3E%3C/svg%3E");
    /* Force the tile to print in Chromium-based browsers. */
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
}