@import '_content/Microsoft.AspNetCore.Components.QuickGrid/Microsoft.AspNetCore.Components.QuickGrid.boiwgh0w5b.bundle.scp.css';

/* /Components/Admin/AdminActivity.razor.rz.scp.css */
/* Range picker + export sit at the right of the page bar, wrapping on narrow
   screens — the same shape as the revenue page's .rev-actions. */
.activity-actions[b-rqju9s18r2] {
    margin-left: auto;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
    /* A flex item's min-width:auto floor is its widest child, so without this
       the date picker inside pushed the page bar past the viewport on a phone. */
    min-width: 0;
}
/* /Components/Admin/AdminBackups.razor.rz.scp.css */
/* Admin backups (spec 058). The status band is the finance page's KPI band,
   renamed so the two can drift apart without one breaking the other. Every
   colour is a theme token, so both themes come for free. */

.bk-actions[b-juo0stwpdc] {
    margin-left: auto;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
    min-width: 0;
}

.bk-card[b-juo0stwpdc] {
    padding: 1rem 1.25rem;
    color: var(--qq-admin-ink);
}

.bk-band[b-juo0stwpdc] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(11rem, 1fr));
    gap: 1px;
    background: var(--qq-admin-border);
    border: 1px solid var(--qq-admin-border);
    border-radius: 12px;
    overflow: hidden;
}

.bk-cell[b-juo0stwpdc] {
    background: var(--qq-admin-card);
    padding: 0.85rem 1rem;
    min-width: 0;
}

.bk-label[b-juo0stwpdc] {
    font-size: 0.72rem;
    color: var(--qq-admin-muted);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.bk-value[b-juo0stwpdc] {
    margin-top: 0.25rem;
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--qq-admin-ink);
    overflow-wrap: anywhere;
}

.bk-sub[b-juo0stwpdc] {
    font-family: var(--qq-admin-mono);
    font-size: 0.68rem;
    color: var(--qq-admin-faint);
    overflow-wrap: anywhere;
}

.bk-mono[b-juo0stwpdc] {
    font-family: var(--qq-admin-mono);
    font-size: 0.82rem;
}

.bk-when[b-juo0stwpdc] {
    font-family: var(--qq-admin-mono);
    font-size: 0.78rem;
    color: var(--qq-admin-muted);
    white-space: nowrap;
}

.bk-muted[b-juo0stwpdc] {
    color: var(--qq-admin-muted);
    font-size: 0.9rem;
}

.bk-note[b-juo0stwpdc] {
    color: var(--qq-admin-faint);
    font-size: 0.82rem;
}
/* /Components/Admin/AdminBookings.razor.rz.scp.css */
/* Spec 051 follow-up: the kind switch in the bookings page bar — Admin v3
   segmented control, the same one the Vehicles and Blocked windows panels use. */

.ab-kind[b-2sd7lmzyu2] {
    display: inline-flex;
    gap: 2px;
    background: var(--qq-admin-input);
    border: 1px solid var(--qq-admin-border);
    border-radius: 10px;
    padding: 3px;
}

.ab-kind-seg[b-2sd7lmzyu2] {
    padding: 7px 13px;
    border-radius: 8px;
    border: none;
    background: transparent;
    color: var(--qq-admin-muted);
    font-family: inherit;
    font-size: 0.8rem;
    font-weight: 600;
    white-space: nowrap;
    cursor: pointer;
}

.ab-kind-seg.is-active[b-2sd7lmzyu2] {
    background: var(--qq-admin-ink);
    color: var(--qq-admin-btn-fg);
}
/* /Components/Admin/AdminCampaignAnalytics.razor.rz.scp.css */
/* Campaign analytics (spec 062, handoff screen 3): funnel, by-surface table,
   seen-per-day bars, language and province splits. Admin tokens throughout;
   the funnel and bar inks are the campaign hue pairs (blue = seen,
   terracotta = clicked, faint = dismissed). The surface table scrolls inside
   its wrapper on a phone. */

.cma-body[b-irnsvj2x9t] {
    display: flex;
    flex-direction: column;
    gap: 22px;
    line-height: normal;
}

/* ---- Page bar ---- */

.cma-title-row[b-irnsvj2x9t] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
}

.cma-chip[b-irnsvj2x9t] {
    font-family: var(--qq-admin-mono);
    font-size: 9.5px;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    padding: 3px 8px;
    border-radius: 5px;
    white-space: nowrap;
}

.cma-status[b-irnsvj2x9t] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-family: var(--qq-admin-mono);
    font-size: 9.5px;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    padding: 4px 9px;
    border-radius: 6px;
    white-space: nowrap;
}

.cma-dot[b-irnsvj2x9t] {
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: currentColor;
}

.cma-hue-terracotta[b-irnsvj2x9t] { background: var(--qq-campaign-terracotta-bg); color: var(--qq-campaign-terracotta-fg); }
.cma-hue-gold[b-irnsvj2x9t] { background: var(--qq-campaign-gold-bg); color: var(--qq-campaign-gold-fg); }
.cma-hue-blue[b-irnsvj2x9t] { background: var(--qq-campaign-blue-bg); color: var(--qq-campaign-blue-fg); }
.cma-hue-grey[b-irnsvj2x9t] { background: var(--qq-campaign-grey-bg); color: var(--qq-campaign-grey-fg); }
.cma-hue-green[b-irnsvj2x9t] { background: var(--qq-campaign-green-bg); color: var(--qq-campaign-green-fg); }
.cma-hue-plum[b-irnsvj2x9t] { background: var(--qq-campaign-plum-bg); color: var(--qq-campaign-plum-fg); }

.cma-summary[b-irnsvj2x9t] {
    flex: 1;
    min-width: 14rem;
    font-family: var(--qq-admin-mono);
    font-size: 11px;
    color: var(--qq-text-muted);
}

.cma-actions[b-irnsvj2x9t] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-left: auto;
}

.cma-btn[b-irnsvj2x9t] {
    border-radius: 9px;
    font-size: 12.5px;
    padding: 7px 15px;
}

.qq-btn-outline.cma-btn[b-irnsvj2x9t] {
    background: transparent;
    border-color: var(--qq-admin-border);
    color: var(--qq-text-body);
}

.qq-btn-outline.cma-btn:hover[b-irnsvj2x9t] {
    background: var(--qq-admin-input);
}

.cma-btn-warm[b-irnsvj2x9t] {
    border-color: var(--qq-campaign-terracotta-border);
    color: var(--qq-campaign-terracotta-fg);
    background: transparent;
}

.cma-btn-warm:hover[b-irnsvj2x9t] {
    background: var(--qq-campaign-terracotta-bg);
    color: var(--qq-campaign-terracotta-fg);
}

.cma-btn-green[b-irnsvj2x9t] {
    border-color: var(--qq-campaign-green-border);
    color: var(--qq-campaign-green-fg);
}

.cma-btn-green:hover[b-irnsvj2x9t] {
    background: var(--qq-campaign-green-bg);
    color: var(--qq-campaign-green-fg);
}

.cma-btn-primary[b-irnsvj2x9t] {
    padding: 8px 15px;
    background: var(--qq-admin-ink);
    color: var(--qq-admin-btn-fg);
}

.cma-btn-primary:hover[b-irnsvj2x9t] {
    background: var(--qq-admin-btn-hover);
    color: var(--qq-admin-btn-fg);
    filter: none;
}

/* ---- Cards ---- */

.cma-card[b-irnsvj2x9t] {
    background: var(--qq-admin-card);
    border: 1px solid var(--qq-admin-border);
    border-radius: 14px;
    overflow: hidden;
}

.cma-funnel-card[b-irnsvj2x9t] {
    border-radius: 16px;
    padding: 22px 24px;
}

.cma-head-mono[b-irnsvj2x9t] {
    font-family: var(--qq-admin-mono);
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--qq-text-muted);
    margin-bottom: 16px;
}

.cma-head-sm[b-irnsvj2x9t] {
    font-size: 10px;
    letter-spacing: 0.12em;
    color: var(--qq-admin-faint);
    margin-bottom: 12px;
}

.cma-card-head[b-irnsvj2x9t] {
    padding: 14px 20px;
    border-bottom: 1px solid var(--qq-admin-border);
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 10px;
}

.cma-card-head-pad[b-irnsvj2x9t] {
    border-bottom: 0;
    padding: 20px 22px 0;
}

.cma-card-title[b-irnsvj2x9t] {
    font-weight: 700;
    font-size: 15px;
    color: var(--qq-admin-ink);
}

.cma-card-aside[b-irnsvj2x9t] {
    margin-left: auto;
    font-family: var(--qq-admin-mono);
    font-size: 11px;
    color: var(--qq-admin-faint);
}

/* ---- Funnel ---- */

.cma-funnel[b-irnsvj2x9t] {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 14px;
}

.cma-step-label[b-irnsvj2x9t] {
    font-family: var(--qq-admin-mono);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--qq-admin-faint);
}

.cma-step-value[b-irnsvj2x9t] {
    font-size: 30px;
    font-weight: 700;
    letter-spacing: -0.03em;
    line-height: 1;
    margin: 8px 0 4px;
}

.cma-step-caption[b-irnsvj2x9t] {
    font-size: 12px;
    color: var(--qq-text-muted);
}

.cma-track[b-irnsvj2x9t] {
    margin-top: 10px;
    height: 8px;
    background: var(--qq-admin-divider);
    border-radius: 4px;
    overflow: hidden;
}

.cma-fill[b-irnsvj2x9t] {
    height: 100%;
    border-radius: 4px;
}

.cma-ink-ink[b-irnsvj2x9t] { color: var(--qq-admin-ink); }
.cma-ink-blue[b-irnsvj2x9t] { color: var(--qq-campaign-blue-fg); }
.cma-ink-terracotta[b-irnsvj2x9t] { color: var(--qq-campaign-terracotta-fg); }
.cma-ink-faint[b-irnsvj2x9t] { color: var(--qq-admin-faint); }
.cma-bg-ink[b-irnsvj2x9t] { background: var(--qq-admin-ink); }
.cma-bg-blue[b-irnsvj2x9t] { background: var(--qq-campaign-blue-fg); }
.cma-bg-terracotta[b-irnsvj2x9t] { background: var(--qq-campaign-terracotta-fg); }
.cma-bg-faint[b-irnsvj2x9t] { background: var(--qq-admin-faint); }

/* ---- Two-column body ---- */

.cma-grid[b-irnsvj2x9t] {
    display: grid;
    grid-template-columns: 7fr 5fr;
    gap: 22px;
    align-items: start;
}

.cma-side[b-irnsvj2x9t] {
    display: flex;
    flex-direction: column;
    gap: 22px;
    min-width: 0;
}

.cma-pair[b-irnsvj2x9t] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 22px;
}

.cma-card-sm[b-irnsvj2x9t] {
    padding: 18px 20px;
}

/* ---- By surface table ---- */

.cma-table-scroll[b-irnsvj2x9t] {
    overflow-x: auto;
}

.cma-trow[b-irnsvj2x9t] {
    display: grid;
    grid-template-columns: 1.6fr 1fr 1fr 1fr 1fr 1fr;
    gap: 10px;
    align-items: center;
    padding: 13px 20px;
    border-bottom: 1px solid var(--qq-admin-divider);
    font-family: var(--qq-admin-mono);
    font-size: 12px;
    color: var(--qq-admin-ink);
    min-width: 560px;
}

.cma-thead[b-irnsvj2x9t] {
    padding: 10px 20px;
    border-bottom-color: var(--qq-admin-border);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--qq-admin-faint);
}

.cma-surface-name[b-irnsvj2x9t] {
    font-family: 'Space Grotesk', Helvetica, Arial, sans-serif;
    font-weight: 700;
    font-size: 13.5px;
    display: flex;
    align-items: center;
    gap: 8px;
}

.cma-code[b-irnsvj2x9t] {
    font-family: var(--qq-admin-mono);
    font-size: 9px;
    font-weight: 700;
    border: 1px solid var(--qq-admin-border);
    color: var(--qq-admin-muted);
    padding: 2px 5px;
    border-radius: 4px;
}

.cma-ctr[b-irnsvj2x9t] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.cma-ctr-value[b-irnsvj2x9t] {
    font-weight: 700;
}

.cma-ctr-track[b-irnsvj2x9t] {
    flex: 1;
    height: 5px;
    background: var(--qq-admin-divider);
    border-radius: 3px;
    overflow: hidden;
}

.cma-ctr-track > span[b-irnsvj2x9t] {
    display: block;
    height: 100%;
    background: var(--qq-campaign-terracotta-fg);
}

.cma-dim[b-irnsvj2x9t] {
    color: var(--qq-text-muted);
}

.cma-footnote[b-irnsvj2x9t] {
    padding: 12px 20px;
    font-size: 12px;
    color: var(--qq-text-muted);
}

.cma-empty[b-irnsvj2x9t] {
    padding: 16px 20px;
    font-size: 12.5px;
    color: var(--qq-text-muted);
}

/* ---- Seen per day ---- */

.cma-bars[b-irnsvj2x9t] {
    display: flex;
    align-items: flex-end;
    gap: 5px;
    height: 110px;
    padding: 14px 22px 20px;
    box-sizing: content-box;
}

.cma-bar-col[b-irnsvj2x9t] {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-end;
    gap: 6px;
    height: 100%;
    min-width: 0;
}

.cma-bar[b-irnsvj2x9t] {
    width: 100%;
    background: var(--qq-admin-ink);
    border-radius: 4px 4px 0 0;
}

.cma-bar.is-launch[b-irnsvj2x9t] {
    background: var(--qq-campaign-terracotta-fg);
}

.cma-bar-label[b-irnsvj2x9t] {
    font-family: var(--qq-admin-mono);
    font-size: 9.5px;
    color: var(--qq-admin-faint);
}

/* ---- Language and provinces ---- */

.cma-lang-row[b-irnsvj2x9t],
.cma-prov-row[b-irnsvj2x9t] {
    display: flex;
    justify-content: space-between;
    gap: 8px;
    font-size: 13px;
    margin-bottom: 6px;
}

.cma-lang[b-irnsvj2x9t] {
    font-weight: 700;
    color: var(--qq-admin-ink);
}

.cma-lang-stat[b-irnsvj2x9t] {
    font-family: var(--qq-admin-mono);
    color: var(--qq-admin-muted);
    text-align: right;
}

.cma-lang-track[b-irnsvj2x9t] {
    height: 6px;
    background: var(--qq-admin-divider);
    border-radius: 3px;
    overflow: hidden;
    margin-bottom: 12px;
}

.cma-lang-track > div[b-irnsvj2x9t] {
    height: 100%;
}

.cma-lang-track:last-child[b-irnsvj2x9t] {
    margin-bottom: 0;
}

.cma-provinces[b-irnsvj2x9t] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

/* ---- Narrow ---- */

@media (max-width: 1100px) {
    .cma-grid[b-irnsvj2x9t] {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 900px) {
    .cma-funnel[b-irnsvj2x9t] {
        grid-template-columns: repeat(2, 1fr);
    }

    .cma-step-value[b-irnsvj2x9t] {
        font-size: 26px;
    }

    .cma-actions[b-irnsvj2x9t] {
        margin-left: 0;
        flex-wrap: wrap;
    }
}

@media (max-width: 600px) {
    .cma-pair[b-irnsvj2x9t] {
        grid-template-columns: minmax(0, 1fr);
    }

    .cma-funnel-card[b-irnsvj2x9t] {
        padding: 18px 16px;
    }
}
/* /Components/Admin/AdminCampaignEditor.razor.rz.scp.css */
/* Campaign composer (spec 062, handoff screen 2): five numbered cards and a
   sticky preview. Admin tokens everywhere a surface themes; the reach card
   and the preview partials are fixed-hex pictures on purpose (fixed surface,
   fixed ink). Segmented controls, pills and province chips are buttons with
   an is-on state, drawn to the handoff's sizes. Under 1100px the preview
   drops below the cards and the two-column blocks stack. */

.cme-body[b-kpww30zdr6] {
    line-height: normal;
}

.cme-spacer[b-kpww30zdr6] {
    flex: 1;
}

.cme-columns[b-kpww30zdr6] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 440px;
    gap: 24px;
    align-items: start;
}

.cme-cards[b-kpww30zdr6] {
    display: flex;
    flex-direction: column;
    gap: 18px;
    min-width: 0;
}

/* ---- Page bar: draft pill or status chip ---- */

.cme-draft-pill[b-kpww30zdr6] {
    font-family: var(--qq-admin-mono);
    font-size: 10.5px;
    color: var(--qq-text-muted);
    border: 1px solid var(--qq-admin-border);
    background: var(--qq-admin-card);
    padding: 7px 12px;
    border-radius: 8px;
    white-space: nowrap;
}

.cme-status[b-kpww30zdr6] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-family: var(--qq-admin-mono);
    font-size: 9.5px;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    padding: 4px 9px;
    border-radius: 6px;
}

.cme-dot[b-kpww30zdr6] {
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: currentColor;
}

.cme-hue-green[b-kpww30zdr6] { background: var(--qq-campaign-green-bg); color: var(--qq-campaign-green-fg); }
.cme-hue-blue[b-kpww30zdr6] { background: var(--qq-campaign-blue-bg); color: var(--qq-campaign-blue-fg); }
.cme-hue-gold[b-kpww30zdr6] { background: var(--qq-campaign-gold-bg); color: var(--qq-campaign-gold-fg); }
.cme-hue-grey[b-kpww30zdr6] { background: var(--qq-campaign-grey-bg); color: var(--qq-campaign-grey-fg); }

/* ---- Cards ---- */

.cme-card[b-kpww30zdr6] {
    background: var(--qq-admin-card);
    border: 1px solid var(--qq-admin-border);
    border-radius: 14px;
    padding: 22px 24px;
}

.cme-card-head[b-kpww30zdr6] {
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 14px;
}

.cme-step[b-kpww30zdr6] {
    font-family: var(--qq-admin-mono);
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 0.12em;
    color: var(--qq-admin-accent);
}

.cme-card-title[b-kpww30zdr6] {
    font-weight: 700;
    font-size: 15px;
    color: var(--qq-admin-ink);
}

.cme-card-hint[b-kpww30zdr6] {
    font-size: 12.5px;
    color: var(--qq-text-muted);
}

.cme-label[b-kpww30zdr6] {
    display: block;
    font-family: var(--qq-admin-mono);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--qq-admin-faint);
    margin-bottom: 6px;
}

/* ---- 01 Type tiles ---- */

.cme-tiles[b-kpww30zdr6] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
}

.cme-tile[b-kpww30zdr6] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 5px;
    text-align: left;
    cursor: pointer;
    border: 1px solid var(--qq-admin-border);
    background: var(--qq-admin-card);
    border-radius: 11px;
    padding: 13px 14px;
    font-family: inherit;
    color: var(--qq-admin-ink);
}

.cme-tile:hover[b-kpww30zdr6] {
    border-color: var(--qq-admin-faint);
}

.cme-tile.is-on[b-kpww30zdr6] {
    border-color: var(--qq-admin-ink);
}

/* The selected tile takes its type's tint; the label is always in the type colour. */
.cme-tile-terracotta .cme-tile-label[b-kpww30zdr6] { color: var(--qq-campaign-terracotta-fg); }
.cme-tile-gold .cme-tile-label[b-kpww30zdr6] { color: var(--qq-campaign-gold-fg); }
.cme-tile-blue .cme-tile-label[b-kpww30zdr6] { color: var(--qq-campaign-blue-fg); }
.cme-tile-grey .cme-tile-label[b-kpww30zdr6] { color: var(--qq-campaign-grey-fg); }
.cme-tile-green .cme-tile-label[b-kpww30zdr6] { color: var(--qq-campaign-green-fg); }
.cme-tile-plum .cme-tile-label[b-kpww30zdr6] { color: var(--qq-campaign-plum-fg); }
.cme-tile-terracotta.is-on[b-kpww30zdr6] { background: var(--qq-campaign-terracotta-bg); }
.cme-tile-gold.is-on[b-kpww30zdr6] { background: var(--qq-campaign-gold-bg); }
.cme-tile-blue.is-on[b-kpww30zdr6] { background: var(--qq-campaign-blue-bg); }
.cme-tile-grey.is-on[b-kpww30zdr6] { background: var(--qq-campaign-grey-bg); }
.cme-tile-green.is-on[b-kpww30zdr6] { background: var(--qq-campaign-green-bg); }
.cme-tile-plum.is-on[b-kpww30zdr6] { background: var(--qq-campaign-plum-bg); }

.cme-tile-label[b-kpww30zdr6] {
    font-family: var(--qq-admin-mono);
    font-size: 9.5px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.cme-tile-name[b-kpww30zdr6] {
    font-size: 13.5px;
    font-weight: 700;
}

.cme-tile-desc[b-kpww30zdr6] {
    font-size: 12px;
    color: var(--qq-admin-muted);
    line-height: 1.4;
}

/* ---- 02 Message ---- */

.cme-langs[b-kpww30zdr6] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 18px;
}

.cme-lang[b-kpww30zdr6] {
    display: flex;
    flex-direction: column;
    gap: 12px;
    min-width: 0;
}

.cme-lang-head[b-kpww30zdr6] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-family: var(--qq-admin-mono);
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 0.08em;
    color: var(--qq-admin-ink);
}

.cme-lang-badge[b-kpww30zdr6] {
    background: var(--qq-admin-ink);
    color: var(--qq-admin-btn-fg);
    padding: 2px 7px;
    border-radius: 4px;
}

.cme-count.is-over[b-kpww30zdr6] {
    color: var(--qq-admin-accent);
}

.cme-input[b-kpww30zdr6] {
    display: block;
    width: 100%;
    box-sizing: border-box;
    font-family: inherit;
    font-size: 14px;
    padding: 10px 12px;
    border: 1px solid var(--qq-admin-border);
    border-radius: 10px;
    background: var(--qq-admin-input);
    color: var(--qq-admin-ink);
    outline: none;
}

.cme-input:focus[b-kpww30zdr6] {
    border-color: var(--qq-admin-faint);
}

.cme-input[b-kpww30zdr6]::placeholder {
    color: var(--qq-admin-faint);
}

.cme-textarea[b-kpww30zdr6] {
    font-size: 13.5px;
    line-height: 1.45;
    resize: vertical;
}

.cme-input-sm[b-kpww30zdr6] {
    font-size: 13.5px;
}

.cme-input-mono[b-kpww30zdr6] {
    font-family: var(--qq-admin-mono);
    font-size: 12.5px;
}

.cme-pair[b-kpww30zdr6] {
    display: grid;
    grid-template-columns: 1fr 1.4fr;
    gap: 10px;
}

/* Compact document slot: a dashed row beside the button field. */
.cme-image-slot[b-kpww30zdr6] {
    flex-direction: row;
    justify-content: flex-start;
    gap: 8px;
    min-height: 0;
    padding: 9px 12px;
    border: 1px dashed var(--qq-track-off);
    border-radius: 10px;
    background: color-mix(in srgb, var(--qq-admin-card) 50%, var(--qq-admin-shell));
    font-size: 12.5px;
    color: var(--qq-text-muted);
    line-height: 1.3;
}

.cme-image-swatch[b-kpww30zdr6] {
    width: 22px;
    height: 16px;
    border-radius: 3px;
    background: var(--qq-admin-border);
    flex: none;
}

.cme-image-filled[b-kpww30zdr6] {
    min-height: 0;
    padding: 6px 10px;
    gap: 10px;
    border-radius: 10px;
}

.cme-image-thumb[b-kpww30zdr6] {
    width: 48px;
    height: 32px;
    border-radius: 5px;
}

.cme-image-acts[b-kpww30zdr6] {
    display: flex;
    gap: 12px;
    font-size: 12.5px;
}

/* ---- 03 Surfaces ---- */

.cme-surfaces[b-kpww30zdr6] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px 18px;
}

.cme-surface[b-kpww30zdr6] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 12px;
    border-radius: 10px;
    border: 1px solid var(--qq-admin-border);
    background: var(--qq-admin-card);
    cursor: pointer;
    margin: 0;
    min-width: 0;
}

.cme-surface.is-on[b-kpww30zdr6] {
    border-color: var(--qq-track-off);
    background: color-mix(in srgb, var(--qq-admin-card) 50%, var(--qq-admin-shell));
}

.cme-surface.is-blocked[b-kpww30zdr6] {
    opacity: 0.45;
    cursor: not-allowed;
}

.cme-switch[b-kpww30zdr6] {
    align-items: center;
    flex: none;
}

/* The handoff's switch: green when on, and a light knob in both states
   (the kit's knob goes ink when off). The knob is a fixed light disc on a
   track that is never lighter than it, so it reads in both themes. */
.cme-switch .qq-toggle-track[b-kpww30zdr6]::after {
    background: #fffdf8;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
}

.cme-switch input:checked + .qq-toggle-track[b-kpww30zdr6] {
    background: var(--qq-campaign-green-fg);
}

.cme-surface-code[b-kpww30zdr6] {
    font-family: var(--qq-admin-mono);
    font-size: 9.5px;
    font-weight: 700;
    letter-spacing: 0.06em;
    border: 1px solid var(--qq-admin-border);
    color: var(--qq-admin-muted);
    padding: 2px 6px;
    border-radius: 4px;
    flex: none;
    width: 46px;
    box-sizing: border-box;
    text-align: center;
}

.cme-surface-text[b-kpww30zdr6] {
    flex: 1;
    min-width: 0;
}

.cme-surface-name[b-kpww30zdr6] {
    display: block;
    font-size: 13.5px;
    font-weight: 600;
    color: var(--qq-admin-ink);
}

.cme-surface-note[b-kpww30zdr6] {
    display: block;
    font-size: 11.5px;
    color: var(--qq-text-muted);
}

/* ---- 04 Audience ---- */

.cme-audience[b-kpww30zdr6] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 220px;
    gap: 22px;
    align-items: start;
}

.cme-rules[b-kpww30zdr6] {
    display: flex;
    flex-direction: column;
    gap: 14px;
    min-width: 0;
}

.cme-rule[b-kpww30zdr6] {
    display: grid;
    grid-template-columns: 120px minmax(0, 1fr);
    gap: 12px;
    align-items: center;
}

/* Card 05 stacks its two rows without the audience card's flex gap. */
.cme-card > .cme-rule + .cme-rule[b-kpww30zdr6] {
    margin-top: 12px;
}

.cme-rule.is-top[b-kpww30zdr6] {
    align-items: start;
}

.cme-rule .cme-label[b-kpww30zdr6] {
    margin-bottom: 0;
}

.cme-label-pad[b-kpww30zdr6] {
    padding-top: 8px;
}

/* Joined segmented control. */
.cme-seg[b-kpww30zdr6] {
    display: inline-flex;
    border: 1px solid var(--qq-admin-border);
    border-radius: 9px;
    overflow: hidden;
    width: max-content;
    max-width: 100%;
}

.cme-seg > button[b-kpww30zdr6] {
    border: 0;
    background: var(--qq-admin-card);
    color: var(--qq-text-body);
    padding: 8px 16px;
    font-family: inherit;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    white-space: nowrap;
}

.cme-seg > button.is-on[b-kpww30zdr6] {
    background: var(--qq-admin-ink);
    color: var(--qq-admin-btn-fg);
}

.cme-chips[b-kpww30zdr6],
.cme-pills[b-kpww30zdr6] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
}

.cme-prov[b-kpww30zdr6] {
    font-family: var(--qq-admin-mono);
    font-size: 11.5px;
    font-weight: 700;
    padding: 6px 10px;
    border-radius: 7px;
    border: 1px solid var(--qq-admin-border);
    background: var(--qq-admin-card);
    color: var(--qq-text-body);
    cursor: pointer;
}

.cme-prov.is-on[b-kpww30zdr6] {
    border-color: var(--qq-admin-ink);
    background: var(--qq-admin-ink);
    color: var(--qq-admin-btn-fg);
}

.cme-link-btn[b-kpww30zdr6] {
    border: 0;
    background: none;
    font-family: inherit;
    font-size: 12px;
    color: var(--qq-admin-accent);
    font-weight: 600;
    padding: 6px 8px;
    cursor: pointer;
}

.cme-pill[b-kpww30zdr6] {
    font-family: inherit;
    font-size: 12.5px;
    font-weight: 600;
    padding: 7px 12px;
    border-radius: 99px;
    border: 1px solid var(--qq-admin-border);
    background: var(--qq-admin-card);
    color: var(--qq-text-body);
    cursor: pointer;
}

.cme-pill.is-on[b-kpww30zdr6] {
    border-color: var(--qq-admin-ink);
    background: var(--qq-admin-ink);
    color: var(--qq-admin-btn-fg);
}

.cme-pill:disabled[b-kpww30zdr6] {
    cursor: default;
}

/* Seller plan at 40% when the audience is buyers only (handoff). */
.cme-pills.is-dim .cme-pill[b-kpww30zdr6] {
    opacity: 0.4;
}

.cme-plan-hint[b-kpww30zdr6] {
    font-size: 11.5px;
    color: var(--qq-admin-faint);
}

/* Reach card: fixed dark surface, fixed ink, in both themes (handoff). */
.cme-reach[b-kpww30zdr6] {
    background: #232019;
    color: #c9c1b0;
    border-radius: 12px;
    padding: 18px 20px;
}

/* In dark the console card is nearly the reach card's own colour, so the
   card takes a hairline to keep its edge. */
html[data-theme="dark"] .cme-reach[b-kpww30zdr6] {
    border: 1px solid var(--qq-admin-border);
}

.cme-reach-label[b-kpww30zdr6] {
    font-family: var(--qq-admin-mono);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: #8a8272;
}

.cme-reach-value[b-kpww30zdr6] {
    font-size: 36px;
    font-weight: 700;
    letter-spacing: -0.03em;
    color: #fbf8f1;
    line-height: 1;
    margin: 10px 0 4px;
}

.cme-reach-who[b-kpww30zdr6] {
    font-size: 12px;
    color: #a49b8a;
}

.cme-reach-bar[b-kpww30zdr6] {
    margin-top: 14px;
    height: 6px;
    border-radius: 3px;
    background: #6f6757;
    overflow: hidden;
    display: flex;
}

.cme-reach-bar > span[b-kpww30zdr6] {
    display: block;
    height: 100%;
    background: #c9a457;
}

.cme-reach-split[b-kpww30zdr6] {
    display: flex;
    justify-content: space-between;
    font-family: var(--qq-admin-mono);
    font-size: 10.5px;
    color: #a49b8a;
    margin-top: 6px;
}

.cme-reach-note[b-kpww30zdr6] {
    font-size: 11.5px;
    color: #8a8272;
    margin-top: 12px;
    line-height: 1.45;
}

/* ---- 05 Schedule ---- */

.cme-when[b-kpww30zdr6] {
    display: grid;
    grid-template-columns: minmax(0, 1.3fr) minmax(0, 1.3fr) minmax(0, 1fr);
    gap: 14px;
    margin-bottom: 16px;
}

.cme-dt[b-kpww30zdr6] {
    display: grid;
    grid-template-columns: minmax(0, 1.45fr) minmax(0, 1fr);
    gap: 6px;
}

/* The shared pickers wear the composer's input look here: mono, radius 10,
   and no leading glyph — the handoff's field is just the date-time text,
   and at a third of a card the icon costs the year. */
.cme-dt[b-kpww30zdr6]  .qq-dt-icon {
    display: none;
}

.cme-dt[b-kpww30zdr6]  .qq-dt-field {
    min-height: 0;
    padding: 10px 10px;
    border: 1px solid var(--qq-admin-border);
    border-radius: 10px;
    background: var(--qq-admin-input);
    color: var(--qq-admin-ink);
    font-family: var(--qq-admin-mono);
    font-size: 12.5px;
    font-weight: 400;
}

.cme-clock[b-kpww30zdr6] {
    font-size: 13px;
    padding: 10px 12px;
    border: 1px solid var(--qq-admin-border);
    border-radius: 10px;
    background: color-mix(in srgb, var(--qq-admin-card) 50%, var(--qq-admin-shell));
    color: var(--qq-text-body);
}

.cme-prio[b-kpww30zdr6] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
}

.cme-prio-hint[b-kpww30zdr6] {
    font-size: 12px;
    color: var(--qq-text-muted);
}

/* ---- Preview ---- */

.cme-preview[b-kpww30zdr6] {
    position: sticky;
    top: 20px;
    background: var(--qq-admin-card);
    border: 1px solid var(--qq-admin-border);
    border-radius: 14px;
    overflow: hidden;
    min-width: 0;
}

.cme-preview-head[b-kpww30zdr6] {
    padding: 14px 18px;
    border-bottom: 1px solid var(--qq-admin-border);
    display: flex;
    align-items: center;
    gap: 8px;
}

.cme-preview-title[b-kpww30zdr6] {
    font-weight: 700;
    font-size: 14px;
    color: var(--qq-admin-ink);
}

.cme-lang-toggle[b-kpww30zdr6] {
    display: inline-flex;
    border: 1px solid var(--qq-admin-border);
    border-radius: 7px;
    overflow: hidden;
}

.cme-lang-toggle > button[b-kpww30zdr6] {
    border: 0;
    background: var(--qq-admin-card);
    color: var(--qq-admin-muted);
    font-family: var(--qq-admin-mono);
    font-size: 10.5px;
    font-weight: 700;
    padding: 5px 10px;
    cursor: pointer;
}

.cme-lang-toggle > button.is-on[b-kpww30zdr6] {
    background: var(--qq-admin-ink);
    color: var(--qq-admin-btn-fg);
}

.cme-preview-tabs[b-kpww30zdr6] {
    display: flex;
    gap: 4px;
    padding: 10px 12px;
    border-bottom: 1px solid var(--qq-admin-border);
    overflow-x: auto;
}

.cme-preview-tab[b-kpww30zdr6] {
    border: 0;
    background: transparent;
    color: var(--qq-text-body);
    font-family: var(--qq-admin-mono);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    padding: 6px 10px;
    border-radius: 6px;
    white-space: nowrap;
    cursor: pointer;
}

/* A surface that is switched off still previews, but its tab reads ghosted. */
.cme-preview-tab.is-off[b-kpww30zdr6] {
    color: var(--qq-text-ghost);
}

.cme-preview-tab.is-on[b-kpww30zdr6] {
    background: var(--qq-admin-ink);
    color: var(--qq-admin-btn-fg);
}

.cme-stage[b-kpww30zdr6] {
    padding: 18px;
    background: var(--qq-campaign-stage);
    min-height: 420px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.cme-preview-foot[b-kpww30zdr6] {
    padding: 12px 18px;
    border-top: 1px solid var(--qq-admin-border);
    font-size: 12px;
    color: var(--qq-text-muted);
    display: flex;
    gap: 8px;
    align-items: center;
}

.cme-dot-green[b-kpww30zdr6] {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--qq-campaign-green-fg);
    flex: none;
}

/* ---- Footer bar ---- */

.cme-footer[b-kpww30zdr6] {
    margin: 24px -2rem -2.5rem;
    background: var(--qq-admin-card);
    border-top: 1px solid var(--qq-admin-border);
    padding: 16px 30px;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
}

.cme-footer-note[b-kpww30zdr6] {
    font-size: 12.5px;
    color: var(--qq-text-muted);
}

.cme-footer-note code[b-kpww30zdr6] {
    font-family: var(--qq-admin-mono);
    font-size: inherit;
    color: inherit;
    background: none;
    padding: 0;
}

.cme-btn[b-kpww30zdr6] {
    border-radius: 10px;
    font-size: 13.5px;
    padding: 10px 18px;
}

.qq-btn-outline.cme-btn[b-kpww30zdr6] {
    background: transparent;
    border-color: var(--qq-admin-border);
    color: var(--qq-text-body);
}

.qq-btn-outline.cme-btn:hover[b-kpww30zdr6] {
    background: var(--qq-admin-input);
}

.cme-btn-primary[b-kpww30zdr6] {
    padding: 10px 22px;
    background: var(--qq-admin-ink);
    color: var(--qq-admin-btn-fg);
}

.cme-btn-primary:hover[b-kpww30zdr6] {
    background: var(--qq-admin-btn-hover);
    color: var(--qq-admin-btn-fg);
    filter: none;
}

/* ---- Narrow ---- */

@media (max-width: 1100px) {
    .cme-columns[b-kpww30zdr6] {
        grid-template-columns: minmax(0, 1fr);
    }

    .cme-preview[b-kpww30zdr6] {
        position: static;
    }
}

@media (max-width: 900px) {
    .cme-footer[b-kpww30zdr6] {
        margin: 20px -0.9rem -2.25rem;
        padding: 14px 16px;
    }

    .cme-footer-note[b-kpww30zdr6] {
        flex-basis: 100%;
    }
}

@media (max-width: 700px) {
    .cme-card[b-kpww30zdr6] {
        padding: 18px 16px;
    }

    .cme-tiles[b-kpww30zdr6],
    .cme-langs[b-kpww30zdr6],
    .cme-surfaces[b-kpww30zdr6],
    .cme-audience[b-kpww30zdr6],
    .cme-when[b-kpww30zdr6],
    .cme-pair[b-kpww30zdr6] {
        grid-template-columns: minmax(0, 1fr);
    }

    .cme-rule[b-kpww30zdr6] {
        grid-template-columns: minmax(0, 1fr);
        gap: 6px;
    }

    .cme-label-pad[b-kpww30zdr6] {
        padding-top: 0;
    }

    .cme-seg[b-kpww30zdr6] {
        width: 100%;
    }

    .cme-seg > button[b-kpww30zdr6] {
        flex: 1;
        padding: 8px 10px;
    }

    .cme-footer .cme-btn[b-kpww30zdr6] {
        flex: 1;
    }
}
/* /Components/Admin/AdminCampaigns.razor.rz.scp.css */
/* Campaign ledger (spec 062, handoff screen 1). Every surface is an admin
   token and every ink on it a token too, so both themes come for free; the
   type and status hues are the --qq-campaign-* pairs app.css defines for
   this feature. The ledger grid sits in an overflow-x wrapper so a phone
   scrolls the table, never the page. Buttons keep their base class and take
   the handoff's squarer radius from a modifier. */

.cmp-body[b-7knmtkpghp] {
    display: flex;
    flex-direction: column;
    gap: 20px;
    line-height: normal;
}

/* ---- Buttons: handoff radius 10 on the kit's bases ---- */

.cmp-btn[b-7knmtkpghp] {
    border-radius: 10px;
    font-size: 12px;
    padding: 6px 12px;
}

.cmp-btn-primary[b-7knmtkpghp] {
    font-size: 13.5px;
    padding: 10px 18px;
    background: var(--qq-admin-ink);
    color: var(--qq-admin-btn-fg);
}

/* The handoff caps the description so the button sits beside it. */
.cmp-hint[b-7knmtkpghp] {
    max-width: 420px;
}

.cmp-btn-primary:hover[b-7knmtkpghp] {
    background: var(--qq-admin-btn-hover);
    color: var(--qq-admin-btn-fg);
    filter: none;
}

.cmp-btn-warm[b-7knmtkpghp] {
    border-color: var(--qq-campaign-terracotta-border);
    color: var(--qq-campaign-terracotta-fg);
    background: transparent;
}

.cmp-btn-warm:hover[b-7knmtkpghp] {
    background: var(--qq-campaign-terracotta-bg);
    color: var(--qq-campaign-terracotta-fg);
}

.cmp-btn-green[b-7knmtkpghp] {
    border-color: var(--qq-campaign-green-border);
    color: var(--qq-campaign-green-fg);
    background: transparent;
}

.cmp-btn-green:hover[b-7knmtkpghp] {
    background: var(--qq-campaign-green-bg);
    color: var(--qq-campaign-green-fg);
}

.qq-btn-outline.cmp-btn[b-7knmtkpghp] {
    background: transparent;
    border-color: var(--qq-admin-border);
    color: var(--qq-text-body);
}

.qq-btn-outline.cmp-btn:hover[b-7knmtkpghp] {
    background: var(--qq-admin-input);
}

/* ---- Metric band ---- */

.cmp-metrics[b-7knmtkpghp] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    background: var(--qq-admin-card);
    border: 1px solid var(--qq-admin-border);
    border-radius: 16px;
    overflow: hidden;
}

.cmp-metric[b-7knmtkpghp] {
    padding: 20px 22px;
    border-left: 1px solid var(--qq-admin-divider);
}

.cmp-metric:first-child[b-7knmtkpghp] {
    border-left: 0;
}

.cmp-metric-label[b-7knmtkpghp] {
    font-family: var(--qq-admin-mono);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--qq-admin-faint);
    margin-bottom: 9px;
}

.cmp-metric-value[b-7knmtkpghp] {
    font-size: 38px;
    font-weight: 700;
    letter-spacing: -0.03em;
    line-height: 1;
    color: var(--qq-admin-ink);
}

.cmp-metric-value.is-accent[b-7knmtkpghp] {
    color: var(--qq-admin-accent);
}

.cmp-metric-unit[b-7knmtkpghp] {
    font-size: 19px;
    font-weight: 500;
    color: var(--qq-admin-faint);
}

/* ---- Status tabs and filter selects ---- */

.cmp-filters[b-7knmtkpghp] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
}

.cmp-tab[b-7knmtkpghp] {
    font-family: var(--qq-admin-mono);
    font-size: 11px;
    font-weight: 400;
    text-transform: uppercase;
    color: var(--qq-admin-muted);
    border: 1px solid var(--qq-admin-border);
    background: var(--qq-admin-card);
    padding: 7px 13px;
    border-radius: 8px;
    cursor: pointer;
    white-space: nowrap;
}

.cmp-tab:hover[b-7knmtkpghp] {
    border-color: var(--qq-admin-faint);
}

.cmp-tab.is-on[b-7knmtkpghp] {
    font-weight: 700;
    background: var(--qq-admin-ink);
    color: var(--qq-admin-btn-fg);
    border-color: var(--qq-admin-ink);
}

.cmp-spacer[b-7knmtkpghp] {
    flex: 1;
}

.cmp-select[b-7knmtkpghp] {
    font-family: inherit;
    font-size: 12.5px;
    color: var(--qq-admin-muted);
    border: 1px solid var(--qq-admin-border);
    background: var(--qq-admin-card);
    padding: 8px 12px;
    border-radius: 9px;
    width: auto;
    min-width: 0;
    height: auto;
    line-height: 1.2;
}

/* ---- Ledger ---- */

.cmp-ledger[b-7knmtkpghp] {
    background: var(--qq-admin-card);
    border: 1px solid var(--qq-admin-border);
    border-radius: 14px;
    overflow: hidden;
}

.cmp-ledger-scroll[b-7knmtkpghp] {
    overflow-x: auto;
}

.cmp-grid[b-7knmtkpghp] {
    display: grid;
    grid-template-columns: minmax(0, 2.2fr) 110px 150px minmax(0, 1.6fr) 150px 130px 110px 80px;
    gap: 14px;
    align-items: center;
    padding: 14px 20px;
    /* The six fixed columns take ~870px with gaps; below this the name
       and audience columns would be squeezed to a word each, so the
       wrapper scrolls instead (the mock's own content width). */
    min-width: 1120px;
    border-bottom: 1px solid var(--qq-admin-divider);
}

.cmp-grid-head[b-7knmtkpghp] {
    padding: 11px 20px;
    border-bottom-color: var(--qq-admin-border);
    font-family: var(--qq-admin-mono);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--qq-admin-faint);
}

.cmp-row:last-child[b-7knmtkpghp] {
    border-bottom: 0;
}

/* An ended row sits a shade back, like a closed ledger line. */
.cmp-row.is-ended[b-7knmtkpghp] {
    background: color-mix(in srgb, var(--qq-admin-card) 70%, var(--qq-admin-shell));
}

.cmp-name-cell[b-7knmtkpghp] {
    min-width: 0;
}

.cmp-name[b-7knmtkpghp] {
    display: block;
    font-weight: 700;
    font-size: 13.5px;
    color: var(--qq-admin-ink);
    text-decoration: none;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.cmp-name:hover[b-7knmtkpghp] {
    color: var(--qq-admin-accent);
}

.cmp-meta[b-7knmtkpghp] {
    font-family: var(--qq-admin-mono);
    font-size: 10.5px;
    color: var(--qq-admin-faint);
    margin-top: 2px;
}

.cmp-chip[b-7knmtkpghp] {
    font-family: var(--qq-admin-mono);
    font-size: 9.5px;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    padding: 3px 8px;
    border-radius: 5px;
    white-space: nowrap;
}

.cmp-codes[b-7knmtkpghp] {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
}

.cmp-code[b-7knmtkpghp] {
    font-family: var(--qq-admin-mono);
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 0.04em;
    border: 1px solid var(--qq-admin-border);
    color: var(--qq-admin-muted);
    padding: 2px 5px;
    border-radius: 4px;
}

.cmp-audience[b-7knmtkpghp] {
    font-size: 12.5px;
    color: var(--qq-text-body);
    line-height: 1.35;
}

.cmp-window[b-7knmtkpghp] {
    font-family: var(--qq-admin-mono);
    font-size: 11px;
    color: var(--qq-text-muted);
    line-height: 1.4;
}

.cmp-seen[b-7knmtkpghp] {
    font-family: var(--qq-admin-mono);
    font-size: 11.5px;
    color: var(--qq-admin-ink);
}

.cmp-arrow[b-7knmtkpghp] {
    color: var(--qq-admin-faint);
}

.cmp-ctr[b-7knmtkpghp] {
    font-size: 10px;
    color: var(--qq-admin-faint);
}

.cmp-status[b-7knmtkpghp] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-family: var(--qq-admin-mono);
    font-size: 9.5px;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    padding: 4px 9px;
    border-radius: 6px;
    white-space: nowrap;
}

.cmp-dot[b-7knmtkpghp] {
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: currentColor;
}

.cmp-action[b-7knmtkpghp] {
    text-align: right;
}

.cmp-empty[b-7knmtkpghp] {
    padding: 28px 20px;
    font-size: 13px;
    color: var(--qq-text-muted);
}

.cmp-footnote[b-7knmtkpghp] {
    font-size: 12px;
    color: var(--qq-admin-faint);
    margin: 0;
}

.cmp-footnote code[b-7knmtkpghp] {
    font-family: var(--qq-admin-mono);
    font-size: inherit;
    color: inherit;
    background: none;
    padding: 0;
}

/* ---- Hue pairs (type chips and status chips) ---- */

.cmp-hue-terracotta[b-7knmtkpghp] { background: var(--qq-campaign-terracotta-bg); color: var(--qq-campaign-terracotta-fg); }
.cmp-hue-gold[b-7knmtkpghp] { background: var(--qq-campaign-gold-bg); color: var(--qq-campaign-gold-fg); }
.cmp-hue-blue[b-7knmtkpghp] { background: var(--qq-campaign-blue-bg); color: var(--qq-campaign-blue-fg); }
.cmp-hue-grey[b-7knmtkpghp] { background: var(--qq-campaign-grey-bg); color: var(--qq-campaign-grey-fg); }
.cmp-hue-green[b-7knmtkpghp] { background: var(--qq-campaign-green-bg); color: var(--qq-campaign-green-fg); }
.cmp-hue-plum[b-7knmtkpghp] { background: var(--qq-campaign-plum-bg); color: var(--qq-campaign-plum-fg); }

/* ---- Phone ---- */

@media (max-width: 900px) {
    .cmp-metrics[b-7knmtkpghp] {
        grid-template-columns: 1fr 1fr;
    }

    .cmp-metric:nth-child(3)[b-7knmtkpghp] {
        border-left: 0;
    }

    .cmp-metric:nth-child(n + 3)[b-7knmtkpghp] {
        border-top: 1px solid var(--qq-admin-divider);
    }

    .cmp-metric-value[b-7knmtkpghp] {
        font-size: 30px;
    }

    .cmp-spacer[b-7knmtkpghp] {
        flex-basis: 100%;
    }

    .cmp-select[b-7knmtkpghp] {
        flex: 1 1 0;
    }

    .cmp-btn-primary[b-7knmtkpghp] {
        margin-left: 0;
    }
}
/* /Components/Admin/AdminEmails.razor.rz.scp.css */
/* Admin email previews (spec 057). Two columns on a desk, one on a phone; the
   catalogue list on the left stays put while the right side scrolls. Every
   colour is an admin token so both themes hold. */

.em-seg[b-cirxvhhya7] {
    margin-left: auto;
}

.em-seg > button[b-cirxvhhya7] {
    padding: 0.4rem 1rem;
    font-size: 0.8rem;
}

.em-layout[b-cirxvhhya7] {
    display: grid;
    grid-template-columns: 17rem minmax(0, 1fr);
    gap: 1.25rem;
    align-items: start;
}

/* --- Left: the catalogue --------------------------------------------------- */

.em-list[b-cirxvhhya7] {
    position: sticky;
    top: 1rem;
    max-height: calc(100vh - 2rem);
    overflow: auto;
    padding: 0 0 0.5rem;
}

/* Pinned search inside the scrolling pane: it filters this list, so it lives here. */
.em-list-search[b-cirxvhhya7] {
    position: sticky;
    top: 0;
    z-index: 1;
    padding: 0.6rem 0.75rem;
    background: var(--qq-card);
    border-bottom: 1px solid var(--qq-admin-divider);
}

.em-list-search input[b-cirxvhhya7] {
    width: 100%;
}

.em-group + .em-group[b-cirxvhhya7] {
    border-top: 1px solid var(--qq-admin-divider);
    margin-top: 0.35rem;
    padding-top: 0.35rem;
}

.em-group-head[b-cirxvhhya7] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.5rem 0.9rem 0.3rem;
}

.em-count[b-cirxvhhya7] {
    font-weight: 400;
    color: var(--qq-admin-faint);
}

/* A row is a button so the keyboard reaches it; it looks like a list row. */
.em-item[b-cirxvhhya7] {
    display: block;
    width: 100%;
    text-align: left;
    border: 0;
    border-left: 3px solid transparent;
    background: transparent;
    padding: 0.42rem 0.9rem 0.42rem calc(0.9rem - 3px);
    font-family: inherit;
    color: var(--qq-admin-ink);
    cursor: pointer;
    min-width: 0;
}

.em-item:hover[b-cirxvhhya7] {
    background: var(--qq-admin-flag);
}

.em-item.on[b-cirxvhhya7] {
    background: var(--qq-admin-flag);
    border-left-color: var(--qq-admin-accent);
}

.em-item-name[b-cirxvhhya7] {
    display: block;
    font-size: 0.84rem;
    font-weight: 600;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.em-item-key[b-cirxvhhya7] {
    display: block;
    font-family: var(--qq-admin-mono);
    font-size: 0.64rem;
    color: var(--qq-admin-faint);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.em-empty[b-cirxvhhya7] {
    padding: 1rem;
    text-align: center;
    color: var(--qq-admin-muted);
    font-size: 0.85rem;
}

/* --- Right: the selected sample -------------------------------------------- */

.em-detail[b-cirxvhhya7] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    min-width: 0;
}

.em-title-row[b-cirxvhhya7] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.5rem 0.75rem;
}

.em-name[b-cirxvhhya7] {
    margin: 0;
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--qq-admin-ink);
}

.em-key[b-cirxvhhya7] {
    font-size: 0.7rem;
    color: var(--qq-admin-faint);
    overflow-wrap: anywhere;
}

.em-desc[b-cirxvhhya7] {
    margin: 0.5rem 0 0;
    font-size: 0.85rem;
    color: var(--qq-admin-muted);
}

.em-fields-head[b-cirxvhhya7] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    margin-top: 1rem;
    margin-bottom: 0.5rem;
}

/* The sample inputs: a compact grid, three up on a wide screen. */
.em-fields[b-cirxvhhya7] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(13rem, 1fr));
    gap: 0.6rem 0.9rem;
}

.em-field[b-cirxvhhya7] {
    display: block;
    min-width: 0;
}

.em-field .qq-label[b-cirxvhhya7] {
    font-size: 0.72rem;
    margin-bottom: 0.2rem;
    color: var(--qq-admin-muted);
}

.em-field .qq-input[b-cirxvhhya7] {
    background: var(--qq-admin-input);
    border-color: var(--qq-admin-border);
    color: var(--qq-admin-ink);
    border-radius: 8px;
}

.em-subject-card[b-cirxvhhya7] {
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 0.35rem 0.9rem;
}

.em-subject[b-cirxvhhya7] {
    flex: 1;
    min-width: 12rem;
    font-family: var(--qq-admin-mono);
    font-size: 0.86rem;
    color: var(--qq-admin-ink);
    overflow-wrap: anywhere;
}

.em-open[b-cirxvhhya7] {
    font-size: 0.78rem;
    color: var(--qq-admin-muted);
    white-space: nowrap;
}

/* The frame sits at email width on a neutral mat so the layout's own
   background (not the admin theme) decides how it reads. */
.em-frame-wrap[b-cirxvhhya7] {
    background: var(--qq-admin-shell);
    border: 1px solid var(--qq-admin-border);
    border-radius: 12px;
    padding: 1rem;
    overflow: auto;
}

.em-frame[b-cirxvhhya7] {
    display: block;
    width: 100%;
    max-width: 640px;
    height: 720px;
    margin: 0 auto;
    border: 0;
    border-radius: 6px;
    background: #ffffff;
}

.em-error[b-cirxvhhya7] {
    color: var(--qq-bad-fg);
    background: var(--qq-bad-bg);
    font-size: 0.85rem;
}

/* --- Other channels (notification kinds only) ------------------------------ */

.em-strip-top[b-cirxvhhya7] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-bottom: 0.9rem;
}

.em-channels[b-cirxvhhya7] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr));
    gap: 1px;
    background: var(--qq-admin-border);
    border: 1px solid var(--qq-admin-border);
    border-radius: 10px;
    overflow: hidden;
}

.em-channel[b-cirxvhhya7] {
    background: var(--qq-admin-card);
    padding: 0.75rem 0.9rem;
    min-width: 0;
}

.em-channel-title[b-cirxvhhya7] {
    margin-top: 0.3rem;
    font-size: 0.88rem;
    font-weight: 600;
    color: var(--qq-admin-ink);
    overflow-wrap: anywhere;
}

.em-channel-body[b-cirxvhhya7] {
    margin-top: 0.25rem;
    font-size: 0.84rem;
    color: var(--qq-admin-ink);
    overflow-wrap: anywhere;
}

.em-sms[b-cirxvhhya7] {
    margin: 0.3rem 0 0;
    padding: 0.5rem 0.6rem;
    font-family: var(--qq-admin-mono);
    font-size: 0.76rem;
    white-space: pre-wrap;
    overflow-wrap: anywhere;
    background: var(--qq-admin-input);
    color: var(--qq-admin-ink);
    border-radius: 8px;
}

.em-cap[b-cirxvhhya7] {
    font-family: var(--qq-admin-mono);
    font-size: 0.66rem;
    color: var(--qq-admin-faint);
    margin-left: 0.3rem;
    white-space: nowrap;
}

/* Past the dispatcher's cap: the strip is the place to notice before a buyer does. */
.em-cap.over[b-cirxvhhya7] {
    color: var(--qq-bad-fg);
    font-weight: 700;
}

.em-url[b-cirxvhhya7] {
    margin: 0.75rem 0 0;
    white-space: normal;
    overflow-wrap: anywhere;
}

.em-gating[b-cirxvhhya7] {
    margin-top: 0.75rem;
}

/* --- Send test ------------------------------------------------------------- */

.em-send-row[b-cirxvhhya7] {
    display: flex;
    align-items: flex-end;
    flex-wrap: wrap;
    gap: 0.75rem;
    margin: 0.5rem 0 0.6rem;
}

.em-send-field[b-cirxvhhya7] {
    flex: 1;
    min-width: 14rem;
    max-width: 26rem;
}

.em-send-field .qq-label[b-cirxvhhya7] {
    font-size: 0.72rem;
    margin-bottom: 0.2rem;
    color: var(--qq-admin-muted);
}

.em-send-field .qq-input[b-cirxvhhya7] {
    background: var(--qq-admin-input);
    border-color: var(--qq-admin-border);
    color: var(--qq-admin-ink);
    border-radius: 8px;
}

/* --- Phones ---------------------------------------------------------------- */

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

    .em-list[b-cirxvhhya7] {
        position: static;
        max-height: 20rem;
    }

    .em-seg[b-cirxvhhya7] {
        margin-left: 0;
    }

    .em-frame[b-cirxvhhya7] {
        height: 560px;
    }
}
/* /Components/Admin/AdminFinance.razor.rz.scp.css */
/* Admin finance (spec 056). The KPI band and page-bar actions are the revenue
   page's, renamed so the two pages can drift without one breaking the other. */

.fin-actions[b-1xb2z1es7q] {
    margin-left: auto;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
    /* A flex item's min-width:auto floor is its widest child; without this the
       date picker pushed the page bar past the viewport on a phone. */
    min-width: 0;
}

/* KPI band: a responsive grid of label/figure cells on one card surface. */
.fin-band[b-1xb2z1es7q] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(10.5rem, 1fr));
    gap: 1px;
    background: var(--qq-admin-border);
    border: 1px solid var(--qq-admin-border);
    border-radius: 12px;
    overflow: hidden;
}

.fin-cell[b-1xb2z1es7q] {
    background: var(--qq-admin-card);
    padding: 0.85rem 1rem;
    min-width: 0;
}

.fin-label[b-1xb2z1es7q] {
    font-size: 0.72rem;
    color: var(--qq-admin-muted);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.fin-value[b-1xb2z1es7q] {
    margin-top: 0.25rem;
    font-size: 1.15rem;
    font-weight: 700;
    color: var(--qq-admin-ink);
    overflow-wrap: anywhere;
}

/* Money going out, and a loss: the same accent the revenue page gives refunds. */
.fin-value.hot[b-1xb2z1es7q] {
    color: var(--qq-admin-accent);
}

.fin-sub[b-1xb2z1es7q] {
    font-family: var(--qq-admin-mono);
    font-size: 0.68rem;
    color: var(--qq-admin-faint);
}

.fin-empty[b-1xb2z1es7q] {
    padding: 0.6rem 0;
    text-align: center;
    color: var(--qq-admin-muted);
    font-size: 0.85rem;
}

.fin-muted[b-1xb2z1es7q] {
    color: var(--qq-admin-faint);
}

/* Category footer: the total row reads as a total, not as one more category. */
.fin-total td[b-1xb2z1es7q] {
    font-weight: 700;
    border-top: 2px solid var(--qq-border);
}

/* Ledger heading row: title, the voided switch, and the add button. */
.fin-ledger-head[b-1xb2z1es7q] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.75rem 1rem;
}

.fin-ledger-head > .admin-col-head[b-1xb2z1es7q] {
    margin: 0;
}

.fin-ledger-head > .qq-btn[b-1xb2z1es7q] {
    margin-left: auto;
}

.fin-vendor[b-1xb2z1es7q] {
    font-weight: 600;
}

.fin-pill[b-1xb2z1es7q] {
    margin-left: 0.4rem;
    font-size: 0.68rem;
    padding: 0.1rem 0.55rem;
}

/* A voided row stays on file (never deleted) but must not read as live money. */
.fin-voided td[b-1xb2z1es7q] {
    color: var(--qq-admin-faint);
}

.fin-voided .fin-vendor[b-1xb2z1es7q],
.fin-voided td.admin-mono[b-1xb2z1es7q] {
    text-decoration: line-through;
}

/* --- Add / edit dialog ---------------------------------------------------- */

.fin-dialog[b-1xb2z1es7q] {
    max-width: 40rem;
}

.fin-form[b-1xb2z1es7q] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.8rem 1rem;
    margin-bottom: 1.1rem;
}

.fin-field[b-1xb2z1es7q] {
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
    min-width: 0;
}

.fin-field-wide[b-1xb2z1es7q] {
    grid-column: 1 / -1;
}

.fin-form textarea.qq-input[b-1xb2z1es7q] {
    resize: vertical;
}

.fin-receipt-row[b-1xb2z1es7q] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.6rem;
    margin-top: 0.3rem;
    font-size: 0.85rem;
}

@media (max-width: 560px) {
    .fin-form[b-1xb2z1es7q] {
        grid-template-columns: minmax(0, 1fr);
    }
}
/* /Components/Admin/AdminFinanceTax.razor.rz.scp.css */
/* Admin tax page (spec 056): settings card beside the worksheet. */

.tax-actions[b-m7eyorxrge] {
    margin-left: auto;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
    min-width: 0;
}

.tax-layout[b-m7eyorxrge] {
    display: grid;
    grid-template-columns: minmax(16rem, 22rem) minmax(0, 1fr);
    gap: 1.2rem;
    align-items: start;
}

.tax-main[b-m7eyorxrge] {
    min-width: 0;
}

/* --- Settings card ---------------------------------------------------------- */

.tax-settings[b-m7eyorxrge] {
    display: flex;
    flex-direction: column;
    gap: 0.85rem;
}

.tax-field[b-m7eyorxrge] {
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
    min-width: 0;
}

.tax-inline[b-m7eyorxrge] {
    display: flex;
    gap: 0.5rem;
    align-items: center;
}

.tax-inline > select[b-m7eyorxrge] {
    flex: 1 1 auto;
    min-width: 0;
}

.tax-day[b-m7eyorxrge] {
    width: 5rem;
    flex: 0 0 auto;
}

.tax-save[b-m7eyorxrge] {
    display: flex;
    justify-content: flex-end;
    padding-top: 0.2rem;
}

/* --- Threshold banner ------------------------------------------------------- */

.tax-threshold-title[b-m7eyorxrge] {
    font-weight: 700;
}

.tax-threshold-figures[b-m7eyorxrge] {
    font-family: var(--qq-admin-mono);
    font-size: 0.78rem;
    margin-top: 0.2rem;
}

.tax-threshold-text[b-m7eyorxrge] {
    font-weight: 400;
    font-size: 0.85rem;
    margin-top: 0.3rem;
}

/* --- Period and worksheet --------------------------------------------------- */

.tax-period[b-m7eyorxrge] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.6rem 1rem;
}

.tax-period > .admin-col-head[b-m7eyorxrge] {
    margin: 0;
}

.tax-period-nav[b-m7eyorxrge] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    margin-left: auto;
}

.tax-period-dates[b-m7eyorxrge] {
    font-family: var(--qq-admin-mono);
    font-size: 0.85rem;
    color: var(--qq-admin-ink);
    white-space: nowrap;
}

.tax-subtotal td[b-m7eyorxrge] {
    font-weight: 600;
}

.tax-net td[b-m7eyorxrge] {
    font-weight: 700;
    border-top: 2px solid var(--qq-border);
}

.tax-pill[b-m7eyorxrge] {
    margin-left: 0.4rem;
    font-size: 0.68rem;
    padding: 0.1rem 0.55rem;
}

.tax-empty[b-m7eyorxrge] {
    padding: 0.6rem 0;
    text-align: center;
    color: var(--qq-admin-muted);
    font-size: 0.85rem;
}

.tax-notes ul[b-m7eyorxrge] {
    margin: 0;
    padding-left: 1.1rem;
}

.tax-notes li[b-m7eyorxrge] {
    font-size: 0.78rem;
    color: var(--qq-admin-muted);
    margin-bottom: 0.3rem;
}

@media (max-width: 900px) {
    .tax-layout[b-m7eyorxrge] {
        grid-template-columns: minmax(0, 1fr);
    }
}
/* /Components/Admin/AdminHome.razor.rz.scp.css */
/* One card, six cells, hairline rules between (the v3 metric band). */
.stat-band[b-crfa4l54ae] {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    overflow: hidden;
}

.stat-cell[b-crfa4l54ae] {
    padding: 1.1rem 1.25rem;
    text-decoration: none;
    color: inherit;
    display: block;
}

.stat-cell + .stat-cell[b-crfa4l54ae] {
    border-left: 1px solid #efe9db;
}

a.stat-cell:hover[b-crfa4l54ae] {
    /* Token, not #fbfaf5: the metric text flips light in dark mode and was
       lost on a fixed light hover wash. */
    background: var(--qq-admin-input);
    color: inherit;
    text-decoration: none;
}

.stat-label[b-crfa4l54ae] {
    font-family: var(--qq-admin-mono);
    font-size: 0.66rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--qq-admin-muted);
    margin-bottom: 0.3rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.stat-value[b-crfa4l54ae] {
    font-size: 2.375rem; /* 38px display metric */
    font-weight: 700;
    letter-spacing: -0.03em;
    line-height: 1.1;
    color: var(--qq-admin-ink);
}

.stat-value.stat-accent[b-crfa4l54ae] {
    color: var(--qq-admin-accent);
}

.stat-sub[b-crfa4l54ae] {
    font-size: 1.1875rem; /* 19px */
    font-weight: 500;
    color: var(--qq-admin-faint);
}

/* needs-attention rows are links; keep the row look */
.attention-row[b-crfa4l54ae] {
    text-decoration: none;
    color: inherit;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.attention-row:hover[b-crfa4l54ae] {
    color: inherit;
}

.overview-grid[b-crfa4l54ae] {
    display: grid;
    grid-template-columns: 8fr 4fr;
    gap: 1.4rem;
    align-items: start;
}

@media (max-width: 1200px) {
    .stat-band[b-crfa4l54ae] {
        grid-template-columns: repeat(3, 1fr);
    }

    .stat-cell:nth-child(4)[b-crfa4l54ae] {
        border-left: none;
    }

    .stat-cell:nth-child(n+4)[b-crfa4l54ae] {
        border-top: 1px solid #efe9db;
    }
}

@media (max-width: 992px) {
    .overview-grid[b-crfa4l54ae] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 600px) {
    .stat-band[b-crfa4l54ae] {
        grid-template-columns: repeat(2, 1fr);
    }

    .stat-cell:nth-child(odd)[b-crfa4l54ae] {
        border-left: none;
    }

    .stat-cell:nth-child(n+3)[b-crfa4l54ae] {
        border-top: 1px solid #efe9db;
    }
}
/* /Components/Admin/AdminLaunch.razor.rz.scp.css */
/* Launch-day checklist (spec 063). Every colour is a theme token, so both
   themes come for free; state reads from the pill, never from colour alone. */

.ln-actions[b-il53mxzknc] {
    margin-left: auto;
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    min-width: 0;
}

.ln-summary[b-il53mxzknc] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.75rem 1.25rem;
    padding: 1rem 1.25rem;
    color: var(--qq-admin-ink);
}

.ln-summary-main[b-il53mxzknc] {
    font-size: 1.15rem;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
}

.ln-summary-parts[b-il53mxzknc] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
}

.ln-list[b-il53mxzknc] {
    padding: 0;
    overflow: hidden;
}

.ln-row[b-il53mxzknc] {
    display: flex;
    align-items: flex-start;
    gap: 0.85rem;
    padding: 0.85rem 1.25rem;
    color: var(--qq-admin-ink);
    min-width: 0;
}

.ln-row + .ln-row[b-il53mxzknc] {
    border-top: 1px solid var(--qq-admin-border);
}

.ln-pill[b-il53mxzknc] {
    flex: none;
    min-width: 7.5rem;
    text-align: center;
    margin-top: 0.1rem;
}

.ln-text[b-il53mxzknc] {
    flex: 1;
    min-width: 0;
}

.ln-name[b-il53mxzknc] {
    font-weight: 600;
    overflow-wrap: anywhere;
}

.ln-detail[b-il53mxzknc] {
    font-size: 0.85rem;
    color: var(--qq-admin-muted);
    overflow-wrap: anywhere;
}

.ln-inline-link[b-il53mxzknc] {
    margin-left: 0.5rem;
    font-size: 0.8rem;
    font-weight: 500;
}

.ln-ticked[b-il53mxzknc] {
    margin-top: 0.3rem;
    font-size: 0.82rem;
    color: var(--qq-admin-muted);
}

.ln-note[b-il53mxzknc] {
    margin-left: 0.35rem;
    font-style: italic;
}

.ln-tick-form[b-il53mxzknc] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-top: 0.5rem;
}

.ln-note-input[b-il53mxzknc] {
    flex: 1 1 14rem;
    min-width: 0;
}

.ln-open[b-il53mxzknc] {
    flex: none;
    align-self: center;
}

.ln-foot[b-il53mxzknc] {
    font-size: 0.8rem;
    color: var(--qq-admin-muted);
}

@media (max-width: 560px) {
    .ln-row[b-il53mxzknc] {
        flex-wrap: wrap;
    }

    .ln-pill[b-il53mxzknc] {
        min-width: 0;
    }

    .ln-text[b-il53mxzknc] {
        flex-basis: 100%;
    }
}
/* /Components/Admin/AdminMenuLayout.razor.rz.scp.css */
/* Menu layout editor. Palette follows the design handoff's settings surface;
   row heights match the rail (40px) so the editor reads as the thing it edits. */

.nav-cat[b-7pvqcfsz8i] {
    border: 1px solid var(--qq-admin-border);
    border-radius: 10px;
    overflow: hidden;
    margin-bottom: 0.75rem;
}

.nav-cat-head[b-7pvqcfsz8i] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 0.7rem;
    background: var(--qq-admin-bar-soft, var(--qq-admin-card));
    border-bottom: 1px solid var(--qq-admin-border);
}

.nav-cat-name[b-7pvqcfsz8i] {
    font-size: 0.72rem;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--qq-admin-muted);
    font-weight: 700;
}

.nav-cat-count[b-7pvqcfsz8i] {
    font-family: var(--qq-admin-mono);
    font-size: 0.68rem;
    color: var(--qq-admin-faint);
    margin-right: auto;
}

.nav-rows[b-7pvqcfsz8i] {
    padding: 0.35rem;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.nav-row[b-7pvqcfsz8i] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    min-height: 40px;
    padding: 0 0.5rem;
    border-radius: 9px;
    background: var(--qq-admin-card);
    cursor: grab;
    /* Without this a touch drag scrolls the page instead of moving the row. */
    touch-action: none;
    transition: transform .16s cubic-bezier(.4, 0, .2, 1), opacity .16s ease;
}

.nav-row:hover[b-7pvqcfsz8i] {
    background: var(--qq-admin-mute-bg, var(--qq-admin-bar-soft));
}

/* The dragged row leaves its slot visually so the drop target is legible. */
.nav-row.is-dragging[b-7pvqcfsz8i] {
    opacity: .5;
    cursor: grabbing;
    transform: scale(1.015);
    box-shadow: 0 12px 26px rgba(23, 21, 18, .22);
}

/* Hidden rows stay listed — this is the only place to bring them back. */
.nav-row.is-hidden .nav-row-text[b-7pvqcfsz8i],
.nav-row.is-hidden .nav-row-ico[b-7pvqcfsz8i] {
    opacity: .45;
}

.nav-row.is-hidden .nav-row-text[b-7pvqcfsz8i] {
    text-decoration: line-through;
}

/* States the row's state in words rather than relying on the strike-through. */
.nav-hidden-tag[b-7pvqcfsz8i] {
    flex-shrink: 0;
    font-family: var(--qq-admin-mono);
    font-size: 0.62rem;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    padding: 2px 7px;
    border-radius: 999px;
    background: var(--qq-admin-mute-bg, var(--qq-admin-bar-soft));
    color: var(--qq-admin-muted);
}

.nav-grip[b-7pvqcfsz8i] {
    display: inline-flex;
    color: var(--qq-admin-faint);
    flex-shrink: 0;
}

.nav-grip svg[b-7pvqcfsz8i] {
    width: 16px;
    height: 16px;
}

.nav-row-ico[b-7pvqcfsz8i] {
    display: inline-flex;
    color: var(--qq-admin-muted);
    flex-shrink: 0;
}

.nav-row-ico svg[b-7pvqcfsz8i] {
    width: 16px;
    height: 16px;
}

.nav-row-text[b-7pvqcfsz8i] {
    flex: 1 1 auto;
    min-width: 0;
    font-size: 0.86rem;
    color: var(--qq-admin-ink);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.nav-icon-btn[b-7pvqcfsz8i] {
    /* 44px on touch, per the handoff's mobile note; compact with a mouse. */
    width: 30px;
    height: 30px;
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid transparent;
    border-radius: 8px;
    background: transparent;
    color: var(--qq-admin-muted);
    cursor: pointer;
}

.nav-icon-btn svg[b-7pvqcfsz8i] {
    width: 15px;
    height: 15px;
}

.nav-icon-btn:hover:not(:disabled)[b-7pvqcfsz8i] {
    border-color: var(--qq-admin-border);
    color: var(--qq-admin-ink);
}

.nav-icon-btn:disabled[b-7pvqcfsz8i] {
    opacity: .3;
    cursor: default;
}

.nav-icon-btn.is-off[b-7pvqcfsz8i] {
    color: var(--qq-admin-accent);
}

@media (pointer: coarse) {
    .nav-icon-btn[b-7pvqcfsz8i] {
        width: 44px;
        height: 44px;
    }

    .nav-row[b-7pvqcfsz8i] {
        min-height: 48px;
    }
}


/* --- Page shape (spec 018) -------------------------------------------------
   Editor on the left, the rail it produces on the right. The two-column layout
   is the reason this became a page: an arrangement is judged from the rail, and
   a settings column had no room to show one. */

.menu-order-head[b-7pvqcfsz8i] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.15rem;
}

.menu-order-heading[b-7pvqcfsz8i] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.menu-order-actions[b-7pvqcfsz8i] {
    margin-left: auto;
    display: flex;
    gap: 0.5rem;
}

.menu-order-hint[b-7pvqcfsz8i] {
    font-size: 0.83rem;
    color: var(--qq-admin-muted);
    max-width: 60ch;
    margin-bottom: 1rem;
}

.menu-order-grid[b-7pvqcfsz8i] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 320px;
    gap: 1.6rem;
    align-items: start;
}

.menu-order-editor[b-7pvqcfsz8i] {
    min-width: 0;
}

.menu-order-note[b-7pvqcfsz8i] {
    font-size: 0.76rem;
    color: var(--qq-admin-faint);
    line-height: 1.5;
    padding: 0 0.15rem;
}

.menu-order-preview[b-7pvqcfsz8i] {
    position: sticky;
    top: 20px;
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
}

.menu-order-preview-head[b-7pvqcfsz8i] {
    display: flex;
    align-items: center;
    gap: 0.55rem;
}

.menu-order-preview-label[b-7pvqcfsz8i] {
    font-family: var(--qq-admin-mono);
    font-size: 0.62rem;
    font-weight: 700;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--qq-admin-faint);
}

.menu-order-preview-count[b-7pvqcfsz8i] {
    font-family: var(--qq-admin-mono);
    font-size: 0.68rem;
    color: var(--qq-admin-faint);
}

.menu-order-preview-note[b-7pvqcfsz8i] {
    font-size: 0.72rem;
    color: var(--qq-admin-faint);
    line-height: 1.45;
}

/* The accordion is a phone affordance; on a desktop the rail is simply there. */
.menu-order-preview-toggle[b-7pvqcfsz8i] {
    display: none;
}

.nav-noaccess-tag[b-7pvqcfsz8i] {
    font-family: var(--qq-admin-mono);
    font-size: 0.56rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    background: var(--qq-admin-accent-tint, #f6e5df);
    color: var(--qq-admin-accent);
    padding: 0.18rem 0.42rem;
    border-radius: 4px;
    white-space: nowrap;
}

@media (max-width: 900px) {
    .menu-order-grid[b-7pvqcfsz8i] {
        grid-template-columns: minmax(0, 1fr);
    }

    /* Order matters: the rail summary belongs above the editor on a phone, so
       the reference is the first thing seen rather than a footnote below two
       dozen rows. */
    .menu-order-preview[b-7pvqcfsz8i] {
        position: static;
        order: -1;
    }

    .menu-order-preview-head[b-7pvqcfsz8i] {
        display: none;
    }

    .menu-order-preview-toggle[b-7pvqcfsz8i] {
        display: flex;
        align-items: center;
        gap: 0.6rem;
        width: 100%;
        text-align: left;
        background: var(--qq-admin-card);
        border: 1px solid var(--qq-admin-border);
        border-radius: 12px;
        padding: 0.8rem 0.9rem;
        font-size: 0.83rem;
        font-weight: 600;
        color: var(--qq-admin-ink, inherit);
    }

    .menu-order-preview-caret[b-7pvqcfsz8i] {
        margin-left: auto;
        color: var(--qq-admin-faint);
    }

    .menu-order-preview-body[b-7pvqcfsz8i] {
        display: none;
    }

    .menu-order-preview-body.is-open[b-7pvqcfsz8i] {
        display: block;
    }

    /* Drag is a pointer gesture. On a touch screen the arrows and the eye are
       the whole interface, so they get real targets and the grip goes away
       rather than advertising something that cannot be done. */
    .nav-row[b-7pvqcfsz8i] {
        flex-wrap: wrap;
    }

    .nav-grip[b-7pvqcfsz8i] {
        display: none;
    }

    .nav-row .nav-icon-btn[b-7pvqcfsz8i] {
        min-width: 44px;
        min-height: 44px;
    }
}
/* /Components/Admin/AdminPlans.razor.rz.scp.css */
/* Plans as a data grid (mirrors the Team roles grid). */
.plans-grid-head[b-o9165jnj4x],
.plans-grid-row[b-o9165jnj4x] {
    display: grid;
    grid-template-columns: minmax(180px, 1.1fr) 110px 130px 90px 1fr 100px;
    gap: 0.75rem;
    align-items: center;
    padding: 0.7rem 1.35rem;
}

.plans-grid-head[b-o9165jnj4x] {
    /* Token, not #faf6ec: the header text inherits admin ink, which flips
       light in dark mode — a fixed light band left it light-on-light. */
    background: var(--qq-admin-input);
    border-bottom: 1px solid var(--qq-admin-border);
}

.plans-grid-head button[b-o9165jnj4x] {
    border: none;
    background: none;
    padding: 0;
    cursor: pointer;
    text-align: left;
    font: inherit;
    color: inherit;
    letter-spacing: inherit;
    text-transform: inherit;
}

.plans-grid-head .sort-on[b-o9165jnj4x] {
    color: var(--qq-admin-accent);
}

.plans-grid-row + .plans-grid-row[b-o9165jnj4x],
.plans-grid-expand[b-o9165jnj4x] {
    border-top: 1px solid var(--qq-admin-divider);
}

.plans-grid-expand[b-o9165jnj4x] {
    background: var(--qq-admin-input);
    padding: 0.9rem 1.35rem 1rem;
}

.plan-desc[b-o9165jnj4x] {
    display: block;
    font-size: 0.76rem;
    color: var(--qq-admin-muted);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* compact filled feature chips in the FEATURES cell */
.role-chip-mini[b-o9165jnj4x] {
    display: inline-block;
    background: var(--qq-admin-ink);
    /* btn-fg, not #fbf8f1: admin ink inverts to ivory in dark mode. */
    color: var(--qq-admin-btn-fg, #fbf8f1);
    font-family: var(--qq-admin-mono);
    font-size: 0.66rem;
    font-weight: 700;
    border-radius: 5px;
    padding: 0.18rem 0.45rem;
    margin: 0 0.25rem 0.25rem 0;
    white-space: nowrap;
}

@media (max-width: 1100px) {
    .plans-grid-head[b-o9165jnj4x],
    .plans-grid-row[b-o9165jnj4x] {
        grid-template-columns: minmax(160px, 1fr) 100px 110px 1fr 90px;
    }

    /* drop the TRIAL column on narrow screens */
    .plans-grid-head > :nth-child(4)[b-o9165jnj4x],
    .plans-grid-row > :nth-child(4)[b-o9165jnj4x] {
        display: none;
    }
}

/* Phones: the columnar grid can't fit, so each plan restacks as a card —
   name on its own line, then status/price/features wrapping, actions right. */
@media (max-width: 767px) {
    .plans-grid-head[b-o9165jnj4x] {
        display: none;
    }

    .plans-grid-row[b-o9165jnj4x] {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 0.45rem 0.9rem;
        padding: 0.85rem 1rem;
    }

    .plans-grid-row > :first-child[b-o9165jnj4x] {
        flex: 1 1 100%;
    }

    .plans-grid-row > :last-child[b-o9165jnj4x] {
        margin-left: auto;
    }

    .plan-desc[b-o9165jnj4x] {
        white-space: normal;
    }

    .plans-grid-expand[b-o9165jnj4x] {
        padding: 0.85rem 1rem 1rem;
    }
}

/* ---- Sort presets ---- */
.admin-plans-sortlabel[b-o9165jnj4x] { font-size: 9.5px; letter-spacing: 0.14em; color: var(--qq-admin-muted); }
.admin-plans-preset[b-o9165jnj4x] {
    font-size: 11.5px; font-weight: 600; padding: 4px 11px; border-radius: 7px; cursor: pointer;
    background: var(--qq-admin-card); color: var(--qq-admin-muted); border: 1px solid var(--qq-admin-border);
}
.admin-plans-preset.on[b-o9165jnj4x] { background: var(--qq-admin-ink); color: var(--qq-admin-btn-fg); border-color: var(--qq-admin-ink); }

/* ---- Per-plan analytics strip ---- */
.plans-grid-stats[b-o9165jnj4x] {
    display: flex; align-items: center; gap: 20px; flex-wrap: wrap;
    padding: 9px 16px; background: var(--qq-admin-card); border-top: 1px solid var(--qq-admin-divider);
}
.plans-grid-stats.dim[b-o9165jnj4x] { opacity: 0.6; }
.plans-grid-stats .stat[b-o9165jnj4x] { font-size: 11px; color: var(--qq-admin-muted); }
.plans-grid-stats .stat b[b-o9165jnj4x] { font-family: 'Space Mono', ui-monospace, monospace; font-size: 13px; font-weight: 700; color: var(--qq-admin-ink); margin-right: 4px; }
.plans-grid-stats .stat.mrr b[b-o9165jnj4x] { color: var(--qq-admin-accent); }
.plans-spark-wrap[b-o9165jnj4x] { display: flex; align-items: center; gap: 8px; margin-left: auto; }
.plans-spark-lbl[b-o9165jnj4x] { font-size: 9px; letter-spacing: 0.12em; color: var(--qq-admin-faint); }
.plans-spark[b-o9165jnj4x] { width: 84px; height: 24px; }
.plans-spark-pct[b-o9165jnj4x] { font-family: 'Space Mono', ui-monospace, monospace; font-size: 11px; font-weight: 700; }
@media (max-width: 767px) {
    .plans-grid-stats[b-o9165jnj4x] { gap: 12px; }
    .plans-spark-wrap[b-o9165jnj4x] { margin-left: 0; width: 100%; }
}
/* /Components/Admin/AdminRevenue.razor.rz.scp.css */
/* Export buttons + range picker sit on the page bar, wrapping on narrow screens. */
.rev-actions[b-olzzu1krri] {
    margin-left: auto;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
    /* Same reason as .qq-rp: a flex item's min-width:auto floor is its widest
       child, so without this the date picker inside pushed this wrapper — and
       the page bar — past the viewport on a phone. */
    min-width: 0;
}

.rev-warning[b-olzzu1krri] {
    border: 1px solid var(--qq-admin-accent);
    border-left-width: 3px;
    border-radius: 10px;
    background: var(--qq-admin-card);
    color: var(--qq-admin-ink);
    padding: 0.7rem 0.95rem;
    font-size: 0.82rem;
}

/* KPI band: a responsive grid of label/figure cells on one card surface. */
.rev-band[b-olzzu1krri] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(10.5rem, 1fr));
    gap: 1px;
    background: var(--qq-admin-border);
    border: 1px solid var(--qq-admin-border);
    border-radius: 12px;
    overflow: hidden;
}

.rev-cell[b-olzzu1krri] {
    background: var(--qq-admin-card);
    padding: 0.85rem 1rem;
    /* Long money strings must shrink inside their column, not push the grid. */
    min-width: 0;
}

.rev-label[b-olzzu1krri] {
    font-size: 0.72rem;
    color: var(--qq-admin-muted);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.rev-value[b-olzzu1krri] {
    margin-top: 0.25rem;
    font-size: 1.15rem;
    font-weight: 700;
    color: var(--qq-admin-ink);
    overflow-wrap: anywhere;
}

.rev-value.hot[b-olzzu1krri] {
    color: var(--qq-admin-accent);
}

.rev-sub[b-olzzu1krri] {
    font-family: var(--qq-admin-mono);
    font-size: 0.68rem;
    color: var(--qq-admin-faint);
}

/* Charts. */
.rev-chart-card[b-olzzu1krri] {
    padding: 1.1rem 1rem 0.7rem;
}

.rev-axis[b-olzzu1krri] {
    font-family: var(--qq-admin-mono);
    font-size: 11px;
    fill: var(--qq-admin-muted);
}

.rev-empty[b-olzzu1krri] {
    padding: 1.2rem 0;
    text-align: center;
    color: var(--qq-admin-muted);
    font-size: 0.85rem;
}

.rev-legend[b-olzzu1krri] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem 1.1rem;
    padding: 0.55rem 0 0.3rem;
    font-size: 0.8rem;
    color: var(--qq-admin-ink);
}

.rev-legend-row[b-olzzu1krri] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
}

.rev-swatch[b-olzzu1krri] {
    width: 0.7rem;
    height: 0.7rem;
    border-radius: 3px;
    background: var(--qq-admin-accent);
}

/* Tables: the same figures as the charts, in text. */
.rev-table[b-olzzu1krri] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.85rem;
}

.rev-caption[b-olzzu1krri] {
    caption-side: top;
    text-align: left;
    padding: 0.75rem 1rem 0.35rem;
    font-size: 0.72rem;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--qq-admin-muted);
}

.rev-table th[b-olzzu1krri],
.rev-table td[b-olzzu1krri] {
    padding: 0.5rem 1rem;
    text-align: left;
    border-top: 1px solid var(--qq-admin-divider);
    color: var(--qq-admin-ink);
    font-weight: 400;
}

.rev-table thead th[b-olzzu1krri] {
    border-top: 0;
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--qq-admin-muted);
    white-space: nowrap;
}

.rev-table .num[b-olzzu1krri] {
    text-align: right;
    font-family: var(--qq-admin-mono);
    white-space: nowrap;
}

.rev-table .strong[b-olzzu1krri] {
    font-weight: 700;
}

/* Money that went back out, in the same accent the KPI cells use for it —
   a refund column rendered in the ordinary ink reads as income. */
.rev-table td.hot[b-olzzu1krri] {
    color: var(--qq-admin-accent);
}

/* Top stores. */
.rev-rank[b-olzzu1krri] {
    width: 1.1rem;
    color: var(--qq-admin-faint);
    font-size: 0.72rem;
    flex-shrink: 0;
}

.rev-store[b-olzzu1krri] {
    color: var(--qq-admin-ink);
    font-weight: 600;
    font-size: 0.88rem;
    min-width: 0;
    overflow-wrap: anywhere;
}

.rev-bar-track[b-olzzu1krri] {
    height: 8px;
    min-width: 3rem;
    border-radius: 999px;
    background: var(--qq-admin-divider);
    overflow: hidden;
}

.rev-bar-fill[b-olzzu1krri] {
    height: 100%;
    border-radius: 999px;
    background: var(--qq-admin-accent);
}

.rev-muted[b-olzzu1krri] {
    color: var(--qq-admin-faint);
}

.rev-strong[b-olzzu1krri] {
    font-weight: 700;
    color: var(--qq-admin-ink);
}

/* Definitions footer. */
.rev-notes ul[b-olzzu1krri] {
    margin: 0;
    padding-left: 1.1rem;
}

.rev-notes li[b-olzzu1krri] {
    font-size: 0.78rem;
    color: var(--qq-admin-muted);
    margin-bottom: 0.3rem;
}
/* /Components/Admin/AdminSeller.razor.rz.scp.css */
/* Spec 050: the QuickRide vehicle lines on a seller's page. Each line opens the
   car's admin detail; the leading glyph is the VIN decode and the dot says
   whether both papers are on file. Tokens only, so both themes hold. */

.asv-head[b-lvjo3o4rla] {
    margin-top: 0.9rem;
    margin-bottom: 0.15rem;
}

.asv-line[b-lvjo3o4rla] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 0;
    border-top: 1px solid var(--qq-admin-divider);
    color: inherit;
    text-decoration: none;
    font-size: 0.85rem;
}

.asv-line:hover[b-lvjo3o4rla] {
    color: inherit;
    text-decoration: none;
    background: var(--qq-admin-row, var(--qq-admin-shell));
}

.asv-line.is-removed[b-lvjo3o4rla] {
    opacity: 0.6;
}

.asv-line.is-removed .asv-name[b-lvjo3o4rla],
.asv-line.is-removed .asv-tag[b-lvjo3o4rla] {
    text-decoration: line-through;
}

.asv-decode[b-lvjo3o4rla] {
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background: #b9b19f;
    color: #fffdf8;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-family: var(--qq-admin-mono);
    font-size: 0.64rem;
    font-weight: 700;
    flex-shrink: 0;
}

.asv-decode.is-ok[b-lvjo3o4rla] { background: #3f7a52; }
.asv-decode.is-bad[b-lvjo3o4rla] { background: #b3402e; }

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

.asv-dot.is-ok[b-lvjo3o4rla] { background: #3f7a52; }
.asv-dot.is-bad[b-lvjo3o4rla] { background: #bf4c2e; }

.asv-name[b-lvjo3o4rla] {
    font-weight: 600;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.asv-plate[b-lvjo3o4rla] {
    font-family: var(--qq-admin-mono);
    font-size: 0.69rem;
    color: var(--qq-admin-muted);
    letter-spacing: 0.06em;
    white-space: nowrap;
}

.asv-tag[b-lvjo3o4rla] {
    margin-left: auto;
    font-family: var(--qq-admin-mono);
    font-size: 0.6rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    padding: 3px 8px;
    border-radius: 5px;
    white-space: nowrap;
}

.asv-tag.is-pending[b-lvjo3o4rla] { background: var(--qq-brass-tint); color: var(--qq-brass-deep); }
.asv-tag.is-approved[b-lvjo3o4rla] { background: var(--qq-ok-bg); color: var(--qq-ok-fg); }
.asv-tag.is-rejected[b-lvjo3o4rla] { background: var(--qq-bad-bg); color: var(--qq-bad-fg); }
.asv-tag.is-draft[b-lvjo3o4rla],
.asv-tag.is-removed[b-lvjo3o4rla] { background: var(--qq-mute-bg); color: var(--qq-mute-fg); }

.asv-chev[b-lvjo3o4rla] {
    color: var(--qq-admin-faint);
    font-size: 0.95rem;
    line-height: 1;
}

.asv-legend[b-lvjo3o4rla] {
    padding: 8px 0 4px;
    font-size: 0.72rem;
    color: var(--qq-admin-faint);
    border-top: 1px solid var(--qq-admin-divider);
}
/* /Components/Admin/AdminSettings.razor.rz.scp.css */
/* Admin settings (spec 019). One column of grouped cards beside a sticky index,
   replacing ten cards dropped into two columns in no particular order.

   Every card has the same shape — title, consequence, control, warning, footer —
   because uniformity is what lets an admin scan eleven unrelated switches. */

.set-bar-tools[b-gcz1fllybn] {
    margin-left: auto;
    display: flex;
    align-items: center;
    gap: 0.6rem;
}

.set-search[b-gcz1fllybn] {
    width: 15rem;
    max-width: 45vw;
}

.set-unsaved[b-gcz1fllybn] {
    font-family: var(--qq-admin-mono);
    font-size: 0.68rem;
    color: var(--qq-admin-accent);
    white-space: nowrap;
}

.set-layout[b-gcz1fllybn] {
    display: grid;
    grid-template-columns: 190px minmax(0, 1fr);
    gap: 1.8rem;
    align-items: start;
}

/* --- Index rail ----------------------------------------------------------- */

.set-rail[b-gcz1fllybn] {
    position: sticky;
    top: 20px;
    display: flex;
    flex-direction: column;
    gap: 1px;
}

.set-rail-link[b-gcz1fllybn] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.45rem 0.6rem;
    border-radius: 8px;
    font-size: 0.83rem;
    color: var(--qq-admin-body, inherit);
    text-decoration: none;
}

.set-rail-link:hover[b-gcz1fllybn] {
    background: var(--qq-admin-card);
    text-decoration: none;
}

/* Dimmed rather than removed: a section with no search hits still exists, and
   hiding it would make the page look like it lost settings. */
.set-rail-link.is-empty[b-gcz1fllybn] {
    opacity: 0.4;
}

.set-rail-count[b-gcz1fllybn] {
    margin-left: auto;
    font-family: var(--qq-admin-mono);
    font-size: 0.68rem;
    color: var(--qq-admin-faint);
}

/* --- Sections and cards --------------------------------------------------- */

.set-col[b-gcz1fllybn] {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 0.9rem;
}

.set-section[b-gcz1fllybn] {
    font-size: 1rem;
    font-weight: 700;
    letter-spacing: -0.01em;
    margin: 0.9rem 0 0;
    scroll-margin-top: 20px;
}

.set-section:first-child[b-gcz1fllybn] {
    margin-top: 0;
}

.set-card[b-gcz1fllybn] {
    background: var(--qq-admin-card);
    border: 1px solid var(--qq-admin-border);
    border-radius: 14px;
    padding: 1rem 1.15rem;
}

/* The two switches that can take the marketplace down or lower the console's
   own front door. They must not look like a reminder-lead number. */
.set-card.is-destructive[b-gcz1fllybn] {
    border-left: 3px solid var(--qq-admin-accent);
}

.set-card.is-locked[b-gcz1fllybn] {
    border-style: dashed;
    background: transparent;
}

.set-card-head[b-gcz1fllybn] {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    margin-bottom: 0.3rem;
}

.set-card-title[b-gcz1fllybn] {
    font-size: 0.95rem;
    font-weight: 700;
    margin: 0;
}

.set-card-hint[b-gcz1fllybn] {
    font-size: 0.83rem;
    color: var(--qq-admin-body, var(--qq-admin-muted));
    line-height: 1.5;
    margin: 0 0 0.8rem;
    max-width: 68ch;
}

.set-note[b-gcz1fllybn] {
    font-size: 0.78rem;
    color: var(--qq-admin-muted);
    line-height: 1.5;
    margin: 0.5rem 0 0;
    max-width: 68ch;
}

/* On/off in words beside the toggle. Colour alone says nothing to a reader who
   cannot see it, and little to one who can. */
.set-state[b-gcz1fllybn] {
    font-family: var(--qq-admin-mono);
    font-size: 0.68rem;
    color: var(--qq-admin-faint);
    margin-left: 0.5rem;
}

.set-warn[b-gcz1fllybn] {
    font-size: 0.82rem;
    margin-top: 0.75rem;
}

.set-fields[b-gcz1fllybn] {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
}

.set-num[b-gcz1fllybn] {
    width: 6.5rem;
}

.set-select[b-gcz1fllybn] {
    max-width: 22rem;
}

.set-inset[b-gcz1fllybn] {
    background: var(--qq-admin-inset, var(--qq-admin-bar-soft));
    border: 1px solid var(--qq-admin-hairline, var(--qq-admin-border));
    border-radius: 11px;
    padding: 0.7rem 0.85rem;
    margin: 0;
}

.set-inset[disabled][b-gcz1fllybn] {
    opacity: 0.55;
}

.set-tag[b-gcz1fllybn] {
    font-family: var(--qq-admin-mono);
    font-size: 0.58rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--qq-admin-muted);
    background: var(--qq-admin-inset, var(--qq-admin-bar-soft));
    border-radius: 4px;
    padding: 0.2rem 0.45rem;
    white-space: nowrap;
}

.set-tag-danger[b-gcz1fllybn] {
    color: var(--qq-admin-accent);
    background: var(--qq-admin-accent-tint, #f6e5df);
}

/* --- Card footer ---------------------------------------------------------- */

.set-foot[b-gcz1fllybn] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    flex-wrap: wrap;
    border-top: 1px solid var(--qq-admin-hairline, var(--qq-admin-border));
    margin-top: 0.9rem;
    padding-top: 0.75rem;
}

.set-foot-audit[b-gcz1fllybn] {
    font-family: var(--qq-admin-mono);
    font-size: 0.66rem;
    color: var(--qq-admin-faint);
    min-height: 1em;
}

.set-foot-state[b-gcz1fllybn] {
    margin-left: auto;
    display: flex;
    align-items: center;
    gap: 0.4rem;
}

.set-changes[b-gcz1fllybn] {
    font-family: var(--qq-admin-mono);
    font-size: 0.66rem;
    color: var(--qq-admin-accent);
}

.set-empty[b-gcz1fllybn] {
    text-align: center;
}

.set-signpost[b-gcz1fllybn] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.6rem;
    font-size: 0.8rem;
    color: var(--qq-admin-muted);
    padding: 0.4rem 0.15rem 0;
}

.set-signpost a[b-gcz1fllybn] {
    color: var(--qq-admin-accent);
}

@media (max-width: 900px) {
    .set-layout[b-gcz1fllybn] {
        grid-template-columns: minmax(0, 1fr);
        gap: 1rem;
    }

    /* A wrapping row of chips, not a clipped scroller — every section has to be
       reachable without a horizontal swipe nobody knows is there. */
    .set-rail[b-gcz1fllybn] {
        position: static;
        flex-direction: row;
        flex-wrap: wrap;
        gap: 0.4rem;
    }

    .set-rail-link[b-gcz1fllybn] {
        border: 1px solid var(--qq-admin-border);
        background: var(--qq-admin-card);
        border-radius: 99px;
        padding: 0.5rem 0.8rem;
    }

    .set-bar-tools[b-gcz1fllybn] {
        width: 100%;
        margin-left: 0;
    }

    .set-search[b-gcz1fllybn] {
        flex: 1;
        max-width: none;
    }

    .set-num[b-gcz1fllybn],
    .set-select[b-gcz1fllybn] {
        width: 100%;
        max-width: none;
    }
}
/* /Components/Admin/AdminStats.razor.rz.scp.css */
/* Period chip in the page bar. */
.stats-period[b-43ntphhwxp] {
    margin-left: auto;
    font-family: var(--qq-admin-mono);
    font-size: 0.7rem;
    color: var(--qq-admin-faint);
    border: 1px solid var(--qq-admin-border);
    background: var(--qq-admin-card);
    padding: 0.5rem 0.9rem;
    border-radius: 9px;
    white-space: nowrap;
}

.stats-empty[b-43ntphhwxp] {
    color: var(--qq-admin-muted);
    font-size: 0.85rem;
}

.muted[b-43ntphhwxp] {
    color: var(--qq-admin-faint);
}

.rank[b-43ntphhwxp] {
    color: var(--qq-admin-faint);
    font-size: 0.72rem;
    width: 1rem;
    flex-shrink: 0;
}

.spend[b-43ntphhwxp] {
    font-weight: 700;
    color: var(--qq-admin-ink);
}

/* Needs attention: terracotta-edged tiles with an age hint. */
.attn-grid[b-43ntphhwxp] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0.9rem;
}

.attn-tile[b-43ntphhwxp] {
    background: var(--qq-admin-card);
    border: 1px solid var(--qq-admin-border);
    border-left: 3px solid var(--qq-admin-accent);
    border-radius: 12px;
    padding: 1rem 1.15rem;
}

.attn-label[b-43ntphhwxp] {
    font-size: 0.78rem;
    color: var(--qq-admin-muted);
}

.attn-figure[b-43ntphhwxp] {
    display: flex;
    align-items: baseline;
    gap: 0.65rem;
    margin-top: 0.35rem;
}

.attn-count[b-43ntphhwxp] {
    font-family: var(--qq-admin-mono);
    font-size: 2.1rem;
    font-weight: 700;
    line-height: 1;
    color: var(--qq-admin-ink);
}

.attn-count.hot[b-43ntphhwxp] {
    color: var(--qq-admin-accent);
}

.attn-age[b-43ntphhwxp] {
    font-family: var(--qq-admin-mono);
    font-size: 0.68rem;
    color: var(--qq-admin-faint);
}

.attn-age.hot[b-43ntphhwxp] {
    color: var(--qq-admin-accent);
}

.attn-sub[b-43ntphhwxp] {
    font-size: 0.74rem;
    color: var(--qq-admin-faint);
    margin-top: 0.5rem;
    display: block;
}

.attn-link[b-43ntphhwxp] {
    font-weight: 600;
    color: var(--qq-admin-accent);
    text-decoration: none;
}

.attn-link:hover[b-43ntphhwxp] {
    text-decoration: underline;
}

/* Hero chart header: section head + legend chips + this-week figure. */
.hero-head[b-43ntphhwxp] {
    display: flex;
    align-items: baseline;
    gap: 1rem;
    flex-wrap: wrap;
    margin-bottom: 0.75rem;
}

.hero-chip[b-43ntphhwxp] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 0.74rem;
    color: var(--qq-admin-muted);
}

.hero-swatch-gmv[b-43ntphhwxp] {
    width: 16px;
    height: 8px;
    border-radius: 2px;
    background: #e9cf9c;
    border: 1px solid #d9a94e;
}

.hero-swatch-orders[b-43ntphhwxp] {
    width: 16px;
    height: 2px;
    border-radius: 1px;
    background: var(--qq-admin-ink);
}

.hero-figure[b-43ntphhwxp] {
    margin-left: auto;
    font-family: var(--qq-admin-mono);
    font-size: 0.72rem;
    color: var(--qq-admin-faint);
}

.hero-figure b[b-43ntphhwxp] {
    color: var(--qq-admin-accent);
}

.hero-card[b-43ntphhwxp] {
    padding: 1.25rem 0.9rem 0.6rem;
}

.chart-y[b-43ntphhwxp] {
    font-family: var(--qq-admin-mono);
    font-size: 10px;
    fill: #c9c1b0;
}

.chart-x[b-43ntphhwxp] {
    font-family: var(--qq-admin-mono);
    font-size: 10px;
    fill: var(--qq-admin-faint);
}

.chart-x-now[b-43ntphhwxp] {
    fill: var(--qq-admin-accent);
    font-weight: 700;
}

/* Heat matrix + (pipeline / buyer mix) column. */
.stats-duo[b-43ntphhwxp] {
    display: grid;
    grid-template-columns: 1.15fr 1fr;
    gap: 1.4rem;
    align-items: start;
}

.heat-card[b-43ntphhwxp] {
    padding: 1.1rem 1.25rem;
}

.heat-grid[b-43ntphhwxp] {
    display: grid;
    grid-template-columns: 1.4fr repeat(4, 1fr) 0.8fr;
    gap: 6px;
    align-items: center;
    padding: 3px 0;
}

.heat-head[b-43ntphhwxp] {
    font-family: var(--qq-admin-mono);
    font-size: 0.63rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--qq-admin-muted);
    padding-bottom: 0.5rem;
}

.heat-head span:not(:first-child):not(:last-child)[b-43ntphhwxp] {
    text-align: center;
}

.heat-row-label[b-43ntphhwxp] {
    font-size: 0.79rem;
    font-weight: 600;
}

.heat-cell[b-43ntphhwxp] {
    font-family: var(--qq-admin-mono);
    font-size: 0.75rem;
    text-align: center;
    border-radius: 6px;
    padding: 0.5rem 0;
}

.heat-0[b-43ntphhwxp] { background: #faf6ec; color: #c9c1b0; }
.heat-1[b-43ntphhwxp] { background: #f3e1d9; color: #8a4a35; }
.heat-2[b-43ntphhwxp] { background: #e8c2b1; color: #7c3a26; }
.heat-3[b-43ntphhwxp] { background: #e0a58e; color: #5f2c1b; }
.heat-red[b-43ntphhwxp] { background: var(--qq-admin-accent); color: var(--qq-admin-btn-fg, #fbf8f1); font-weight: 700; }

.heat-oldest[b-43ntphhwxp] {
    font-family: var(--qq-admin-mono);
    font-size: 0.72rem;
    text-align: right;
    color: var(--qq-admin-muted, #6f6757);
}

.heat-oldest.hot[b-43ntphhwxp] {
    color: var(--qq-admin-accent);
    font-weight: 700;
}

.heat-caption[b-43ntphhwxp] {
    font-family: var(--qq-admin-mono);
    font-size: 0.63rem;
    color: #b8b0a0;
    margin-top: 0.75rem;
}

/* Order pipeline: one stacked bar + two-column legend. */
.pipe-bar[b-43ntphhwxp] {
    display: flex;
    height: 34px;
    border-radius: 9px;
    overflow: hidden;
}

.pipe-seg[b-43ntphhwxp] {
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 2px;
    overflow: hidden;
}

.pipe-seg-label[b-43ntphhwxp] {
    font-family: var(--qq-admin-mono);
    font-size: 0.68rem;
    font-weight: 700;
    text-transform: uppercase;
    color: #fbf8f1;
    white-space: nowrap;
}

.pipe-legend[b-43ntphhwxp] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 6px 18px;
    margin-top: 1rem;
}

.pipe-legend-row[b-43ntphhwxp] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.78rem;
    color: var(--qq-admin-muted, #6f6757);
}

.stats-legend-dot[b-43ntphhwxp] {
    width: 9px;
    height: 9px;
    border-radius: 3px;
    flex-shrink: 0;
}

/* Buyer mix: donut + legend + top-buyer mini list. */
.mix-card[b-43ntphhwxp] {
    display: flex;
    align-items: center;
    gap: 1.35rem;
}

.donut[b-43ntphhwxp] {
    width: 110px;
    height: 110px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.donut-hole[b-43ntphhwxp] {
    width: 74px;
    height: 74px;
    border-radius: 50%;
    background: var(--qq-admin-card);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.donut-pct[b-43ntphhwxp] {
    font-family: var(--qq-admin-mono);
    font-size: 1.25rem;
    font-weight: 700;
    color: var(--qq-ok-fg, #3f7a52);
    line-height: 1;
}

.donut-cap[b-43ntphhwxp] {
    font-size: 0.6rem;
    color: var(--qq-admin-faint);
    margin-top: 2px;
}

.mix-rows[b-43ntphhwxp] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    min-width: 0;
}

.mix-top[b-43ntphhwxp] {
    border-top: 1px solid var(--qq-admin-divider);
    padding-top: 0.5rem;
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
}

.buyer-row[b-43ntphhwxp] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.78rem;
}

.buyer-name[b-43ntphhwxp] {
    font-weight: 600;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Store health + top store rows. */
.stats-grid[b-43ntphhwxp] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.4rem;
    align-items: start;
}

.health-name[b-43ntphhwxp] {
    font-weight: 700;
    font-size: 0.85rem;
    color: var(--qq-admin-ink);
    min-width: 8rem;
    text-decoration: none;
}

.health-name:hover[b-43ntphhwxp] {
    color: var(--qq-admin-accent);
}

.health-bar-track[b-43ntphhwxp] {
    height: 8px;
    min-width: 4rem;
    border-radius: 4px;
    background: var(--qq-admin-divider);
    overflow: hidden;
}

.health-bar-fill[b-43ntphhwxp] {
    height: 100%;
    border-radius: 4px;
}

.health-bar-brass[b-43ntphhwxp] {
    background: var(--qq-brass);
}

.health-bar-hot[b-43ntphhwxp] {
    background: var(--qq-admin-accent);
}

.health-bar-ink[b-43ntphhwxp] {
    background: var(--qq-admin-ink);
}

.health-stars[b-43ntphhwxp] {
    font-family: var(--qq-admin-mono);
    font-size: 0.78rem;
    color: var(--qq-brass, #9a6b1e);
    white-space: nowrap;
}

.aging-hot[b-43ntphhwxp] {
    font-family: var(--qq-admin-mono);
    font-size: 0.78rem;
    font-weight: 700;
    color: var(--qq-admin-accent);
}

/* Last 30 days: a 2×2 band with internal hairlines. */
.band-2x2[b-43ntphhwxp] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
}

.band-cell[b-43ntphhwxp] {
    padding: 1.1rem 1.25rem;
}

.band-cell:nth-child(odd)[b-43ntphhwxp] {
    border-right: 1px solid var(--qq-admin-divider);
}

.band-cell:nth-child(-n+2)[b-43ntphhwxp] {
    border-bottom: 1px solid var(--qq-admin-divider);
}

.stats-label[b-43ntphhwxp] {
    font-family: var(--qq-admin-mono);
    font-size: 0.62rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: var(--qq-admin-muted);
    margin-bottom: 0.3rem;
    line-height: 1.35;
}

.band-value[b-43ntphhwxp] {
    font-family: var(--qq-admin-mono);
    font-size: 1.6rem;
    font-weight: 700;
    letter-spacing: -0.02em;
    line-height: 1.1;
    color: var(--qq-admin-ink);
}

.band-value.hot[b-43ntphhwxp] {
    color: var(--qq-admin-accent);
}

@media (max-width: 1100px) {
    .attn-grid[b-43ntphhwxp] {
        grid-template-columns: repeat(2, 1fr);
    }

    .stats-duo[b-43ntphhwxp],
    .stats-grid[b-43ntphhwxp] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 640px) {
    .attn-grid[b-43ntphhwxp] {
        grid-template-columns: 1fr;
    }

    .mix-card[b-43ntphhwxp] {
        flex-direction: column;
        align-items: flex-start;
    }
}

/* Backlog drill-down: clickable heat cells + the items modal. */
.heat-click[b-43ntphhwxp] {
    cursor: pointer;
}

.heat-click:hover[b-43ntphhwxp] {
    outline: 2px solid var(--qq-admin-accent, #bf4c2e);
    outline-offset: -2px;
}

.drill-overlay[b-43ntphhwxp] {
    position: fixed;
    inset: 0;
    z-index: 1100;
    background: rgba(23, 21, 18, 0.45);
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: 6vh 1rem 1rem;
}

.drill-panel[b-43ntphhwxp] {
    width: min(34rem, 100%);
    max-height: 82vh;
    display: flex;
    flex-direction: column;
    padding: 1.1rem 1.2rem;
    background: var(--qq-admin-card, #fffdf8);
}

.drill-head[b-43ntphhwxp] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 0.6rem;
}

.drill-band[b-43ntphhwxp] {
    font-size: 0.75rem;
    color: var(--qq-admin-muted, #8b8272);
    margin-top: 2px;
}

.drill-close[b-43ntphhwxp] {
    border: 0;
    background: transparent;
    font-size: 1.4rem;
    line-height: 1;
    color: var(--qq-admin-muted, #8b8272);
    cursor: pointer;
    padding: 0.15rem 0.4rem;
    border-radius: 8px;
}

.drill-close:hover[b-43ntphhwxp] {
    background: var(--qq-admin-divider, #f2ede2);
}

.drill-list[b-43ntphhwxp] {
    overflow-y: auto;
    display: flex;
    flex-direction: column;
}

.drill-row[b-43ntphhwxp] {
    display: flex;
    align-items: center;
    gap: 0.8rem;
    padding: 0.55rem 0.1rem;
    border-bottom: 1px solid var(--qq-admin-divider, #f2ede2);
}

.drill-row:last-child[b-43ntphhwxp] {
    border-bottom: 0;
}

.drill-main[b-43ntphhwxp] {
    flex: 1 1 auto;
    min-width: 0;
}

.drill-title[b-43ntphhwxp] {
    font-weight: 600;
    font-size: 0.9rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.drill-sub[b-43ntphhwxp] {
    font-size: 0.78rem;
    color: var(--qq-admin-muted, #8b8272);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.drill-age[b-43ntphhwxp] {
    font-size: 0.78rem;
    color: var(--qq-admin-faint, #a89f8d);
    white-space: nowrap;
}

.drill-link[b-43ntphhwxp] {
    text-decoration: none;
    font-weight: 700;
    color: var(--qq-admin-accent, #bf4c2e);
    padding: 0.1rem 0.35rem;
}

/* Drill affordances: linked figures keep the layout of their plain twins. */
.pipe-legend-link[b-43ntphhwxp] {
    text-decoration: none;
    color: inherit;
    border-radius: 6px;
}

.pipe-legend-link:hover[b-43ntphhwxp] { background: var(--qq-admin-flag, #f4ead6); }

.band-link[b-43ntphhwxp] {
    text-decoration: none;
    color: inherit;
    display: inline-block;
}

.band-link:hover[b-43ntphhwxp] { text-decoration: underline; text-underline-offset: 3px; }
/* /Components/Admin/AdminSupportAssistant.razor.rz.scp.css */
/* Spec 061 Assistant tab on /admin/support. Admin kit only: every surface is
   a --qq-admin-* (or shared pill) token with a token ink, so both themes come
   from the tokens. Tables sit in an overflow-x wrapper so a phone scrolls the
   table, never the page — the same arrangement as /admin/system. */

.asst-admin[b-l36w9l6mhq] {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
    min-width: 0;
    line-height: normal;
}

.asst-card[b-l36w9l6mhq] {
    min-width: 0;
    color: var(--qq-admin-ink);
}

.asst-tablecard[b-l36w9l6mhq] {
    overflow: hidden;
}

.asst-card-head[b-l36w9l6mhq] {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 0.35rem 0.75rem;
    padding: 1rem 1.25rem 0.5rem;
}

.asst-card-title[b-l36w9l6mhq] {
    margin: 0;
    font-size: 0.95rem;
    font-weight: 700;
    color: var(--qq-admin-ink);
}

.asst-card-meta[b-l36w9l6mhq] {
    font-family: var(--qq-admin-mono);
    font-size: 0.68rem;
    color: var(--qq-admin-faint);
}

.asst-count[b-l36w9l6mhq] {
    font-family: var(--qq-admin-mono);
    font-size: 0.7rem;
    font-weight: 700;
    padding: 0.1rem 0.5rem;
    border-radius: 999px;
    background: var(--qq-warn-bg);
    color: var(--qq-warn-fg);
}

.asst-hint[b-l36w9l6mhq] {
    margin: 0;
    padding: 0 1.25rem 0.6rem;
    font-size: 0.82rem;
    color: var(--qq-admin-muted);
}

.asst-muted[b-l36w9l6mhq] {
    color: var(--qq-admin-muted);
}

.asst-empty[b-l36w9l6mhq] {
    margin: 0;
    padding: 0.4rem 1.25rem 1.1rem;
}

/* ---- Switches ---- */

.asst-switches[b-l36w9l6mhq] {
    display: flex;
    flex-direction: column;
    padding: 0.25rem 0 0.5rem;
}

.asst-switch[b-l36w9l6mhq] {
    display: flex;
    align-items: flex-start;
    gap: 0.85rem;
    padding: 0.85rem 1.25rem;
    border-top: 1px solid var(--qq-admin-divider);
    cursor: pointer;
}

.asst-switch:first-child[b-l36w9l6mhq] {
    border-top: 0;
}

.asst-switch-text[b-l36w9l6mhq] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
}

.asst-switch-name[b-l36w9l6mhq] {
    font-weight: 600;
    font-size: 0.9rem;
    color: var(--qq-admin-ink);
}

.asst-switch-note[b-l36w9l6mhq] {
    font-size: 0.8rem;
    line-height: 1.45;
    color: var(--qq-admin-muted);
}

.asst-switch-state[b-l36w9l6mhq] {
    flex: none;
}

/* ---- Filters + tables ---- */

.asst-chipset[b-l36w9l6mhq] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    padding: 0.25rem 1.25rem 0.75rem;
}

/* Positioned so the header's visually-hidden label (position: absolute) is
   clipped by this scroller instead of escaping it and widening the page on a
   phone — the harness caught exactly that at 390px. */
.asst-scroll[b-l36w9l6mhq] {
    position: relative;
    overflow-x: auto;
    min-width: 0;
}

.asst-table[b-l36w9l6mhq] {
    width: 100%;
    font-size: 0.85rem;
}

.asst-table > thead > tr > th[b-l36w9l6mhq] {
    font-family: var(--qq-admin-mono);
    font-size: 0.64rem;
    font-weight: 700;
    line-height: 1.5;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--qq-admin-faint);
    background: transparent;
    border-bottom: 0;
    padding: 0.6rem 1rem;
    white-space: nowrap;
}

.asst-table > tbody > tr > td[b-l36w9l6mhq] {
    padding: 0.6rem 1rem;
    color: var(--qq-admin-ink);
    background: transparent;
    border-top: 1px solid var(--qq-admin-divider);
    border-bottom: 0;
    white-space: nowrap;
}

.asst-table > thead > tr > th:first-child[b-l36w9l6mhq],
.asst-table > tbody > tr > td:first-child[b-l36w9l6mhq] {
    padding-left: 1.25rem;
}

.asst-table > thead > tr > th:last-child[b-l36w9l6mhq],
.asst-table > tbody > tr > td:last-child[b-l36w9l6mhq] {
    padding-right: 1.25rem;
}

/* The unmatched text wraps; its neighbours do not. */
.asst-table-wrap > tbody > tr > td.asst-quote[b-l36w9l6mhq] {
    white-space: normal;
    min-width: 16rem;
    overflow-wrap: anywhere;
}

.asst-nowrap[b-l36w9l6mhq] {
    white-space: nowrap;
}

.asst-mono[b-l36w9l6mhq] {
    font-family: var(--qq-admin-mono);
    font-size: 0.75rem;
    color: var(--qq-admin-muted);
}

.asst-quote[b-l36w9l6mhq] {
    font-size: 0.86rem;
    color: var(--qq-admin-ink);
}

.asst-ticket[b-l36w9l6mhq] {
    font-weight: 600;
    color: var(--qq-admin-accent);
    text-decoration: none;
}

.asst-ticket:hover[b-l36w9l6mhq] {
    text-decoration: underline;
}

/* ---- Transcript drawer ---- */

.asst-transcript[b-l36w9l6mhq] {
    overflow-y: auto;
    padding: 1rem 1.1rem 1.25rem;
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
}

.asst-masked[b-l36w9l6mhq] {
    margin: 0 0 0.25rem;
    font-size: 0.75rem;
    color: var(--qq-text-muted);
}

.asst-line[b-l36w9l6mhq] {
    max-width: 88%;
    align-self: flex-start;
    padding: 0.55rem 0.8rem;
    border-radius: 12px;
    background: var(--qq-shell);
    border: 1px solid var(--qq-border-soft);
    color: var(--qq-text);
}

.asst-line.is-asker[b-l36w9l6mhq] {
    align-self: flex-end;
    background: var(--qq-brass-tint);
    border-color: transparent;
}

.asst-line-who[b-l36w9l6mhq] {
    font-family: var(--qq-admin-mono);
    font-size: 0.62rem;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--qq-text-faint);
    margin-bottom: 0.15rem;
}

.asst-line-text[b-l36w9l6mhq] {
    font-size: 0.86rem;
    line-height: 1.45;
    white-space: pre-line;
    overflow-wrap: anywhere;
}

.asst-drawer-ticket[b-l36w9l6mhq] {
    align-self: flex-start;
    margin-top: 0.5rem;
}

@media (max-width: 560px) {
    .asst-card-head[b-l36w9l6mhq],
    .asst-chipset[b-l36w9l6mhq],
    .asst-hint[b-l36w9l6mhq],
    .asst-empty[b-l36w9l6mhq] {
        padding-left: 1rem;
        padding-right: 1rem;
    }

    .asst-switch[b-l36w9l6mhq] {
        padding: 0.85rem 1rem;
        flex-wrap: wrap;
    }

    .asst-switch-state[b-l36w9l6mhq] {
        margin-left: auto;
    }
}
/* /Components/Admin/AdminSystem.razor.rz.scp.css */
/* Admin system page (spec 059), laid out as a dashboard split: a sticky
   summary panel on the left, the detail behind four tabs on the right. Every
   surface is a theme token and every ink on it is a theme token too (the
   pairing rule), so both themes come for free; the status marks use the
   shared ok/warn/bad pairs the pills use. Tables sit in an overflow-x wrapper
   so a phone scrolls the table, never the page. */

.sys-dash[b-pwznnq0658] {
    display: grid;
    grid-template-columns: 300px minmax(0, 1fr);
    gap: 1.5rem;
    align-items: start;
    /* The type's own line height, not Bootstrap's 1.5: the dashboard is dense
       by design and the handoff's spacing is measured against it. */
    line-height: normal;
}

/* Page bar, right side: commit and uptime. */
.sys-build[b-pwznnq0658] {
    font-family: var(--qq-admin-mono);
    font-size: 0.7rem;
    color: var(--qq-admin-faint);
    white-space: nowrap;
}

/* ---- Level tint pairs (mark backgrounds) and state words ---- */

.sys-tint-good[b-pwznnq0658] {
    background: var(--qq-ok-bg);
    color: var(--qq-ok-fg);
}

.sys-tint-warning[b-pwznnq0658] {
    background: var(--qq-warn-bg);
    color: var(--qq-warn-fg);
}

.sys-tint-critical[b-pwznnq0658] {
    background: var(--qq-bad-bg);
    color: var(--qq-bad-fg);
}

.sys-word-good[b-pwznnq0658] {
    color: var(--qq-ok-fg);
}

.sys-word-warning[b-pwznnq0658] {
    color: var(--qq-warn-fg);
}

.sys-word-critical[b-pwznnq0658] {
    color: var(--qq-bad-fg);
}

/* ---- Summary panel ---- */

/* A flex column capped to the viewport: the head and the footer are pinned,
   the checks and counts between them scroll inside the panel, so a longer
   list never pushes Refresh off screen. */
.sys-panel[b-pwznnq0658] {
    position: sticky;
    top: 1rem;
    max-height: calc(100vh - 2rem);
    min-height: 0;
    display: flex;
    flex-direction: column;
    color: var(--qq-admin-ink);
}

/* The phone's folded bar; hidden on a wide screen. */
.sys-bar[b-pwznnq0658] {
    display: none;
}

.sys-panel-head[b-pwznnq0658] {
    flex: none;
    padding: 1.1rem 1.25rem;
    border-bottom: 1px solid var(--qq-admin-border);
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.sys-overall-row[b-pwznnq0658] {
    display: flex;
    align-items: center;
    gap: 0.85rem;
}

/* The mark's shape (tick, bang, cross) says the state as well as its colour. */
.sys-overall[b-pwznnq0658] {
    flex: none;
    width: 40px;
    height: 40px;
    border-radius: 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-weight: 800;
    font-size: 1.1rem;
}

.sys-overall-text[b-pwznnq0658] {
    min-width: 0;
}

.sys-headline[b-pwznnq0658] {
    font-size: 1.3rem;
    font-weight: 700;
    letter-spacing: -0.02em;
    line-height: 1.1;
}

.sys-headline-sub[b-pwznnq0658] {
    margin-top: 0.2rem;
    font-family: var(--qq-admin-mono);
    font-size: 0.7rem;
    color: var(--qq-admin-muted);
}

.sys-panel-scroll[b-pwznnq0658] {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: var(--qq-admin-border) transparent;
    /* A 20px fade at the bottom edge says "there is more". Only the mask's
       alpha matters; any opaque token will do. */
    -webkit-mask-image: linear-gradient(to bottom, var(--qq-admin-ink) calc(100% - 20px), transparent);
    mask-image: linear-gradient(to bottom, var(--qq-admin-ink) calc(100% - 20px), transparent);
}

.sys-checks[b-pwznnq0658] {
    list-style: none;
    margin: 0;
    padding: 0.35rem 0;
}

.sys-check[b-pwznnq0658] {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 0.7rem;
    align-items: center;
    padding: 0.6rem 1.25rem;
}

.sys-check-mark[b-pwznnq0658] {
    width: 22px;
    height: 22px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-weight: 800;
    font-size: 0.72rem;
}

.sys-check-body[b-pwznnq0658] {
    min-width: 0;
}

.sys-check-label[b-pwznnq0658] {
    font-weight: 600;
    font-size: 0.9rem;
}

.sys-check-detail[b-pwznnq0658] {
    font-size: 0.76rem;
    color: var(--qq-admin-muted);
    overflow-wrap: anywhere;
}

.sys-check-state[b-pwznnq0658] {
    font-family: var(--qq-admin-mono);
    font-size: 0.62rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.sys-block[b-pwznnq0658] {
    padding: 1rem 1.25rem;
    border-top: 1px solid var(--qq-admin-border);
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
}

.sys-block-events[b-pwznnq0658] {
    gap: 0.5rem;
}

.sys-kv[b-pwznnq0658] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.5rem 1rem;
}

.sys-k[b-pwznnq0658] {
    font-size: 0.7rem;
    color: var(--qq-admin-muted);
}

.sys-v[b-pwznnq0658] {
    font-size: 1.1rem;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    overflow-wrap: anywhere;
}

.sys-sent[b-pwznnq0658] {
    font-family: var(--qq-admin-mono);
    font-size: 0.68rem;
    color: var(--qq-admin-faint);
}

.sys-event[b-pwznnq0658] {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 1rem;
    font-size: 0.86rem;
}

.sys-event-n[b-pwznnq0658] {
    font-weight: 700;
    font-variant-numeric: tabular-nums;
}

.sys-panel-foot[b-pwznnq0658] {
    flex: none;
    padding: 0.9rem 1.25rem;
    border-top: 1px solid var(--qq-admin-border);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    background: var(--qq-admin-input);
    /* The card's 16px radius, less its 1px border. */
    border-radius: 0 0 15px 15px;
}

.sys-panel-foot .qq-btn.qq-btn-sm[b-pwznnq0658] {
    padding: 0.4rem 0.9rem;
    font-size: 0.8rem;
    line-height: normal;
}

.sys-foot-note[b-pwznnq0658] {
    font-family: var(--qq-admin-mono);
    font-size: 0.68rem;
    color: var(--qq-admin-faint);
    text-align: right;
}

/* ---- Tabs (a qq-seg, squared to the admin's radius) ---- */

.sys-main[b-pwznnq0658] {
    display: flex;
    flex-direction: column;
    gap: 1.1rem;
    min-width: 0;
}

.sys-tabs[b-pwznnq0658],
.sys-range[b-pwznnq0658] {
    background: var(--qq-admin-input);
    border: 1px solid var(--qq-admin-border);
}

.sys-tabs[b-pwznnq0658] {
    align-self: flex-start;
    gap: 0.25rem;
    padding: 0.25rem;
    border-radius: 12px;
}

.sys-tabs > button[b-pwznnq0658],
.sys-range > button[b-pwznnq0658] {
    font-weight: 600;
    color: var(--qq-admin-muted);
}

.sys-tabs > button[b-pwznnq0658] {
    border-radius: 9px;
    padding: 0.45rem 1rem;
    font-size: 0.85rem;
}

.sys-tabs > button:hover[b-pwznnq0658],
.sys-range > button:hover[b-pwznnq0658] {
    color: var(--qq-admin-ink);
}

/* Ink inverts with the theme, so its label inverts with it (btn-fg). */
.sys-tabs > button.active[b-pwznnq0658],
.sys-range > button.active[b-pwznnq0658] {
    background: var(--qq-admin-ink);
    color: var(--qq-admin-btn-fg);
    box-shadow: none;
    font-weight: 600;
}

.sys-tabs > button:focus-visible[b-pwznnq0658],
.sys-range > button:focus-visible[b-pwznnq0658],
.sys-bar:focus-visible[b-pwznnq0658] {
    outline: 2px solid var(--qq-admin-accent);
    outline-offset: 2px;
}

.sys-tab-short[b-pwznnq0658] {
    display: none;
}

.sys-pane[b-pwznnq0658] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    min-width: 0;
}

.sys-pane-loose[b-pwznnq0658] {
    gap: 1.1rem;
}

.sys-note[b-pwznnq0658] {
    margin: 0;
    font-size: 0.78rem;
    color: var(--qq-admin-faint);
}

/* ---- Live ---- */

.sys-live[b-pwznnq0658] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
}

/* One markup for both widths: stacked here, text beside the spark on a phone. */
.sys-stat[b-pwznnq0658] {
    min-width: 0;
    padding: 1.1rem 1.25rem;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas: "label" "value" "spark" "sub";
    row-gap: 0.25rem;
    color: var(--qq-admin-ink);
}

.sys-stat-label[b-pwznnq0658] {
    grid-area: label;
    font-family: var(--qq-admin-mono);
    font-size: 0.66rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--qq-admin-muted);
}

/* AdminHome's stat-value size. */
.sys-stat-value[b-pwznnq0658] {
    grid-area: value;
    font-size: 2.375rem;
    font-weight: 700;
    letter-spacing: -0.03em;
    line-height: 1.1;
    overflow-wrap: anywhere;
}

.sys-stat .sys-spark[b-pwznnq0658] {
    grid-area: spark;
    display: block;
    width: 100%;
    height: 72px;
    margin: 0.6rem 0 0.4rem;
}

.sys-stat .sys-sub[b-pwznnq0658] {
    grid-area: sub;
}

/* ---- Filter rows (Jobs, Payments) ---- */

.sys-filterbar[b-pwznnq0658] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.6rem;
}

.sys-filterbar .admin-search.sys-search[b-pwznnq0658] {
    /* 16rem of field inside its padding and border. */
    width: calc(16rem + 1.7rem + 2px);
    padding: 0.5rem 0.85rem;
}

.sys-chipset[b-pwznnq0658] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
}

.sys-count[b-pwznnq0658] {
    margin-left: auto;
    font-family: var(--qq-admin-mono);
    font-size: 0.7rem;
    color: var(--qq-admin-faint);
}

.sys-show[b-pwznnq0658] {
    font-family: var(--qq-admin-mono);
    font-size: 0.66rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--qq-admin-faint);
}

/* ---- Cards and tables ---- */

.sys-card[b-pwznnq0658] {
    padding: 1rem 1.25rem;
    color: var(--qq-admin-ink);
    min-width: 0;
}

.sys-tablecard[b-pwznnq0658] {
    min-width: 0;
    overflow: hidden;
    color: var(--qq-admin-ink);
}

.sys-scroll[b-pwznnq0658] {
    overflow-x: auto;
    min-width: 0;
}

.sys-table-head[b-pwznnq0658] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem 0.75rem;
    padding: 0.9rem 1.25rem 0.5rem;
}

.sys-table-head .sys-card-title[b-pwznnq0658] {
    font-size: 0.9rem;
}

.sys-card-meta[b-pwznnq0658] {
    margin-left: 0.4rem;
    font-family: var(--qq-admin-mono);
    font-size: 0.68rem;
    font-weight: 400;
    color: var(--qq-admin-faint);
}

.sys-table-empty[b-pwznnq0658] {
    margin: 0;
    padding: 0.4rem 1.25rem 1.1rem;
}

.sys-table[b-pwznnq0658] {
    width: 100%;
    font-size: 0.85rem;
}

.sys-table > thead > tr > th[b-pwznnq0658] {
    font-family: var(--qq-admin-mono);
    font-size: 0.64rem;
    font-weight: 700;
    line-height: 1.5;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--qq-admin-faint);
    background: transparent;
    border-bottom: 0;
    padding: 0.85rem 1rem 0.65rem;
    vertical-align: bottom;
}

.sys-table > tbody > tr > td[b-pwznnq0658] {
    padding: 0.75rem 1rem;
    font-size: 0.85rem;
    color: var(--qq-admin-ink);
    background: transparent;
    border-top: 1px solid var(--qq-admin-divider);
    border-bottom: 0;
}

/* The first row's rule is the header's underline (qq-table drops it). */
.sys-table > tbody > tr:first-child > td[b-pwznnq0658] {
    border-top: 1px solid var(--qq-admin-divider);
}

.sys-table > thead > tr > th:first-child[b-pwznnq0658],
.sys-table > tbody > tr > td:first-child[b-pwznnq0658] {
    padding-left: 1.25rem;
}

.sys-table > thead > tr > th:last-child[b-pwznnq0658],
.sys-table > tbody > tr > td:last-child[b-pwznnq0658] {
    padding-right: 1.25rem;
}

.sys-table-compact > thead > tr > th[b-pwznnq0658] {
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
}

.sys-table-compact > tbody > tr > td[b-pwznnq0658] {
    padding-top: 0.65rem;
    padding-bottom: 0.65rem;
}

.sys-table th[b-pwznnq0658],
.sys-table td[b-pwznnq0658] {
    white-space: nowrap;
}

.sys-table td.sys-err[b-pwznnq0658],
.sys-table td.sys-break[b-pwznnq0658],
.sys-table td.sys-nomatch[b-pwznnq0658],
.sys-table td.sys-wrap[b-pwznnq0658] {
    white-space: normal;
}

/* Headers may wrap ("Runs / failures" over two lines), as the handoff's do. */
.sys-table > thead > tr > th[b-pwznnq0658] {
    white-space: normal;
}

/* The job's name and its "id - every ..." line wrap rather than widen the table. */
.sys-table > tbody > tr > td.sys-wrap[b-pwznnq0658] {
    min-width: 10.5rem;
}

.sys-table > tbody > tr > td.sys-nomatch[b-pwznnq0658] {
    padding: 1.5rem 1.25rem;
    font-size: 0.9rem;
    color: var(--qq-admin-muted);
}

/* overflow-wrap:anywhere shrinks a cell's min-content to one character, and
   an auto-layout table then squeezes the column into a tall sliver on a
   phone; the min-widths keep it readable and let the wrapper scroll. */
.sys-table > tbody > tr > td.sys-err[b-pwznnq0658] {
    min-width: 9rem;
    max-width: 22rem;
    font-family: var(--qq-admin-mono);
    font-size: 0.74rem;
    overflow-wrap: anywhere;
}

.sys-err-on[b-pwznnq0658] {
    color: var(--qq-bad-fg);
}

.sys-table > tbody > tr > td.sys-break[b-pwznnq0658] {
    min-width: 9rem;
    overflow-wrap: anywhere;
}

.sys-table > tbody > tr > td.sys-mono[b-pwznnq0658],
.sys-table > tbody > tr > td.sys-when[b-pwznnq0658] {
    font-size: 0.78rem;
}

/* One instrument's rows under its own heading, so the name is said once. */
.sys-table > tbody > tr.sys-group > th[b-pwznnq0658] {
    padding: 0.45rem 1.25rem;
    font-family: var(--qq-admin-mono);
    font-size: 0.64rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--qq-admin-muted);
    background: var(--qq-admin-divider);
    border: 0;
}

.sys-strong[b-pwznnq0658] {
    font-weight: 600;
    color: var(--qq-admin-ink);
}

.sys-num[b-pwznnq0658] {
    font-variant-numeric: tabular-nums;
}

.sys-when[b-pwznnq0658] {
    font-family: var(--qq-admin-mono);
    font-size: 0.78rem;
    color: var(--qq-admin-muted);
    white-space: nowrap;
}

.sys-sub[b-pwznnq0658] {
    font-family: var(--qq-admin-mono);
    font-size: 0.68rem;
    color: var(--qq-admin-faint);
    overflow-wrap: anywhere;
}

.sys-pills[b-pwznnq0658] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.3rem;
}

.sys-mono[b-pwznnq0658] {
    font-family: var(--qq-admin-mono);
    font-size: 0.8rem;
}

.sys-muted[b-pwznnq0658] {
    color: var(--qq-admin-muted);
    font-size: 0.9rem;
}

.sys-faint[b-pwznnq0658],
.sys-table > tbody > tr > td.sys-faint[b-pwznnq0658] {
    color: var(--qq-admin-faint);
}

.sys-quiet[b-pwznnq0658],
.sys-table > tbody > tr > td.sys-quiet[b-pwznnq0658] {
    color: var(--qq-admin-muted);
}

.sys-bad[b-pwznnq0658],
.sys-table > tbody > tr > td.sys-bad[b-pwznnq0658] {
    color: var(--qq-bad-fg);
    font-weight: 700;
}

.sys-warn[b-pwznnq0658] {
    color: var(--qq-warn-fg);
}

/* ---- Pager: the shared qq-grid-pager, in the admin's mono meta voice ---- */

.qq-grid-pager.sys-pager[b-pwznnq0658] {
    gap: 0.75rem;
    padding: 0.7rem 1.25rem;
    font-family: var(--qq-admin-mono);
    font-size: 0.72rem;
    border-top-color: var(--qq-admin-divider);
}

.qq-grid-pager.sys-pager > .qq-btn-outline[b-pwznnq0658] {
    padding: 0.3rem 0.7rem;
    border-radius: 8px;
    border-color: var(--qq-admin-border);
    background: transparent;
    color: var(--qq-admin-ink);
    font-family: inherit;
    font-size: 0.78rem;
    line-height: normal;
}

.qq-grid-pager.sys-pager-compact[b-pwznnq0658] {
    padding: 0.6rem 1.25rem;
}

.qq-grid-pager.sys-pager-compact > .qq-btn-outline[b-pwznnq0658] {
    padding: 0.25rem 0.6rem;
    font-size: 0.76rem;
}

/* ---- History ---- */

.sys-history-head[b-pwznnq0658] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.sys-range[b-pwznnq0658] {
    gap: 0.2rem;
    padding: 0.2rem;
    border-radius: 10px;
}

.sys-range > button[b-pwznnq0658] {
    border-radius: 7px;
    padding: 0.3rem 0.85rem;
    font-size: 0.78rem;
}

.sys-card-head[b-pwznnq0658] {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 0.4rem 0.9rem;
    margin-bottom: 0.5rem;
}

.sys-card-title[b-pwznnq0658] {
    font-weight: 700;
    font-size: 0.88rem;
    margin-right: auto;
}

.sys-legend[b-pwznnq0658] {
    font-family: var(--qq-admin-mono);
    font-size: 0.72rem;
    color: var(--qq-admin-muted);
}

.sys-trio[b-pwznnq0658] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
}

.sys-duo[b-pwznnq0658] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
    align-items: start;
}

.sys-trio > *[b-pwznnq0658],
.sys-duo > *[b-pwznnq0658] {
    min-width: 0;
}

/* The small search in the Exceptions head. */
.sys-table-head .admin-search.sys-search-sm[b-pwznnq0658] {
    width: 11rem;
    gap: 0.5rem;
    padding: 0.3rem 0.65rem;
    border-radius: 8px;
}

.sys-table-head .admin-search.sys-search-sm[b-pwznnq0658]::before {
    width: 5px;
    height: 5px;
}

.sys-table-head .admin-search.sys-search-sm input[b-pwznnq0658] {
    font-size: 0.78rem;
}

.sys-chart[b-pwznnq0658] {
    display: block;
    width: 100%;
    height: auto;
}

.sys-axis[b-pwznnq0658] {
    font-family: var(--qq-admin-mono);
    font-size: 11px;
    fill: var(--qq-admin-faint);
}

/* ---- In between. The admin rail (252px) and the panel (300px) leave the
   main column only ~950px at 1600px and ~370px at 1024px, so the grids give
   way before the layout's 900px drawer breakpoint does. ---- */

/* Two tables side by side need about 900px between them. */
@media (max-width: 1599px) {
    .sys-duo[b-pwznnq0658] {
        grid-template-columns: minmax(0, 1fr);
    }
}

/* Three cards across need about 700px; below that they stack, the live ones
   as the phone's row (text left, a 120x44 spark right). */
@media (max-width: 1279px) {
    /* "Payments" alone, so all four tabs stay in view. */
    .sys-tab-long[b-pwznnq0658] {
        display: none;
    }

    .sys-tab-short[b-pwznnq0658] {
        display: inline;
    }

    .sys-live[b-pwznnq0658],
    .sys-trio[b-pwznnq0658] {
        grid-template-columns: minmax(0, 1fr);
    }

    .sys-stat[b-pwznnq0658] {
        grid-template-columns: minmax(0, 1fr) 120px;
        grid-template-areas: "label spark" "value spark" "sub spark";
        column-gap: 1rem;
        align-items: center;
        padding: 1rem 1.1rem;
    }

    .sys-stat-value[b-pwznnq0658] {
        font-size: 1.9rem;
    }

    .sys-stat .sys-spark[b-pwznnq0658] {
        width: 120px;
        height: 44px;
        margin: 0;
    }

    .sys-stat .sys-sub[b-pwznnq0658] {
        margin-top: 0.2rem;
    }
}

/* ---- Narrow: the layout's drawer breakpoint ---- */

@media (max-width: 900px) {
    .sys-dash[b-pwznnq0658] {
        grid-template-columns: minmax(0, 1fr);
        gap: 0.9rem;
    }

    /* The commit rides in the folded bar instead. */
    .sys-build[b-pwznnq0658] {
        display: none;
    }

    .sys-panel[b-pwznnq0658] {
        position: static;
        max-height: none;
    }

    /* Beats the layout's qq-card radius (a ::deep rule, so one class heavier). */
    .sys-dash .sys-panel.qq-card[b-pwznnq0658] {
        border-radius: 14px;
    }

    .sys-bar[b-pwznnq0658] {
        display: flex;
        align-items: center;
        gap: 0.75rem;
        width: 100%;
        padding: 0.8rem 1rem;
        border: 0;
        border-radius: 14px;
        background: transparent;
        color: var(--qq-admin-ink);
        font-family: inherit;
        text-align: left;
        cursor: pointer;
    }

    .sys-overall-sm[b-pwznnq0658] {
        width: 32px;
        height: 32px;
        border-radius: 10px;
        font-size: 1rem;
    }

    .sys-bar-text[b-pwznnq0658] {
        flex: 1;
        min-width: 0;
    }

    .sys-bar-head[b-pwznnq0658] {
        display: block;
        font-weight: 700;
        font-size: 1rem;
    }

    .sys-bar-sub[b-pwznnq0658] {
        display: block;
        font-family: var(--qq-admin-mono);
        font-size: 0.66rem;
        color: var(--qq-admin-muted);
        overflow-wrap: anywhere;
    }

    .sys-bar-more[b-pwznnq0658] {
        flex: none;
        font-family: var(--qq-admin-mono);
        font-size: 0.66rem;
        color: var(--qq-admin-faint);
        white-space: nowrap;
    }

    .sys-caret[b-pwznnq0658] {
        display: inline-block;
        transition: transform 140ms ease;
    }

    .sys-panel.is-open .sys-caret[b-pwznnq0658] {
        transform: rotate(180deg);
    }

    /* The bar already says the headline. */
    .sys-panel-head[b-pwznnq0658] {
        display: none;
    }

    .sys-panel:not(.is-open) .sys-panel-scroll[b-pwznnq0658],
    .sys-panel:not(.is-open) .sys-panel-foot[b-pwznnq0658] {
        display: none;
    }

    .sys-panel-scroll[b-pwznnq0658] {
        overflow: visible;
        border-top: 1px solid var(--qq-admin-border);
        -webkit-mask-image: none;
        mask-image: none;
    }

    .sys-panel-foot[b-pwznnq0658] {
        border-radius: 0 0 13px 13px;
    }

    /* Full width and scrolling sideways (qq-seg already scrolls). */
    .sys-tabs[b-pwznnq0658] {
        align-self: stretch;
        display: flex;
    }

    .sys-tabs > button[b-pwznnq0658] {
        padding: 0.4rem 0.85rem;
        font-size: 0.8rem;
    }

    .sys-main[b-pwznnq0658] {
        gap: 0.9rem;
    }

    .sys-count[b-pwznnq0658] {
        margin-left: 0;
    }
}
/* /Components/Admin/AdminVehicles.razor.rz.scp.css */
/* Admin › Vehicles (spec 050, handoff AdminVehicles.zip). Every colour maps to
   an Admin v3 token so the dark theme applies without a second palette; the
   two fixed hexes are the brass plate badge and the green Approve, which are
   fixed in the handoff for both themes and take fixed ink. */

/* --- Header bar ------------------------------------------------------------- */

.av-title[b-ky91xn87bs] {
    font-family: 'Instrument Serif', Georgia, serif;
    font-weight: 400;
    font-size: 1.65rem;
    letter-spacing: -0.01em;
    line-height: 1.1;
}

.av-sub[b-ky91xn87bs] {
    font-size: 0.8rem;
    color: var(--qq-admin-muted);
    margin-top: 2px;
}

.av-segs[b-ky91xn87bs] {
    display: flex;
    gap: 2px;
    background: var(--qq-admin-input);
    border: 1px solid var(--qq-admin-border);
    border-radius: 10px;
    padding: 3px;
    max-width: 100%;
    overflow-x: auto;
}

.av-seg[b-ky91xn87bs] {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 7px 12px;
    border-radius: 8px;
    border: none;
    background: transparent;
    color: var(--qq-admin-muted);
    font-family: inherit;
    font-size: 0.8rem;
    font-weight: 600;
    white-space: nowrap;
    cursor: pointer;
}

.av-seg.is-active[b-ky91xn87bs] {
    background: var(--qq-admin-ink);
    color: var(--qq-admin-btn-fg);
}

.av-seg-count[b-ky91xn87bs] {
    font-family: var(--qq-admin-mono);
    font-size: 0.64rem;
    font-weight: 700;
    color: var(--qq-admin-faint);
}

.av-seg.is-active .av-seg-count[b-ky91xn87bs] {
    color: #d9a94e;
}

/* --- List ------------------------------------------------------------------- */

.av-card[b-ky91xn87bs] {
    background: var(--qq-admin-card);
    border: 1px solid var(--qq-admin-border);
    border-radius: 16px;
    overflow: hidden;
}

.av-grid[b-ky91xn87bs] {
    display: grid;
    /* minmax(0, …) so the text columns truncate instead of forcing the row wider. */
    grid-template-columns: 56px minmax(0, 1.3fr) minmax(0, 1fr) minmax(0, 1.6fr) 200px 104px 64px 20px;
    gap: 16px;
    align-items: center;
    padding: 13px 22px;
    border-bottom: 1px solid var(--qq-admin-divider);
}

.av-grid-head[b-ky91xn87bs] {
    padding: 11px 22px;
    background: var(--qq-admin-row, var(--qq-admin-shell));
    border-bottom-color: var(--qq-admin-border);
    font-family: var(--qq-admin-mono);
    font-size: 0.6rem;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--qq-admin-faint);
}

.av-row[b-ky91xn87bs] {
    color: inherit;
    text-decoration: none;
    cursor: pointer;
}

.av-row:hover[b-ky91xn87bs] {
    background: var(--qq-admin-row, var(--qq-admin-shell));
    color: inherit;
    text-decoration: none;
}

.av-row.is-open[b-ky91xn87bs] {
    background: var(--qq-admin-row, var(--qq-admin-shell));
}

.av-row.is-removed[b-ky91xn87bs] {
    opacity: 0.6;
}

.av-row.is-removed .av-name[b-ky91xn87bs],
.av-row.is-removed .av-tag[b-ky91xn87bs],
.is-struck[b-ky91xn87bs] {
    text-decoration: line-through;
}

.av-row:last-child[b-ky91xn87bs] {
    border-bottom: none;
}

.av-cover[b-ky91xn87bs] {
    position: relative;
    display: block;
    width: 56px;
    height: 42px;
    border-radius: 8px;
    overflow: hidden;
    background: var(--qq-admin-input);
}

.av-cover img[b-ky91xn87bs] {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

/* The corner badge from the review card: brass ◐ = plate blurred, grey ? = not checked. */
.av-corner[b-ky91xn87bs] {
    position: absolute;
    top: 0;
    right: 0;
    width: 20px;
    height: 20px;
    display: inline-flex;
    align-items: flex-start;
    justify-content: flex-end;
    padding: 1px 2px 0 0;
    font-size: 9px;
    font-weight: 700;
    line-height: 1;
    color: #fffdf8;
    background: linear-gradient(225deg, #b9b19f 50%, transparent 50%);
}

.av-corner.is-brass[b-ky91xn87bs] {
    color: #211d18;
    background: linear-gradient(225deg, #d9a94e 50%, transparent 50%);
}

.av-name[b-ky91xn87bs] {
    display: block;
    font-weight: 700;
    font-size: 0.85rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.av-plate[b-ky91xn87bs],
.av-vin[b-ky91xn87bs] {
    display: block;
    font-family: var(--qq-admin-mono);
    letter-spacing: 0.06em;
}

.av-plate[b-ky91xn87bs] {
    font-size: 0.69rem;
    color: var(--qq-admin-muted);
    margin-top: 2px;
}

.av-store[b-ky91xn87bs] {
    display: block;
    font-size: 0.82rem;
    font-weight: 600;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.av-owner[b-ky91xn87bs] {
    display: block;
    font-size: 0.72rem;
    color: var(--qq-admin-muted);
    margin-top: 2px;
}

.av-vin[b-ky91xn87bs] {
    font-size: 0.75rem;
    font-weight: 700;
}

.av-decode[b-ky91xn87bs] {
    display: flex;
    align-items: center;
    gap: 5px;
    font-size: 0.75rem;
    margin-top: 3px;
    min-width: 0;
}

.av-decode > span:last-child[b-ky91xn87bs] {
    flex: 1;
    min-width: 0;
}

.av-decode-glyph[b-ky91xn87bs] {
    font-family: var(--qq-admin-mono);
    font-weight: 700;
    font-size: 0.64rem;
    flex-shrink: 0;
}

.av-decode.is-ok[b-ky91xn87bs] { color: var(--qq-ok-fg); }
.av-decode.is-bad[b-ky91xn87bs] { color: var(--qq-bad-fg); }
.av-decode.is-grey[b-ky91xn87bs] { color: var(--qq-admin-muted); }

.av-chips[b-ky91xn87bs] {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
}

.av-chip[b-ky91xn87bs] {
    font-family: var(--qq-admin-mono);
    font-size: 0.6rem;
    font-weight: 700;
    padding: 4px 8px;
    border-radius: 6px;
    border: 1px solid transparent;
    white-space: nowrap;
}

.av-chip.is-on[b-ky91xn87bs] {
    background: var(--qq-admin-ink);
    color: var(--qq-admin-btn-fg);
}

.av-chip.is-missing[b-ky91xn87bs] {
    background: var(--qq-bad-bg);
    border-color: color-mix(in srgb, var(--qq-bad-fg) 35%, transparent);
    color: var(--qq-bad-fg);
}

/* Admin v3 signature tag; Removed reuses Draft, struck through by the row. */
.av-tag[b-ky91xn87bs] {
    display: inline-block;
    font-family: var(--qq-admin-mono);
    font-size: 0.6rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    padding: 4px 9px;
    border-radius: 6px;
    white-space: nowrap;
}

.av-tag.is-pending[b-ky91xn87bs] { background: var(--qq-brass-tint); color: var(--qq-brass-deep); }
.av-tag.is-approved[b-ky91xn87bs] { background: var(--qq-ok-bg); color: var(--qq-ok-fg); }
.av-tag.is-rejected[b-ky91xn87bs] { background: var(--qq-bad-bg); color: var(--qq-bad-fg); }
.av-tag.is-draft[b-ky91xn87bs],
.av-tag.is-removed[b-ky91xn87bs] { background: var(--qq-mute-bg); color: var(--qq-mute-fg); }

.av-date[b-ky91xn87bs] {
    font-family: var(--qq-admin-mono);
    font-size: 0.72rem;
    color: var(--qq-admin-muted);
    white-space: nowrap;
}

.av-chev[b-ky91xn87bs] {
    color: var(--qq-admin-faint);
    font-size: 1rem;
    line-height: 1;
}

.av-empty[b-ky91xn87bs] {
    padding: 44px 22px;
    text-align: center;
    font-size: 0.85rem;
    color: var(--qq-admin-muted);
}

/* --- Drawer ----------------------------------------------------------------- */

.av-scrim[b-ky91xn87bs] {
    position: fixed;
    inset: 0;
    background: rgba(35, 32, 25, 0.28);
    z-index: 1080;
}

.av-drawer[b-ky91xn87bs] {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    width: min(700px, 100vw);
    background: var(--qq-admin-shell);
    border-left: 1px solid var(--qq-admin-border);
    box-shadow: -20px 0 50px rgba(40, 32, 20, 0.18);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    z-index: 1085;
}

.av-drawer-head[b-ky91xn87bs] {
    background: var(--qq-admin-card);
    border-bottom: 1px solid var(--qq-admin-border);
    padding: 18px 26px;
    display: flex;
    align-items: flex-start;
    gap: 14px;
    flex-wrap: wrap;
}

.av-drawer-title[b-ky91xn87bs] {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.av-drawer-name[b-ky91xn87bs] {
    font-weight: 700;
    font-size: 1.125rem;
    letter-spacing: -0.01em;
}

.av-plate-pill[b-ky91xn87bs] {
    font-family: var(--qq-admin-mono);
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    background: var(--qq-brass-tint);
    border: 1px solid color-mix(in srgb, var(--qq-brass) 35%, transparent);
    color: var(--qq-admin-ink);
    padding: 1px 8px;
    border-radius: 5px;
    white-space: nowrap;
}

.av-drawer-store[b-ky91xn87bs] {
    font-size: 0.8rem;
    color: var(--qq-admin-muted);
    margin-top: 5px;
}

.av-verbs[b-ky91xn87bs] {
    display: flex;
    gap: 8px;
    align-items: center;
    flex-shrink: 0;
    flex-wrap: wrap;
}

.av-note[b-ky91xn87bs] {
    font-size: 0.8rem;
    color: var(--qq-admin-muted);
}

.av-btn[b-ky91xn87bs] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-family: inherit;
    font-size: 0.82rem;
    font-weight: 700;
    padding: 9px 16px;
    border-radius: 10px;
    border: 1px solid transparent;
    cursor: pointer;
    white-space: nowrap;
    line-height: 1.2;
}

.av-btn:disabled[b-ky91xn87bs] {
    cursor: default;
}

.av-btn-danger[b-ky91xn87bs] {
    background: transparent;
    border-color: color-mix(in srgb, var(--qq-bad-fg) 35%, transparent);
    color: var(--qq-bad-fg);
    font-weight: 600;
}

.av-btn-danger:hover:not(:disabled)[b-ky91xn87bs] {
    background: var(--qq-bad-bg);
}

.av-btn-plain[b-ky91xn87bs] {
    background: transparent;
    border-color: var(--qq-admin-border);
    color: var(--qq-admin-muted);
    font-weight: 600;
}

.av-btn-destructive[b-ky91xn87bs] {
    background: var(--qq-bad-fg);
    color: #fffdf8;
}

.av-btn-destructive:disabled[b-ky91xn87bs] {
    background: var(--qq-mute-bg);
    color: var(--qq-mute-fg);
}

.av-close[b-ky91xn87bs] {
    width: 30px;
    height: 30px;
    border: 1px solid var(--qq-admin-border);
    border-radius: 9px;
    background: transparent;
    color: var(--qq-admin-muted);
    font-size: 1.05rem;
    line-height: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    margin-left: 6px;
    flex-shrink: 0;
}

.av-drawer-body[b-ky91xn87bs] {
    padding: 20px 26px 30px;
    overflow: auto;
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.av-panel[b-ky91xn87bs] {
    background: var(--qq-admin-card);
    border: 1px solid var(--qq-admin-border);
    border-radius: 14px;
    padding: 16px 18px;
}

.av-eyebrow[b-ky91xn87bs] {
    font-family: var(--qq-admin-mono);
    font-size: 0.6rem;
    font-weight: 700;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--qq-admin-faint);
    margin-bottom: 10px;
}

.av-vin-big[b-ky91xn87bs] {
    font-family: var(--qq-admin-mono);
    font-size: 0.875rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    word-break: break-all;
}

.av-decode-lg[b-ky91xn87bs] {
    font-size: 0.8rem;
    gap: 7px;
    margin-top: 6px;
}

.av-decode-dot[b-ky91xn87bs] {
    width: 16px;
    height: 16px;
    border-radius: 50%;
    color: #fffdf8;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-family: var(--qq-admin-mono);
    font-size: 0.64rem;
    font-weight: 700;
    flex-shrink: 0;
    background: #b9b19f;
}

.av-decode.is-ok .av-decode-dot[b-ky91xn87bs] { background: #3f7a52; }
.av-decode.is-bad .av-decode-dot[b-ky91xn87bs] { background: #b3402e; }

.av-papers[b-ky91xn87bs] {
    display: flex;
    gap: 8px;
    margin-top: 12px;
    align-items: center;
    flex-wrap: wrap;
}

.av-papers-label[b-ky91xn87bs] {
    font-size: 0.75rem;
    color: var(--qq-admin-muted);
    margin-right: 4px;
}

.av-doc[b-ky91xn87bs] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-family: var(--qq-admin-mono);
    font-size: 0.69rem;
    font-weight: 700;
    padding: 6px 12px;
    border-radius: 7px;
    border: 1px solid var(--qq-admin-ink);
    background: var(--qq-admin-ink);
    color: var(--qq-admin-btn-fg);
    text-decoration: none;
    cursor: pointer;
}

.av-doc:hover[b-ky91xn87bs] {
    color: var(--qq-admin-btn-fg);
    text-decoration: none;
    filter: brightness(1.25);
}

.av-doc.is-missing[b-ky91xn87bs] {
    background: var(--qq-bad-bg);
    border-color: color-mix(in srgb, var(--qq-bad-fg) 35%, transparent);
    color: var(--qq-bad-fg);
    cursor: default;
}

.av-submitted[b-ky91xn87bs] {
    border-top: 1px dashed var(--qq-admin-divider);
    margin-top: 14px;
    padding-top: 10px;
    font-size: 0.75rem;
    color: var(--qq-admin-muted);
}

/* Photos: the hero, split in two when the reviewer asks for the private original. */
.av-hero-grid[b-ky91xn87bs] {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
}

.av-hero-grid.is-split[b-ky91xn87bs] {
    grid-template-columns: 1fr 1fr;
}

.av-hero[b-ky91xn87bs] {
    position: relative;
    height: 220px;
    border-radius: 12px;
    overflow: hidden;
    background: var(--qq-admin-input);
}

.av-hero img[b-ky91xn87bs] {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.av-hero.is-original[b-ky91xn87bs] {
    border: 2px solid #d9a94e;
}

.av-hero-empty[b-ky91xn87bs] {
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: var(--qq-admin-mono);
    font-size: 0.72rem;
    color: var(--qq-admin-faint);
}

.av-hero-label[b-ky91xn87bs] {
    position: absolute;
    left: 12px;
    top: 10px;
    font-family: var(--qq-admin-mono);
    font-size: 0.64rem;
    letter-spacing: 0.1em;
    color: #e6e1d5;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.6);
}

.av-hero-pill[b-ky91xn87bs] {
    position: absolute;
    left: 12px;
    bottom: 12px;
    font-size: 0.64rem;
    font-weight: 700;
    background: #f7f0e0;
    color: #9a6b1e;
    padding: 3px 9px;
    border-radius: 99px;
}

.av-hero-hide[b-ky91xn87bs] {
    position: absolute;
    right: 10px;
    top: 8px;
    background: rgba(23, 21, 18, 0.75);
    color: #f4f0e8;
    font-family: inherit;
    font-size: 0.69rem;
    font-weight: 600;
    padding: 3px 10px;
    border-radius: 99px;
    border: none;
    cursor: pointer;
}

.av-strip[b-ky91xn87bs] {
    display: flex;
    gap: 7px;
    margin-top: 8px;
    flex-wrap: wrap;
}

.av-thumb[b-ky91xn87bs] {
    position: relative;
    flex: 1 1 54px;
    max-width: 96px;
    height: 54px;
    border-radius: 8px;
    overflow: hidden;
    border: 2px solid transparent;
    padding: 0;
    background: var(--qq-admin-input);
    cursor: pointer;
    display: block;
}

.av-thumb img[b-ky91xn87bs] {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.av-thumb.is-hero[b-ky91xn87bs] {
    border-color: var(--qq-admin-ink);
}

.av-thumb.is-split[b-ky91xn87bs] {
    border-color: #d9a94e;
}

.av-thumb .av-corner[b-ky91xn87bs] {
    width: 22px;
    height: 22px;
}

.av-video[b-ky91xn87bs] {
    background: var(--qq-admin-ink);
}

.av-play[b-ky91xn87bs] {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #f4f0e8;
    font-size: 0.8rem;
}

.av-legend[b-ky91xn87bs] {
    font-size: 0.72rem;
    color: var(--qq-admin-muted);
    margin-top: 8px;
}

.av-legend-brass[b-ky91xn87bs] {
    color: var(--qq-brass);
    font-weight: 700;
}

/* Seats / departures: one card, two rows. */
.av-panel-rows[b-ky91xn87bs] {
    padding: 0 18px;
}

.av-kv[b-ky91xn87bs] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 13px 0;
    font-size: 0.82rem;
    border-bottom: 1px solid var(--qq-admin-divider);
    flex-wrap: wrap;
}

.av-kv:last-child[b-ky91xn87bs] {
    border-bottom: none;
}

.av-kv-label[b-ky91xn87bs] {
    width: 96px;
    margin-bottom: 0;
    flex-shrink: 0;
}

.av-kv-link[b-ky91xn87bs] {
    margin-left: auto;
    font-size: 0.8rem;
    white-space: nowrap;
}

/* History */
.av-hist[b-ky91xn87bs] {
    display: grid;
    grid-template-columns: 60px 1fr;
    gap: 12px;
    padding: 8px 0;
    border-bottom: 1px solid var(--qq-admin-divider);
    font-size: 0.8rem;
    align-items: start;
}

.av-hist:last-child[b-ky91xn87bs] {
    border-bottom: none;
}

.av-hist-date[b-ky91xn87bs] {
    font-family: var(--qq-admin-mono);
    font-size: 0.69rem;
    color: var(--qq-admin-muted);
    padding-top: 1px;
}

.av-hist-what[b-ky91xn87bs] {
    font-weight: 600;
}

.av-hist-who[b-ky91xn87bs] {
    color: var(--qq-admin-muted);
}

.av-hist-note[b-ky91xn87bs] {
    color: var(--qq-admin-muted);
    margin-top: 2px;
    font-style: italic;
}

/* --- Reason dialog ---------------------------------------------------------- */

.av-dialog-backdrop[b-ky91xn87bs] {
    position: fixed;
    inset: 0;
    background: rgba(23, 21, 18, 0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1096;
    padding: 1rem;
}

.av-dialog[b-ky91xn87bs] {
    width: 460px;
    max-width: 100%;
    background: var(--qq-admin-card);
    color: var(--qq-admin-ink);
    border-radius: 16px;
    padding: 22px 24px;
    box-shadow: 0 24px 60px rgba(0, 0, 0, 0.35);
}

.av-dialog-title[b-ky91xn87bs] {
    font-weight: 700;
    font-size: 1rem;
}

.av-dialog-hint[b-ky91xn87bs] {
    font-size: 0.8rem;
    color: var(--qq-admin-muted);
    margin-top: 4px;
}

.av-dialog-input[b-ky91xn87bs] {
    width: 100%;
    margin-top: 14px;
    font-family: inherit;
    font-size: 0.85rem;
    color: var(--qq-admin-ink);
    background: var(--qq-admin-input);
    border: 1px solid var(--qq-admin-border);
    border-radius: 10px;
    padding: 10px 13px;
    resize: vertical;
    outline: none;
}

.av-dialog-input:focus[b-ky91xn87bs] {
    border-color: var(--qq-admin-accent);
}

.av-dialog-warn[b-ky91xn87bs] {
    margin-top: 12px;
    background: var(--qq-bad-bg);
    border: 1px solid color-mix(in srgb, var(--qq-bad-fg) 35%, transparent);
    color: var(--qq-bad-fg);
    border-radius: 10px;
    padding: 10px 13px;
    font-size: 0.8rem;
    font-weight: 600;
}

.av-dialog-actions[b-ky91xn87bs] {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    margin-top: 16px;
}

/* --- Narrow desktop and tablet: the store folds under the car, the chips wrap - */

@media (max-width: 1280px) {
    .av-grid[b-ky91xn87bs] {
        grid-template-columns: 56px minmax(0, 1.4fr) minmax(0, 1.6fr) auto auto 64px 20px;
        grid-template-areas:
            "cover car vin papers status date chev"
            "cover store vin papers status date chev";
        row-gap: 0;
    }

    .av-grid-head[b-ky91xn87bs] {
        grid-template-areas: "cover car vin papers status date chev";
    }

    .av-grid-head > span:nth-child(3)[b-ky91xn87bs] {
        display: none;
    }

    .c-cover[b-ky91xn87bs] { grid-area: cover; }
    .c-car[b-ky91xn87bs] { grid-area: car; }
    .c-store[b-ky91xn87bs] { grid-area: store; }
    .c-vin[b-ky91xn87bs] { grid-area: vin; }
    .c-papers[b-ky91xn87bs] { grid-area: papers; }
    .c-status[b-ky91xn87bs] { grid-area: status; }
    .c-date[b-ky91xn87bs] { grid-area: date; }
    .c-chev[b-ky91xn87bs] { grid-area: chev; }

    .av-store[b-ky91xn87bs] {
        font-weight: 400;
        font-size: 0.72rem;
        color: var(--qq-admin-muted);
        margin-top: 2px;
    }

    .av-owner[b-ky91xn87bs] {
        display: none;
    }

    .av-chips[b-ky91xn87bs] {
        flex-wrap: nowrap;
    }
}

/* --- Phone: rows stack, the drawer is a page, verbs sit under the header --- */

@media (max-width: 900px) {
    .av-grid[b-ky91xn87bs] {
        grid-template-columns: 48px 1fr auto;
        grid-template-areas:
            "cover car status"
            "cover store date"
            "cover vin vin"
            "cover papers papers";
        gap: 4px 12px;
        padding: 12px;
        align-items: start;
    }

    .av-grid-head[b-ky91xn87bs] {
        display: none;
    }

    .c-cover[b-ky91xn87bs] { grid-area: cover; }
    .c-car[b-ky91xn87bs] { grid-area: car; }
    .c-store[b-ky91xn87bs] { grid-area: store; }
    .c-vin[b-ky91xn87bs] { grid-area: vin; }
    .c-papers[b-ky91xn87bs] { grid-area: papers; margin-top: 4px; }
    .c-status[b-ky91xn87bs] { grid-area: status; justify-self: end; }
    .c-date[b-ky91xn87bs] { grid-area: date; justify-self: end; font-size: 0.66rem; }
    .c-chev[b-ky91xn87bs] { display: none; }

    .av-cover[b-ky91xn87bs] {
        width: 48px;
        height: 38px;
    }

    .av-store[b-ky91xn87bs] {
        font-weight: 400;
        font-size: 0.72rem;
        color: var(--qq-admin-muted);
    }

    .av-owner[b-ky91xn87bs] {
        display: none;
    }

    .av-drawer[b-ky91xn87bs] {
        width: 100vw;
        border-left: none;
        box-shadow: none;
    }

    .av-drawer-head[b-ky91xn87bs] {
        padding: 14px 16px;
    }

    .av-verbs[b-ky91xn87bs] {
        width: 100%;
    }

    .av-verbs .av-btn[b-ky91xn87bs] {
        flex: 1;
    }

    .av-close[b-ky91xn87bs] {
        order: -1;
        margin-left: auto;
    }

    .av-drawer-body[b-ky91xn87bs] {
        padding: 12px 12px 20px;
        gap: 10px;
    }

    .av-hero[b-ky91xn87bs] {
        height: 150px;
    }

    .av-hero-grid.is-split[b-ky91xn87bs] {
        grid-template-columns: 1fr;
    }

    .av-kv-label[b-ky91xn87bs] {
        width: 100%;
    }

    .av-kv-link[b-ky91xn87bs] {
        margin-left: 0;
    }
}
/* /Components/Admin/AdminVerification.razor.rz.scp.css */
/* Admin verification (handoff rework). The queue is a list beside one open
   store, so a reviewer works store by store instead of scrolling past every
   store to reach any store. */

/* --- Tabs ------------------------------------------------------------------ */

.ver-tabs[b-yvhq229b81] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    margin: 0.35rem 0 1rem;
}

.ver-tab[b-yvhq229b81] {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    font-size: 0.85rem;
    font-weight: 600;
    color: inherit;
    background: var(--qq-admin-card);
    border: 1px solid var(--qq-admin-border);
    border-radius: 99px;
    padding: 0.45rem 0.95rem;
    cursor: pointer;
}

.ver-tab.is-active[b-yvhq229b81] {
    background: var(--qq-admin-accent);
    border-color: var(--qq-admin-accent);
    color: var(--qq-admin-btn-fg, #fff);
}

.ver-tab-count[b-yvhq229b81] {
    font-family: var(--qq-admin-mono);
    font-size: 0.68rem;
    font-weight: 700;
    opacity: 0.75;
}

/* --- Queue split ----------------------------------------------------------- */

.ver-split[b-yvhq229b81] {
    display: grid;
    grid-template-columns: 380px minmax(0, 1fr);
    gap: 1.1rem;
    align-items: start;
}

.ver-list[b-yvhq229b81] {
    display: flex;
    flex-direction: column;
    gap: 0.45rem;
}

.ver-row[b-yvhq229b81] {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    width: 100%;
    text-align: left;
    background: var(--qq-admin-row, #faf7f0);
    border: 1px solid var(--qq-admin-border);
    border-radius: 13px;
    padding: 0.6rem 0.75rem;
    cursor: pointer;
    color: inherit;
}

.ver-row.is-open[b-yvhq229b81] {
    background: var(--qq-admin-card);
    border-color: var(--qq-admin-accent);
    box-shadow: inset 3px 0 0 var(--qq-admin-accent);
}

.ver-row-main[b-yvhq229b81] {
    min-width: 0;
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
}

.ver-row-name[b-yvhq229b81] {
    font-size: 0.9rem;
    font-weight: 700;
    display: flex;
    align-items: center;
    gap: 0.4rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ver-row-meta[b-yvhq229b81] {
    font-family: var(--qq-admin-mono);
    font-size: 0.66rem;
    color: var(--qq-admin-muted);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ver-row-count[b-yvhq229b81] {
    font-family: var(--qq-admin-mono);
    font-size: 0.72rem;
    color: var(--qq-admin-faint);
    flex-shrink: 0;
}

/* One segment per required document — colour never stands alone, since the
   pills in the detail panel spell every status out in words. */
.ver-progress[b-yvhq229b81] {
    display: flex;
    gap: 3px;
}

.ver-seg[b-yvhq229b81] {
    height: 5px;
    flex: 1;
    max-width: 46px;
    border-radius: 3px;
    background: var(--qq-admin-border);
}

.ver-seg.is-ok[b-yvhq229b81] { background: #3f7d4e; }
.ver-seg.is-review[b-yvhq229b81] { background: #d9a94e; }
.ver-seg.is-bad[b-yvhq229b81] { background: var(--qq-admin-accent); }
.ver-seg.is-missing[b-yvhq229b81] {
    background: transparent;
    border: 1px dashed var(--qq-admin-faint);
}

/* --- Open store ------------------------------------------------------------ */

.ver-detail[b-yvhq229b81] {
    background: var(--qq-admin-card);
    border: 1px solid var(--qq-admin-border);
    border-radius: 16px;
    padding: 1rem 1.1rem;
    min-width: 0;
}

.ver-detail-head[b-yvhq229b81] {
    display: flex;
    align-items: center;
    gap: 0.7rem;
    flex-wrap: wrap;
    padding-bottom: 0.8rem;
    border-bottom: 1px solid var(--qq-admin-hairline, var(--qq-admin-border));
    margin-bottom: 0.9rem;
}

.ver-detail-title[b-yvhq229b81] {
    min-width: 0;
    flex: 1;
}

.ver-detail-link[b-yvhq229b81] {
    color: var(--qq-info-fg, #39627e);
}

.ver-docs[b-yvhq229b81] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(310px, 1fr));
    gap: 0.9rem;
}

.ver-doc[b-yvhq229b81] {
    border: 1px solid var(--qq-admin-border);
    border-radius: 13px;
    padding: 0.7rem 0.8rem;
    display: flex;
    flex-direction: column;
    gap: 0.55rem;
    min-width: 0;
}

.ver-doc.is-missing[b-yvhq229b81] {
    border-style: dashed;
    background: transparent;
}

.ver-doc-head[b-yvhq229b81] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
}

.ver-doc-type[b-yvhq229b81] {
    font-family: var(--qq-admin-mono);
    font-size: 0.64rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--qq-admin-muted);
}

.ver-doc-preview[b-yvhq229b81] {
    position: relative;
    display: block;
    border-radius: 10px;
    overflow: hidden;
    border: 1px solid var(--qq-admin-border);
    cursor: zoom-in;
}

.ver-doc-preview img[b-yvhq229b81] {
    width: 100%;
    height: 150px;
    object-fit: cover;
    display: block;
}

.ver-doc-tag[b-yvhq229b81] {
    position: absolute;
    top: 6px;
    right: 6px;
    font-family: var(--qq-admin-mono);
    font-size: 0.6rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    background: rgba(33, 29, 24, 0.75);
    color: #fbf8f1;
    border-radius: 4px;
    padding: 0.15rem 0.4rem;
}

/* The previous reviewer's words — the seller read exactly this. */
.ver-doc-note[b-yvhq229b81] {
    font-size: 0.78rem;
    color: var(--qq-bad-fg, #93381f);
    background: var(--qq-admin-accent-tint, #f6e5df);
    border-left: 3px solid var(--qq-admin-accent);
    border-radius: 0 8px 8px 0;
    padding: 0.4rem 0.6rem;
    line-height: 1.4;
}

.ver-doc-actions[b-yvhq229b81] {
    display: flex;
    gap: 0.45rem;
}

.ver-doc-actions .admin-approve[b-yvhq229b81] {
    flex: 1;
}

.ver-doc-approved[b-yvhq229b81] {
    font-family: var(--qq-admin-mono);
    font-size: 0.72rem;
    color: #3f7d4e;
}

.ver-reject[b-yvhq229b81] {
    display: flex;
    flex-direction: column;
    gap: 0.45rem;
}

.ver-reject textarea[b-yvhq229b81] {
    font-size: 0.82rem;
    resize: vertical;
}

.ver-reject-actions[b-yvhq229b81] {
    display: flex;
    justify-content: flex-end;
    gap: 0.45rem;
}

.ver-doc-empty[b-yvhq229b81] {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 150px;
    border: 2px dashed var(--qq-admin-border);
    border-radius: 10px;
    color: var(--qq-admin-faint);
    font-size: 0.82rem;
}

.ver-doc-hint[b-yvhq229b81] {
    font-size: 0.74rem;
    color: var(--qq-admin-faint);
}

/* --- The moment a store goes live ------------------------------------------ */

.ver-live-banner[b-yvhq229b81] {
    background: #e8f0e6;
    border: 1px solid #cfe0cb;
    color: #3f7d4e;
    border-radius: 12px;
    padding: 0.7rem 1rem;
    font-size: 0.86rem;
    font-weight: 600;
    margin-bottom: 0.9rem;
}

/* --- Waiting / verified ---------------------------------------------------- */

.ver-framing[b-yvhq229b81] {
    font-size: 0.83rem;
    color: var(--qq-admin-muted);
    max-width: 70ch;
    margin: 0 0 0.9rem;
}

.ver-verified-head[b-yvhq229b81] {
    display: flex;
    margin-bottom: 0.8rem;
}

/* --- Mobile ---------------------------------------------------------------- */

@media (max-width: 900px) {
    .ver-split[b-yvhq229b81] {
        grid-template-columns: minmax(0, 1fr);
    }

    .ver-doc-actions .qq-btn-sm[b-yvhq229b81],
    .ver-reject-actions .qq-btn-sm[b-yvhq229b81] {
        min-height: 44px;
    }
}
/* /Components/Admin/BlockedSlotReviewDialog.razor.rz.scp.css */
.qq-review-backdrop[b-7fnjoukfd5] {
    position: fixed;
    inset: 0;
    background: rgba(23, 21, 18, .55);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1090; /* above the notification dropdown (1080-ish bootstrap) */
    padding: 1rem;
}

.qq-review-card[b-7fnjoukfd5] {
    background: var(--qq-admin-card, #fff);
    color: var(--qq-admin-ink, #171512);
    border-radius: 14px;
    padding: 1.5rem 1.6rem;
    max-width: 32rem;
    width: 100%;
    box-shadow: 0 16px 56px rgba(0, 0, 0, .35);
}

.qq-review-badge[b-7fnjoukfd5] {
    width: 2.4rem;
    height: 2.4rem;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.15rem;
    background: rgba(217, 169, 78, .18);
    color: #b07d1e;
    margin-bottom: .7rem;
}

.qq-review-title[b-7fnjoukfd5] {
    font-size: 1.08rem;
    font-weight: 700;
    margin: 0 0 .4rem;
}

.qq-review-lead[b-7fnjoukfd5] {
    font-size: .9rem;
    color: var(--qq-admin-muted, #6b6459);
    margin: 0 0 .7rem;
}

.qq-review-list[b-7fnjoukfd5] {
    margin: 0 0 1rem;
    padding-left: 1.1rem;
    font-size: .86rem;
    display: flex;
    flex-direction: column;
    gap: .45rem;
}

.qq-review-more[b-7fnjoukfd5] {
    color: var(--qq-admin-muted, #6b6459);
    list-style: none;
}

.qq-review-actions[b-7fnjoukfd5] {
    display: flex;
    gap: .6rem;
    flex-wrap: wrap;
}
/* /Components/Admin/BlockedWindowsPanel.razor.rz.scp.css */
/* Blocked windows panel (spec 051, handoff blockedwindow.zip). Admin v3 tokens
   throughout; the two fixed hexes are the brass kind chip and the green toast
   dot, fixed in the handoff for both themes and paired with fixed ink. */

.bw-card[b-2rcxewa6fq] {
    background: var(--qq-admin-card);
    border: 1px solid var(--qq-admin-border);
    border-radius: 16px;
    overflow: hidden;
    margin-bottom: 22px;
}

/* --- Header ----------------------------------------------------------------- */

.bw-head[b-2rcxewa6fq] {
    padding: 20px 22px 0;
    display: flex;
    align-items: flex-start;
    gap: 18px;
}

.bw-eyebrow[b-2rcxewa6fq] {
    font-family: var(--qq-admin-mono);
    font-size: 0.6rem;
    font-weight: 700;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--qq-admin-faint);
}

.bw-title[b-2rcxewa6fq] {
    font-family: 'Instrument Serif', Georgia, serif;
    font-weight: 400;
    font-size: 1.7rem;
    letter-spacing: -0.01em;
    line-height: 1.15;
    margin: 4px 0 0;
}

.bw-sub[b-2rcxewa6fq] {
    font-size: 0.82rem;
    color: var(--qq-admin-muted);
    margin-top: 3px;
}

.bw-total[b-2rcxewa6fq] {
    text-align: right;
    flex-shrink: 0;
    margin-left: auto;
}

.bw-total-n[b-2rcxewa6fq] {
    font-family: var(--qq-admin-mono);
    font-size: 1.9rem;
    font-weight: 700;
    line-height: 1;
}

.bw-total-l[b-2rcxewa6fq] {
    font-family: var(--qq-admin-mono);
    font-size: 0.6rem;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--qq-admin-faint);
    margin-top: 5px;
}

/* Phone only: reveals the checkboxes. */
.bw-select-toggle[b-2rcxewa6fq] {
    display: none;
}

/* --- Segments ---------------------------------------------------------------- */

.bw-segs-row[b-2rcxewa6fq] {
    padding: 16px 22px 0;
}

.bw-segs[b-2rcxewa6fq] {
    display: inline-flex;
    gap: 2px;
    background: var(--qq-admin-input);
    border: 1px solid var(--qq-admin-border);
    border-radius: 10px;
    padding: 3px;
    max-width: 100%;
    overflow-x: auto;
}

.bw-seg[b-2rcxewa6fq] {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 7px 13px;
    border-radius: 8px;
    border: none;
    background: transparent;
    color: var(--qq-admin-muted);
    font-family: inherit;
    font-size: 0.8rem;
    font-weight: 600;
    white-space: nowrap;
    cursor: pointer;
}

.bw-seg.is-active[b-2rcxewa6fq] {
    background: var(--qq-admin-card);
    color: var(--qq-admin-ink);
    box-shadow: 0 1px 2px rgba(23, 21, 18, 0.08);
}

.bw-seg-count[b-2rcxewa6fq] {
    font-family: var(--qq-admin-mono);
    font-size: 0.64rem;
    font-weight: 700;
    color: var(--qq-admin-faint);
}

.bw-seg.is-active .bw-seg-count[b-2rcxewa6fq] {
    color: var(--qq-admin-accent);
}

/* --- Filters ---------------------------------------------------------------- */

.bw-filters[b-2rcxewa6fq] {
    padding: 12px 22px 16px;
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.bw-search[b-2rcxewa6fq] {
    display: flex;
    align-items: center;
    gap: 9px;
    flex: 1 1 240px;
    min-width: 240px;
    background: var(--qq-admin-input);
    border: 1px solid var(--qq-admin-border);
    border-radius: 10px;
    padding: 9px 14px;
}

.bw-search svg[b-2rcxewa6fq] {
    width: 15px;
    height: 15px;
    color: var(--qq-admin-faint);
    flex-shrink: 0;
}

.bw-search input[b-2rcxewa6fq] {
    flex: 1;
    min-width: 0;
    border: none;
    outline: none;
    background: transparent;
    font-family: inherit;
    font-size: 0.85rem;
    color: var(--qq-admin-ink);
}

.bw-filter-scroll[b-2rcxewa6fq] {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.bw-select[b-2rcxewa6fq] {
    border: 1px solid var(--qq-admin-border);
    background: var(--qq-admin-input);
    color: var(--qq-admin-ink);
    border-radius: 10px;
    padding: 9px 12px;
    font-family: inherit;
    font-size: 0.85rem;
    min-width: 176px;
    cursor: pointer;
}

.bw-dates[b-2rcxewa6fq] {
    display: flex;
    align-items: center;
    gap: 8px;
    background: var(--qq-admin-input);
    border: 1px solid var(--qq-admin-border);
    border-radius: 10px;
    padding: 4px 10px;
}

.bw-dates svg[b-2rcxewa6fq] {
    width: 15px;
    height: 15px;
    color: var(--qq-admin-faint);
    flex-shrink: 0;
}

.bw-dates-arrow[b-2rcxewa6fq] {
    color: var(--qq-admin-faint);
    font-size: 0.75rem;
}

.bw-clear[b-2rcxewa6fq] {
    border: none;
    background: transparent;
    font-family: inherit;
    font-size: 0.82rem;
    font-weight: 600;
    color: var(--qq-brass);
    cursor: pointer;
    padding: 8px 4px;
}

/* --- Table ------------------------------------------------------------------ */

.bw-grid[b-2rcxewa6fq] {
    display: grid;
    grid-template-columns: 34px 92px 100px minmax(0, 1.15fr) 128px minmax(0, 1.3fr) minmax(0, 1.1fr) minmax(0, 1.35fr) 92px;
    gap: 14px;
    align-items: center;
    padding: 13px 22px;
    border-bottom: 1px solid var(--qq-admin-divider);
}

.bw-grid-head[b-2rcxewa6fq] {
    padding: 11px 22px;
    background: var(--qq-admin-row, var(--qq-admin-shell));
    border-top: 1px solid var(--qq-admin-border);
    border-bottom-color: var(--qq-admin-border);
    font-family: var(--qq-admin-mono);
    font-size: 0.6rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--qq-admin-faint);
}

.bw-row:hover[b-2rcxewa6fq] {
    background: var(--qq-admin-row, var(--qq-admin-shell));
}

.bw-row.is-selected[b-2rcxewa6fq] {
    background: var(--qq-brass-tint);
}

.c-action[b-2rcxewa6fq] {
    text-align: right;
    justify-self: end;
}

.bw-check[b-2rcxewa6fq] {
    width: 17px;
    height: 17px;
    border-radius: 5px;
    border: 1.5px solid var(--qq-admin-border);
    background: transparent;
    color: #fffdf8;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 11px;
    line-height: 1;
    cursor: pointer;
    padding: 0;
}

.bw-check.is-on[b-2rcxewa6fq] {
    background: var(--qq-admin-accent);
    border-color: var(--qq-admin-accent);
}

.bw-chip[b-2rcxewa6fq] {
    display: inline-block;
    font-family: var(--qq-admin-mono);
    font-size: 0.6rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    padding: 4px 8px;
    border-radius: 6px;
    border: 1px solid var(--qq-admin-border);
    background: var(--qq-admin-input);
    color: var(--qq-admin-muted);
    white-space: nowrap;
}

.bw-chip.is-departure[b-2rcxewa6fq] {
    background: #f5ebd6;
    border-color: #e6d9b8;
    color: #7a5410;
}

.bw-code[b-2rcxewa6fq] {
    font-family: var(--qq-admin-mono);
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.04em;
}

.bw-store[b-2rcxewa6fq] {
    font-size: 0.82rem;
    font-weight: 600;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.bw-when[b-2rcxewa6fq] {
    font-family: var(--qq-admin-mono);
    font-size: 0.72rem;
    line-height: 1.35;
    cursor: help;
    display: flex;
    flex-direction: column;
}

.bw-what[b-2rcxewa6fq] {
    font-size: 0.82rem;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.bw-who[b-2rcxewa6fq] {
    font-size: 0.78rem;
    color: var(--qq-admin-muted);
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.bw-who.is-admin[b-2rcxewa6fq] {
    color: var(--qq-brass);
    font-weight: 600;
}

.bw-reason[b-2rcxewa6fq] {
    font-size: 0.78rem;
    color: var(--qq-admin-muted);
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.bw-release[b-2rcxewa6fq] {
    border: 1px solid color-mix(in srgb, var(--qq-bad-fg) 35%, transparent);
    color: var(--qq-bad-fg);
    background: transparent;
    font-family: inherit;
    font-size: 0.78rem;
    font-weight: 600;
    padding: 6px 13px;
    border-radius: 9px;
    cursor: pointer;
    white-space: nowrap;
}

.bw-release:hover:not(:disabled)[b-2rcxewa6fq] {
    background: var(--qq-bad-bg);
}

.bw-empty[b-2rcxewa6fq] {
    padding: 56px 22px;
    text-align: center;
}

.bw-empty-title[b-2rcxewa6fq] {
    font-size: 0.9rem;
    font-weight: 600;
}

.bw-empty-sub[b-2rcxewa6fq] {
    font-size: 0.82rem;
    color: var(--qq-admin-muted);
    margin-top: 6px;
}

/* --- Footer ----------------------------------------------------------------- */

.bw-foot[b-2rcxewa6fq] {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 14px 22px;
    background: var(--qq-admin-row, var(--qq-admin-shell));
    border-top: 1px solid var(--qq-admin-border);
    flex-wrap: wrap;
}

.bw-release-many[b-2rcxewa6fq] {
    background: var(--qq-admin-accent);
    color: #fffdf8;
    border: none;
    font-family: inherit;
    font-size: 0.82rem;
    font-weight: 700;
    padding: 9px 16px;
    border-radius: 10px;
    cursor: pointer;
    white-space: nowrap;
}

.bw-deselect[b-2rcxewa6fq] {
    border: none;
    background: transparent;
    font-family: inherit;
    font-size: 0.78rem;
    color: var(--qq-admin-muted);
    cursor: pointer;
}

.bw-pager-label[b-2rcxewa6fq] {
    margin-left: auto;
    font-family: var(--qq-admin-mono);
    font-size: 0.72rem;
    color: var(--qq-admin-muted);
}

.bw-pager[b-2rcxewa6fq] {
    display: flex;
    gap: 6px;
}

.bw-pager-btn[b-2rcxewa6fq] {
    width: 30px;
    height: 30px;
    border: 1px solid var(--qq-admin-border);
    border-radius: 9px;
    background: transparent;
    color: var(--qq-admin-ink);
    font-size: 0.9rem;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.bw-pager-btn:disabled[b-2rcxewa6fq] {
    color: var(--qq-admin-faint);
    cursor: default;
}

/* --- Phone: filters stack, rows become cards, checkboxes behind Select ------ */

@media (max-width: 900px) {
    .bw-head[b-2rcxewa6fq] {
        padding: 16px 14px 0;
        align-items: center;
    }

    .bw-total[b-2rcxewa6fq] {
        display: none;
    }

    .bw-select-toggle[b-2rcxewa6fq] {
        display: inline-flex;
        border: 1px solid var(--qq-admin-border);
        background: transparent;
        color: var(--qq-admin-ink);
        font-family: inherit;
        font-size: 0.78rem;
        font-weight: 600;
        padding: 7px 12px;
        border-radius: 99px;
        cursor: pointer;
        flex-shrink: 0;
    }

    .bw-select-toggle.is-on[b-2rcxewa6fq] {
        background: var(--qq-admin-ink);
        color: var(--qq-admin-btn-fg);
        border-color: var(--qq-admin-ink);
    }

    .bw-segs-row[b-2rcxewa6fq] {
        padding: 12px 14px 0;
    }

    .bw-segs[b-2rcxewa6fq] {
        display: flex;
        background: transparent;
        border: none;
        padding: 0;
        gap: 6px;
    }

    .bw-seg[b-2rcxewa6fq] {
        background: var(--qq-admin-card);
        border: 1px solid var(--qq-admin-border);
    }

    .bw-seg.is-active[b-2rcxewa6fq] {
        background: var(--qq-admin-ink);
        color: var(--qq-admin-btn-fg);
        border-color: var(--qq-admin-ink);
        box-shadow: none;
    }

    .bw-seg.is-active .bw-seg-count[b-2rcxewa6fq] {
        color: #d9a94e;
    }

    .bw-filters[b-2rcxewa6fq] {
        padding: 10px 14px 12px;
    }

    .bw-search[b-2rcxewa6fq] {
        flex-basis: 100%;
    }

    .bw-filter-scroll[b-2rcxewa6fq] {
        width: 100%;
        flex-wrap: nowrap;
        overflow-x: auto;
        padding-bottom: 2px;
    }

    .bw-select[b-2rcxewa6fq] {
        min-width: 150px;
    }

    .bw-dates[b-2rcxewa6fq] {
        flex-shrink: 0;
    }

    .bw-grid-head[b-2rcxewa6fq] {
        display: none;
    }

    .bw-table[b-2rcxewa6fq] {
        padding: 0 12px 12px;
        display: flex;
        flex-direction: column;
        gap: 10px;
    }

    .bw-grid.bw-row[b-2rcxewa6fq] {
        grid-template-columns: 0 1fr;
        grid-template-areas:
            "check kind"
            "check store"
            "check what"
            "check who"
            "check action";
        gap: 4px 0;
        padding: 13px 14px;
        border: 1px solid var(--qq-admin-border);
        border-radius: 14px;
        background: var(--qq-admin-card);
        align-items: start;
    }

    .bw-table.is-selecting .bw-grid.bw-row[b-2rcxewa6fq] {
        grid-template-columns: 28px 1fr;
    }

    .c-check[b-2rcxewa6fq] { grid-area: check; }
    .c-kind[b-2rcxewa6fq] { grid-area: kind; display: flex; align-items: center; gap: 8px; }
    .c-code[b-2rcxewa6fq] { grid-area: kind; justify-self: end; }
    .c-store[b-2rcxewa6fq] { grid-area: store; font-weight: 400; font-size: 0.75rem; color: var(--qq-admin-muted); }
    .c-when[b-2rcxewa6fq] { grid-area: store; justify-self: end; flex-direction: row; gap: 6px; }
    .c-what[b-2rcxewa6fq] { grid-area: what; white-space: normal; }
    .c-who[b-2rcxewa6fq] { grid-area: who; }
    .c-reason[b-2rcxewa6fq] { grid-area: who; justify-self: end; max-width: 55%; }
    .c-action[b-2rcxewa6fq] { grid-area: action; justify-self: stretch; margin-top: 6px; }

    .c-check .bw-check[b-2rcxewa6fq] {
        display: none;
        width: 19px;
        height: 19px;
    }

    .bw-table.is-selecting .c-check .bw-check[b-2rcxewa6fq] {
        display: inline-flex;
    }

    .c-action .bw-release[b-2rcxewa6fq] {
        width: 100%;
        padding: 9px 13px;
    }

    .bw-foot.has-selection[b-2rcxewa6fq] {
        position: sticky;
        bottom: 0;
        z-index: 5;
    }

    .bw-release-many[b-2rcxewa6fq] {
        flex: 1 1 100%;
    }
}
/* /Components/Admin/CampaignPreviews/CampaignPreviewBanner.razor.rz.scp.css */
/* Buyer-kit picture: fixed hex on purpose (see the component comment). */
.cpv-frame[b-8fgq6wnrr5] {
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 8px 24px rgba(23, 21, 18, 0.14);
    background: #faf8f4;
    color: #171512;
    font-family: 'Space Grotesk', Helvetica, Arial, sans-serif;
}

.cpv-bar[b-8fgq6wnrr5] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 9px 14px;
    background: #171512;
    color: #f2e9d8;
    font-size: 12.5px;
    line-height: 1.3;
}

.cpv-bar.is-urgent[b-8fgq6wnrr5] {
    background: #bf4c2e;
    color: #fff;
}

.cpv-tag[b-8fgq6wnrr5] {
    font-family: 'Space Mono', Consolas, monospace;
    font-size: 9.5px;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    border: 1px solid currentColor;
    padding: 2px 6px;
    border-radius: 4px;
    opacity: 0.9;
    white-space: nowrap;
}

.cpv-line[b-8fgq6wnrr5] {
    flex: 1;
    min-width: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.cpv-cta[b-8fgq6wnrr5] {
    font-weight: 700;
    text-decoration: underline;
    white-space: nowrap;
}

.cpv-x[b-8fgq6wnrr5] {
    opacity: 0.7;
}

.cpv-nav[b-8fgq6wnrr5] {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 12px 14px;
    font-size: 12px;
    color: #4f483d;
}

.cpv-brand[b-8fgq6wnrr5] {
    font-weight: 700;
    color: #171512;
}

.cpv-signin[b-8fgq6wnrr5] {
    margin-left: auto;
    border: 1px solid #ddd4c1;
    border-radius: 99px;
    padding: 4px 10px;
    font-weight: 600;
    color: #171512;
}

.cpv-page[b-8fgq6wnrr5] {
    padding: 16px 14px 22px;
}

.cpv-block-line[b-8fgq6wnrr5] {
    height: 12px;
    width: 60%;
    background: #e7e0d1;
    border-radius: 4px;
    margin-bottom: 8px;
}

.cpv-block-box[b-8fgq6wnrr5] {
    height: 30px;
    background: #efe9db;
    border-radius: 8px;
}
/* /Components/Admin/CampaignPreviews/CampaignPreviewEmail.razor.rz.scp.css */
/* An email: fixed hex on purpose (see the component comment). */
.cpv-frame[b-l3cqvd9n0f] {
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 8px 24px rgba(23, 21, 18, 0.14);
    background: #faf8f4;
    color: #171512;
    font-family: 'Space Grotesk', Helvetica, Arial, sans-serif;
}

.cpv-head[b-l3cqvd9n0f] {
    background: #171512;
    padding: 14px 18px;
    display: flex;
    align-items: center;
    gap: 8px;
}

.cpv-brand[b-l3cqvd9n0f] {
    font-weight: 700;
    font-size: 14px;
    color: #fbf8f1;
}

.cpv-digest[b-l3cqvd9n0f] {
    margin-left: auto;
    font-family: 'Space Mono', Consolas, monospace;
    font-size: 9.5px;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: #c9a457;
}

.cpv-image[b-l3cqvd9n0f] {
    height: 100px;
    background: #3d5a40 center / cover no-repeat;
}

.cpv-image-placeholder[b-l3cqvd9n0f] {
    background: linear-gradient(135deg, #3d5a40, #9a6b1e);
}

.cpv-body[b-l3cqvd9n0f] {
    padding: 20px 18px;
}

.cpv-title[b-l3cqvd9n0f] {
    font-size: 18px;
    font-weight: 700;
    letter-spacing: -0.02em;
    color: #171512;
    line-height: 1.25;
}

.cpv-text[b-l3cqvd9n0f] {
    font-size: 13px;
    color: #4f483d;
    line-height: 1.5;
    margin-top: 8px;
}

.cpv-btn[b-l3cqvd9n0f] {
    display: inline-block;
    margin-top: 14px;
    background: #171512;
    color: #f7f3ea;
    font-size: 13px;
    font-weight: 600;
    padding: 9px 16px;
    border-radius: 9px;
}

.cpv-foot[b-l3cqvd9n0f] {
    padding: 12px 18px 16px;
    border-top: 1px solid #ece5d6;
    font-size: 10.5px;
    color: #8b8272;
    line-height: 1.45;
}
/* /Components/Admin/CampaignPreviews/CampaignPreviewModal.razor.rz.scp.css */
/* Buyer-kit picture: fixed hex on purpose (see the component comment). */
.cpv-frame[b-opsxt0v3cr] {
    position: relative;
    min-height: 380px;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 8px 24px rgba(23, 21, 18, 0.14);
    background: #faf8f4;
    color: #171512;
    font-family: 'Space Grotesk', Helvetica, Arial, sans-serif;
}

.cpv-nav[b-opsxt0v3cr] {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 12px 14px;
    font-size: 12px;
    color: #4f483d;
    opacity: 0.5;
}

.cpv-brand[b-opsxt0v3cr] {
    font-weight: 700;
    color: #171512;
}

.cpv-scrim[b-opsxt0v3cr] {
    position: absolute;
    inset: 0;
    background: rgba(23, 21, 18, 0.45);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
}

.cpv-card[b-opsxt0v3cr] {
    width: 100%;
    max-width: 340px;
    background: #faf8f4;
    border-radius: 14px;
    overflow: hidden;
    box-shadow: 0 24px 60px rgba(0, 0, 0, 0.3);
}

.cpv-image[b-opsxt0v3cr] {
    height: 110px;
    background: #3d5a40 center / cover no-repeat;
}

.cpv-image-placeholder[b-opsxt0v3cr] {
    background: linear-gradient(135deg, #3d5a40, #9a6b1e);
    display: flex;
    align-items: flex-end;
    padding: 10px 14px;
}

.cpv-image-placeholder span[b-opsxt0v3cr] {
    font-family: 'Space Mono', Consolas, monospace;
    font-size: 9.5px;
    letter-spacing: 0.08em;
    color: #fff;
    opacity: 0.85;
}

.cpv-body[b-opsxt0v3cr] {
    padding: 18px 20px 20px;
}

.cpv-eyebrow[b-opsxt0v3cr] {
    font-family: 'Space Mono', Consolas, monospace;
    font-size: 10px;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #9a6b1e;
}

.cpv-title[b-opsxt0v3cr] {
    font-size: 19px;
    font-weight: 700;
    letter-spacing: -0.02em;
    margin: 5px 0 7px;
    line-height: 1.2;
    color: #171512;
}

.cpv-text[b-opsxt0v3cr] {
    font-size: 13px;
    color: #4f483d;
    line-height: 1.5;
}

.cpv-actions[b-opsxt0v3cr] {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-top: 16px;
}

.cpv-btn[b-opsxt0v3cr] {
    background: #171512;
    color: #f7f3ea;
    font-size: 13px;
    font-weight: 600;
    padding: 9px 16px;
    border-radius: 9px;
}

.cpv-notnow[b-opsxt0v3cr] {
    font-size: 12.5px;
    color: #6f6757;
}
/* /Components/Admin/CampaignPreviews/CampaignPreviewPush.razor.rz.scp.css */
/* A phone, not the buyer kit: fixed hex on purpose (see the component comment). */
.cpv-phone[b-80dupduelt] {
    margin: 0 auto;
    width: 300px;
    max-width: 100%;
    border-radius: 30px;
    background: #0d0d10;
    padding: 40px 12px 60px;
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.35);
    font-family: -apple-system, system-ui, 'Segoe UI', Roboto, sans-serif;
    color: #fff;
}

.cpv-clock[b-80dupduelt] {
    text-align: center;
}

.cpv-date[b-80dupduelt] {
    font-size: 13px;
    opacity: 0.8;
    text-transform: capitalize;
}

.cpv-time[b-80dupduelt] {
    font-size: 54px;
    font-weight: 300;
    line-height: 1;
    margin-top: 2px;
}

.cpv-notif[b-80dupduelt] {
    margin-top: 36px;
    background: rgba(255, 255, 255, 0.14);
    backdrop-filter: blur(10px);
    border-radius: 18px;
    padding: 12px 14px;
    display: flex;
    gap: 10px;
}

.cpv-icon[b-80dupduelt] {
    width: 34px;
    height: 34px;
    border-radius: 9px;
    background: #faf8f4;
    display: flex;
    align-items: center;
    justify-content: center;
    flex: none;
}

.cpv-notif-body[b-80dupduelt] {
    flex: 1;
    min-width: 0;
}

.cpv-notif-head[b-80dupduelt] {
    display: flex;
    justify-content: space-between;
    font-size: 11px;
    opacity: 0.7;
}

.cpv-title[b-80dupduelt] {
    display: block;
    font-size: 14px;
    font-weight: 600;
    margin-top: 1px;
}

.cpv-text[b-80dupduelt] {
    display: block;
    font-size: 13px;
    line-height: 1.35;
    opacity: 0.9;
}

.cpv-note[b-80dupduelt] {
    margin-top: 8px;
    font-size: 11px;
    color: rgba(255, 255, 255, 0.5);
    text-align: center;
}
/* /Components/Admin/CampaignPreviews/CampaignPreviewToast.razor.rz.scp.css */
/* Buyer-kit picture: fixed hex on purpose (see the component comment). */
.cpv-frame[b-8ld373i119] {
    position: relative;
    min-height: 380px;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 8px 24px rgba(23, 21, 18, 0.14);
    background: #faf8f4;
    color: #171512;
    font-family: 'Space Grotesk', Helvetica, Arial, sans-serif;
}

.cpv-nav[b-8ld373i119] {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 12px 14px;
    font-size: 12px;
    color: #4f483d;
}

.cpv-brand[b-8ld373i119] {
    font-weight: 700;
    color: #171512;
}

.cpv-page[b-8ld373i119] {
    padding: 0 14px;
}

.cpv-block-line[b-8ld373i119] {
    height: 12px;
    width: 50%;
    background: #e7e0d1;
    border-radius: 4px;
    margin-bottom: 8px;
}

.cpv-block-box[b-8ld373i119] {
    height: 90px;
    background: #efe9db;
    border-radius: 8px;
}

.cpv-toast[b-8ld373i119] {
    position: absolute;
    right: 14px;
    bottom: 14px;
    width: 300px;
    max-width: calc(100% - 28px);
    background: #171512;
    color: #efe7d7;
    border-radius: 12px;
    padding: 14px 16px;
    box-shadow: 0 16px 40px rgba(0, 0, 0, 0.3);
    display: flex;
    gap: 12px;
}

.cpv-symbol[b-8ld373i119] {
    flex: none;
    margin-top: 2px;
}

.cpv-toast-body[b-8ld373i119] {
    flex: 1;
    min-width: 0;
}

.cpv-title[b-8ld373i119] {
    font-size: 13.5px;
    font-weight: 700;
}

.cpv-text[b-8ld373i119] {
    font-size: 12px;
    color: #b3a992;
    line-height: 1.45;
    margin-top: 3px;
}

.cpv-cta[b-8ld373i119] {
    font-size: 12.5px;
    font-weight: 700;
    color: #c9a457;
    margin-top: 8px;
}

.cpv-x[b-8ld373i119] {
    color: #8a8272;
    font-size: 12px;
}
/* /Components/Admin/VerificationDirectoryPanel.razor.rz.scp.css */
/* Verification directory panel. Sits above the queue; collapsed by default so
   the pending sellers stay the first thing on the page. */

.vdir[b-xyyd3kj6of] {
    background: var(--qq-admin-card);
    border: 1px solid var(--qq-admin-border);
    border-radius: 14px;
    margin-bottom: 1rem;
    overflow: hidden;
}

.vdir-toggle[b-xyyd3kj6of] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    width: 100%;
    text-align: left;
    background: none;
    border: none;
    padding: 0.85rem 1.1rem;
    cursor: pointer;
    color: inherit;
}

.vdir-toggle-title[b-xyyd3kj6of] {
    font-size: 0.9rem;
    font-weight: 700;
}

.vdir-toggle-hint[b-xyyd3kj6of] {
    font-size: 0.78rem;
    color: var(--qq-admin-muted);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.vdir-caret[b-xyyd3kj6of] {
    margin-left: auto;
    color: var(--qq-admin-faint);
}

.vdir-body[b-xyyd3kj6of] {
    padding: 0 1.1rem 1rem;
    /* Full-width strip above the tabs (verification handoff): Canada-wide
       left, the province picker right, instead of stacking. */
    display: grid;
    grid-template-columns: 5fr 7fr;
    gap: 0 1.6rem;
}

.vdir-disclaimer[b-xyyd3kj6of] {
    grid-column: 1 / -1;
}

@media (max-width: 900px) {
    .vdir-body[b-xyyd3kj6of] {
        grid-template-columns: minmax(0, 1fr);
    }
}

.vdir-heading[b-xyyd3kj6of] {
    font-family: var(--qq-admin-mono);
    font-size: 0.62rem;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--qq-admin-muted);
    margin: 0.9rem 0 0.5rem;
}

.vdir-chips[b-xyyd3kj6of] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    margin-bottom: 0.7rem;
}

.vdir-chip[b-xyyd3kj6of] {
    font-size: 0.78rem;
    background: var(--qq-admin-inset, var(--qq-admin-bar-soft));
    border: 1px solid var(--qq-admin-border);
    border-radius: 99px;
    padding: 0.3rem 0.7rem;
    cursor: pointer;
    color: inherit;
    /* 44px touch targets on phones would double the block's height for a
       reference panel; these stay compact and the row wraps instead. */
}

.vdir-chip.is-active[b-xyyd3kj6of] {
    background: var(--qq-admin-accent);
    border-color: var(--qq-admin-accent);
    color: var(--qq-admin-btn-fg, #fff);
    font-weight: 600;
}

.vdir-row[b-xyyd3kj6of] {
    display: grid;
    grid-template-columns: 7.5rem minmax(0, 1fr);
    gap: 0.15rem 0.8rem;
    padding: 0.5rem 0;
    border-top: 1px solid var(--qq-admin-hairline, var(--qq-admin-border));
    font-size: 0.83rem;
}

.vdir-layer[b-xyyd3kj6of] {
    font-family: var(--qq-admin-mono);
    font-size: 0.66rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--qq-admin-faint);
    padding-top: 0.15rem;
}

.vdir-links[b-xyyd3kj6of] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem 1.1rem;
}

.vdir-none[b-xyyd3kj6of] {
    color: var(--qq-admin-muted);
    font-style: italic;
}

.vdir-note[b-xyyd3kj6of] {
    grid-column: 2;
    font-size: 0.76rem;
    color: var(--qq-admin-muted);
    line-height: 1.45;
    max-width: 70ch;
}

.vdir-disclaimer[b-xyyd3kj6of] {
    font-size: 0.72rem;
    color: var(--qq-admin-faint);
    margin: 0.9rem 0 0;
}

@media (max-width: 700px) {
    .vdir-row[b-xyyd3kj6of] {
        grid-template-columns: minmax(0, 1fr);
    }

    .vdir-note[b-xyyd3kj6of] {
        grid-column: 1;
    }

    .vdir-toggle-hint[b-xyyd3kj6of] {
        display: none;
    }
}
/* /Components/Buyer/AppointmentSummary.razor.rz.scp.css */
/* 2b · Booking summary. Desktop: details left, code + payment right. Mobile:
   one column with the code card promoted above the details. */

.qq-as-back[b-pf61qg0lxc] {
    font-size: .85rem;
    font-weight: 600;
}

.qq-as-banner[b-pf61qg0lxc] {
    display: flex;
    align-items: center;
    gap: 14px;
    background: var(--qq-ok-bg);
    border: 1px solid var(--qq-border);
    border-radius: 16px;
    padding: 16px 18px;
    margin-top: 12px;
}

.qq-as-banner-check[b-pf61qg0lxc] {
    width: 44px;
    height: 44px;
    border-radius: 99px;
    background: var(--qq-card);
    color: var(--qq-ok-fg);
    display: flex;
    align-items: center;
    justify-content: center;
    flex: none;
}

.qq-as-banner-title[b-pf61qg0lxc] {
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--qq-ok-fg);
    letter-spacing: -.02em;
}

.qq-as-banner-text[b-pf61qg0lxc] {
    font-size: .8rem;
    color: var(--qq-text-body);
    line-height: 1.45;
    margin-top: 3px;
}

.qq-as-banner-close[b-pf61qg0lxc] {
    margin-left: auto;
    width: 30px;
    height: 30px;
    border-radius: 99px;
    border: 0;
    background: transparent;
    color: var(--qq-text-muted);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    flex: none;
}

.qq-as-head[b-pf61qg0lxc] {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    flex-wrap: wrap;
    margin: 14px 0 20px;
}

.qq-as-title-row[b-pf61qg0lxc] {
    display: flex;
    align-items: center;
    gap: 11px;
    flex-wrap: wrap;
}

.qq-as-title[b-pf61qg0lxc] {
    font-size: 1.6rem;
    letter-spacing: -.03em;
    margin: 0;
}

.qq-as-byline[b-pf61qg0lxc] {
    font-size: .85rem;
    color: var(--qq-text-muted);
    margin-top: 6px;
}

.qq-as-head-actions[b-pf61qg0lxc] {
    margin-left: auto;
    display: flex;
    gap: 9px;
    align-items: center;
}

.qq-as-grid[b-pf61qg0lxc] {
    display: grid;
    grid-template-columns: 1fr 330px;
    gap: 22px;
    align-items: start;
    max-width: 62rem;
}

.qq-as-main[b-pf61qg0lxc] {
    display: flex;
    flex-direction: column;
    gap: 14px;
    min-width: 0;
}

.qq-as-side[b-pf61qg0lxc] {
    display: flex;
    flex-direction: column;
    gap: 12px;
    min-width: 0;
}

.qq-as-service[b-pf61qg0lxc] {
    display: flex;
    gap: 16px;
    padding-bottom: 17px;
    border-bottom: 1px solid var(--qq-border-soft);
}

.qq-as-thumb[b-pf61qg0lxc] {
    width: 74px;
    height: 74px;
    border-radius: 14px;
    object-fit: cover;
    border: 1px solid var(--qq-border);
    flex: none;
}

.qq-as-thumb-empty[b-pf61qg0lxc] {
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--qq-brass-soft);
    color: var(--qq-text-faint);
}

.qq-as-service-name[b-pf61qg0lxc] {
    font-size: 1.05rem;
    font-weight: 700;
    letter-spacing: -.02em;
    line-height: 1.3;
    margin-top: 5px;
}

.qq-as-service-sub[b-pf61qg0lxc] {
    font-size: .8rem;
    color: var(--qq-text-muted);
    margin-top: 5px;
}

.qq-as-facts[b-pf61qg0lxc] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1px;
    background: var(--qq-border-soft);
    border-radius: 12px;
    overflow: hidden;
    margin-top: 17px;
}

.qq-as-fact[b-pf61qg0lxc] {
    background: var(--qq-card);
    padding: 13px 14px;
    min-width: 0;
}

.qq-as-fact-label[b-pf61qg0lxc] {
    font-family: var(--qq-admin-mono);
    font-size: .6rem;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--qq-text-faint);
    font-weight: 700;
}

.qq-as-fact-value[b-pf61qg0lxc] {
    font-size: .92rem;
    font-weight: 700;
    margin-top: 5px;
}

.qq-as-fact-sub[b-pf61qg0lxc] {
    font-size: .73rem;
    color: var(--qq-text-faint);
    margin-top: 2px;
}

/* SLOT HELD (amber) note replacing the on-the-day card while payment is due. */
.qq-as-note[b-pf61qg0lxc] {
    display: flex;
    gap: 12px;
    border-radius: 16px;
    padding: 16px 18px;
}

.qq-as-note-warn[b-pf61qg0lxc] {
    background: var(--qq-warn-bg);
    color: var(--qq-warn-fg);
}

.qq-as-note svg[b-pf61qg0lxc] {
    flex: none;
    margin-top: 1px;
}

.qq-as-note-title[b-pf61qg0lxc] {
    font-size: .92rem;
    font-weight: 700;
}

.qq-as-note-text[b-pf61qg0lxc] {
    font-size: .8rem;
    line-height: 1.5;
    margin-top: 3px;
    overflow-wrap: anywhere;
}

.qq-as-day-grid[b-pf61qg0lxc] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 13px;
}

.qq-as-day-item[b-pf61qg0lxc] {
    display: flex;
    gap: 10px;
    align-items: flex-start;
    font-size: .85rem;
    color: var(--qq-text-body);
    line-height: 1.5;
    min-width: 0;
}

.qq-as-day-item svg[b-pf61qg0lxc] {
    flex: none;
    margin-top: 1px;
}

/* Cancellation policy card with the actions inside it — consequence and
   action in one place, never a bare destructive button. */
.qq-as-policy[b-pf61qg0lxc] {
    background: var(--qq-brass-soft);
    border: 1px solid var(--qq-border);
    border-radius: 16px;
    padding: 18px;
}

.qq-as-policy-head[b-pf61qg0lxc] {
    display: flex;
    align-items: center;
    gap: 9px;
    margin-bottom: 10px;
    color: var(--qq-brass-deep);
    font-size: .92rem;
    font-weight: 700;
}

.qq-as-policy-text[b-pf61qg0lxc] {
    font-size: .8rem;
    color: var(--qq-text-body);
    line-height: 1.6;
}

.qq-as-policy-actions[b-pf61qg0lxc] {
    display: flex;
    gap: 9px;
    margin-top: 14px;
    flex-wrap: wrap;
}

.qq-as-policy-btn[b-pf61qg0lxc] {
    height: 38px;
    padding: 0 15px;
    border-radius: 99px;
    border: 1.5px solid var(--qq-border);
    background: var(--qq-card);
    color: var(--qq-brass-deep);
    display: flex;
    align-items: center;
    font-size: .8rem;
    font-weight: 600;
    cursor: pointer;
}

.qq-as-policy-btn.danger[b-pf61qg0lxc] {
    color: var(--qq-bad-fg);
}

/* The code card: ink surface in both themes — at the door it has to read
   from arm's length, so it gets the page's strongest contrast. */
.qq-as-code-card[b-pf61qg0lxc] {
    background: #171512;
    border-radius: 16px;
    padding: 20px;
    display: flex;
    flex-direction: column;
    gap: 13px;
}

.qq-as-code-label[b-pf61qg0lxc] {
    font-family: var(--qq-admin-mono);
    font-size: .6rem;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: #a39a88;
    font-weight: 700;
}

.qq-as-code[b-pf61qg0lxc] {
    font-family: var(--qq-admin-mono);
    font-size: 1.9rem;
    font-weight: 700;
    letter-spacing: .16em;
    color: #d9a94e;
    line-height: 1;
    overflow-wrap: anywhere;
}

.qq-as-copy[b-pf61qg0lxc] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    height: 44px;
    border-radius: 99px;
    border: 0;
    background: #d9a94e;
    color: #171512;
    font-size: .85rem;
    font-weight: 700;
    cursor: pointer;
}

.qq-as-copy.done[b-pf61qg0lxc] {
    background: #3d7a3f;
    color: #f2f7f0;
}

.qq-as-lines[b-pf61qg0lxc] {
    display: flex;
    flex-direction: column;
    gap: 9px;
}

.qq-as-line[b-pf61qg0lxc] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 10px;
    font-size: .85rem;
    color: var(--qq-text-muted);
}

.qq-as-line-total[b-pf61qg0lxc] {
    padding-top: 11px;
    border-top: 1px solid var(--qq-border-soft);
    color: var(--qq-text);
    font-weight: 700;
    font-size: .92rem;
}

.qq-mono[b-pf61qg0lxc] {
    font-family: var(--qq-admin-mono);
    font-variant-numeric: tabular-nums;
}

.qq-as-amount[b-pf61qg0lxc] {
    font-size: 1.3rem;
    font-weight: 700;
    color: var(--qq-brass-deep);
    line-height: 1;
}

.qq-as-paychip[b-pf61qg0lxc] {
    display: flex;
    align-items: center;
    gap: 9px;
    border-radius: 11px;
    padding: 10px 12px;
    margin-top: 14px;
    font-size: .78rem;
    font-weight: 600;
}

.qq-as-paychip.ok[b-pf61qg0lxc] {
    background: var(--qq-ok-bg);
    color: var(--qq-ok-fg);
}

.qq-as-paychip.warn[b-pf61qg0lxc] {
    background: var(--qq-warn-bg);
    color: var(--qq-warn-fg);
}

@media (max-width: 767.98px) {
    .qq-as-grid[b-pf61qg0lxc] {
        grid-template-columns: 1fr;
    }

    /* The code is the only thing that matters at the door — promote the whole
       side column above the details on phones. */
    .qq-as-side[b-pf61qg0lxc] {
        order: -1;
    }

    .qq-as-facts[b-pf61qg0lxc] {
        grid-template-columns: 1fr;
        gap: 0;
        background: transparent;
        border-radius: 0;
    }

    .qq-as-fact[b-pf61qg0lxc] {
        display: flex;
        align-items: baseline;
        gap: 8px;
        padding: 8px 0;
        background: transparent;
        border-bottom: 1px solid var(--qq-border-soft);
    }

    .qq-as-fact:last-child[b-pf61qg0lxc] {
        border-bottom: 0;
    }

    .qq-as-fact-label[b-pf61qg0lxc] {
        flex: none;
    }

    .qq-as-fact-value[b-pf61qg0lxc] {
        margin-top: 0;
        margin-left: auto;
        text-align: right;
    }

    .qq-as-fact-sub[b-pf61qg0lxc] {
        margin-top: 0;
        flex: none;
    }

    .qq-as-day-grid[b-pf61qg0lxc] {
        grid-template-columns: 1fr;
    }

    .qq-as-head-actions[b-pf61qg0lxc] {
        margin-left: 0;
        width: 100%;
        /* Three buttons on a ride (chat, share, calendar) do not fit one phone row. */
        flex-wrap: wrap;
    }
}
/* /Components/Buyer/NextAppointmentCard.razor.rz.scp.css */
/* 2c · Next appointment + countdown. Three states: days out (calm green),
   inside the cancellation window (amber, policy spelled out), starting now
   (ink, the code promoted to the primary action). Colour never carries the
   state alone — each state has its own eyebrow text. */

.qq-na[b-928nud64qi] {
    display: grid;
    grid-template-columns: 1fr 290px;
    gap: 26px;
    align-items: start;
    border-radius: 18px;
    padding: 22px;
    border: 1px solid transparent;
    margin-bottom: 20px;
    max-width: 62rem;
}

.qq-na.ok[b-928nud64qi] {
    background: var(--qq-ok-bg);
    border-color: var(--qq-border);
    --na-accent: var(--qq-ok-fg);
    --na-ink: var(--qq-text);
    --na-muted: var(--qq-text-muted);
    --na-seg-bg: var(--qq-card);
    --na-track: var(--qq-track-off);
}

.qq-na.warn[b-928nud64qi] {
    background: var(--qq-warn-bg);
    border-color: var(--qq-border);
    --na-accent: var(--qq-warn-fg);
    --na-ink: var(--qq-text);
    --na-muted: var(--qq-text-muted);
    --na-seg-bg: var(--qq-card);
    --na-track: var(--qq-track-off);
}

/* "Starting now" is deliberately the same ink surface in both themes — like
   the code card on the summary page, it has to read at the door. */
.qq-na.now[b-928nud64qi] {
    background: #171512;
    border-color: #332e24;
    --na-accent: #d9a94e;
    --na-ink: #f2ede4;
    --na-muted: #a39a88;
    --na-seg-bg: #2c2720;
    --na-track: #332e24;
}

.qq-na-body[b-928nud64qi] {
    min-width: 0;
}

.qq-na-eyebrow-row[b-928nud64qi] {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.qq-na-icon[b-928nud64qi] {
    width: 30px;
    height: 30px;
    border-radius: 9px;
    background: var(--na-seg-bg);
    color: var(--na-accent);
    display: flex;
    align-items: center;
    justify-content: center;
    flex: none;
}

.qq-na-eyebrow[b-928nud64qi] {
    font-family: var(--qq-admin-mono);
    font-size: .62rem;
    letter-spacing: .14em;
    text-transform: uppercase;
    font-weight: 700;
    color: var(--na-accent);
}

.qq-na-code[b-928nud64qi] {
    font-size: .66rem;
    letter-spacing: .06em;
    color: var(--na-muted);
}

.qq-na-mono[b-928nud64qi] {
    font-family: var(--qq-admin-mono);
    font-variant-numeric: tabular-nums;
}

.qq-na-name[b-928nud64qi] {
    font-size: 1.15rem;
    font-weight: 700;
    line-height: 1.32;
    letter-spacing: -.02em;
    margin: 13px 0 15px;
    color: var(--na-ink);
}

.qq-na-meta[b-928nud64qi] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.qq-na-meta-item[b-928nud64qi] {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: .85rem;
    color: var(--na-ink);
    min-width: 0;
}

.qq-na-meta-item svg[b-928nud64qi] {
    flex: none;
    color: var(--na-muted);
}

.qq-na-warnnote[b-928nud64qi] {
    display: flex;
    gap: 10px;
    background: var(--qq-card);
    border: 1px solid var(--qq-border);
    border-radius: 12px;
    padding: 11px 13px;
    margin-top: 15px;
    font-size: .78rem;
    color: var(--qq-warn-fg);
    line-height: 1.5;
}

.qq-na-warnnote svg[b-928nud64qi] {
    flex: none;
    margin-top: 1px;
}

.qq-na-clock[b-928nud64qi] {
    display: flex;
    flex-direction: column;
    gap: 14px;
    min-width: 0;
}

.qq-na-segs[b-928nud64qi] {
    display: flex;
    align-items: flex-end;
    gap: 8px;
}

.qq-na-seg[b-928nud64qi] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 5px;
    min-width: 60px;
    background: var(--na-seg-bg);
    border: 1px solid var(--qq-border);
    border-radius: 13px;
    padding: 11px 8px 8px;
}

.qq-na.now .qq-na-seg[b-928nud64qi] {
    border-color: #3d372b;
}

.qq-na-seg-v[b-928nud64qi] {
    font-size: 1.75rem;
    font-weight: 700;
    line-height: 1;
    color: var(--na-accent);
}

.qq-na-seg-k[b-928nud64qi] {
    font-size: .56rem;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--na-muted);
}

.qq-na-far[b-928nud64qi] {
    font-size: 1.3rem;
    font-weight: 700;
    color: var(--na-ink);
}

.qq-na-tail[b-928nud64qi] {
    font-size: .78rem;
    color: var(--na-muted);
    line-height: 1.45;
}

.qq-na-track[b-928nud64qi] {
    height: 5px;
    border-radius: 99px;
    background: var(--na-track);
    overflow: hidden;
}

.qq-na-fill[b-928nud64qi] {
    height: 100%;
    border-radius: 99px;
    background: var(--na-accent);
}

.qq-na-actions[b-928nud64qi] {
    display: flex;
    flex-direction: column;
    gap: 9px;
}

.qq-na-primary[b-928nud64qi] {
    height: 44px;
    border-radius: 99px;
    background: var(--na-accent);
    color: var(--qq-paper);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: .85rem;
    font-weight: 700;
    text-decoration: none;
}

.qq-na-primary:hover[b-928nud64qi] {
    text-decoration: none;
    filter: brightness(1.08);
}

.qq-na.now .qq-na-primary[b-928nud64qi] {
    color: #171512;
}

/* 2d · Two or more upcoming bookings: a horizontal scroll-snap strip, one
   card per "page" with a peek of the next so swipeability is discoverable.
   The strip owns all horizontal overflow (the page never scrolls sideways);
   its scrollbar is hidden, and the page dots underneath — decorative,
   aria-hidden, driven from scrollLeft by js/appointment-countdown.js — carry
   the position instead. */

.qq-na-strip-wrap[b-928nud64qi] {
    max-width: 62rem;
    min-width: 0;
    margin-bottom: 20px;
}

.qq-na-strip[b-928nud64qi] {
    display: flex;
    gap: 14px;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    overscroll-behavior-x: contain;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;    /* Firefox */
    -ms-overflow-style: none; /* legacy Edge */
    border-radius: 18px;
}

.qq-na-strip[b-928nud64qi]::-webkit-scrollbar {
    display: none; /* WebKit */
}

/* The strip is the keyboard surface (tabindex="0"): arrow keys scroll it. */
.qq-na-strip:focus-visible[b-928nud64qi] {
    outline: 2px solid var(--qq-brass);
    outline-offset: 3px;
}

/* Mouse affordances (appointment-countdown.js drives the drag): the open
   hand says "draggable", and the dots double as jump targets. Touch devices
   keep native scrolling and never see these cursors. */
@media (pointer: fine) {
    .qq-na-strip[b-928nud64qi] {
        cursor: grab;
    }

    .qq-na-strip.qq-na-dragging[b-928nud64qi] {
        cursor: grabbing;
    }

    .qq-na-dot[b-928nud64qi] {
        cursor: pointer;
    }
}

.qq-na-slide[b-928nud64qi] {
    flex: 0 0 calc(100% - 48px); /* 48px peek of the next card */
    min-width: 0;
    display: flex;
    scroll-snap-align: start;
}

/* The last card parks flush with the right edge instead of over-scrolling. */
.qq-na-slide:last-child[b-928nud64qi] {
    scroll-snap-align: end;
}

.qq-na-slide > .qq-na[b-928nud64qi] {
    width: 100%;
    max-width: none;
    margin-bottom: 0;
}

.qq-na-dots[b-928nud64qi] {
    display: flex;
    justify-content: center;
    gap: 7px;
    margin-top: 10px;
}

.qq-na-dot[b-928nud64qi] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--qq-border);
    transition: background-color .2s ease, transform .2s ease;
}

.qq-na-dot.active[b-928nud64qi] {
    background: var(--qq-brass);
    transform: scale(1.25);
}

@media (max-width: 767.98px) {
    .qq-na[b-928nud64qi] {
        grid-template-columns: 1fr;
        gap: 14px;
        padding: 15px;
    }

    .qq-na-seg[b-928nud64qi] {
        min-width: 52px;
        padding: 9px 6px 7px;
    }

    .qq-na-seg-v[b-928nud64qi] {
        font-size: 1.5rem;
    }

    .qq-na-slide[b-928nud64qi] {
        flex-basis: calc(100% - 32px); /* tighter peek on small screens */
    }
}
/* /Components/Layout/AdminLayout.razor.rz.scp.css */
.admin-shell[b-fhh082q3bk] {
    min-height: 100vh;
    background: var(--qq-admin-shell); /* warm ivory: the v3 "editorial back-office" canvas */
    display: flex;
    align-items: stretch;
    color: var(--qq-admin-ink);
}

/* --- Sidebar (espresso rail) ---------------------------------------------- */

.admin-sidebar[b-fhh082q3bk] {
    width: 252px;
    flex-shrink: 0;
    background: var(--qq-admin-bar);
    color: #a49b8a;
    display: flex;
    flex-direction: column;
    position: sticky;
    top: 0;
    max-height: 100vh;
    transition: width 0.15s ease;
}

.admin-sidebar-head[b-fhh082q3bk] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 1.25rem 0.9rem 1.05rem 1.15rem;
    border-bottom: 1px solid #332e24;
}

.admin-brand[b-fhh082q3bk] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    min-width: 0;
    color: #fbf8f1;
    font-weight: 700;
    text-decoration: none;
}

.admin-brand:hover[b-fhh082q3bk] {
    color: #fff;
    text-decoration: none;
}

.admin-brand-text[b-fhh082q3bk] {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.admin-nav-toggle[b-fhh082q3bk] {
    margin-left: auto;
    flex-shrink: 0;
    width: 30px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    border: 1px solid #3a352a;
    border-radius: 8px;
    color: var(--qq-admin-faint);
    cursor: pointer;
    padding: 0;
}

.admin-nav-toggle:hover[b-fhh082q3bk] {
    color: #fff;
    background: var(--qq-admin-bar-active);
}

.admin-nav-toggle svg[b-fhh082q3bk] {
    width: 15px;
    height: 15px;
    transition: transform 0.15s ease;
}

.admin-tag[b-fhh082q3bk] {
    background: var(--qq-admin-accent);
    color: #fff;
    font-family: var(--qq-admin-mono);
    font-size: 0.6rem;
    font-weight: 700;
    padding: 0.14rem 0.5rem;
    border-radius: 6px;
    letter-spacing: 0.08em;
    vertical-align: middle;
}

/* --- Sidebar footer -------------------------------------------------------- */

.admin-sidebar-footer[b-fhh082q3bk] {
    border-top: 1px solid #332e24;
    padding: 0.9rem 0.8rem;
    display: flex;
    flex-direction: column;
    gap: 0.7rem;
}

.admin-sidebar-meta[b-fhh082q3bk] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    /* The row is a link plus three fixed-width controls. Without wrapping they
       cannot all fit the drawer's width, and the language toggle was pushed
       past its right edge — visibly clipped rather than merely tight. */
    flex-wrap: wrap;
    gap: 0.5rem;
    padding: 0 0.4rem;
}

/* Keeps the toggles together as one unit when the row does wrap, instead of
   the language switch stranding itself on a line of its own. */
.admin-meta-tools[b-fhh082q3bk] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    flex-wrap: wrap;
}

.admin-link[b-fhh082q3bk] {
    color: var(--qq-admin-faint);
    text-decoration: none;
    font-size: 0.85rem;
}

.admin-link:hover[b-fhh082q3bk] {
    color: #fff;
}

.admin-user-card[b-fhh082q3bk] {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    background: #2c2820;
    border: 1px solid #3a352a;
    border-radius: 10px;
    padding: 0.6rem 0.7rem;
}

.admin-user-avatar[b-fhh082q3bk] {
    width: 32px;
    height: 32px;
    flex-shrink: 0;
    border-radius: 9px; /* squircle, not a circle */
    background: var(--qq-admin-accent);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 0.85rem;
    text-transform: uppercase;
}

.admin-user-name[b-fhh082q3bk] {
    flex: 1;
    min-width: 0;
    font-family: var(--qq-admin-mono);
    font-size: 0.72rem;
    color: #fbf8f1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.admin-logout[b-fhh082q3bk] {
    background: transparent;
    border: 1px solid #3a352a;
    color: #a49b8a;
    border-radius: 8px;
    padding: 0.3rem 0.8rem;
    font-family: inherit;
    font-size: 0.76rem;
    font-weight: 600;
    cursor: pointer;
}

.admin-logout:hover[b-fhh082q3bk] {
    background: var(--qq-admin-bar-active);
    color: #fbf8f1;
}

/* --- Content --------------------------------------------------------------- */

.admin-content[b-fhh082q3bk] {
    flex: 1;
    min-width: 0;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
}

/* --- Page shell: paper topbar + padded body -------------------------------- */

.admin-content[b-fhh082q3bk]  .admin-page-bar {
    background: var(--qq-admin-card);
    border-bottom: 1px solid var(--qq-admin-border);
    padding: 1rem 1.9rem;
    display: flex;
    align-items: center;
    gap: 1.1rem;
    flex-wrap: wrap;
}

/* Space Mono route line stacked above the page title. */
.admin-content[b-fhh082q3bk]  .admin-page-route {
    display: block;
    font-family: var(--qq-admin-mono);
    font-size: 0.69rem;
    color: var(--qq-admin-faint);
    letter-spacing: 0.02em;
    margin-bottom: 0.1rem;
}

.admin-content[b-fhh082q3bk]  .admin-page-title {
    font-weight: 700;
    font-size: 1.125rem;
    margin: 0;
    letter-spacing: -0.01em;
}

.admin-content[b-fhh082q3bk]  .admin-page-hint {
    flex: 1;
    min-width: 14rem;
    font-size: 0.82rem;
    color: var(--qq-admin-muted);
    margin: 0;
}

.admin-content[b-fhh082q3bk]  .admin-page-body {
    padding: 1.75rem 2rem 2.5rem;
}

/* rectangular search box with the v3 grey-dot glyph */
.admin-content[b-fhh082q3bk]  .admin-search {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    background: var(--qq-admin-input);
    border: 1px solid var(--qq-admin-border);
    border-radius: 10px;
    padding: 0.55rem 0.85rem;
    width: 18rem;
    max-width: 100%;
}

.admin-content[b-fhh082q3bk]  .admin-search::before {
    content: "";
    width: 6px;
    height: 6px;
    flex-shrink: 0;
    border-radius: 50%;
    background: var(--qq-admin-faint);
}

.admin-content[b-fhh082q3bk]  .admin-search input {
    flex: 1;
    min-width: 0;
    border: none;
    outline: none;
    background: transparent;
    font-family: inherit;
    font-size: 0.85rem;
    color: var(--qq-admin-ink);
}

/* toggle chips (plan features, role permissions): Space Mono, rectangular */
.admin-content[b-fhh082q3bk]  .admin-chip {
    border: 1px solid var(--qq-admin-border);
    background: var(--qq-admin-card);
    color: var(--qq-admin-faint);
    font-family: var(--qq-admin-mono);
    font-size: 0.69rem;
    font-weight: 700;
    padding: 0.375rem 0.75rem;
    border-radius: 7px;
    cursor: pointer;
    white-space: nowrap;
}

.admin-content[b-fhh082q3bk]  .admin-chip:hover {
    border-color: var(--qq-admin-faint);
}

.admin-content[b-fhh082q3bk]  .admin-chip.on {
    background: var(--qq-admin-ink);
    border-color: var(--qq-admin-ink);
    /* ink inverts to ivory in dark mode, so the label has to invert with it —
       a fixed near-white here made the selected chip unreadable. */
    color: var(--qq-admin-btn-fg);
}

.admin-content[b-fhh082q3bk]  .admin-chip.on::before {
    content: "✓ ";
}

.admin-content[b-fhh082q3bk]  .admin-chip:disabled {
    cursor: default;
    opacity: 0.7;
}

/* inputs keep the rectangular radius in the topbar too */
.admin-content[b-fhh082q3bk]  .admin-page-bar .qq-input,
.admin-content[b-fhh082q3bk]  .admin-page-bar .qq-select {
    border-radius: 10px;
    padding: 0.5rem 0.85rem;
    font-size: 0.85rem;
}

/* flagged rows (locked users, hidden reviews, inactive cities) */
.admin-content[b-fhh082q3bk]  .admin-row-flag {
    background: var(--qq-admin-flag);
}

/* uppercase column/section labels: Space Mono */
.admin-content[b-fhh082q3bk]  .admin-col-head {
    font-family: var(--qq-admin-mono);
    font-size: 0.66rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--qq-admin-faint);
}

/* mono meta text (routes, ids, timestamps, amounts) */
.admin-content[b-fhh082q3bk]  .admin-mono {
    font-family: var(--qq-admin-mono);
    font-size: 0.72rem;
    color: var(--qq-admin-muted);
}

/* label/value fact list (buyer & seller detail pages) */
.admin-content[b-fhh082q3bk]  .admin-facts {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.35rem 1rem;
    margin: 0;
    font-size: 0.85rem;
}

.admin-content[b-fhh082q3bk]  .admin-facts dt {
    font-family: var(--qq-admin-mono);
    font-size: 0.66rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--qq-admin-faint);
    align-self: center;
    white-space: nowrap;
}

/* An email or an address is the widest thing in the card; without the wrap it
   stretches the grid column and pushes the card's actions out of the layout. */
.admin-content[b-fhh082q3bk]  .admin-facts dd {
    margin: 0;
    min-width: 0;
    overflow-wrap: anywhere;
    color: var(--qq-admin-ink);
}

/* pass/fail criteria list (verified-buyer standing) */
.admin-content[b-fhh082q3bk]  .admin-checklist {
    list-style: none;
    margin: 0;
    padding: 0;
    font-size: 0.86rem;
}

.admin-content[b-fhh082q3bk]  .admin-checklist li {
    position: relative;
    padding-left: 1.4rem;
    margin-bottom: 0.35rem;
    color: var(--qq-admin-ink);
}

.admin-content[b-fhh082q3bk]  .admin-checklist li::before {
    position: absolute;
    left: 0;
    font-weight: 700;
}

.admin-content[b-fhh082q3bk]  .admin-checklist li.ok::before {
    content: "\2713";
    color: var(--qq-ok-fg);
}

.admin-content[b-fhh082q3bk]  .admin-checklist li.bad::before {
    content: "\2717";
    color: var(--qq-bad-fg);
}

/* --- Warm-editorial overrides of the shared qq-* kit ------------------------ */

.admin-content[b-fhh082q3bk]  .qq-card {
    background: var(--qq-admin-card);
    border-color: var(--qq-admin-border);
    border-radius: 16px;
}

.admin-content[b-fhh082q3bk]  .qq-row {
    padding: 0.9rem 1.35rem;
}

.admin-content[b-fhh082q3bk]  .qq-row + .qq-row {
    border-top-color: var(--qq-admin-divider);
}

/* Was #fbfaf5 — a near-white that stayed put in dark mode while the row's text
   flipped to light admin ink, so hovering a row dropped the store name to
   1.17:1 and erased it. Mixing ink into the card tints in whichever direction
   the theme runs. 4% rather than a larger share because the mix moves the
   background toward the text in both themes, so a heavier tint costs contrast:
   this keeps the admin-mono sub-line as close as possible to what it reads on
   an unhovered row. */
.admin-content[b-fhh082q3bk]  .qq-row:hover {
    background: color-mix(in srgb, var(--qq-admin-ink) 4%, var(--qq-admin-card));
}

/* QuickGrid pads short pages with placeholder rows (every cell empty) so the
   table height stays constant across pages; with the v3 hairline row rules
   they read as blank entries, so hide them. */
.admin-content[b-fhh082q3bk]  .qq-grid tbody tr:not(:has(td:not(:empty))) {
    display: none;
}

.admin-content[b-fhh082q3bk]  .qq-input,
.admin-content[b-fhh082q3bk]  .qq-select {
    background: var(--qq-admin-input);
    border-color: var(--qq-admin-border);
    border-radius: 10px;
    color: var(--qq-admin-ink);
}

.admin-content[b-fhh082q3bk]  .qq-microlabel {
    color: var(--qq-admin-muted);
}

.admin-content[b-fhh082q3bk]  .qq-btn {
    background: var(--qq-admin-ink);
    color: var(--qq-admin-btn-fg);
    border-radius: 10px;
}

.admin-content[b-fhh082q3bk]  .qq-btn:hover {
    background: var(--qq-admin-btn-hover);
    color: var(--qq-admin-btn-fg);
    filter: none;
}

.admin-content[b-fhh082q3bk]  .qq-btn-outline {
    border-radius: 10px;
}

.admin-content[b-fhh082q3bk]  .qq-btn-outline:hover {
    border-color: var(--qq-admin-faint);
}

/* status tags: the v3 signature — Space Mono, uppercase, tint background */
.admin-content[b-fhh082q3bk]  [class*="qq-pill"] {
    font-family: var(--qq-admin-mono);
    font-size: 0.625rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    border-radius: 6px;
    padding: 0.25rem 0.55rem;
}

.admin-content[b-fhh082q3bk]  .qq-pill-ok    { background: var(--qq-ok-bg); color: var(--qq-ok-fg); }
.admin-content[b-fhh082q3bk]  .qq-pill-warn  { background: var(--qq-warn-bg); color: var(--qq-warn-fg); }
.admin-content[b-fhh082q3bk]  .qq-pill-info  { background: var(--qq-info-bg); color: var(--qq-info-fg); }
.admin-content[b-fhh082q3bk]  .qq-pill-bad   { background: var(--qq-bad-bg); color: var(--qq-bad-fg); }
.admin-content[b-fhh082q3bk]  .qq-pill-mute  { background: var(--qq-mute-bg); color: var(--qq-mute-fg); }
.admin-content[b-fhh082q3bk]  .qq-pill-brass { background: var(--qq-brass-tint); color: var(--qq-brass-deep); }
.admin-content[b-fhh082q3bk]  .qq-pill-outline { background: transparent; border: 1px solid var(--qq-admin-border); color: var(--qq-admin-muted); }

/* live-status tags carry a leading dot; role tags don't (add .qq-pill-dot) */
.admin-content[b-fhh082q3bk]  .qq-pill-dot::before {
    content: "";
    display: inline-block;
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: currentColor;
    margin-right: 0.35rem;
    vertical-align: 1px;
}

.admin-content[b-fhh082q3bk]  .qq-btn-danger {
    border-color: color-mix(in srgb, var(--qq-bad-fg) 35%, transparent);
    color: var(--qq-bad-fg);
    border-radius: 10px;
}

/* solid approve (verification) — green in both themes, so its text stays
   ivory even where .qq-btn text flips dark */
.admin-content[b-fhh082q3bk]  .admin-approve {
    background: #3f7a52;
    color: #fbf8f1;
}

.admin-content[b-fhh082q3bk]  .admin-approve:hover:not(:disabled) {
    background: #356b46;
    color: #fbf8f1;
}

.admin-content[b-fhh082q3bk]  .admin-approve:disabled {
    background: var(--qq-mute-bg);
    color: var(--qq-mute-fg);
    cursor: default;
}

/* positive outline (reactivate / unlock / unhide) */
.admin-content[b-fhh082q3bk]  .qq-btn-good {
    background: transparent;
    border: 1px solid color-mix(in srgb, var(--qq-ok-fg) 40%, transparent);
    color: var(--qq-ok-fg);
    border-radius: 10px;
    font-family: inherit;
    font-size: 0.82rem;
    font-weight: 600;
    padding: 0.4rem 0.9rem;
    cursor: pointer;
}

.admin-content[b-fhh082q3bk]  .qq-btn-good:hover {
    border-color: var(--qq-ok-fg);
}

/* avatars go squircle in the admin */
.admin-content[b-fhh082q3bk]  .qq-avatar {
    border-radius: 10px;
}

/* Narrow screens: sidebar collapses to a top block */
/* Mobile drawer controls are hidden on desktop; the rail is a static sidebar. */
.admin-topbar[b-fhh082q3bk],
.admin-nav-burger[b-fhh082q3bk],
.admin-nav-close[b-fhh082q3bk],
.admin-scrim[b-fhh082q3bk] {
    display: none;
}

@media (max-width: 900px) {
    /* Dark top bar to match the rail. */
    .admin-topbar[b-fhh082q3bk] {
        display: flex;
        align-items: center;
        gap: 0.6rem;
        position: sticky;
        top: 0;
        z-index: 40;
        height: 56px;
        padding: 0 0.9rem;
        background: var(--qq-admin-bar, #232019);
        color: #fbf8f1;
        border-bottom: 1px solid #332e24;
    }

    .admin-topbar-brand[b-fhh082q3bk] {
        font-weight: 700;
        letter-spacing: -0.01em;
    }

    .admin-nav-burger[b-fhh082q3bk] {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 40px;
        height: 40px;
        border: none;
        background: none;
        color: #fbf8f1;
        cursor: pointer;
        padding: 0;
    }

    .admin-nav-burger svg[b-fhh082q3bk] {
        width: 22px;
        height: 22px;
    }

    /* The rail becomes an off-canvas drawer. */
    .admin-sidebar[b-fhh082q3bk] {
        position: fixed;
        top: 0;
        bottom: 0;
        left: 0;
        width: 78%;
        max-width: 320px;
        max-height: none;
        z-index: 60;
        transform: translateX(-100%);
        transition: transform 0.22s cubic-bezier(0.4, 0, 0.2, 1);
        overflow-y: auto;
        box-shadow: 0 0 40px rgba(0, 0, 0, 0.4);
    }

    .admin-sidebar.open[b-fhh082q3bk] {
        transform: translateX(0);
    }

    /* The desktop mini-collapse chevron is a desktop-only affordance. */
    .admin-nav-toggle[b-fhh082q3bk] {
        display: none;
    }

    .admin-nav-close[b-fhh082q3bk] {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        margin-left: auto;
        width: 34px;
        height: 34px;
        border: none;
        background: none;
        font-size: 1.5rem;
        line-height: 1;
        color: #a49b8a;
        cursor: pointer;
    }

    .admin-scrim[b-fhh082q3bk] {
        display: block;
        position: fixed;
        inset: 0;
        background: rgba(0, 0, 0, 0.45);
        z-index: 55;
        opacity: 0;
        visibility: hidden;
        transition: opacity 0.2s ease;
    }

    .admin-scrim.open[b-fhh082q3bk] {
        opacity: 1;
        visibility: visible;
    }
}

#blazor-error-ui[b-fhh082q3bk] {
    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-fhh082q3bk] {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }

/* Maintenance band (spec 019). Sits under the topbar on every console page for
   as long as the marketplace is parked, because an admin who forgets it is on
   is exactly the person who needs telling. */

.admin-maintenance-band[b-fhh082q3bk] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.75rem;
    background: var(--qq-admin-accent-tint, #f6e5df);
    border-bottom: 1px solid var(--qq-admin-accent-tint-border, #ecd0c6);
    color: var(--qq-admin-accent-deep, #93381f);
    font-size: 0.85rem;
    padding: 0.7rem 1.2rem;
}

.admin-maintenance-band a[b-fhh082q3bk] {
    margin-left: auto;
    color: var(--qq-admin-accent-deep, #93381f);
    font-weight: 600;
    text-decoration: underline;
}
/* /Components/Layout/AdminLoginLayout.razor.rz.scp.css */
.admin-login-shell[b-s2gpfe3ku0] {
    min-height: 100vh;
    background: var(--qq-admin-bar);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 2rem 1rem;
}

.admin-login-brand[b-s2gpfe3ku0] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    color: #fff;
    font-weight: 700;
    font-size: 1.1rem;
    letter-spacing: -0.01em;
    margin-bottom: 2rem;
    text-decoration: none;
}

.admin-login-brand-name[b-s2gpfe3ku0] {
    white-space: nowrap;
}

.admin-login-tag[b-s2gpfe3ku0] {
    display: inline-block;
    font-size: 0.6rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    background: var(--qq-admin-accent);
    /* btn-fg, not #fff: the accent lightens to salmon in dark mode, where a
       white label washed out. */
    color: var(--qq-admin-btn-fg, #fff);
    border-radius: 4px;
    padding: 1px 5px;
    vertical-align: middle;
    margin-left: 0.2rem;
}

.admin-login-main[b-s2gpfe3ku0] {
    width: 100%;
    max-width: 26rem;
}
/* /Components/Layout/AdminNavRail.razor.rz.scp.css */
/* The admin rail. Moved here from AdminLayout.razor.css when the rail became
   its own component: scoped CSS follows the markup, so these rules only match
   once they live beside the elements they style.

   ::deep is still needed for the row itself — NavLink renders its own <a>, so
   that element never carries this component's scope id. */

.admin-nav[b-76frtqt2gu] {
    flex: 1;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
    padding: 1.1rem 0.7rem;
}

.admin-nav-group[b-76frtqt2gu] {
    font-family: var(--qq-admin-mono);
    font-size: 0.62rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: #6b6353;
    padding: 0 0.8rem;
    margin: 1.1rem 0 0.3rem;
}

.admin-nav[b-76frtqt2gu]  a {
    position: relative;
    display: flex;
    align-items: center;
    gap: 0.7rem;
    color: #a49b8a;
    text-decoration: none;
    padding: 0.56rem 0.8rem;
    border-radius: 8px;
    font-size: 0.9rem;
}

.admin-nav[b-76frtqt2gu]  .admin-nav-ico {
    display: flex;
    flex-shrink: 0;
    color: #7d7462;
}

.admin-nav[b-76frtqt2gu]  .admin-nav-ico svg {
    width: 17px;
    height: 17px;
}

.admin-nav[b-76frtqt2gu]  .admin-nav-text {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.admin-nav[b-76frtqt2gu]  a:hover {
    color: #fbf8f1;
    text-decoration: none;
    background: #2c2820;
}

.admin-nav[b-76frtqt2gu]  a.active {
    background: var(--qq-admin-bar-active);
    color: #fbf8f1;
    font-weight: 600;
}

/* Active affordances: 3px terracotta bar on the left edge + a filled 9px
   square marker on the right (the v3 signature). */
.admin-nav[b-76frtqt2gu]  a.active::before {
    content: "";
    position: absolute;
    left: -0.7rem;
    top: 6px;
    bottom: 6px;
    width: 3px;
    background: var(--qq-admin-accent);
    border-radius: 0 2px 2px 0;
}

.admin-nav[b-76frtqt2gu]  a.active::after {
    content: "";
    margin-left: auto;
    width: 9px;
    height: 9px;
    flex-shrink: 0;
    background: var(--qq-admin-accent);
    border-radius: 2px;
}

.admin-nav[b-76frtqt2gu]  a.active .admin-nav-ico {
    color: var(--qq-admin-accent);
}

/* Count badge (e.g. pending verifications) — sits on the right edge and
   replaces the active square marker when present. */
.admin-nav[b-76frtqt2gu]  .admin-nav-badge {
    margin-left: auto;
    flex-shrink: 0;
    background: var(--qq-admin-accent);
    color: #fbf8f1;
    font-family: var(--qq-admin-mono);
    font-size: 0.66rem;
    font-weight: 700;
    line-height: 1;
    padding: 0.22rem 0.42rem;
    border-radius: 99px;
    min-width: 1.25rem;
    text-align: center;
}

.admin-nav[b-76frtqt2gu]  a.active:has(.admin-nav-badge)::after {
    display: none;
}

/* --- Preview mode ---------------------------------------------------------
   The editor draws the rail at 320px in a light page. Only the container
   changes; every row rule above applies unchanged, which is the whole point. */

.admin-nav.is-preview[b-76frtqt2gu] {
    padding: 0.85rem 0.6rem;
    overflow: visible;
    background: var(--qq-admin-bar, #232019);
    border-radius: 14px;
}

/* A row that is a span, not a link. Same box as ::deep a above — repeated
   rather than shared because this element does carry the scope id and that
   one does not, so no single selector can reach both. */
.admin-nav.is-preview .admin-nav-preview-row[b-76frtqt2gu] {
    position: relative;
    display: flex;
    align-items: center;
    gap: 0.7rem;
    color: #a49b8a;
    padding: 0.5rem 0.8rem;
    border-radius: 8px;
    font-size: 0.84rem;
}

.admin-nav.is-preview .admin-nav-preview-row .admin-nav-ico[b-76frtqt2gu] {
    display: flex;
    flex-shrink: 0;
    color: #7d7462;
}

.admin-nav.is-preview .admin-nav-preview-row .admin-nav-ico svg[b-76frtqt2gu] {
    width: 15px;
    height: 15px;
}

.admin-nav.is-preview .admin-nav-preview-row .admin-nav-text[b-76frtqt2gu] {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.admin-nav.is-preview .admin-nav-preview-row.active[b-76frtqt2gu] {
    background: var(--qq-admin-bar-active);
    color: #fbf8f1;
    font-weight: 600;
}

.admin-nav.is-preview .admin-nav-preview-row.active[b-76frtqt2gu]::before {
    content: "";
    position: absolute;
    left: -0.6rem;
    top: 5px;
    bottom: 5px;
    width: 3px;
    background: var(--qq-admin-accent);
    border-radius: 0 2px 2px 0;
}

.admin-nav.is-preview .admin-nav-preview-row.active .admin-nav-ico[b-76frtqt2gu] {
    color: var(--qq-admin-accent);
}

.admin-nav.is-preview .admin-nav-preview-row .admin-nav-badge[b-76frtqt2gu] {
    margin-left: auto;
    flex-shrink: 0;
    background: var(--qq-admin-accent);
    color: #fbf8f1;
    font-family: var(--qq-admin-mono);
    font-size: 0.62rem;
    font-weight: 700;
    line-height: 1;
    padding: 0.2rem 0.4rem;
    border-radius: 99px;
    text-align: center;
}
/* /Components/Layout/BuyerLayout.razor.rz.scp.css */
.qq-buyer-tabwrap[b-i1yhp8abfv] {
    margin-bottom: 1.5rem;
}

.qq-buyer-eyebrow[b-i1yhp8abfv] {
    font-family: 'Space Mono', ui-monospace, monospace;
    font-size: 10px;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--qq-text-faint, #a39a88);
    margin-bottom: 7px;
}

.qq-buyer-scroll[b-i1yhp8abfv] {
    position: relative;
}

/* Each tab is icon + label (+ optional badge). Base pill look comes from
   the shared .qq-seg; this adds the row layout and per-tab affordances. */
.qq-buyer-tabs[b-i1yhp8abfv]  a {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    border-radius: 999px;
    color: var(--qq-text-muted);
    text-decoration: none;
    white-space: nowrap;
}

.qq-buyer-tabs[b-i1yhp8abfv]  a:hover {
    color: var(--qq-ink);
}

.qq-buyer-tabs[b-i1yhp8abfv]  a.active {
    background: var(--qq-card);
    box-shadow: 0 1px 4px rgba(23, 21, 18, 0.12);
    font-weight: 700;
    color: var(--qq-ink);
}

.qq-buyer-tabs[b-i1yhp8abfv]  a svg {
    width: 16px;
    height: 16px;
    opacity: 0.65;
    flex-shrink: 0;
}

.qq-buyer-tabs[b-i1yhp8abfv]  a.active svg {
    opacity: 1;
    color: var(--qq-brass, #d9a94e);
}

.qq-buyer-tabs[b-i1yhp8abfv]  .qq-tab-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 18px;
    height: 18px;
    padding: 0 5px;
    border-radius: 999px;
    font-family: 'Space Mono', ui-monospace, monospace;
    font-size: 10.5px;
    font-weight: 700;
    background: var(--qq-mute-bg, #e3dfd5);
    color: var(--qq-mute-fg, #7a7264);
}

.qq-buyer-tabs[b-i1yhp8abfv]  a.active .qq-tab-badge {
    background: #f3e7cf;
    color: #9a6b1e;
}

/* Mobile: never wrap — one horizontally-scrolling row with an edge fade. */
@media (max-width: 640px) {
    .qq-buyer-tabs[b-i1yhp8abfv] {
        display: flex;
        flex-wrap: nowrap;
        overflow-x: auto;
        max-width: 100%;
        scrollbar-width: none;
        -webkit-overflow-scrolling: touch;
    }

    .qq-buyer-tabs[b-i1yhp8abfv]::-webkit-scrollbar {
        display: none;
    }

    .qq-buyer-tabs[b-i1yhp8abfv]  a {
        flex-shrink: 0;
    }

    .qq-buyer-scroll[b-i1yhp8abfv]::after {
        content: "";
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        width: 34px;
        pointer-events: none;
        background: linear-gradient(90deg, transparent, var(--qq-shell, #f5f2ec));
    }
}
/* /Components/Layout/MainLayout.razor.rz.scp.css */
.page[b-tby334v388] {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

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

.qq-footer[b-tby334v388] {
    border-top: 1px solid var(--qq-border);
    color: var(--qq-text-muted);
    font-size: 0.85rem;
    background: var(--qq-paper);
}

#blazor-error-ui[b-tby334v388] {
    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-tby334v388] {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }
/* /Components/Layout/NavMenu.razor.rz.scp.css */
.qq-navbar[b-dayiu7bhg9] {
    background-color: var(--qq-paper);
    border-bottom: 1px solid var(--qq-border);
    padding-top: 0.55rem;
    padding-bottom: 0.55rem;
    /* Bootstrap paints nav links from its own navbar variables (derived from a
       near-black emphasis colour that ignores data-theme) — feed them our
       tokens so links stay visible in dark mode, active pill included. */
    --bs-navbar-color: var(--qq-text-muted);
    --bs-navbar-hover-color: var(--qq-text);
    --bs-navbar-active-color: var(--qq-text);
    --bs-navbar-brand-color: var(--qq-text);
    --bs-navbar-brand-hover-color: var(--qq-text);
}

.qq-nav-inner[b-dayiu7bhg9] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    /* Desktop stays a single no-wrap row; the collapse grows and the actions
       sit at the far right. Wrapping is enabled only below the breakpoint. */
    flex-wrap: nowrap;
}

/* Mobile: let the Bootstrap collapse wrap to its own full-width line below the
   bar (matches Bootstrap's default .navbar flex-wrap). */
@media (max-width: 767.98px) {
    .qq-nav-inner[b-dayiu7bhg9] {
        flex-wrap: wrap;
    }
}

.qq-wordmark[b-dayiu7bhg9] {
    font-weight: 700;
    font-size: 1.2rem;
    letter-spacing: -0.02em;
    color: var(--qq-ink);
}

.navbar-toggler[b-dayiu7bhg9] {
    border-color: var(--qq-border);
    padding: 0.3rem 0.55rem;
}

[b-dayiu7bhg9] .nav-link {
    color: var(--qq-text-muted);
    font-weight: 500;
    font-size: 0.95rem;
}

[b-dayiu7bhg9] .nav-link:hover {
    color: var(--qq-ink);
}

[b-dayiu7bhg9] .nav-link.active {
    color: var(--qq-ink);
    font-weight: 600;
}

/* Left links get a subtle active chip. */
.qq-nav-links[b-dayiu7bhg9]  .nav-link {
    border-radius: 999px;
    padding: 0.4rem 0.85rem;
}

.qq-nav-links[b-dayiu7bhg9]  .nav-link.active {
    background: var(--qq-mute-bg);
}

/* Right cluster — cart, bell, account, language, burger. Always in the bar. */
.qq-nav-actions[b-dayiu7bhg9] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* Account pill (desktop dropdown trigger). */
.qq-account-pill[b-dayiu7bhg9] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    border: 1px solid var(--qq-border);
    /* Token, not #fff: dark mode flips the ink text light, which was
       illegible on a hardcoded white pill. */
    background: var(--qq-card, #fff);
    border-radius: 999px;
    padding: 0.25rem 0.6rem 0.25rem 0.3rem;
    cursor: pointer;
    color: var(--qq-ink);
    font-weight: 600;
    font-size: 0.9rem;
}

.qq-account-pill:hover[b-dayiu7bhg9] {
    background: var(--qq-shell, #f5f2ec);
}

.qq-account-avatar[b-dayiu7bhg9] {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: #41597a;
    color: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 0.85rem;
    flex-shrink: 0;
}

.qq-account-name[b-dayiu7bhg9] {
    max-width: 8rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Account dropdown card. */
[b-dayiu7bhg9] .qq-account-menu {
    border: 1px solid var(--qq-border);
    border-radius: 14px;
    box-shadow: 0 14px 36px rgba(23, 21, 18, 0.16);
    padding: 0.4rem;
    min-width: 12rem;
}

[b-dayiu7bhg9] .qq-account-menu .dropdown-item {
    border-radius: 9px;
    font-size: 0.9rem;
    padding: 0.5rem 0.7rem;
}

[b-dayiu7bhg9] .qq-account-menu .qq-account-logout {
    color: var(--qq-bad-fg, #b2483c);
    width: 100%;
    text-align: left;
    border: none;
    background: none;
}

/* Only one of the desktop / mobile account treatments shows per breakpoint. */
@media (max-width: 767.98px) {
    .qq-nav-desktop[b-dayiu7bhg9] {
        display: none !important;
    }
}

/* ---- Mobile drawer account block (inside the Bootstrap collapse) ---- */
.qq-nav-mobileaccount[b-dayiu7bhg9] {
    border-top: 1px solid var(--qq-border);
    margin-top: 0.5rem;
    padding-top: 0.75rem;
}

.qq-nav-macct-head[b-dayiu7bhg9] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    margin-bottom: 0.75rem;
}

.qq-nav-macct-head .qq-account-name[b-dayiu7bhg9] {
    font-weight: 700;
    max-width: none;
}

.qq-nav-macct-grid[b-dayiu7bhg9] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.5rem;
    margin-bottom: 0.75rem;
}

.qq-nav-macct-grid a[b-dayiu7bhg9] {
    background: var(--qq-shell, #f5f2ec);
    border: 1px solid var(--qq-border);
    border-radius: 10px;
    padding: 0.6rem 0.75rem;
    text-decoration: none;
    color: var(--qq-ink);
    font-weight: 600;
    font-size: 0.9rem;
}

.qq-nav-macct-foot[b-dayiu7bhg9] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
}

.qq-nav-macct-foot a[b-dayiu7bhg9] {
    text-decoration: none;
    color: var(--qq-ink);
    font-weight: 600;
    font-size: 0.9rem;
}

.qq-nav-logout[b-dayiu7bhg9] {
    border: none;
    background: none;
    color: var(--qq-bad-fg, #b2483c);
    font-weight: 700;
    font-size: 0.9rem;
    cursor: pointer;
    padding: 0;
}

.qq-nav-macct-signedout[b-dayiu7bhg9] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

/* On desktop, the collapse grows so the actions cluster sits at the far right;
   the mobile account block and the burger are hidden by Bootstrap's d-* / expand. */
@media (min-width: 768px) {
    .qq-nav-collapse[b-dayiu7bhg9] {
        flex-grow: 1;
    }
}
/* /Components/Layout/ReconnectModal.razor.rz.scp.css */
.components-reconnect-first-attempt-visible[b-d5g5ebqb2p],
.components-reconnect-repeated-attempt-visible[b-d5g5ebqb2p],
.components-reconnect-failed-visible[b-d5g5ebqb2p],
.components-pause-visible[b-d5g5ebqb2p],
.components-resume-failed-visible[b-d5g5ebqb2p],
.components-rejoining-animation[b-d5g5ebqb2p] {
    display: none;
}

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


#components-reconnect-modal[b-d5g5ebqb2p] {
    background-color: var(--qq-paper, #faf8f4);
    color: var(--qq-ink, #171512);
    width: 21rem;
    margin: 20vh auto;
    padding: 2rem 1.9rem;
    border: 1px solid var(--qq-border, #e7e2d8);
    border-radius: 18px;
    box-shadow: 0 24px 60px rgba(23, 21, 18, 0.32);
    font-family: 'Space Grotesk', Helvetica, Arial, sans-serif;
    opacity: 0;
    transition: display 0.5s allow-discrete, overlay 0.5s allow-discrete;
    animation: components-reconnect-modal-fadeOutOpacity-b-d5g5ebqb2p 0.5s both;
    &[open]

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

}

#components-reconnect-modal[b-d5g5ebqb2p]::backdrop {
    background-color: rgba(23, 21, 18, 0.42);
    animation: components-reconnect-modal-fadeInOpacity-b-d5g5ebqb2p 0.5s ease-in-out;
    opacity: 1;
}

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

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

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

    100% {
        opacity: 1;
    }
}

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

    100% {
        opacity: 0;
    }
}

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

/* Each state shows a single message line, so style them uniformly as the heading. */
#components-reconnect-modal p[b-d5g5ebqb2p] {
    margin: 0;
    text-align: center;
    font-size: 0.95rem;
    font-weight: 600;
    color: var(--qq-ink, #171512);
    line-height: 1.5;
}

/* The countdown seconds read as a brass highlight. */
#components-reconnect-modal #components-seconds-to-next-attempt[b-d5g5ebqb2p] {
    font-weight: 700;
    color: var(--qq-brass, #d9a94e);
}

#components-reconnect-modal button[b-d5g5ebqb2p] {
    border: 0;
    background-color: var(--qq-ink, #171512);
    color: var(--qq-paper, #faf8f4);
    padding: 0.65rem 2rem;
    border-radius: 999px;
    font-weight: 600;
    font-family: inherit;
    cursor: pointer;
    transition: background-color 0.15s ease;
}

    /* Ink shifted toward paper, not a fixed dark hover: the button inverts to
       light-on-dark in dark mode, where a hardcoded #3a352c hover swallowed
       the (dark) label. */
    #components-reconnect-modal button:hover[b-d5g5ebqb2p] {
        background-color: color-mix(in srgb, var(--qq-ink, #171512) 85%, var(--qq-paper, #faf8f4));
    }

    #components-reconnect-modal button:active[b-d5g5ebqb2p] {
        background-color: color-mix(in srgb, var(--qq-ink, #171512) 85%, var(--qq-paper, #faf8f4));
    }

    #components-reconnect-modal button:focus-visible[b-d5g5ebqb2p] {
        outline: 2px solid var(--qq-gold-bright, #d9a94e);
        outline-offset: 2px;
    }

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

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

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

@keyframes components-rejoining-animation-b-d5g5ebqb2p {
    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/Layout/SellerLayout.razor.rz.scp.css */
.seller-shell[b-ewxuigli75] {
    display: flex;
    min-height: 100vh;
    background: var(--qq-shell);
}

.seller-sidebar[b-ewxuigli75] {
    width: 248px;
    flex-shrink: 0;
    background: var(--qq-paper);
    border-right: 1px solid var(--qq-border);
    color: var(--qq-text-body);
    display: flex;
    flex-direction: column;
    padding: 1.25rem 0.85rem;
    gap: 1.1rem;
}

.seller-brand[b-ewxuigli75] {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    font-weight: 700;
    font-size: 1.05rem;
    letter-spacing: -0.02em;
    color: var(--qq-ink);
    text-decoration: none;
    padding: 0.25rem 0.5rem;
}

.seller-brand:hover[b-ewxuigli75] {
    color: var(--qq-ink);
    text-decoration: none;
}

.seller-store[b-ewxuigli75] {
    background: var(--qq-card);
    border: 1px solid var(--qq-border);
    border-radius: 14px;
    padding: 0.75rem;
    display: flex;
    align-items: center;
    gap: 0.6rem;
}

.seller-store-meta[b-ewxuigli75] {
    min-width: 0;
}

.seller-store-name[b-ewxuigli75] {
    font-weight: 700;
    font-size: 0.88rem;
    color: var(--qq-ink);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.seller-store-link[b-ewxuigli75] {
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--qq-brass);
    text-decoration: none;
}

.seller-nav[b-ewxuigli75] {
    display: flex;
    flex-direction: column;
    gap: 0.13rem;
}

.seller-nav[b-ewxuigli75]  a {
    color: var(--qq-text-body);
    text-decoration: none;
    padding: 0.55rem 0.75rem;
    border-radius: 10px;
    font-size: 0.91rem;
}

.seller-nav[b-ewxuigli75]  a .seller-nav-badge {
    display: inline-block; margin-left: 8px; padding: 1px 7px; border-radius: 999px;
    background: var(--qq-ink); color: #d9a94e;
    font-family: var(--qq-admin-mono); font-size: 10.5px; font-weight: 700; line-height: 1.5; vertical-align: 1px;
}

.seller-nav[b-ewxuigli75]  a:hover {
    background: var(--qq-brass-tint);
    color: var(--qq-brass-deep);
}

.seller-nav[b-ewxuigli75]  a.active {
    background: var(--qq-ink);
    color: var(--qq-paper);
    font-weight: 600;
}

.seller-nav-section[b-ewxuigli75] {
    font-size: 0.69rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.09em;
    color: var(--qq-text-faint);
    padding: 0.85rem 0.75rem 0.25rem;
}

.seller-main[b-ewxuigli75] {
    flex: 1;
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.seller-topbar[b-ewxuigli75] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: var(--qq-paper);
    border-bottom: 1px solid var(--qq-border);
    padding: 0.65rem 1.75rem;
}

.seller-topbar-title[b-ewxuigli75] {
    font-weight: 700;
    color: var(--qq-text-faint);
    font-size: 0.78rem;
    text-transform: uppercase;
    letter-spacing: 0.08em;
}

.seller-topbar-actions[b-ewxuigli75] {
    display: flex;
    align-items: center;
    gap: 0.85rem;
}

/* The signed-in account: a ghost-pill button so it clearly reads as a link
   into account settings, not plain text. */
.seller-topbar-link[b-ewxuigli75] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    color: var(--qq-text);
    text-decoration: none;
    font-size: 0.9rem;
    font-weight: 500;
    padding: 0.35rem 0.75rem;
    border-radius: 999px;
    border: 1px solid var(--qq-border);
    background: var(--qq-card);
    transition: background-color 140ms ease, border-color 140ms ease, color 140ms ease;
}

.seller-topbar-link svg[b-ewxuigli75] {
    width: 15px;
    height: 15px;
    color: var(--qq-text-muted);
    flex-shrink: 0;
}

.seller-topbar-link:hover[b-ewxuigli75] {
    background: var(--qq-brass-tint);
    border-color: var(--qq-brass-soft);
    color: var(--qq-brass-deep);
    text-decoration: none;
}

.seller-topbar-link:hover svg[b-ewxuigli75] {
    color: var(--qq-brass-deep);
}

.seller-topbar-link:focus-visible[b-ewxuigli75] {
    outline: 2px solid var(--qq-gold-bright);
    outline-offset: 2px;
}

.seller-content[b-ewxuigli75] {
    padding: 2rem 1.75rem;
    /* 1440, not 1150: on a wide screen the ledgers, grids and charts left a
       third of the studio as empty gutter (owner, 2026-09-08). Pages that are
       forms keep their own reading width inside this. Under 820px the
       drawer layout takes over and this cap never applies. */
    max-width: 1440px;
    width: 100%;
}

/* Drawer controls are desktop-hidden; the sidebar is a static rail there. */
.seller-nav-burger[b-ewxuigli75],
.seller-nav-close[b-ewxuigli75],
.seller-sidebar-head .seller-nav-close[b-ewxuigli75],
.seller-scrim[b-ewxuigli75],
.seller-drawer-foot[b-ewxuigli75] {
    display: none;
}

.seller-sidebar-head[b-ewxuigli75] {
    display: flex;
    align-items: center;
}

/* Desktop keeps language / account / logout in the topbar. */
.seller-topbar-desktop[b-ewxuigli75] {
    display: flex;
    align-items: center;
    gap: 0.85rem;
}

@media (max-width: 820px) {
    /* The sidebar becomes an off-canvas drawer; main takes the full width. */
    .seller-topbar[b-ewxuigli75] {
        position: sticky;
        top: 0;
        z-index: 40;
        gap: 0.5rem;
    }

    .seller-nav-burger[b-ewxuigli75] {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 40px;
        height: 40px;
        border: none;
        background: none;
        color: var(--qq-ink);
        cursor: pointer;
        padding: 0;
        margin-right: 0.15rem;
    }

    .seller-nav-burger svg[b-ewxuigli75] {
        width: 22px;
        height: 22px;
    }

    .seller-sidebar[b-ewxuigli75] {
        position: fixed;
        top: 0;
        bottom: 0;
        left: 0;
        width: 78%;
        max-width: 320px;
        z-index: 60;
        transform: translateX(-100%);
        transition: transform 0.22s cubic-bezier(0.4, 0, 0.2, 1);
        overflow-y: auto;
        box-shadow: 0 0 40px rgba(23, 21, 18, 0.22);
    }

    .seller-sidebar.open[b-ewxuigli75] {
        transform: translateX(0);
    }

    .seller-sidebar-head .seller-nav-close[b-ewxuigli75] {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        margin-left: auto;
        width: 34px;
        height: 34px;
        border: none;
        background: none;
        font-size: 1.5rem;
        line-height: 1;
        color: var(--qq-text-muted);
        cursor: pointer;
    }

    .seller-scrim[b-ewxuigli75] {
        display: block;
        position: fixed;
        inset: 0;
        background: rgba(0, 0, 0, 0.45);
        z-index: 55;
        opacity: 0;
        visibility: hidden;
        transition: opacity 0.2s ease;
    }

    .seller-scrim.open[b-ewxuigli75] {
        opacity: 1;
        visibility: visible;
    }

    /* On a phone the topbar only holds the burger, title and bell — the wide
       language / account / logout controls move to the foot of the drawer. */
    .seller-topbar[b-ewxuigli75] {
        gap: 0.5rem;
    }

    .seller-topbar-desktop[b-ewxuigli75] {
        display: none;
    }

    .seller-topbar-title[b-ewxuigli75] {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        min-width: 0;
    }

    .seller-drawer-foot[b-ewxuigli75] {
        display: flex;
        flex-direction: column;
        gap: 0.75rem;
        margin-top: auto;
        padding-top: 1rem;
        border-top: 1px solid var(--qq-border);
    }

    .seller-drawer-account[b-ewxuigli75] {
        display: inline-flex;
        align-items: center;
        gap: 0.5rem;
        color: var(--qq-ink);
        text-decoration: none;
        font-weight: 600;
        font-size: 0.9rem;
    }

    .seller-drawer-account svg[b-ewxuigli75] {
        width: 16px;
        height: 16px;
        color: var(--qq-text-muted);
        flex-shrink: 0;
    }

    .seller-drawer-foot form[b-ewxuigli75] {
        margin: 0;
    }

    .seller-drawer-foot .qq-btn-outline[b-ewxuigli75] {
        width: 100%;
    }
}

#blazor-error-ui[b-ewxuigli75] {
    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-ewxuigli75] {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }
/* /Components/Shared/MessageThread.razor.rz.scp.css */
/* Emoji palette for the shared composer. The thread's own layout (qq-msg-*)
   stays in app.css where the thread pages share it; this file styles only what
   this component added. */

.qq-msg-emoji[b-7a6hfadh2p] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(2.1rem, 1fr));
    gap: 2px;
    padding: 0.45rem 0.6rem;
    border-top: 1px solid var(--qq-border);
    max-height: 9.5rem;
    overflow-y: auto;
    background: var(--qq-bg-soft, var(--qq-card, #fff));
}

.qq-msg-emoji button[b-7a6hfadh2p] {
    font-size: 1.15rem;
    line-height: 1;
    background: none;
    border: none;
    border-radius: 8px;
    padding: 0.3rem 0;
    cursor: pointer;
}

.qq-msg-emoji button:hover[b-7a6hfadh2p],
.qq-msg-emoji button:focus-visible[b-7a6hfadh2p] {
    background: var(--qq-accent-soft, rgba(0, 0, 0, 0.06));
}

.qq-msg-emoji-toggle[b-7a6hfadh2p] {
    align-self: flex-end;
    background: none;
    border: 1px solid var(--qq-border);
    border-radius: 10px;
    font-size: 1.05rem;
    line-height: 1;
    padding: 0.45rem 0.55rem;
    cursor: pointer;
}

.qq-msg-emoji-toggle[aria-expanded="true"][b-7a6hfadh2p] {
    background: var(--qq-accent-soft, rgba(0, 0, 0, 0.06));
}
/* /Components/Storefront/ConfirmBooking.razor.rz.scp.css */
/* 2a · Confirm your booking. One breakpoint at 768px: the sticky side column
   becomes a pinned bottom bar, the 4-up facts grid becomes label-value rows. */

.qq-cf-head[b-uztfslw45a] {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 6px;
}

.qq-cf-head a[b-uztfslw45a] {
    font-size: .85rem;
    font-weight: 600;
}

.qq-cf-title[b-uztfslw45a] {
    font-size: 1.7rem;
    letter-spacing: -.03em;
    margin: 0 0 1.25rem;
}

.qq-cf-grid[b-uztfslw45a] {
    display: grid;
    grid-template-columns: 1fr 348px;
    gap: 26px;
    align-items: start;
    max-width: 62rem;
}

.qq-cf-main[b-uztfslw45a] {
    display: flex;
    flex-direction: column;
    gap: 16px;
    min-width: 0;
}

.qq-cf-change[b-uztfslw45a] {
    font-size: .8rem;
    font-weight: 600;
}

.qq-cf-service[b-uztfslw45a] {
    display: flex;
    gap: 16px;
    padding-bottom: 16px;
    border-bottom: 1px solid var(--qq-border-soft);
}

.qq-cf-thumb[b-uztfslw45a] {
    width: 74px;
    height: 74px;
    border-radius: 14px;
    object-fit: cover;
    border: 1px solid var(--qq-border);
    flex: none;
}

.qq-cf-thumb-empty[b-uztfslw45a] {
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--qq-brass-soft);
    color: var(--qq-text-faint);
}

.qq-cf-service-name[b-uztfslw45a] {
    font-size: 1.1rem;
    font-weight: 700;
    letter-spacing: -.02em;
    line-height: 1.3;
}

.qq-cf-service-sub[b-uztfslw45a] {
    font-size: .85rem;
    color: var(--qq-text-muted);
    margin-top: 5px;
}

/* The hairlines between the four facts are the 1px grid gap over the border colour. */
.qq-cf-facts[b-uztfslw45a] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1px;
    background: var(--qq-border-soft);
    border-radius: 12px;
    overflow: hidden;
    margin-top: 16px;
}

.qq-cf-fact[b-uztfslw45a] {
    background: var(--qq-card);
    padding: 13px 14px;
    min-width: 0;
}

.qq-cf-fact-label[b-uztfslw45a] {
    font-family: var(--qq-admin-mono);
    font-size: .6rem;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--qq-text-faint);
    font-weight: 700;
}

.qq-cf-fact-value[b-uztfslw45a] {
    font-size: .92rem;
    font-weight: 700;
    margin-top: 5px;
}

.qq-cf-fact-sub[b-uztfslw45a] {
    font-size: .73rem;
    color: var(--qq-text-faint);
    margin-top: 2px;
}

.qq-cf-client[b-uztfslw45a] {
    display: flex;
    align-items: center;
    gap: 13px;
}

.qq-cf-avatar[b-uztfslw45a] {
    width: 42px;
    height: 42px;
    border-radius: 99px;
    background: var(--qq-brass-tint);
    color: var(--qq-brass-deep);
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: .9rem;
    flex: none;
}

.qq-cf-client-who[b-uztfslw45a] {
    min-width: 0;
}

.qq-cf-client-name[b-uztfslw45a] {
    font-size: .95rem;
    font-weight: 700;
}

.qq-cf-client-mail[b-uztfslw45a] {
    font-size: .8rem;
    color: var(--qq-text-muted);
    margin-top: 2px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Payment method radio cards: the whole card is the hit target; the native
   radio stays for keyboard and screen-reader users. */
.qq-cf-methods[b-uztfslw45a] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 11px;
}

.qq-cf-method[b-uztfslw45a] {
    display: flex;
    align-items: flex-start;
    gap: 11px;
    background: var(--qq-card);
    border: 1.5px solid var(--qq-border);
    border-radius: 14px;
    padding: 13px 14px;
    cursor: pointer;
    min-height: 44px;
}

.qq-cf-method.on[b-uztfslw45a] {
    border-color: var(--qq-brass);
    background: var(--qq-brass-soft);
}

.qq-cf-method input[b-uztfslw45a] {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.qq-cf-method-dot[b-uztfslw45a] {
    width: 19px;
    height: 19px;
    border-radius: 99px;
    border: 2px solid var(--qq-track-off);
    display: flex;
    align-items: center;
    justify-content: center;
    flex: none;
    margin-top: 1px;
}

.qq-cf-method.on .qq-cf-method-dot[b-uztfslw45a] {
    border-color: var(--qq-brass);
}

.qq-cf-method.on .qq-cf-method-dot[b-uztfslw45a]::after {
    content: "";
    width: 9px;
    height: 9px;
    border-radius: 99px;
    background: var(--qq-brass);
}

.qq-cf-method:focus-within[b-uztfslw45a] {
    outline: 2px solid var(--qq-brass);
    outline-offset: 2px;
}

.qq-cf-method-text[b-uztfslw45a] {
    min-width: 0;
}

.qq-cf-method-label[b-uztfslw45a] {
    display: block;
    font-size: .85rem;
    font-weight: 700;
}

.qq-cf-method-hint[b-uztfslw45a] {
    display: block;
    font-size: .73rem;
    color: var(--qq-text-muted);
    line-height: 1.45;
    margin-top: 3px;
}

/* Single-option notes (green pay-on-site / amber prepay). */
.qq-cf-note[b-uztfslw45a] {
    display: flex;
    gap: 12px;
    border-radius: 16px;
    padding: 16px 18px;
}

.qq-cf-note-ok[b-uztfslw45a] {
    background: var(--qq-ok-bg);
    color: var(--qq-ok-fg);
}

.qq-cf-note-warn[b-uztfslw45a] {
    background: var(--qq-warn-bg);
    color: var(--qq-warn-fg);
}

.qq-cf-note svg[b-uztfslw45a] {
    flex: none;
    margin-top: 1px;
}

.qq-cf-note-title[b-uztfslw45a] {
    font-size: .92rem;
    font-weight: 700;
}

.qq-cf-note-text[b-uztfslw45a] {
    font-size: .8rem;
    line-height: 1.5;
    margin-top: 3px;
}

/* Cancellation policy card — same surface on 2a, 2b and the emails. */
.qq-cf-policy[b-uztfslw45a] {
    background: var(--qq-brass-soft);
    border: 1px solid var(--qq-border);
    border-radius: 16px;
    padding: 18px;
}

.qq-cf-policy-head[b-uztfslw45a] {
    display: flex;
    align-items: center;
    gap: 9px;
    margin-bottom: 10px;
    color: var(--qq-brass-deep);
    font-size: .92rem;
    font-weight: 700;
}

.qq-cf-policy-text[b-uztfslw45a] {
    font-size: .8rem;
    color: var(--qq-text-body);
    line-height: 1.6;
}

/* Sticky side column (desktop). */
.qq-cf-side[b-uztfslw45a] {
    position: sticky;
    top: 12px;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.qq-cf-lines[b-uztfslw45a] {
    display: flex;
    flex-direction: column;
    gap: 9px;
}

.qq-cf-line[b-uztfslw45a] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 10px;
    font-size: .85rem;
    color: var(--qq-text-muted);
}

.qq-cf-line-total[b-uztfslw45a] {
    padding-top: 11px;
    margin-top: 2px;
    border-top: 1px solid var(--qq-border-soft);
    color: var(--qq-text);
    font-weight: 700;
    font-size: .95rem;
}

.qq-mono[b-uztfslw45a] {
    font-family: var(--qq-admin-mono);
    font-variant-numeric: tabular-nums;
}

.qq-cf-amount[b-uztfslw45a] {
    font-size: 1.4rem;
    font-weight: 700;
    color: var(--qq-brass-deep);
    line-height: 1;
}

.qq-cf-due-note[b-uztfslw45a] {
    font-size: .73rem;
    color: var(--qq-text-faint);
    line-height: 1.5;
}

.qq-cf-confirm[b-uztfslw45a] {
    height: 52px;
    border-radius: 99px;
    margin-top: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    width: 100%;
}

.qq-cf-spinner[b-uztfslw45a] {
    width: 15px;
    height: 15px;
    border-radius: 99px;
    border: 2px solid rgba(250, 248, 244, .35);
    border-top-color: #faf8f4;
    display: inline-block;
    animation: qq-cf-spin-b-uztfslw45a .8s linear infinite;
}

@keyframes qq-cf-spin-b-uztfslw45a {
    to { transform: rotate(360deg); }
}

.qq-cf-terms[b-uztfslw45a] {
    font-size: .73rem;
    color: var(--qq-text-faint);
    line-height: 1.5;
    text-align: center;
    margin-top: 11px;
}

.qq-cf-held[b-uztfslw45a] {
    display: flex;
    align-items: center;
    gap: 10px;
    background: var(--qq-mute-bg);
    border: 1px solid var(--qq-border);
    border-radius: 14px;
    padding: 12px 14px;
    color: var(--qq-text-body);
    font-size: .73rem;
    line-height: 1.45;
}

.qq-cf-held svg[b-uztfslw45a] {
    flex: none;
    color: var(--qq-text-faint);
}

/* Pinned mobile bar — hidden on desktop, fixed to the bottom under 768px. */
.qq-cf-pinned[b-uztfslw45a] {
    display: none;
}

@media (max-width: 767.98px) {
    .qq-cf-grid[b-uztfslw45a] {
        grid-template-columns: 1fr;
        /* Room for the pinned bar so the last card is never covered. */
        padding-bottom: 132px;
    }

    .qq-cf-side[b-uztfslw45a] {
        display: none;
    }

    .qq-cf-facts[b-uztfslw45a] {
        grid-template-columns: 1fr;
        gap: 0;
        background: transparent;
        border-radius: 0;
    }

    .qq-cf-fact[b-uztfslw45a] {
        display: flex;
        align-items: baseline;
        gap: 8px;
        padding: 8px 0;
        background: transparent;
        border-bottom: 1px solid var(--qq-border-soft);
    }

    .qq-cf-fact:last-child[b-uztfslw45a] {
        border-bottom: 0;
    }

    .qq-cf-fact-label[b-uztfslw45a] {
        flex: none;
    }

    .qq-cf-fact-value[b-uztfslw45a] {
        margin-top: 0;
        margin-left: auto;
        text-align: right;
    }

    .qq-cf-fact-sub[b-uztfslw45a] {
        margin-top: 0;
        flex: none;
    }

    .qq-cf-methods[b-uztfslw45a] {
        grid-template-columns: 1fr;
    }

    .qq-cf-pinned[b-uztfslw45a] {
        display: block;
        position: fixed;
        inset: auto 0 0 0;
        background: var(--qq-paper);
        border-top: 1px solid var(--qq-border-soft);
        box-shadow: 0 -6px 18px rgba(23, 21, 18, .05);
        padding: 12px 16px calc(16px + env(safe-area-inset-bottom));
        z-index: 1030;
    }

    .qq-cf-pinned-due[b-uztfslw45a] {
        display: flex;
        align-items: center;
        justify-content: space-between;
        margin-bottom: 9px;
        font-size: .8rem;
        color: var(--qq-text-muted);
    }

    .qq-cf-pinned-due .qq-mono[b-uztfslw45a] {
        font-size: 1rem;
        font-weight: 700;
        color: var(--qq-text);
    }

    .qq-cf-pinned .qq-cf-confirm[b-uztfslw45a] {
        margin-top: 0;
    }
}