/* _content/ApexSupps.Client.Admin/Pages/Admin/Fulfillment/FulfillmentBadge.razor.rz.scp.css */
.ff-badge[b-kiisnnz8hz] { font-weight: 600; font-size: .74rem; margin: 0 .25rem .2rem 0; letter-spacing: .01em; white-space: nowrap; }
.ff-pay-paid[b-kiisnnz8hz] { background: #d1f0dc; color: #0f5132; }
.ff-pay-unpaid[b-kiisnnz8hz] { background: #fff0c2; color: #6b4b00; border: 1px solid #e0b000; }
.ff-pay-review[b-kiisnnz8hz] { background: #dbe9ff; color: #0b3d91; }
.ff-pay-refund[b-kiisnnz8hz] { background: #e7e7ea; color: #333; }
.ff-pay-cancel[b-kiisnnz8hz] { background: #343a40; color: #fff; }
.ff-st-notready[b-kiisnnz8hz] { background: #f8d7da; color: #842029; border: 1px solid #e4a3aa; }
.ff-st-ready[b-kiisnnz8hz] { background: #0d6efd; color: #fff; }
.ff-st-packed[b-kiisnnz8hz] { background: #6f42c1; color: #fff; }
.ff-st-label[b-kiisnnz8hz] { background: #fd7e14; color: #fff; }
.ff-st-carrier[b-kiisnnz8hz] { background: #198754; color: #fff; }
.ff-st-delivered[b-kiisnnz8hz] { background: #0f5132; color: #fff; }
.ff-hold[b-kiisnnz8hz] { background: #fff; color: #842029; border: 1px solid #842029; border-radius: .25rem; }
.ff-warn[b-kiisnnz8hz] { background: #fff3cd; color: #664d03; border: 1px solid #c79800; border-radius: .25rem; }
.ff-note[b-kiisnnz8hz] { background: #f1f3f5; color: #495057; border: 1px dashed #adb5bd; border-radius: .25rem; }
/* _content/ApexSupps.Client.Admin/Pages/Admin/Fulfillment/FulfillmentOrderPage.razor.rz.scp.css */
.ff-page[b-pt0r6fhbgj] { max-width: 1320px; margin: 0 auto; padding: 8px 12px 32px; }
.ff-back[b-pt0r6fhbgj] { color: rgba(255,255,255,.8); font-size: .85rem; text-decoration: none; }
.ff-title[b-pt0r6fhbgj] { display: flex; justify-content: space-between; align-items: flex-end; gap: 12px; flex-wrap: wrap; margin: 6px 0 10px; }
.ff-ordno-big[b-pt0r6fhbgj] { color: #fff; font-weight: 800; font-size: 1.9rem; margin: 0; letter-spacing: .01em; }
.ff-sub[b-pt0r6fhbgj] { color: rgba(255,255,255,.7); font-size: .85rem; }
.ff-status-block[b-pt0r6fhbgj] { display: flex; flex-direction: column; gap: 4px; background: #fff; border-radius: 8px; padding: 8px 12px; }
.ff-lbl[b-pt0r6fhbgj] { display: inline-block; width: 82px; font-size: .7rem; text-transform: uppercase; letter-spacing: .04em; color: #6c757d; }
.ff-holdbox[b-pt0r6fhbgj] { background: #fff5f5; border: 2px solid #dc3545; border-radius: 8px; padding: 10px 14px; margin-bottom: 10px; color: #58151c; }
.ff-holdhead[b-pt0r6fhbgj] { font-weight: 800; margin-bottom: 4px; }
.ff-holdbox ul[b-pt0r6fhbgj] { margin: 0; padding-left: 18px; font-size: .88rem; }
.ff-grid[b-pt0r6fhbgj] { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-bottom: 10px; }
.ff-card[b-pt0r6fhbgj] { background: #fff; border-radius: 8px; padding: 12px 14px; margin-bottom: 10px; min-width: 0; }
.ff-grid > .ff-card[b-pt0r6fhbgj] { margin-bottom: 0; }
.ff-card h6[b-pt0r6fhbgj] { font-weight: 800; font-size: .82rem; text-transform: uppercase; letter-spacing: .05em; margin-bottom: 8px; }
.ff-btns[b-pt0r6fhbgj] { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 6px; }
.ff-gate[b-pt0r6fhbgj] { color: #842029; }
.ff-override[b-pt0r6fhbgj] { margin-top: 6px; }
.ff-addr[b-pt0r6fhbgj] { font-size: .95rem; line-height: 1.35; margin-bottom: 8px; }
.ff-dl[b-pt0r6fhbgj] { display: grid; grid-template-columns: 90px 1fr; gap: 2px 8px; font-size: .86rem; margin: 0; }
.ff-dl dt[b-pt0r6fhbgj] { color: #6c757d; font-weight: 500; }
.ff-dl dd[b-pt0r6fhbgj] { margin: 0; }
.ff-dim[b-pt0r6fhbgj] { font-size: .78rem; color: #6c757d; }
.ff-mono[b-pt0r6fhbgj] { font-family: Menlo, Consolas, monospace; font-size: .8rem; }
.ff-tag[b-pt0r6fhbgj] { font-size: .66rem; background: #6f42c1; color: #fff; border-radius: 3px; padding: 1px 4px; margin-right: 4px; vertical-align: middle; }
.ff-items th[b-pt0r6fhbgj] { font-size: .72rem; text-transform: uppercase; color: #555; background: #fafafa; }
.ff-items tr.ff-bundle td[b-pt0r6fhbgj] { background: #f4f0fb; }
.ff-items tr.ff-comp td:first-child[b-pt0r6fhbgj] { padding-left: 24px; }
.ff-money-table td[b-pt0r6fhbgj] { font-size: .88rem; font-variant-numeric: tabular-nums; }
.ff-timeline[b-pt0r6fhbgj] { list-style: none; padding: 0; margin: 0; font-size: .86rem; }
.ff-timeline li[b-pt0r6fhbgj] { border-left: 2px solid #dee2e6; padding: 0 0 8px 10px; }
.ff-internal[b-pt0r6fhbgj] { border: 2px dashed #6c757d; background: #fbfbfb; }
.ff-internal-tag[b-pt0r6fhbgj] { background: #212529; color: #fff; border-radius: 3px; padding: 1px 6px; font-size: .68rem; margin-right: 4px; }
.ff-note[b-pt0r6fhbgj] { border-bottom: 1px solid #eee; padding: 4px 0; font-size: .88rem; }
@media (max-width: 767.98px) {
    .ff-page[b-pt0r6fhbgj] { padding: 6px 8px 24px; }
    .ff-grid[b-pt0r6fhbgj] { grid-template-columns: 1fr; }
    .ff-ordno-big[b-pt0r6fhbgj] { font-size: 1.5rem; }
    .ff-status-block[b-pt0r6fhbgj] { width: 100%; }
    .ff-items[b-pt0r6fhbgj] { font-size: .82rem; }
    .ff-items th:nth-child(4)[b-pt0r6fhbgj], .ff-items td:nth-child(4)[b-pt0r6fhbgj] { display: none; }
    .ff-btns .btn[b-pt0r6fhbgj] { flex: 1 1 calc(50% - 6px); }
}
/* _content/ApexSupps.Client.Admin/Pages/Admin/Fulfillment/FulfillmentQueuePage.razor.rz.scp.css */
.ff-page[b-oavhk8wz04] { max-width: 1320px; margin: 0 auto; padding: 0 12px 32px; }
.ff-head[b-oavhk8wz04] { display: flex; justify-content: space-between; align-items: flex-end; gap: 12px; flex-wrap: wrap; margin: 12px 0 10px; }
.ff-sub[b-oavhk8wz04] { color: rgba(255,255,255,.65); font-size: .85rem; }
.ff-head-actions[b-oavhk8wz04] { display: flex; gap: 8px; flex-wrap: wrap; }
.ff-chips[b-oavhk8wz04] { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 10px; }
.ff-chip[b-oavhk8wz04] { border: 1px solid rgba(255,255,255,.3); background: rgba(255,255,255,.06); color: #fff; border-radius: 999px; padding: 4px 12px; font-size: .82rem; }
.ff-chip b[b-oavhk8wz04] { margin-left: 4px; }
.ff-chip.active[b-oavhk8wz04] { background: #fff; color: #111; border-color: #fff; }
.ff-chip-held[b-oavhk8wz04] { border-color: #f1aeb5; }
.ff-chip-held.active[b-oavhk8wz04] { background: #f8d7da; color: #842029; }
.ff-filters[b-oavhk8wz04] { display: flex; flex-wrap: wrap; gap: 8px; align-items: flex-end; background: #fff; border-radius: 8px; padding: 10px 12px; margin-bottom: 10px; }
.ff-f[b-oavhk8wz04] { display: flex; flex-direction: column; min-width: 130px; }
.ff-f .form-label[b-oavhk8wz04] { font-size: .72rem; text-transform: uppercase; letter-spacing: .04em; color: #555; margin-bottom: 2px; }
.ff-f-search[b-oavhk8wz04] { flex: 1 1 260px; }
.ff-f-btn[b-oavhk8wz04] { flex-direction: row; gap: 4px; min-width: 0; }
.ff-card[b-oavhk8wz04] { background: #fff; border-radius: 8px; overflow: hidden; }
.ff-count[b-oavhk8wz04] { font-size: .8rem; color: #555; padding: 8px 12px; border-bottom: 1px solid #eee; }
.ff-table th[b-oavhk8wz04] { font-size: .72rem; text-transform: uppercase; letter-spacing: .04em; color: #555; background: #fafafa; padding: 8px 10px; }
.ff-table td[b-oavhk8wz04] { padding: 9px 10px; border-color: #eee; }
.ff-row-held td:first-child[b-oavhk8wz04] { box-shadow: inset 4px 0 0 #dc3545; }
.ff-ck[b-oavhk8wz04] { width: 34px; }
.ff-ordno[b-oavhk8wz04] { font-weight: 700; font-size: .98rem; color: #0b3d91; text-decoration: none; }
.ff-dim[b-oavhk8wz04] { font-size: .76rem; color: #6c757d; }
.ff-name[b-oavhk8wz04] { font-weight: 600; font-size: .88rem; }
.ff-svc[b-oavhk8wz04] { font-size: .85rem; }
.ff-money[b-oavhk8wz04] { font-variant-numeric: tabular-nums; font-weight: 600; }
.ff-tag[b-oavhk8wz04] { font-size: .68rem; border: 1px solid #6f42c1; color: #6f42c1; border-radius: 4px; padding: 0 4px; margin-left: 2px; }
.ff-pager[b-oavhk8wz04] { display: flex; justify-content: space-between; align-items: center; padding: 8px 12px; border-top: 1px solid #eee; }
.ff-cards[b-oavhk8wz04] { padding: 8px; display: flex; flex-direction: column; gap: 8px; }
.ff-mcard[b-oavhk8wz04] { display: block; border: 1px solid #e5e5e5; border-radius: 8px; padding: 10px 12px; color: #111; text-decoration: none; }
.ff-mcard.ff-row-held[b-oavhk8wz04] { border-left: 4px solid #dc3545; }
.ff-mtop[b-oavhk8wz04] { display: flex; justify-content: space-between; align-items: baseline; }
.ff-mrow[b-oavhk8wz04] { display: flex; align-items: center; flex-wrap: wrap; gap: 4px; margin-top: 4px; }
.ff-mlbl[b-oavhk8wz04] { font-size: .7rem; text-transform: uppercase; color: #6c757d; width: 78px; }
@media (max-width: 767.98px) {
    .ff-page[b-oavhk8wz04] { padding: 0 8px 24px; }
    .ff-f[b-oavhk8wz04] { min-width: calc(50% - 8px); flex: 1 1 calc(50% - 8px); }
    .ff-f-search[b-oavhk8wz04] { flex-basis: 100%; }
    .ff-head-actions .btn[b-oavhk8wz04] { flex: 1 1 auto; }
}
/* _content/ApexSupps.Client.Admin/Pages/Admin/Inventory/BundleManagementPage.razor.rz.scp.css */
/* Bundles (round 16): light admin canvas (.ca-light), dark readable text on white panels, blue primary buttons.
   Tokens come from cosmetics-admin.css (--ca-*), with fallbacks so the page stays readable if that sheet is missing. */
.bd[b-n0cuexgp9e] {
    --bd-ink: var(--ca-ink, #172033);
    --bd-navy: var(--ca-navy, #10213a);
    --bd-muted: var(--ca-muted, #4a5870);
    --bd-line: var(--ca-line, #dde2ea);
    --bd-cobalt: var(--ca-cobalt, #2346b8);
    --bd-cobalt-dark: var(--ca-cobalt-dark, #1a3590);
    --bd-cobalt-soft: var(--ca-cobalt-soft, #e8edfb);
    --bd-amber-bg: #fff1db;
    --bd-amber-ink: #7a4100;
    --bd-amber-line: #e7b46a;
    color: var(--bd-ink);
    font-size: 15px;
    width: 100%;
    max-width: 100%;
    min-width: 0;
}

/* ---------- heading ---------- */
.bd-head[b-n0cuexgp9e] { margin: 0 0 16px; }
.bd-title[b-n0cuexgp9e] { margin: 0; color: var(--bd-navy); font-family: 'Space Grotesk', 'Inter', sans-serif; font-size: 28px; font-weight: 700; letter-spacing: -.01em; }
.bd-intro[b-n0cuexgp9e] { margin: 6px 0 0; color: var(--bd-muted); font-size: 15px; max-width: 70ch; }

/* ---------- toolbar ---------- */
.bd-toolbar[b-n0cuexgp9e] {
    display: grid;
    grid-template-columns: minmax(220px, 1.6fr) minmax(170px, .8fr) auto;
    gap: 12px 14px;
    align-items: end;
    margin-bottom: 10px;
}
.bd-field[b-n0cuexgp9e] { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.bd-field label[b-n0cuexgp9e], .bd-label[b-n0cuexgp9e] { color: var(--bd-navy); font-size: 13px; font-weight: 650; }
.bd-field input:not([type=checkbox]):not([type=radio])[b-n0cuexgp9e], .bd-field select[b-n0cuexgp9e], .bd-field textarea[b-n0cuexgp9e] {
    min-height: 42px;
    padding: 8px 12px;
    border: 1px solid #b9c1ce;
    border-radius: 8px;
    background: #fff;
    color: var(--bd-ink);
    font-size: 15px;
    width: 100%;
    max-width: 100%;
}
.bd-field textarea[b-n0cuexgp9e] { min-height: 96px; resize: vertical; font-family: inherit; }
.bd-field input:focus[b-n0cuexgp9e], .bd-field select:focus[b-n0cuexgp9e], .bd-field textarea:focus[b-n0cuexgp9e] { outline: 3px solid rgba(35, 70, 184, .25); border-color: var(--bd-cobalt); }
.bd-field [aria-invalid=true][b-n0cuexgp9e] { border-color: #c53030; }
.bd-actions[b-n0cuexgp9e] { display: flex; gap: 10px; align-items: end; justify-content: flex-end; }

.bd-btn[b-n0cuexgp9e] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-height: 44px;
    padding: 8px 16px;
    border: 1.5px solid var(--bd-navy);
    border-radius: 8px;
    background: #fff;
    color: var(--bd-navy);
    font-size: 15px;
    font-weight: 650;
    text-decoration: none;
    white-space: nowrap;
    cursor: pointer;
}
.bd-btn:hover:not(:disabled)[b-n0cuexgp9e] { background: var(--bd-cobalt-soft); color: var(--bd-navy); }
.bd-btn:disabled[b-n0cuexgp9e] { border-color: #b9c1ce; color: #6b7588; cursor: not-allowed; background: #f1f3f7; }
.bd-btn.primary[b-n0cuexgp9e] { border-color: var(--bd-cobalt); background: var(--bd-cobalt); color: #fff; }
.bd-btn.primary:hover:not(:disabled)[b-n0cuexgp9e] { background: var(--bd-cobalt-dark); color: #fff; }
.bd-btn.primary:disabled[b-n0cuexgp9e] { background: #9aa9d9; border-color: #9aa9d9; color: #fff; }
.bd-btn.danger[b-n0cuexgp9e] { border-color: #9f1d1d; color: #9f1d1d; }
.bd-btn.danger:hover:not(:disabled)[b-n0cuexgp9e] { background: #fde2e2; color: #7f1414; }

.bd-linkbtn[b-n0cuexgp9e] {
    min-height: 44px;
    padding: 6px 4px;
    border: 0;
    background: none;
    color: var(--bd-cobalt-dark);
    font-size: 14px;
    font-weight: 650;
    text-decoration: underline;
    text-underline-offset: 2px;
    cursor: pointer;
}

.bd-meta[b-n0cuexgp9e] {
    display: flex;
    flex-wrap: wrap;
    gap: 4px 18px;
    align-items: center;
    justify-content: space-between;
    min-height: 32px;
    margin: 4px 0 10px;
    color: var(--bd-muted);
    font-size: 14px;
}

/* ---------- states ---------- */
.bd-state[b-n0cuexgp9e] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    align-items: flex-start;
    padding: 22px;
    border: 1px dashed #c6ccd6;
    border-radius: 12px;
    background: #fff;
    color: var(--bd-ink);
}
.bd-state strong[b-n0cuexgp9e] { color: var(--bd-navy); font-size: 16px; }
.bd-state.is-error[b-n0cuexgp9e] { border-style: solid; border-color: #f0b4b4; background: #fff7f7; }
.bd-state[data-test="bd-loading"][b-n0cuexgp9e] { flex-direction: row; align-items: center; gap: 12px; }
.bd-spinner[b-n0cuexgp9e] {
    width: 20px; height: 20px;
    border: 3px solid var(--bd-cobalt-soft);
    border-top-color: var(--bd-cobalt);
    border-radius: 50%;
    animation: bd-spin-b-n0cuexgp9e .8s linear infinite;
}
@keyframes bd-spin-b-n0cuexgp9e { to { transform: rotate(360deg); } }

/* ---------- list ---------- */
.bd-table-wrap[b-n0cuexgp9e] { width: 100%; border: 1px solid var(--bd-line); border-radius: 12px; background: #fff; overflow: hidden; }
.bd-table-wrap.is-plain[b-n0cuexgp9e] { border-radius: 8px; overflow-x: auto; }
.bd-table[b-n0cuexgp9e], .bd-mini[b-n0cuexgp9e] { width: 100%; border-collapse: collapse; }
.bd-table thead th[b-n0cuexgp9e], .bd-mini thead th[b-n0cuexgp9e] {
    padding: 12px 14px;
    border-bottom: 1px solid var(--bd-line);
    background: #f3f5f9;
    color: var(--bd-navy);
    font-size: 13px;
    font-weight: 700;
    text-align: left;
    white-space: nowrap;
}
.bd-table td[b-n0cuexgp9e], .bd-table tbody th[b-n0cuexgp9e], .bd-mini td[b-n0cuexgp9e] {
    padding: 12px 14px;
    border-bottom: 1px solid #edf0f4;
    color: var(--bd-ink);
    font-weight: 400;
    text-align: left;
    vertical-align: middle;
}
.bd-table tbody tr:last-child td[b-n0cuexgp9e], .bd-table tbody tr:last-child th[b-n0cuexgp9e] { border-bottom: 0; }
.bd-table tbody tr:hover td[b-n0cuexgp9e], .bd-table tbody tr:hover th[b-n0cuexgp9e] { background: #fafbfe; }
.bd-table .num[b-n0cuexgp9e], .bd-mini .num[b-n0cuexgp9e] { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
.bd-mini td[b-n0cuexgp9e] { padding: 9px 12px; font-size: 14px; }
.bd-mini tr.is-limiting td[b-n0cuexgp9e] { background: #fffaf0; }

.bd-name-cell[b-n0cuexgp9e] { min-width: 220px; }
.bd-product[b-n0cuexgp9e] { display: flex; gap: 12px; align-items: center; }
.bd-thumb[b-n0cuexgp9e] { flex: 0 0 auto; width: 52px; height: 52px; border-radius: 8px; object-fit: cover; background: #f1f3f7; border: 1px solid var(--bd-line); }
.bd-thumb.is-empty[b-n0cuexgp9e] { display: inline-flex; align-items: center; justify-content: center; color: #6b7588; font-size: 10px; text-align: center; }
.bd-name[b-n0cuexgp9e] { color: var(--bd-navy); font-weight: 650; overflow-wrap: anywhere; }
.bd-strong[b-n0cuexgp9e] { display: block; font-weight: 650; font-variant-numeric: tabular-nums; }
.bd-sub[b-n0cuexgp9e] { display: block; color: var(--bd-muted); font-size: 13px; line-height: 1.35; }
.bd-muted[b-n0cuexgp9e] { color: var(--bd-muted); }
.bd-code[b-n0cuexgp9e] { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 12.5px; overflow-wrap: anywhere; }
.bd-col-edit[b-n0cuexgp9e] { width: 90px; text-align: right !important; }
.bd-edit[b-n0cuexgp9e] {
    display: inline-flex;
    align-items: center;
    min-height: 40px;
    padding: 6px 16px;
    border: 1.5px solid var(--bd-cobalt);
    border-radius: 8px;
    color: var(--bd-cobalt-dark);
    font-weight: 650;
    text-decoration: none;
}
.bd-edit:hover[b-n0cuexgp9e] { background: var(--bd-cobalt-soft); }

.bd-status[b-n0cuexgp9e] { display: inline-block; padding: 2px 10px; border-radius: 999px; font-size: 13px; font-weight: 650; white-space: nowrap; }
.bd-status.is-active[b-n0cuexgp9e] { background: #dcfce7; color: #14532d; }
.bd-status.is-inactive[b-n0cuexgp9e] { background: #eef1f6; color: #33415a; }
.bd-status.is-setup[b-n0cuexgp9e] { background: var(--bd-amber-bg); color: var(--bd-amber-ink); border: 1px solid var(--bd-amber-line); }
.bd-setup-text[b-n0cuexgp9e] { max-width: 30ch; }
.bd-setup[b-n0cuexgp9e] { display: inline-block; margin-top: 4px; color: var(--bd-cobalt-dark); font-size: 14px; font-weight: 650; }

.bd-tag[b-n0cuexgp9e] { display: inline-block; margin-left: 6px; padding: 0 8px; border-radius: 999px; background: #eef1f6; color: #33415a; font-size: 12px; font-weight: 700; }
.bd-tag.is-warn[b-n0cuexgp9e] { background: var(--bd-amber-bg); color: var(--bd-amber-ink); }
.bd-tag.is-bad[b-n0cuexgp9e] { background: #fde2e2; color: #9f1d1d; }

/* ---------- advanced ---------- */
.bd-advanced[b-n0cuexgp9e] { margin-top: 22px; border: 1px solid var(--bd-line); border-radius: 12px; background: #fff; }
.bd-advanced > summary[b-n0cuexgp9e] { min-height: 48px; display: flex; align-items: center; padding: 0 16px; cursor: pointer; color: var(--bd-navy); font-weight: 650; }
.bd-advanced-body[b-n0cuexgp9e] { padding: 0 16px 16px; display: flex; flex-direction: column; gap: 10px; }
.bd-dl[b-n0cuexgp9e] { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 10px 18px; margin: 0; }
.bd-dl dt[b-n0cuexgp9e] { color: var(--bd-muted); font-size: 13px; font-weight: 650; }
.bd-dl dd[b-n0cuexgp9e] { margin: 2px 0 0; }
.bd-remove[b-n0cuexgp9e] { border-top: 1px solid #edf0f4; padding-top: 12px; }
.bd-remove-row[b-n0cuexgp9e] { display: flex; flex-wrap: wrap; gap: 10px; align-items: end; }
.bd-grow[b-n0cuexgp9e] { flex: 1 1 240px; }

/* ---------- editor ---------- */
.bd-edhead[b-n0cuexgp9e] { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px; margin-bottom: 16px; }
.bd-edhead .bd-title[b-n0cuexgp9e] { font-size: 24px; flex: 0 1 auto; min-width: 0; overflow-wrap: anywhere; }
.bd-back[b-n0cuexgp9e] { flex: 1 0 100%; color: var(--bd-cobalt-dark); font-weight: 650; text-decoration: none; min-height: 32px; display: inline-flex; align-items: center; }
.bd-editor[b-n0cuexgp9e] { display: flex; flex-direction: column; gap: 16px; max-width: 980px; }
.bd-card[b-n0cuexgp9e] { padding: 18px 20px; border: 1px solid var(--bd-line); border-radius: 12px; background: #fff; }
.bd-card:focus[b-n0cuexgp9e] { outline: none; }
.bd-h[b-n0cuexgp9e] { margin: 0 0 12px; color: var(--bd-navy); font-family: 'Inter', sans-serif; font-size: 17px; font-weight: 700; }
.bd-grid[b-n0cuexgp9e] { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 16px; }
.bd-grid-3[b-n0cuexgp9e] { grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: end; }
.bd-wide[b-n0cuexgp9e] { grid-column: 1 / -1; }
.bd-req[b-n0cuexgp9e] { color: var(--bd-muted); font-weight: 500; font-size: 12px; }
.bd-hint[b-n0cuexgp9e] { margin: 6px 0 0; color: var(--bd-muted); font-size: 13.5px; line-height: 1.45; }
.bd-hint.is-warn[b-n0cuexgp9e] { color: var(--bd-amber-ink); font-weight: 600; }
.bd-err[b-n0cuexgp9e] { color: #9f1d1d; font-size: 13.5px; font-weight: 600; }
.bd-switches[b-n0cuexgp9e] { justify-content: center; }
.bd-switch[b-n0cuexgp9e] { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; color: var(--bd-ink); font-size: 15px; font-weight: 500 !important; cursor: pointer; }
.bd-switch input[b-n0cuexgp9e] { width: 18px; height: 18px; }
.bd-photo[b-n0cuexgp9e] { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
.bd-photo img[b-n0cuexgp9e] { width: 96px; height: 96px; object-fit: cover; border-radius: 10px; border: 1px solid var(--bd-line); }
.bd-photo-empty[b-n0cuexgp9e] { display: inline-flex; align-items: center; justify-content: center; width: 96px; height: 96px; border-radius: 10px; border: 1px dashed #c6ccd6; color: var(--bd-muted); font-size: 12px; text-align: center; }
.bd-photo-field[b-n0cuexgp9e] { grid-column: 1 / -1; }

.bd-items[b-n0cuexgp9e] { display: flex; flex-direction: column; gap: 10px; margin: 6px 0 12px; }
.bd-item[b-n0cuexgp9e] { display: grid; grid-template-columns: minmax(0, 1fr) 110px auto; gap: 10px; align-items: end; padding: 10px 12px; border: 1px solid #edf0f4; border-radius: 10px; background: #fafbfd; }
.bd-summary[b-n0cuexgp9e] { margin: 14px 0 0; padding: 10px 14px; border-left: 4px solid var(--bd-cobalt); border-radius: 6px; background: var(--bd-cobalt-soft); color: var(--bd-navy); font-weight: 600; }

.bd-radios[b-n0cuexgp9e] { display: flex; flex-direction: column; gap: 8px; margin: 0; padding: 0; border: 0; }
.bd-radio[b-n0cuexgp9e] { display: flex; gap: 10px; align-items: flex-start; padding: 10px 12px; border: 1px solid #edf0f4; border-radius: 10px; cursor: pointer; }
.bd-radio input[b-n0cuexgp9e] { width: 18px; height: 18px; margin-top: 3px; flex: 0 0 auto; }
.bd-radio:has(input:checked)[b-n0cuexgp9e] { border-color: var(--bd-cobalt); background: var(--bd-cobalt-soft); }
.bd-radio strong[b-n0cuexgp9e] { color: var(--bd-navy); }

.bd-needs[b-n0cuexgp9e] { display: flex; flex-wrap: wrap; gap: 6px 12px; align-items: center; padding: 10px 14px; border: 1px solid var(--bd-amber-line); border-radius: 10px; background: #fffaf0; color: var(--bd-amber-ink); font-weight: 600; }
.bd-avail-main[b-n0cuexgp9e] { margin: 0; display: flex; flex-wrap: wrap; gap: 4px 14px; align-items: baseline; }
.bd-avail-main strong[b-n0cuexgp9e] { color: var(--bd-navy); font-size: 20px; }
.bd-avail-limit[b-n0cuexgp9e] { color: var(--bd-amber-ink); font-weight: 650; }
.bd-details[b-n0cuexgp9e] { margin-top: 10px; }
.bd-details > summary[b-n0cuexgp9e] { min-height: 44px; display: inline-flex; align-items: center; color: var(--bd-cobalt-dark); font-weight: 650; cursor: pointer; }
.bd-errors[b-n0cuexgp9e] { padding: 12px 16px; border: 1px solid #f0b4b4; border-radius: 10px; background: #fff7f7; color: #7f1414; }
.bd-errors ul[b-n0cuexgp9e] { margin: 6px 0 0; padding-left: 20px; }

.bd-footer[b-n0cuexgp9e] {
    position: sticky;
    bottom: 0;
    z-index: 5;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    align-items: center;
    justify-content: flex-end;
    padding: 12px 16px;
    border: 1px solid var(--bd-line);
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 -6px 18px rgba(16, 33, 58, .06);
}
.bd-footer .bd-muted[b-n0cuexgp9e] { margin-right: auto; font-size: 14px; }

/* ---------- dialog ---------- */
.bd-overlay[b-n0cuexgp9e] { position: fixed; inset: 0; z-index: 1040; background: rgba(12, 24, 41, .45); }
.bd-dialog[b-n0cuexgp9e] {
    position: fixed; z-index: 1050; top: 50%; left: 50%; transform: translate(-50%, -50%);
    width: min(520px, calc(100vw - 32px)); padding: 20px; border-radius: 14px; background: #fff; color: var(--bd-ink);
    box-shadow: 0 24px 60px rgba(12, 24, 41, .3);
}
.bd-dialog-title[b-n0cuexgp9e] { margin: 0 0 8px; color: var(--bd-navy); font-size: 19px; font-weight: 700; }
.bd-dialog-actions[b-n0cuexgp9e] { display: flex; flex-wrap: wrap; gap: 10px; justify-content: flex-end; margin-top: 14px; }

/* ---------- tablet ---------- */
@media (max-width: 1000px) {
    .bd-toolbar[b-n0cuexgp9e] { grid-template-columns: 1fr 1fr; }
    .bd-search[b-n0cuexgp9e] { grid-column: 1 / -1; }
}

/* ---------- phone: each bundle becomes a card ---------- */
@media (max-width: 760px) {
    .bd-title[b-n0cuexgp9e] { font-size: 24px; }
    .bd-toolbar[b-n0cuexgp9e] { grid-template-columns: 1fr; }
    .bd-actions[b-n0cuexgp9e] { justify-content: stretch; }
    .bd-actions .bd-btn[b-n0cuexgp9e] { width: 100%; }

    .bd-table-wrap:not(.is-plain)[b-n0cuexgp9e] { border: 0; background: none; overflow: visible; }
    .bd-table[b-n0cuexgp9e], .bd-table tbody[b-n0cuexgp9e], .bd-table tr[b-n0cuexgp9e], .bd-table td[b-n0cuexgp9e], .bd-table tbody th[b-n0cuexgp9e] { display: block; width: 100%; }
    .bd-table thead[b-n0cuexgp9e] { display: none; }
    .bd-table tr.bd-row[b-n0cuexgp9e] { margin-bottom: 12px; border: 1px solid var(--bd-line); border-radius: 12px; background: #fff; overflow: hidden; }
    .bd-table td[b-n0cuexgp9e], .bd-table tbody th[b-n0cuexgp9e] { border: 0; padding: 4px 14px; }
    .bd-table .bd-name-cell[b-n0cuexgp9e] { padding: 14px 14px 10px; border-bottom: 1px solid #edf0f4; min-width: 0; }
    .bd-table td[data-label][b-n0cuexgp9e] { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 8px; text-align: left; }
    .bd-table td[data-label][b-n0cuexgp9e]::before { content: attr(data-label); flex: 0 0 84px; color: var(--bd-muted); font-size: 13px; font-weight: 600; }
    .bd-table td[data-label] > *[b-n0cuexgp9e] { min-width: 0; }
    .bd-table td[data-label] .bd-sub[b-n0cuexgp9e], .bd-table td[data-label] .bd-setup[b-n0cuexgp9e] { flex: 1 1 100%; padding-left: 92px; }
    .bd-table td[data-label] .bd-strong[b-n0cuexgp9e] { display: inline; }
    .bd-table .num[b-n0cuexgp9e] { text-align: left; }
    .bd-table .bd-col-edit[b-n0cuexgp9e] { padding: 8px 14px 14px; width: 100%; text-align: left !important; }
    .bd-edit[b-n0cuexgp9e] { width: 100%; justify-content: center; min-height: 44px; }
    .bd-setup-text[b-n0cuexgp9e] { max-width: none; }

    .bd-mini thead[b-n0cuexgp9e] { display: none; }
    .bd-mini[b-n0cuexgp9e], .bd-mini tbody[b-n0cuexgp9e], .bd-mini tr[b-n0cuexgp9e], .bd-mini td[b-n0cuexgp9e] { display: block; width: 100%; }
    .bd-mini tr[b-n0cuexgp9e] { padding: 8px 0; border-bottom: 1px solid #edf0f4; }
    .bd-mini td[b-n0cuexgp9e] { display: flex; justify-content: space-between; gap: 10px; padding: 3px 12px; border: 0; text-align: right; }
    .bd-mini td[b-n0cuexgp9e]::before { content: attr(data-label); color: var(--bd-muted); font-size: 13px; font-weight: 600; text-align: left; }
    .bd-mini td[data-label="Item"][b-n0cuexgp9e], .bd-mini td[data-label="Bundle"][b-n0cuexgp9e] { display: block; text-align: left; font-weight: 650; }
    .bd-mini td[data-label="Item"][b-n0cuexgp9e]::before, .bd-mini td[data-label="Bundle"][b-n0cuexgp9e]::before { content: none; }
    .bd-mini .num[b-n0cuexgp9e] { text-align: right; }

    .bd-card[b-n0cuexgp9e] { padding: 16px 14px; }
    .bd-grid[b-n0cuexgp9e], .bd-grid-3[b-n0cuexgp9e] { grid-template-columns: 1fr; }
    .bd-item[b-n0cuexgp9e] { grid-template-columns: 1fr 96px; }
    .bd-item-size[b-n0cuexgp9e] { grid-column: 1 / -1; }
    .bd-item-remove[b-n0cuexgp9e] { width: 100%; }
    .bd-footer[b-n0cuexgp9e] { padding: 10px 12px; }
    .bd-footer .bd-muted[b-n0cuexgp9e] { flex: 1 1 100%; }
    .bd-footer .bd-btn[b-n0cuexgp9e] { flex: 1 1 0; }
}
/* _content/ApexSupps.Client.Admin/Pages/Admin/Orders/BulkPrintPanel.razor.rz.scp.css */
/* Bulk print view of the Orders page (BULK_PRINTING.md). Same palette as the Fulfillment page (white cards on the dark admin). */
.bp[b-rkwx798ocg] { max-width: 1320px; margin: 0 auto; padding: 0 12px 32px; }
.bp-head[b-rkwx798ocg] { margin: 10px 0 10px; }
.bp-title[b-rkwx798ocg] { color: #fff; font-weight: 800; margin: 0; }
.bp-sub[b-rkwx798ocg] { color: rgba(255,255,255,.7); font-size: .85rem; max-width: 980px; }

.bp-filters[b-rkwx798ocg] { display: flex; flex-wrap: wrap; gap: 8px; align-items: flex-end; background: #fff; border-radius: 8px; padding: 10px 12px; margin-bottom: 10px; }
.bp-f[b-rkwx798ocg] { display: flex; flex-direction: column; min-width: 120px; }
.bp-f .form-label[b-rkwx798ocg] { font-size: .72rem; text-transform: uppercase; letter-spacing: .04em; color: #555; margin-bottom: 2px; }
.bp-f-search[b-rkwx798ocg] { flex: 1 1 220px; }
.bp-f-btn[b-rkwx798ocg] { flex-direction: row; gap: 4px; min-width: 0; }

/* The selection bar sticks to the top while scrolling so the selected count is always visible. */
.bp-selbar[b-rkwx798ocg] { position: sticky; top: 0; z-index: 20; display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 8px;
             background: #0b3d91; color: #fff; border-radius: 8px; padding: 8px 12px; margin-bottom: 8px; box-shadow: 0 2px 8px rgba(0,0,0,.25); }
.bp-selcount[b-rkwx798ocg] { display: flex; align-items: baseline; gap: 6px; }
.bp-selnum[b-rkwx798ocg] { font-size: 1.6rem; font-weight: 800; font-variant-numeric: tabular-nums; line-height: 1; }
.bp-sellbl[b-rkwx798ocg] { font-size: .9rem; }
.bp-clear[b-rkwx798ocg] { color: #fff; text-decoration: underline; padding: 0 4px; }
.bp-actions[b-rkwx798ocg] { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.bp-sep[b-rkwx798ocg] { width: 1px; height: 24px; background: rgba(255,255,255,.4); margin: 0 4px; }

.bp-banner[b-rkwx798ocg] { background: #fff8e1; border: 1px solid #f0c36d; color: #5c4400; border-radius: 8px; padding: 6px 12px; margin-bottom: 8px; font-size: .88rem; }
.bp-banner .btn-link[b-rkwx798ocg] { font-weight: 700; padding: 0 4px; vertical-align: baseline; }
.bp-banner-on[b-rkwx798ocg] { background: #e7f1ff; border-color: #9ec5fe; color: #052c65; }

.bp-card[b-rkwx798ocg] { background: #fff; border-radius: 8px; overflow: hidden; }
.bp-count[b-rkwx798ocg] { font-size: .8rem; color: #555; padding: 8px 12px; border-bottom: 1px solid #eee; }
.bp-table th[b-rkwx798ocg] { font-size: .72rem; text-transform: uppercase; letter-spacing: .04em; color: #555; background: #fafafa; padding: 8px 10px; }
.bp-table td[b-rkwx798ocg] { padding: 8px 10px; border-color: #eee; }
.bp-row-sel td[b-rkwx798ocg] { background: #eef5ff; }
.bp-row-held td:first-child[b-rkwx798ocg] { box-shadow: inset 4px 0 0 #dc3545; }
.bp-ck[b-rkwx798ocg] { width: 34px; }
.bp-ck .form-check-input[b-rkwx798ocg] { width: 1.15em; height: 1.15em; }
.bp-ordno[b-rkwx798ocg] { font-weight: 700; font-size: .98rem; color: #0b3d91; text-decoration: none; }
.bp-dim[b-rkwx798ocg] { font-size: .76rem; color: #6c757d; }
.bp-name[b-rkwx798ocg] { font-weight: 600; font-size: .88rem; }
.bp-svc[b-rkwx798ocg] { font-size: .85rem; }
.bp-tag[b-rkwx798ocg] { font-size: .68rem; border: 1px solid #6f42c1; color: #6f42c1; border-radius: 4px; padding: 0 4px; margin-left: 2px; }
.bp-pill[b-rkwx798ocg] { display: inline-block; font-size: .72rem; font-weight: 600; border-radius: 999px; padding: 1px 8px; margin: 1px 2px 1px 0; background: #eef0f2; color: #495057; }
.bp-pill-ok[b-rkwx798ocg] { background: #d1e7dd; color: #0a3622; }
.bp-pill-warn[b-rkwx798ocg] { background: #fff3cd; color: #664d03; border: 1px solid #ffda6a; }
.bp-pill-info[b-rkwx798ocg] { background: #cfe2ff; color: #052c65; }
.bp-pill-bad[b-rkwx798ocg] { background: #f8d7da; color: #58151c; }
.bp-pager[b-rkwx798ocg] { display: flex; justify-content: space-between; align-items: center; padding: 8px 12px; border-top: 1px solid #eee; }

.bp-cards[b-rkwx798ocg] { padding: 8px; display: flex; flex-direction: column; gap: 8px; }
.bp-mall[b-rkwx798ocg] { font-size: .85rem; font-weight: 600; display: flex; gap: 6px; align-items: center; }
.bp-mcard[b-rkwx798ocg] { border: 1px solid #e5e5e5; border-radius: 8px; padding: 10px 12px; color: #111; }
.bp-mcard.bp-row-held[b-rkwx798ocg] { border-left: 4px solid #dc3545; }
.bp-mtop[b-rkwx798ocg] { display: flex; gap: 8px; align-items: center; margin: 0; }
.bp-mrow[b-rkwx798ocg] { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 4px; }

/* Dialogs */
.bp-modal-backdrop[b-rkwx798ocg] { position: fixed; inset: 0; background: rgba(0,0,0,.5); z-index: 1050; }
.bp-modal[b-rkwx798ocg] { position: fixed; z-index: 1055; top: 4vh; left: 50%; transform: translateX(-50%); width: min(820px, calc(100vw - 24px));
            max-height: 92vh; display: flex; flex-direction: column; background: #fff; color: #111; border-radius: 10px; box-shadow: 0 10px 40px rgba(0,0,0,.4); }
.bp-modal-head[b-rkwx798ocg] { display: flex; justify-content: space-between; align-items: center; padding: 12px 16px; border-bottom: 1px solid #eee; }
.bp-modal-head h4[b-rkwx798ocg] { margin: 0; font-size: 1.15rem; font-weight: 800; }
.bp-format[b-rkwx798ocg] { font-size: .75rem; font-weight: 700; border: 1px solid #0b3d91; color: #0b3d91; border-radius: 4px; padding: 1px 6px; margin-left: 6px; vertical-align: middle; }
.bp-modal-body[b-rkwx798ocg] { padding: 12px 16px; overflow: auto; }
.bp-modal-foot[b-rkwx798ocg] { display: flex; justify-content: flex-end; gap: 8px; padding: 10px 16px; border-top: 1px solid #eee; }
.bp-snap[b-rkwx798ocg] { font-size: .88rem; background: #f6f8fa; border-radius: 6px; padding: 6px 10px; margin-bottom: 8px; }
.bp-snap-nums[b-rkwx798ocg] { color: #495057; }
.bp-sum[b-rkwx798ocg] { display: flex; flex-wrap: wrap; gap: 14px; align-items: baseline; margin-bottom: 8px; font-size: .95rem; }
.bp-sum-in b[b-rkwx798ocg] { color: #0a3622; font-size: 1.3rem; }
.bp-sum-out b[b-rkwx798ocg] { color: #842029; font-size: 1.3rem; }
.bp-reprint[b-rkwx798ocg] { border: 2px solid #f0ad4e; background: #fff8e1; border-radius: 8px; padding: 8px 12px; margin: 8px 0; }
.bp-reprint-title[b-rkwx798ocg] { font-weight: 800; color: #664d03; }
.bp-reprint-list[b-rkwx798ocg] { margin: 4px 0 6px; padding-left: 18px; font-size: .85rem; }
.bp-radio[b-rkwx798ocg] { display: flex; flex-direction: column; gap: 2px; font-size: .88rem; margin-bottom: 6px; }
.bp-radio input[b-rkwx798ocg] { margin-right: 6px; }
.bp-chips[b-rkwx798ocg] { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 4px; }
.bp-chip[b-rkwx798ocg] { border: 1px solid #ced4da; background: #fff; border-radius: 999px; font-size: .75rem; padding: 1px 10px; }
.bp-done[b-rkwx798ocg] { border: 2px solid #198754; background: #e8f5ee; border-radius: 8px; padding: 10px 12px; margin-bottom: 8px; font-size: .9rem; }
.bp-done-title[b-rkwx798ocg] { font-size: 1.05rem; color: #0a3622; }
.bp-total[b-rkwx798ocg] { font-size: 1.05rem; background: #fff3cd; border: 1px solid #ffda6a; border-radius: 8px; padding: 8px 12px; margin-bottom: 8px; }
.bp-total b[b-rkwx798ocg] { font-size: 1.35rem; }
.bp-ltable[b-rkwx798ocg] { font-size: .85rem; }
.bp-ltable th[b-rkwx798ocg] { font-size: .7rem; text-transform: uppercase; color: #555; }
.bp-l-failed td[b-rkwx798ocg] { background: #fff5f5; }
.bp-confirm[b-rkwx798ocg] { display: flex; gap: 8px; align-items: flex-start; background: #f6f8fa; border-radius: 6px; padding: 8px 10px; font-size: .9rem; }

@media (max-width: 767.98px) {
    .bp-selbar[b-rkwx798ocg] { border-radius: 0; margin: 0 -12px 8px; }
    .bp-actions .btn[b-rkwx798ocg] { flex: 1 1 46%; }
    .bp-sep[b-rkwx798ocg] { display: none; }
    .bp-modal[b-rkwx798ocg] { top: 0; width: 100vw; max-height: 100vh; height: 100vh; border-radius: 0; }
}
/* _content/ApexSupps.Client.Admin/Pages/Admin/Orders/ExcludedList.razor.rz.scp.css */
.bp-excluded[b-xs1n818tcm] { border: 1px solid #f1aeb5; background: #fff5f5; border-radius: 8px; padding: 8px 10px; margin: 8px 0; }
.bp-excluded-title[b-xs1n818tcm] { font-weight: 800; color: #842029; margin-bottom: 4px; }
.bp-excluded-code[b-xs1n818tcm] { font-size: .74rem; text-transform: uppercase; letter-spacing: .04em; color: #842029; font-weight: 700; margin-top: 4px; }
.bp-excluded table[b-xs1n818tcm] { font-size: .82rem; background: transparent; }
.bp-excluded td[b-xs1n818tcm] { background: transparent; padding: 3px 6px; }
.bp-x-num[b-xs1n818tcm] { width: 110px; white-space: nowrap; }
/* _content/ApexSupps.Client.Admin/Pages/Admin/Orders/OrderManagementPage.razor.rz.scp.css */
.dropdown-menu[b-wc8n4opdeu] {
    padding: 0;
    margin: 0;
    border-radius: 0.25rem;
}

.mobile-filter-backdrop[b-wc8n4opdeu] {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,.4);
    z-index: 1040;
}

.mobile-filter-sheet[b-wc8n4opdeu] {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    background: #fff;
    padding: 16px;
    border-radius: 12px 12px 0 0;
    z-index: 1050;
    animation: slideUp-b-wc8n4opdeu .25s ease-out;
}

@keyframes slideUp-b-wc8n4opdeu {
    from {
        transform: translateY(100%);
    }

    to {
        transform: translateY(0);
    }
}

/* ============================================================================================================
   Round 14 visual refresh (design-references/orders-page-concept.png). Presentation only, scoped to this page:
   light canvas, navy text, cobalt buttons, status badges, right-aligned money, sticky table header, horizontal
   table scrolling, selected-row highlight. The generic table (Templates/Table) is only restyled through ::deep
   under .op-page, so every other table in the admin keeps its look.
   Contrast (WCAG AA, 4.5:1 or better for text): navy #10213a / ink #172033 on white and #f6f8fb; white on cobalt
   #2346b8 (7.0:1); every badge text colour on its own background is 6:1 or better.
   ============================================================================================================ */
.op-page[b-wc8n4opdeu] {
    --op-navy: #10213a;
    --op-ink: #172033;
    --op-muted: #4a5870;
    --op-cobalt: #2346b8;
    --op-cobalt-dark: #1a3590;
    --op-cobalt-soft: #e8edfb;
    --op-line: #dde2ea;
    --op-line-strong: #c6ccd6;
    --op-head: #f1f4f9;
    --op-sel: #e3ebff;
    --op-hover: #f4f7fd;
    --op-danger: #b42318;
    --op-danger-dark: #912018;
    --op-amber: #8a4b00;
    --op-amber-line: #d98a2b;
    --op-amber-soft: #fff7ec;
    color: var(--op-ink);
    font-family: 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
    font-size: 14px;
}

.op-titlebar[b-wc8n4opdeu] { padding: 2px 4px 10px; }
.op-title[b-wc8n4opdeu] { margin: 0; color: var(--op-navy); font-family: 'Space Grotesk', 'Inter', sans-serif; font-size: 30px; font-weight: 700; letter-spacing: -.01em; line-height: 1.15; }
.op-subtitle[b-wc8n4opdeu] { margin: 2px 0 0; color: var(--op-muted); font-size: 14.5px; }

/* View switch: classic table / bulk print (BULK_PRINTING.md) */
.op-viewtabs[b-wc8n4opdeu] { display: flex; gap: 6px; padding: 0 4px 12px; flex-wrap: wrap; }
.op-viewtab[b-wc8n4opdeu] { min-height: 36px; border: 1px solid var(--op-line-strong); background: #fff; color: var(--op-navy); border-radius: 999px; padding: 6px 16px; font-size: 14px; font-weight: 600; }
.op-viewtab:hover[b-wc8n4opdeu] { border-color: var(--op-navy); }
.op-viewtab.active[b-wc8n4opdeu] { background: var(--op-navy); color: #fff; border-color: var(--op-navy); }

/* ---------- Buttons (scoped; Bootstrap .btn keeps its sizing) ---------- */
.op-page .btn[b-wc8n4opdeu] { font-weight: 600; }
.op-btn-primary[b-wc8n4opdeu], .op-page[b-wc8n4opdeu]  .op-btn-primary { background: var(--op-cobalt); border: 1px solid var(--op-cobalt); color: #fff; }
.op-btn-primary:hover[b-wc8n4opdeu], .op-page[b-wc8n4opdeu]  .op-btn-primary:hover { background: var(--op-cobalt-dark); border-color: var(--op-cobalt-dark); color: #fff; }
.op-btn-outline[b-wc8n4opdeu], .op-page[b-wc8n4opdeu]  .op-btn-outline { background: #fff; border: 1px solid var(--op-cobalt); color: var(--op-cobalt-dark); }
.op-btn-outline:hover:not(:disabled)[b-wc8n4opdeu], .op-page[b-wc8n4opdeu]  .op-btn-outline:hover:not(:disabled) { background: var(--op-cobalt-soft); color: var(--op-cobalt-dark); }
.op-btn-quiet[b-wc8n4opdeu], .op-page[b-wc8n4opdeu]  .op-btn-quiet { background: #fff; border: 1px solid var(--op-line-strong); color: var(--op-navy); }
.op-btn-quiet:hover:not(:disabled)[b-wc8n4opdeu], .op-page[b-wc8n4opdeu]  .op-btn-quiet:hover:not(:disabled) { border-color: var(--op-navy); background: #fff; color: var(--op-navy); }
.op-page[b-wc8n4opdeu]  .op-btn-buy { background: var(--op-amber-soft); border: 1px solid var(--op-amber-line); color: var(--op-amber); }
.op-page[b-wc8n4opdeu]  .op-btn-buy:hover:not(:disabled) { background: #ffefd6; color: #6b3a00; }
.op-page[b-wc8n4opdeu]  .op-btn-danger { background: #fff; border: 1px solid #e0a3a0; color: var(--op-danger); }
.op-page[b-wc8n4opdeu]  .op-btn-danger:hover:not(:disabled) { background: #fdecec; border-color: var(--op-danger); color: var(--op-danger-dark); }
.op-btn-danger-solid[b-wc8n4opdeu] { background: var(--op-danger); border: 1px solid var(--op-danger); color: #fff; }
.op-btn-danger-solid:hover[b-wc8n4opdeu] { background: var(--op-danger-dark); border-color: var(--op-danger-dark); color: #fff; }
.op-page[b-wc8n4opdeu]  .btn:disabled { opacity: .55; }

/* ---------- Counters above the table ---------- */
.op-top[b-wc8n4opdeu] { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin: 0 0 14px; padding: 0 4px; }
.op-stats[b-wc8n4opdeu] { display: flex; flex-wrap: wrap; gap: 12px; }
.op-stat[b-wc8n4opdeu] { display: flex; align-items: center; gap: 14px; min-width: 250px; padding: 14px 18px; border: 1px solid var(--op-line); border-radius: 12px; background: #fff; }
.op-stat-ready[b-wc8n4opdeu] { background: #f2f6ff; border-color: #d3def7; }
.op-stat-pdf[b-wc8n4opdeu] { background: #f1faf6; border-color: #cfe9dc; cursor: help; }
.op-stat-icon[b-wc8n4opdeu] { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: 50%; font-size: 18px; flex: none; }
.op-stat-ready .op-stat-icon[b-wc8n4opdeu] { background: #dfe8fb; color: var(--op-cobalt-dark); }
.op-stat-pdf .op-stat-icon[b-wc8n4opdeu] { background: #d5f0e3; color: #11643f; }
.op-stat-text[b-wc8n4opdeu] { display: flex; flex-direction: column; line-height: 1.2; }
.op-stat-num[b-wc8n4opdeu] { color: var(--op-navy); font-size: 28px; font-weight: 700; font-variant-numeric: tabular-nums; }
.op-stat-label[b-wc8n4opdeu] { color: var(--op-ink); font-size: 15px; font-weight: 600; }
.op-stat-info[b-wc8n4opdeu] { color: var(--op-muted); font-size: 12px; }
.op-stat-note[b-wc8n4opdeu] { margin-top: 2px; color: var(--op-muted); font-size: 12.5px; }

/* ---------- Toolbar (the generic table's controls bar, re-ordered with flex) ----------
   Row 1: Actions · Live · Print ready labels · Print selected | Buy / retry labels · Fulfill SellAbroad ··· Cancel all pending · Refresh
   Row 2: N orders selected · Clear selection · scope ··· Show deleted · page size · pager · Columns · Search
   Everything wraps instead of disappearing, so every action stays reachable down to tablet width. */
.op-shell[b-wc8n4opdeu]  #table-controls.op-controls { margin-bottom: 10px !important; padding: 0 4px; }
.op-shell[b-wc8n4opdeu]  .op-controls > .row { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0; }
.op-shell[b-wc8n4opdeu]  .op-controls > .row > .col-auto { display: contents; }
.op-shell[b-wc8n4opdeu]  .op-controls > .row > .col-auto > * { order: 20; }
.op-shell[b-wc8n4opdeu]  .op-controls #table-actions-menu { order: 1; display: inline-flex !important; align-items: center; min-height: 34px; padding: 4px 12px; border: 1px solid var(--op-line-strong); border-radius: 6px; background: #fff; color: var(--op-navy); font-size: 14px; font-weight: 600; }
.op-shell[b-wc8n4opdeu]  .op-controls .op-live,
.op-shell[b-wc8n4opdeu]  .op-controls .op-tb-print { order: 2; }
.op-shell[b-wc8n4opdeu]  .op-controls .op-tb-sep { order: 3; width: 1px; align-self: stretch; min-height: 28px; background: var(--op-line-strong); margin: 0 2px; }
.op-shell[b-wc8n4opdeu]  .op-controls .op-tb-buy { order: 4; }
.op-shell[b-wc8n4opdeu]  .op-controls .op-tb-danger { order: 5; margin-left: auto; padding-left: 12px; border-left: 1px dashed #e0a3a0; }
.op-shell[b-wc8n4opdeu]  .op-controls .refresh-btn { order: 6; margin-left: 0 !important; min-height: 34px; border: 1px solid var(--op-line-strong); background: #fff; color: var(--op-navy); }
.op-shell[b-wc8n4opdeu]  .op-controls .op-tb-break { order: 7; flex-basis: 100%; height: 0; }
.op-shell[b-wc8n4opdeu]  .op-controls .op-selbar { order: 8; margin-right: auto; }
.op-shell[b-wc8n4opdeu]  .op-controls .form-switch,
.op-shell[b-wc8n4opdeu]  .op-controls .form-switch + span { order: 19; }
.op-shell[b-wc8n4opdeu]  .op-controls .op-colchooser { order: 30; }
.op-shell[b-wc8n4opdeu]  .op-controls .input-group { order: 31; width: auto; }
.op-tb-group[b-wc8n4opdeu] { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.op-shell[b-wc8n4opdeu]  .op-controls .btn-sm { min-height: 34px; padding: 4px 12px; font-size: 14px; border-radius: 6px; }

/* Live / paused */
.op-shell[b-wc8n4opdeu]  .op-live { display: inline-flex; align-items: center; gap: 6px; }
.op-shell[b-wc8n4opdeu]  .op-live.is-live { background: #e7f6ee; border: 1px solid #9fd5b6; color: #11643f; }
.op-shell[b-wc8n4opdeu]  .op-live.is-paused { background: #fff; border: 1px solid var(--op-line-strong); color: var(--op-navy); }
.op-shell[b-wc8n4opdeu]  .op-live-dot { width: 8px; height: 8px; border-radius: 50%; background: #16a34a; }
.op-shell[b-wc8n4opdeu]  .op-live-count { padding: 0 6px; border-radius: 999px; background: #fde9c8; color: #6b3a00; font-size: 12px; }

/* Selection bar and scope */
.op-shell[b-wc8n4opdeu]  .op-selbar { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; min-height: 34px; font-size: 14px; color: var(--op-ink); }
.op-shell[b-wc8n4opdeu]  .op-selbar.has-selection #op-selcount { color: var(--op-navy); }
.op-shell[b-wc8n4opdeu]  .op-selnum { font-variant-numeric: tabular-nums; }
.op-shell[b-wc8n4opdeu]  .op-selnone { color: var(--op-muted); }
.op-shell[b-wc8n4opdeu]  .op-dot { color: var(--op-muted); }
.op-shell[b-wc8n4opdeu]  .op-clear, .op-shell[b-wc8n4opdeu]  .op-scope-link { padding: 0; border: 0; color: var(--op-cobalt-dark); font-weight: 600; font-size: 14px; text-decoration: underline; text-underline-offset: 2px; vertical-align: baseline; }
.op-shell[b-wc8n4opdeu]  .op-scope { color: var(--op-muted); font-size: 13px; }
.op-shell[b-wc8n4opdeu]  .op-scope-link { font-size: 13px; }

/* Show deleted, page size, pager, search */
.op-shell[b-wc8n4opdeu]  .op-controls .form-switch + span { color: var(--op-ink) !important; font-size: 13.5px; }
.op-shell[b-wc8n4opdeu]  .op-controls .form-switch { margin-left: 0 !important; }
.op-shell[b-wc8n4opdeu]  .op-controls #PageSize { margin-left: 4px !important; height: 34px; padding: 2px 28px 2px 10px; border-color: var(--op-line-strong); font-size: 14px; color: var(--op-ink); }
.op-shell[b-wc8n4opdeu]  .op-controls #CurrentPage, .op-shell[b-wc8n4opdeu]  .op-controls #TotalPages { height: 34px; width: 60px; padding: 2px 8px; font-size: 14px; text-align: center; border-color: var(--op-line-strong); }
.op-shell[b-wc8n4opdeu]  .op-controls #TotalPages { background: #f1f4f9; }
.op-shell[b-wc8n4opdeu]  .op-controls .btn-outline-secondary:not(.refresh-btn) { min-height: 34px; padding: 4px 12px; border-color: var(--op-line-strong); background: #fff; color: var(--op-navy); font-size: 14px; }
.op-shell[b-wc8n4opdeu]  .op-controls .btn-outline-secondary:disabled { color: #8a94a6; }
.op-shell[b-wc8n4opdeu]  .op-controls input[id$='table-search-box'] { height: 34px; max-width: 240px; border-color: var(--op-line-strong); font-size: 14px; background: #fff; }
.op-shell[b-wc8n4opdeu]  .op-controls .input-group-text { background: #fff; border-color: var(--op-line-strong); }

/* Column chooser */
.op-colchooser[b-wc8n4opdeu] { position: relative; display: inline-block; }
.op-colcount[b-wc8n4opdeu] { font-weight: 500; color: var(--op-muted); }
.op-colmenu-backdrop[b-wc8n4opdeu] { position: fixed; inset: 0; z-index: 1040; }
.op-colmenu[b-wc8n4opdeu] { position: absolute; right: 0; top: calc(100% + 6px); z-index: 1045; width: 300px; max-height: 70vh; overflow-y: auto; padding: 12px 14px; border: 1px solid var(--op-line); border-radius: 10px; background: #fff; box-shadow: 0 12px 32px rgba(16, 33, 58, .18); text-align: left; }
.op-colmenu-title[b-wc8n4opdeu] { margin: 0 0 6px; color: var(--op-navy); font-size: 14px; font-weight: 700; }
.op-colopt[b-wc8n4opdeu] { display: flex; align-items: flex-start; gap: 10px; padding: 6px 2px; color: var(--op-ink); font-size: 14px; cursor: pointer; }
.op-colopt .form-check-input[b-wc8n4opdeu] { margin-top: 2px; flex: none; }
.op-colopt.is-required[b-wc8n4opdeu] { color: var(--op-muted); cursor: default; }
.op-colopt-text[b-wc8n4opdeu] { display: flex; flex-direction: column; }
.op-colopt-note[b-wc8n4opdeu] { color: var(--op-muted); font-size: 12px; }
.op-colmenu-foot[b-wc8n4opdeu] { display: flex; justify-content: space-between; align-items: center; gap: 8px; margin-top: 8px; padding-top: 8px; border-top: 1px solid var(--op-line); }
.op-colmenu-foot .btn-link[b-wc8n4opdeu] { padding: 0; color: var(--op-cobalt-dark); font-weight: 600; }
.op-colmenu-hint[b-wc8n4opdeu] { margin: 8px 0 0; color: var(--op-muted); font-size: 12px; }

/* ---------- Table: sticky header, compact rows, horizontal scroll, selection ---------- */
.op-shell[b-wc8n4opdeu]  .table-responsive { max-height: calc(100vh - 300px); min-height: 360px; overflow: auto; border: 1px solid var(--op-line); border-radius: 10px; background: #fff !important; }
.op-shell[b-wc8n4opdeu]  table.op-table { min-width: 1240px; margin: 0; box-shadow: none; border-collapse: separate; border-spacing: 0; font-family: inherit; font-size: 13.5px; color: var(--op-ink); }
.op-shell[b-wc8n4opdeu]  table.op-table tr { display: table-row; width: auto; table-layout: auto; }
.op-shell[b-wc8n4opdeu]  table.op-table > tbody.table-height { display: table-row-group !important; height: auto !important; max-height: none !important; overflow: visible; }
.op-shell[b-wc8n4opdeu]  table.op-table.table-sm > thead > tr > th {
    position: sticky; top: 0; z-index: 3;
    padding: 9px 10px; background: var(--op-head); color: var(--op-navy); font-size: 13px; font-weight: 650; vertical-align: middle;
    border: 0 !important; border-bottom: 1px solid var(--op-line-strong) !important; border-radius: 0 !important;
    box-shadow: 0 1px 0 var(--op-line-strong);
}
.op-shell[b-wc8n4opdeu]  table.op-table.table-sm > tbody > tr > td {
    padding: 7px 10px; vertical-align: middle; background: #fff; color: var(--op-ink); box-shadow: none;
    border: 0 !important; border-bottom: 1px solid #e7eaf0 !important; border-radius: 0 !important;
}
.op-shell[b-wc8n4opdeu]  table.op-table.table-sm.table-hover > tbody > tr:hover > td { background: var(--op-hover); }
.op-shell[b-wc8n4opdeu]  table.op-table.table-sm > tbody > tr.is-selected > td { background: var(--op-sel); }
.op-shell[b-wc8n4opdeu]  table.op-table.table-sm > tbody > tr.is-selected > td:first-child { box-shadow: inset 4px 0 0 var(--op-cobalt); }
.op-shell[b-wc8n4opdeu]  table.op-table.table-sm.table-hover > tbody > tr.is-selected:hover > td { background: #d9e4ff; }
.op-shell[b-wc8n4opdeu]  table.op-table .check-cell { width: 44px; text-align: center; }
.op-shell[b-wc8n4opdeu]  table.op-table .check-cell .form-check-input { width: 1.1em; height: 1.1em; margin: 0; cursor: pointer; border-color: #8a94a6; }
.op-shell[b-wc8n4opdeu]  table.op-table .check-cell .form-check-input:checked { background-color: var(--op-cobalt); border-color: var(--op-cobalt); }
.op-shell[b-wc8n4opdeu]  table.op-table td.op-ordno { color: var(--op-navy); font-weight: 650; }
.op-shell[b-wc8n4opdeu]  table.op-table td.cell-clickable:hover { text-decoration: underline; text-underline-offset: 2px; }
.op-shell[b-wc8n4opdeu]  table.op-table .op-num { text-align: right !important; }
.op-shell[b-wc8n4opdeu]  table.op-table th.op-num .table-column-header-toolbar { justify-content: flex-end; }
.op-shell[b-wc8n4opdeu]  table.op-table .op-money { font-variant-numeric: tabular-nums; }
.op-shell[b-wc8n4opdeu]  table.op-table .table-column-header-toolbar { align-items: center; gap: 4px; flex-wrap: nowrap; }
.op-shell[b-wc8n4opdeu]  table.op-table .table-column-header-toolbar .width-70 { max-width: none; }
.op-shell[b-wc8n4opdeu]  table.op-table th.op-col-actions, .op-shell[b-wc8n4opdeu]  table.op-table td.op-col-actions { width: 48px; text-align: center; }
.op-shell[b-wc8n4opdeu]  table.op-table td.op-col-actions .menu-btn { color: var(--op-navy); }
.op-shell[b-wc8n4opdeu]  table.op-table.table-sm > tbody > tr > td.bg-sky-blue { background: #eef4ff; }
.op-shell[b-wc8n4opdeu]  table.op-table.table-sm > tbody > tr.table-secondary > td { background: #f1f2f4; color: var(--op-muted); }

/* Status badges: same names as before, colour by group, text always readable */
.op-shell[b-wc8n4opdeu]  .op-badge { display: inline-block; padding: 3px 9px; border-radius: 999px; background: #eceff4; color: #33415a; font-size: 12.5px; font-weight: 650; line-height: 1.35; white-space: nowrap; }
.op-shell[b-wc8n4opdeu]  .op-badge-pending { background: #fff1d6; color: #7a4100; }
.op-shell[b-wc8n4opdeu]  .op-badge-paid { background: #e6eefc; color: #1743b0; }
.op-shell[b-wc8n4opdeu]  .op-badge-ready { background: #dce7ff; color: #1a3590; }
.op-shell[b-wc8n4opdeu]  .op-badge-legacy-printed { background: #def3ea; color: #0f5132; }
.op-shell[b-wc8n4opdeu]  .op-badge-progress { background: #eceff4; color: #33415a; }
.op-shell[b-wc8n4opdeu]  .op-badge-shipped { background: #dcfce7; color: #14532d; }
.op-shell[b-wc8n4opdeu]  .op-badge-delivered { background: #cdeed9; color: #0b4122; }
.op-shell[b-wc8n4opdeu]  .op-badge-cancelled { background: #fdecec; color: #9f1d1d; }
.op-shell[b-wc8n4opdeu]  .op-badge-reshipped { background: #efe9fe; color: #4c1d95; }
.op-shell[b-wc8n4opdeu]  .op-mini { display: inline-block; margin-right: 4px; padding: 0 6px; border-radius: 4px; font-size: 11px; font-weight: 700; letter-spacing: .03em; vertical-align: 1px; }
.op-shell[b-wc8n4opdeu]  .op-mini-tax { background: #e0f2fe; color: #075985; }
.op-shell[b-wc8n4opdeu]  .op-mini-hero { background: #dcfce7; color: #14532d; }
.op-shell[b-wc8n4opdeu]  .op-mini-gift { margin: 0; padding: 2px 8px; border-radius: 999px; background: #fff1d6; color: #7a4100; font-size: 12.5px; letter-spacing: 0; }

/* Row action menu */
.op-shell[b-wc8n4opdeu]  .dropdown-menu { border: 1px solid var(--op-line); border-radius: 8px; box-shadow: 0 10px 28px rgba(16, 33, 58, .16); font-size: 14px; }
.op-shell[b-wc8n4opdeu]  #table-actions li { color: var(--op-ink); }

/* Summary under the table */
.op-shell[b-wc8n4opdeu]  caption { color: var(--op-muted); }

/* ---------- Destructive confirmation ---------- */
.op-modal-backdrop[b-wc8n4opdeu] { position: fixed; inset: 0; z-index: 1060; background: rgba(16, 33, 58, .45); }
.op-modal[b-wc8n4opdeu] { position: fixed; z-index: 1065; top: 18vh; left: 50%; transform: translateX(-50%); width: min(480px, calc(100vw - 24px)); padding: 20px 22px; border-radius: 12px; background: #fff; color: var(--op-ink); box-shadow: 0 18px 50px rgba(16, 33, 58, .35); }
.op-modal-head[b-wc8n4opdeu] { display: flex; align-items: center; gap: 12px; }
.op-modal-icon[b-wc8n4opdeu] { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 50%; background: #fdecec; color: var(--op-danger); flex: none; }
.op-modal-title[b-wc8n4opdeu] { margin: 0; color: var(--op-navy); font-size: 19px; font-weight: 700; }
.op-danger-count[b-wc8n4opdeu] { margin: 14px 0 6px; padding: 10px 12px; border: 1px solid #f1c4c1; border-radius: 8px; background: #fff6f5; color: var(--op-danger-dark); font-size: 15px; font-weight: 600; }
.op-danger-num[b-wc8n4opdeu] { font-size: 22px; font-weight: 800; font-variant-numeric: tabular-nums; margin-right: 4px; }
.op-modal-body[b-wc8n4opdeu] { margin: 0; color: var(--op-ink); font-size: 14px; }
.op-modal-foot[b-wc8n4opdeu] { display: flex; justify-content: flex-end; flex-wrap: wrap; gap: 8px; margin-top: 18px; }

/* ---------- Bulk print view on the light canvas (BulkPrintPanel) ---------- */
.op-page[b-wc8n4opdeu]  .bp-title { color: var(--op-navy); }
.op-page[b-wc8n4opdeu]  .bp-sub { color: var(--op-muted); }
.op-page[b-wc8n4opdeu]  .bp-filters, .op-page[b-wc8n4opdeu]  .bp-card { border: 1px solid var(--op-line); }
.op-page[b-wc8n4opdeu]  .bp-selbar { background: var(--op-navy); box-shadow: 0 2px 8px rgba(16, 33, 58, .18); }

/* ---------- Phones: card list (unchanged) + print / labels buttons ---------- */
.op-m-actions[b-wc8n4opdeu] { display: flex; flex-wrap: wrap; gap: 8px; }
.op-m-actions .btn[b-wc8n4opdeu] { flex: 1 1 100%; min-height: 40px; font-size: 14.5px; }
.op-page .card[b-wc8n4opdeu] { border: 1px solid var(--op-line) !important; color: var(--op-ink); }

@media (max-width: 1100px) {
    .op-shell[b-wc8n4opdeu]  .op-controls .op-tb-danger { margin-left: 0; }
    /* Where the toolbar wraps, the chooser can sit anywhere on the row: show its menu centred instead. */
    .op-colmenu[b-wc8n4opdeu] { position: fixed; top: 16vh; left: 50%; right: auto; transform: translateX(-50%); width: min(320px, calc(100vw - 24px)); }
}
@media (max-width: 767.98px) {
    .op-title[b-wc8n4opdeu] { font-size: 24px; }
    .op-titlebar[b-wc8n4opdeu] { padding: 0 12px 8px; }
    .op-viewtabs[b-wc8n4opdeu] { padding: 0 12px 4px; }
}
@media (prefers-reduced-motion: reduce) {
    .op-page *[b-wc8n4opdeu] { transition: none !important; }
}

/* ---------- Round 17: "Ready to ship" quick filter (desktop toolbar and phone) ----------
   Off: white chip with a filter icon. On: solid cobalt with a tick and "Show all orders" beside it. White on cobalt
   #2346b8 is 7.0:1; navy on white 16:1. */
.op-quickfilters[b-wc8n4opdeu] { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; }
.op-shell[b-wc8n4opdeu]  .op-controls .op-quickfilters { order: 18; }
.op-chip[b-wc8n4opdeu] { display: inline-flex; align-items: center; gap: 2px; min-height: 34px; padding: 4px 14px; border: 1px solid var(--op-line-strong); border-radius: 999px; background: #fff; color: var(--op-navy); font-size: 14px; font-weight: 600; line-height: 1.2; cursor: pointer; }
.op-chip:hover[b-wc8n4opdeu] { border-color: var(--op-cobalt); color: var(--op-cobalt-dark); }
.op-chip:focus-visible[b-wc8n4opdeu] { outline: 3px solid #93b0f5; outline-offset: 2px; }
.op-chip.is-on[b-wc8n4opdeu] { background: var(--op-cobalt); border-color: var(--op-cobalt); color: #fff; }
.op-chip.is-on:hover[b-wc8n4opdeu] { background: var(--op-cobalt-dark); border-color: var(--op-cobalt-dark); color: #fff; }
.op-chip-icon[b-wc8n4opdeu] { display: inline-flex; align-items: center; }
.op-chip-count[b-wc8n4opdeu] { margin-left: 6px; padding: 0 7px; border-radius: 999px; background: var(--op-cobalt-soft); color: var(--op-cobalt-dark); font-size: 12.5px; font-variant-numeric: tabular-nums; }
.op-chip.is-on .op-chip-count[b-wc8n4opdeu] { background: #fff; color: var(--op-cobalt-dark); }
.op-chip-clear[b-wc8n4opdeu] { padding: 0; border: 0; color: var(--op-cobalt-dark); font-size: 14px; font-weight: 600; text-decoration: underline; text-underline-offset: 2px; }
.op-stat-ready[b-wc8n4opdeu] { cursor: pointer; }
.op-stat-ready:hover[b-wc8n4opdeu] { border-color: #a9bde9; }
.op-stat-ready:focus-visible[b-wc8n4opdeu], .op-m-stat-ready:focus-visible[b-wc8n4opdeu] { outline: 3px solid #93b0f5; outline-offset: 2px; }
.op-stat-ready.is-on[b-wc8n4opdeu] { border-color: var(--op-cobalt); box-shadow: inset 0 0 0 1px var(--op-cobalt); }
.op-m-stat-ready[b-wc8n4opdeu] { cursor: pointer; }
.op-m-stat-ready.is-on[b-wc8n4opdeu] { box-shadow: inset 0 0 0 2px var(--op-cobalt) !important; }
.op-m-quickfilters[b-wc8n4opdeu] { margin-top: 10px; }
.op-m-quickfilters .op-chip[b-wc8n4opdeu] { min-height: 40px; }
.op-m-empty[b-wc8n4opdeu] { padding: 24px 12px; border: 1px dashed var(--op-line-strong); border-radius: 10px; background: #fff; color: var(--op-ink); text-align: center; }
/* _content/ApexSupps.Client.Admin/Pages/Admin/Orders/SelectRateComponent.razor.rz.scp.css */
.white-btn-bordered[b-dv40day2kq] {
    border-radius: 0;
    background: #FFFFFF;
    height: 41px;
    box-shadow: none;
    padding-inline: 18px;
    font-family: 'Inter', sans-serif;
    border: 1px solid black;
    font-style: normal;
    font-weight: 900;
    font-size: 12.699px;
    line-height: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    color: #000000;
    text-transform: uppercase;
    text-decoration: none;
}

    .white-btn-bordered.selected[b-dv40day2kq] {
        background-color: transparent;
        border: 5.5px solid #000;
        color: #000;
    }

        .white-btn-bordered.selected:hover[b-dv40day2kq] {
            transform: scale(1);
        }

    .white-btn-bordered:hover[b-dv40day2kq] {
        transform: scale(1.01);
    }

    .white-btn-bordered:disabled[b-dv40day2kq],
    .white-btn-bordered[disabled][b-dv40day2kq] {
        background: #e0e0e0 !important;
        color: #999 !important;
        border-color: #ccc !important;
        opacity: 0.65;
        cursor: not-allowed;
        pointer-events: none;
    }

    .white-btn-bordered.selected:disabled[b-dv40day2kq],
    .white-btn-bordered.selected[disabled][b-dv40day2kq] {
        border: 3px solid #ccc !important;
        background: #f5f5f5 !important;
        color: #999 !important;
    }
/* _content/ApexSupps.Client.Admin/Pages/Admin/Orders/UpdateAddressForm.razor.rz.scp.css */
.white-btn-bordered[b-bq711lesu5] {
    border-radius: 0;
    background: #FFFFFF;
    height: 41px;
    box-shadow: none;
    padding-inline: 18px;
    font-family: 'Inter', sans-serif;
    border: 1px solid black;
    font-style: normal;
    font-weight: 900;
    font-size: 12.699px;
    line-height: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    color: #000000;
    text-transform: uppercase;
    text-decoration: none;
}

    .white-btn-bordered.selected[b-bq711lesu5] {
        background-color: transparent;
        border: 5.5px solid #000;
        color: #000;
    }

        .white-btn-bordered.selected:hover[b-bq711lesu5] {
            transform: scale(1);
        }

    .white-btn-bordered:hover[b-bq711lesu5] {
        transform: scale(1.01);
    }

    .white-btn-bordered:disabled[b-bq711lesu5],
    .white-btn-bordered[disabled][b-bq711lesu5] {
        background: #e0e0e0 !important;
        color: #999 !important;
        border-color: #ccc !important;
        opacity: 0.65;
        cursor: not-allowed;
        pointer-events: none;
    }

    .white-btn-bordered.selected:disabled[b-bq711lesu5],
    .white-btn-bordered.selected[disabled][b-bq711lesu5] {
        border: 3px solid #ccc !important;
        background: #f5f5f5 !important;
        color: #999 !important;
    }
/* _content/ApexSupps.Client.Admin/Pages/Admin/Orders/ViewOrderDetails.razor.rz.scp.css */
@media (max-width: 991.98px) {
    .btn-mobile-stretch[b-16mnvtqygj] {
        width: 100%;
    }

    .order-item-font-size[b-16mnvtqygj] {
        font-size: 11px;
    }
}
/* _content/ApexSupps.Client.Admin/Pages/Admin/Products/CreateUpdateProductForm.razor.rz.scp.css */
/* Product editor (round 15): light admin canvas, same tokens as the Products & Inventory list. */
.pe[b-fsmulah410] {
    --pe-ink: var(--ca-ink, #172033);
    --pe-navy: var(--ca-navy, #10213a);
    --pe-muted: var(--ca-muted, #4a5870);
    --pe-line: var(--ca-line, #dde2ea);
    --pe-cobalt: var(--ca-cobalt, #2346b8);
    --pe-cobalt-dark: var(--ca-cobalt-dark, #1a3590);
    --pe-cobalt-soft: var(--ca-cobalt-soft, #e8edfb);
    color: var(--pe-ink);
    font-size: 15px;
    width: 100%;
    max-width: 1100px;
    min-width: 0;
    padding-bottom: 90px;
}

.pe-head[b-fsmulah410] { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; margin-bottom: 14px; }
.pe-back[b-fsmulah410] { color: var(--pe-cobalt-dark); font-weight: 650; text-decoration: none; }
.pe-back:hover[b-fsmulah410] { text-decoration: underline; }
.pe-title[b-fsmulah410] { margin: 0; color: var(--pe-navy); font-size: 22px; font-weight: 700; overflow-wrap: anywhere; }

.pe-card[b-fsmulah410] { margin-bottom: 16px; padding: 18px 20px; border: 1px solid var(--pe-line); border-radius: 12px; background: #fff; min-width: 0; }
.pe-h[b-fsmulah410] { margin: 0 0 12px; color: var(--pe-navy); font-size: 17px; font-weight: 700; }

.pe-grid[b-fsmulah410] { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 18px; }
.pe-wide[b-fsmulah410] { grid-column: 1 / -1; }
.pe-field[b-fsmulah410] { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.pe-field label[b-fsmulah410] { color: var(--pe-navy); font-size: 14px; font-weight: 650; }
.pe-field input[b-fsmulah410], .pe-field select[b-fsmulah410], .pe-field textarea[b-fsmulah410] {
    min-height: 42px;
    padding: 8px 12px;
    border: 1px solid #b9c1ce;
    border-radius: 8px;
    background: #fff;
    color: var(--pe-ink);
    font-size: 15px;
    width: 100%;
}
.pe-field textarea[b-fsmulah410] { min-height: 90px; resize: vertical; line-height: 1.45; }
.pe-field input:focus[b-fsmulah410], .pe-field select:focus[b-fsmulah410], .pe-field textarea:focus[b-fsmulah410] { outline: 3px solid rgba(35, 70, 184, .25); border-color: var(--pe-cobalt); }
.pe-field [aria-invalid="true"][b-fsmulah410] { border-color: #c53030; }
.pe-req[b-fsmulah410] { color: var(--pe-muted); font-size: 12px; font-weight: 500; }
.pe-hint[b-fsmulah410] { margin: 0; color: var(--pe-muted); font-size: 13px; }
.pe-muted[b-fsmulah410] { color: var(--pe-muted); }
.pe-err[b-fsmulah410] { color: #9f1d1d; font-size: 13.5px; font-weight: 600; }
.pe-ok[b-fsmulah410] { color: #14532d; font-size: 13.5px; font-weight: 600; margin: 6px 0 0; }
.pe-switches[b-fsmulah410] { justify-content: flex-end; gap: 10px; }
.pe-switch[b-fsmulah410] { display: inline-flex; align-items: center; gap: 8px; color: var(--pe-ink) !important; font-weight: 500 !important; cursor: pointer; }
.pe-switch input[b-fsmulah410] { width: 18px; height: 18px; min-height: 0; }
.pe-small[b-fsmulah410] { font-size: 13.5px; margin-top: 6px; }

.pe-btn[b-fsmulah410] {
    display: inline-flex; align-items: center; justify-content: center; gap: 6px;
    min-height: 42px; padding: 8px 16px;
    border: 1.5px solid var(--pe-navy); border-radius: 8px;
    background: #fff; color: var(--pe-navy);
    font-size: 15px; font-weight: 650; text-decoration: none; white-space: nowrap; cursor: pointer;
}
.pe-btn:hover:not(:disabled)[b-fsmulah410] { background: var(--pe-cobalt-soft); }
.pe-btn:disabled[b-fsmulah410] { opacity: .6; cursor: not-allowed; }
.pe-btn.primary[b-fsmulah410] { border-color: var(--pe-cobalt); background: var(--pe-cobalt); color: #fff; }
.pe-btn.primary:hover:not(:disabled)[b-fsmulah410] { background: var(--pe-cobalt-dark); }
.pe-btn.danger[b-fsmulah410] { border-color: #9f1d1d; background: #9f1d1d; color: #fff; }
.pe-link[b-fsmulah410] { padding: 0; border: 0; background: none; color: var(--pe-cobalt-dark); font-weight: 650; text-decoration: underline; cursor: pointer; }

.pe-pill[b-fsmulah410] { display: inline-block; padding: 2px 10px; border-radius: 999px; font-size: 13px; font-weight: 650; background: #eef1f6; color: #33415a; }
.pe-pill.is-active[b-fsmulah410] { background: #dcfce7; color: #14532d; }
.pe-pill.is-archived[b-fsmulah410] { background: #f3e8d6; color: #6b3f12; }
.pe-pill.is-new[b-fsmulah410] { background: #fff1db; color: #7a4100; }
.pe-pill.is-bundle[b-fsmulah410] { background: var(--pe-cobalt-soft); color: var(--pe-cobalt-dark); }

.pe-errors[b-fsmulah410] { margin-bottom: 14px; padding: 12px 16px; border: 1px solid #f0b4b4; border-left: 4px solid #c53030; border-radius: 8px; background: #fff7f7; }
.pe-errors ul[b-fsmulah410] { margin: 6px 0 0; padding-left: 20px; }
.pe-state[b-fsmulah410] { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; padding: 22px; border: 1px dashed #c6ccd6; border-radius: 12px; background: #fff; }
.pe-state.is-error[b-fsmulah410] { border: 1px solid #f0b4b4; background: #fff7f7; }
.pe-spinner[b-fsmulah410] { width: 20px; height: 20px; border: 3px solid var(--pe-cobalt-soft); border-top-color: var(--pe-cobalt); border-radius: 50%; animation: pe-spin-b-fsmulah410 .8s linear infinite; }
@keyframes pe-spin-b-fsmulah410 { to { transform: rotate(360deg); } }

.pe-photo[b-fsmulah410] { display: flex; flex-wrap: wrap; align-items: center; gap: 14px; margin-bottom: 8px; }
.pe-photo img[b-fsmulah410] { width: 140px; height: 140px; object-fit: cover; border-radius: 10px; border: 1px solid var(--pe-line); }
.pe-photo-empty[b-fsmulah410] { display: inline-flex; align-items: center; justify-content: center; width: 140px; height: 140px; border: 1px dashed #b9c1ce; border-radius: 10px; color: var(--pe-muted); font-size: 13px; }

.pe-sizes[b-fsmulah410] { display: flex; flex-direction: column; gap: 12px; margin-bottom: 12px; }
.pe-size[b-fsmulah410] { padding: 14px; border: 1px solid var(--pe-line); border-radius: 10px; background: #fbfcfe; }
.pe-size-head[b-fsmulah410] { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin-bottom: 10px; color: var(--pe-navy); }
.pe-size-head .pe-link[b-fsmulah410] { margin-left: auto; }
.pe-size-grid[b-fsmulah410] { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 12px 14px; }

.pe-inv[b-fsmulah410] { padding: 14px 0; border-top: 1px solid #edf0f4; }
.pe-inv:first-of-type[b-fsmulah410] { border-top: 0; }
.pe-inv-head[b-fsmulah410] { margin-bottom: 6px; color: var(--pe-navy); }
.pe-stock[b-fsmulah410] { display: flex; flex-wrap: wrap; gap: 10px 28px; margin: 0 0 10px; }
.pe-stock div[b-fsmulah410] { display: flex; flex-direction: column; }
.pe-stock dt[b-fsmulah410] { color: var(--pe-muted); font-size: 13px; font-weight: 600; }
.pe-stock dd[b-fsmulah410] { margin: 0; color: var(--pe-navy); font-size: 20px; font-weight: 700; font-variant-numeric: tabular-nums; }
.pe-level[b-fsmulah410] { display: inline-block; margin-left: 6px; padding: 1px 8px; border-radius: 999px; font-size: 12.5px; font-weight: 700; vertical-align: middle; }
.pe-level.is-outofstock[b-fsmulah410] { background: #fde2e2; color: #9f1d1d; }
.pe-level.is-lowstock[b-fsmulah410] { background: #fff1db; color: #7a4100; }
.pe-adjust[b-fsmulah410] { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 10px 12px; }
.pe-adjust .pe-field[b-fsmulah410] { width: 150px; }
.pe-adjust .pe-grow[b-fsmulah410] { flex: 1 1 260px; width: auto; }
.pe-ship[b-fsmulah410] { margin-top: 10px; }
.pe-ship summary[b-fsmulah410] { cursor: pointer; color: var(--pe-cobalt-dark); font-weight: 650; }

.pe-bundle[b-fsmulah410] { margin-bottom: 14px; }
.pe-bundle-sum[b-fsmulah410] { margin: 0 0 8px; }
.pe-table-wrap[b-fsmulah410] { width: 100%; overflow-x: auto; border: 1px solid var(--pe-line); border-radius: 8px; }
.pe-table[b-fsmulah410] { width: 100%; border-collapse: collapse; }
.pe-table th[b-fsmulah410], .pe-table td[b-fsmulah410] { padding: 9px 12px; border-bottom: 1px solid #edf0f4; text-align: left; font-size: 14px; }
.pe-table th[b-fsmulah410] { background: #f3f5f9; color: var(--pe-navy); font-size: 13px; }
.pe-table .num[b-fsmulah410] { text-align: right; font-variant-numeric: tabular-nums; }
.pe-table tr.is-limiting td[b-fsmulah410] { background: #fff7eb; font-weight: 600; }

.pe-footer[b-fsmulah410] {
    position: sticky;
    bottom: 0;
    z-index: 5;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 10px 12px;
    margin-top: 6px;
    padding: 12px 16px;
    border: 1px solid var(--pe-line);
    border-radius: 12px;
    background: rgba(255, 255, 255, .97);
    box-shadow: 0 -6px 18px rgba(16, 33, 58, .08);
}
.pe-footer .pe-muted[b-fsmulah410] { margin-right: auto; font-size: 14px; }

.pe-overlay[b-fsmulah410] { position: fixed; inset: 0; z-index: 1040; background: rgba(12, 24, 41, .45); }
.pe-dialog[b-fsmulah410] {
    position: fixed; z-index: 1050; top: 50%; left: 50%; transform: translate(-50%, -50%);
    width: min(480px, calc(100vw - 24px)); padding: 20px; border-radius: 14px; background: #fff; color: var(--pe-ink);
    box-shadow: 0 24px 60px rgba(12, 24, 41, .3);
}
.pe-dialog-title[b-fsmulah410] { margin: 0 0 8px; color: var(--pe-navy); font-size: 19px; font-weight: 700; }
.pe-dialog-actions[b-fsmulah410] { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 10px; }

@media (max-width: 760px) {
    .pe-card[b-fsmulah410] { padding: 14px; }
    .pe-grid[b-fsmulah410] { grid-template-columns: 1fr; }
    .pe-size-grid[b-fsmulah410] { grid-template-columns: 1fr 1fr; }
    .pe-adjust .pe-field[b-fsmulah410], .pe-adjust .pe-btn[b-fsmulah410] { width: 100%; flex: 1 1 100%; }
    .pe-footer .pe-muted[b-fsmulah410] { width: 100%; }
    .pe-footer .pe-btn[b-fsmulah410] { flex: 1 1 0; }
    .pe-table thead[b-fsmulah410] { display: none; }
    .pe-table[b-fsmulah410], .pe-table tbody[b-fsmulah410], .pe-table tr[b-fsmulah410], .pe-table td[b-fsmulah410] { display: block; width: 100%; }
    .pe-table tr[b-fsmulah410] { padding: 6px 0; border-bottom: 1px solid #edf0f4; }
    .pe-table td[b-fsmulah410] { display: grid; grid-template-columns: 110px minmax(0, 1fr); gap: 8px; border: 0; padding: 3px 12px; text-align: left !important; }
    .pe-table td[b-fsmulah410]::before { content: attr(data-label); color: var(--pe-muted); font-size: 13px; font-weight: 600; }
}
@media (max-width: 420px) {
    .pe-size-grid[b-fsmulah410] { grid-template-columns: 1fr; }
}
/* _content/ApexSupps.Client.Admin/Pages/Admin/Products/ProductManagementPage.razor.rz.scp.css */
/* Products & Inventory (round 15): light admin canvas (.ca-light), navy text, cobalt accents. Tokens come from
   cosmetics-admin.css (--ca-*), with fallbacks so the page stays readable if that sheet is missing. */
.pp[b-419bj43rxz] {
    --pp-ink: var(--ca-ink, #172033);
    --pp-navy: var(--ca-navy, #10213a);
    --pp-muted: var(--ca-muted, #4a5870);
    --pp-line: var(--ca-line, #dde2ea);
    --pp-cobalt: var(--ca-cobalt, #2346b8);
    --pp-cobalt-dark: var(--ca-cobalt-dark, #1a3590);
    --pp-cobalt-soft: var(--ca-cobalt-soft, #e8edfb);
    color: var(--pp-ink);
    font-size: 15px;
    width: 100%;
    max-width: 100%;
    min-width: 0;
}

/* ---------- toolbar ---------- */
.pp-toolbar[b-419bj43rxz] {
    display: grid;
    grid-template-columns: minmax(220px, 1.6fr) minmax(170px, 1fr) minmax(160px, .9fr) auto;
    gap: 12px 14px;
    align-items: end;
    margin-bottom: 10px;
}

.pp-field[b-419bj43rxz] { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.pp-field label[b-419bj43rxz] { color: var(--pp-navy); font-size: 13px; font-weight: 650; }
.pp-field input[b-419bj43rxz], .pp-field select[b-419bj43rxz] {
    min-height: 42px;
    padding: 8px 12px;
    border: 1px solid #b9c1ce;
    border-radius: 8px;
    background: #fff;
    color: var(--pp-ink);
    font-size: 15px;
    width: 100%;
}
.pp-field input:focus[b-419bj43rxz], .pp-field select:focus[b-419bj43rxz] { outline: 3px solid rgba(35, 70, 184, .25); border-color: var(--pp-cobalt); }

.pp-actions[b-419bj43rxz] { display: flex; gap: 10px; align-items: end; justify-content: flex-end; }
.pp-bulk[b-419bj43rxz] { position: relative; }

.pp-btn[b-419bj43rxz] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-height: 42px;
    padding: 8px 16px;
    border: 1.5px solid var(--pp-navy);
    border-radius: 8px;
    background: #fff;
    color: var(--pp-navy);
    font-size: 15px;
    font-weight: 650;
    text-decoration: none;
    white-space: nowrap;
    cursor: pointer;
}
.pp-btn:hover:not(:disabled)[b-419bj43rxz] { background: var(--pp-cobalt-soft); color: var(--pp-navy); }
.pp-btn:disabled[b-419bj43rxz] { border-color: #b9c1ce; color: #7a8599; cursor: not-allowed; background: #f1f3f7; }
.pp-btn.primary[b-419bj43rxz] { border-color: var(--pp-cobalt); background: var(--pp-cobalt); color: #fff; }
.pp-btn.primary:hover:not(:disabled)[b-419bj43rxz] { background: var(--pp-cobalt-dark); color: #fff; }
.pp-btn.primary:disabled[b-419bj43rxz] { background: #9aa9d9; border-color: #9aa9d9; color: #fff; }

.pp-menu[b-419bj43rxz] {
    position: absolute;
    right: 0;
    top: calc(100% + 6px);
    z-index: 20;
    min-width: 240px;
    padding: 6px;
    border: 1px solid var(--pp-line);
    border-radius: 10px;
    background: #fff;
    box-shadow: 0 12px 28px rgba(16, 33, 58, .16);
}
.pp-menu button[b-419bj43rxz] {
    display: block;
    width: 100%;
    padding: 10px 12px;
    border: 0;
    border-radius: 6px;
    background: none;
    color: var(--pp-ink);
    font-size: 15px;
    text-align: left;
    cursor: pointer;
}
.pp-menu button:hover[b-419bj43rxz] { background: var(--pp-cobalt-soft); }
.pp-menu-note[b-419bj43rxz] { margin: 4px 12px 6px; color: var(--pp-muted); font-size: 13px; }

.pp-meta[b-419bj43rxz] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 18px;
    align-items: center;
    justify-content: space-between;
    min-height: 28px;
    margin: 6px 0 10px;
    color: var(--pp-muted);
    font-size: 14px;
}
.pp-check[b-419bj43rxz] { display: inline-flex; align-items: center; gap: 8px; color: var(--pp-ink); font-size: 14px; cursor: pointer; }
.pp-check input[b-419bj43rxz] { width: 18px; height: 18px; }

/* ---------- states ---------- */
.pp-state[b-419bj43rxz] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    align-items: flex-start;
    padding: 22px;
    border: 1px dashed #c6ccd6;
    border-radius: 12px;
    background: #fff;
    color: var(--pp-ink);
}
.pp-state strong[b-419bj43rxz] { color: var(--pp-navy); font-size: 16px; }
.pp-state.is-error[b-419bj43rxz] { border-style: solid; border-color: #f0b4b4; background: #fff7f7; }
.pp-state[data-test="pp-loading"][b-419bj43rxz] { flex-direction: row; align-items: center; gap: 12px; }
.pp-spinner[b-419bj43rxz] {
    width: 20px; height: 20px;
    border: 3px solid var(--pp-cobalt-soft);
    border-top-color: var(--pp-cobalt);
    border-radius: 50%;
    animation: pp-spin-b-419bj43rxz .8s linear infinite;
}
@keyframes pp-spin-b-419bj43rxz { to { transform: rotate(360deg); } }

/* ---------- table ---------- */
.pp-table-wrap[b-419bj43rxz] {
    width: 100%;
    border: 1px solid var(--pp-line);
    border-radius: 12px;
    background: #fff;
    overflow: hidden;
}
.pp-table[b-419bj43rxz] { width: 100%; border-collapse: collapse; table-layout: auto; }
.pp-table thead th[b-419bj43rxz] {
    position: sticky;
    top: 0;
    z-index: 1;
    padding: 12px 14px;
    border-bottom: 1px solid var(--pp-line);
    background: #f3f5f9;
    color: var(--pp-navy);
    font-size: 13px;
    font-weight: 700;
    text-align: left;
    white-space: nowrap;
}
.pp-table td[b-419bj43rxz], .pp-table tbody th[b-419bj43rxz] {
    padding: 12px 14px;
    border-bottom: 1px solid #edf0f4;
    color: var(--pp-ink);
    font-weight: 400;
    text-align: left;
    vertical-align: middle;
}
.pp-table tbody.pp-group[b-419bj43rxz] { border-top: 2px solid var(--pp-line); }
.pp-table tbody.pp-group:first-of-type[b-419bj43rxz] { border-top: 0; }
.pp-table tbody.pp-group:hover td[b-419bj43rxz], .pp-table tbody.pp-group:hover th[b-419bj43rxz] { background: #fafbfe; }
.pp-table .num[b-419bj43rxz] { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
.pp-col-select[b-419bj43rxz] { width: 44px; text-align: center !important; }
.pp-col-select input[b-419bj43rxz] { width: 18px; height: 18px; cursor: pointer; }
.pp-col-edit[b-419bj43rxz] { width: 80px; text-align: right !important; }

.pp-product[b-419bj43rxz] { min-width: 240px; }
.pp-product-cell[b-419bj43rxz] { display: flex; gap: 12px; align-items: center; }
.pp-thumb[b-419bj43rxz] { flex: 0 0 auto; width: 52px; height: 52px; border-radius: 8px; object-fit: cover; background: #f1f3f7; border: 1px solid var(--pp-line); }
.pp-thumb.is-empty[b-419bj43rxz] { display: inline-flex; align-items: center; justify-content: center; color: #7a8599; font-size: 10px; text-align: center; }
.pp-product-text[b-419bj43rxz] { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.pp-name[b-419bj43rxz] { color: var(--pp-navy); font-weight: 650; overflow-wrap: anywhere; }
.pp-tags[b-419bj43rxz] { display: flex; flex-wrap: wrap; gap: 6px; }
.pp-tag[b-419bj43rxz] { padding: 1px 8px; border-radius: 999px; background: #eef1f6; color: #33415a; font-size: 12.5px; font-weight: 600; }
.pp-tag.is-warn[b-419bj43rxz] { background: #fff1db; color: #7a4100; }
.pp-tag.is-bundle[b-419bj43rxz] { background: var(--pp-cobalt-soft); color: var(--pp-cobalt-dark); }

.pp-size span[b-419bj43rxz] { display: block; }
.pp-sku[b-419bj43rxz] { color: var(--pp-muted); font-size: 12.5px; white-space: nowrap; }
.pp-size[b-419bj43rxz] { min-width: 110px; }
.pp-sale[b-419bj43rxz] { display: inline-block; margin-left: 6px; padding: 0 6px; border-radius: 4px; background: #eef1f6; color: var(--pp-muted); font-size: 12px; font-weight: 700; }
.pp-sale.is-on[b-419bj43rxz] { background: #dcfce7; color: #14532d; }
.pp-muted[b-419bj43rxz] { color: var(--pp-muted); }

.pp-stock[b-419bj43rxz] { min-width: 170px; }
.pp-qty[b-419bj43rxz] { font-weight: 650; font-variant-numeric: tabular-nums; margin-right: 6px; }
.pp-sub[b-419bj43rxz] { display: block; color: var(--pp-muted); font-size: 12.5px; line-height: 1.35; }
.pp-sub a[b-419bj43rxz] { color: var(--pp-cobalt-dark); font-weight: 600; }
.pp-level[b-419bj43rxz] { display: inline-block; padding: 1px 8px; border-radius: 999px; font-size: 12.5px; font-weight: 700; }
.pp-level.is-outofstock[b-419bj43rxz] { background: #fde2e2; color: #9f1d1d; }
.pp-level.is-lowstock[b-419bj43rxz] { background: #fff1db; color: #7a4100; }
.pp-level.is-notsold[b-419bj43rxz] { background: #eef1f6; color: #33415a; }

.pp-status[b-419bj43rxz] { display: inline-block; padding: 2px 10px; border-radius: 999px; font-size: 13px; font-weight: 650; }
.pp-status.is-active[b-419bj43rxz] { background: #dcfce7; color: #14532d; }
.pp-status.is-inactive[b-419bj43rxz] { background: #eef1f6; color: #33415a; }
.pp-status.is-archived[b-419bj43rxz] { background: #f3e8d6; color: #6b3f12; }

.pp-edit[b-419bj43rxz] {
    display: inline-flex;
    align-items: center;
    min-height: 36px;
    padding: 6px 14px;
    border: 1.5px solid var(--pp-cobalt);
    border-radius: 8px;
    color: var(--pp-cobalt-dark);
    font-weight: 650;
    text-decoration: none;
}
.pp-edit:hover[b-419bj43rxz] { background: var(--pp-cobalt-soft); }

.pp-reports[b-419bj43rxz] { margin-top: 22px; }
.pp-reports summary[b-419bj43rxz] { cursor: pointer; color: var(--pp-navy); font-weight: 650; }

/* ---------- confirmation dialog ---------- */
.pp-overlay[b-419bj43rxz] { position: fixed; inset: 0; z-index: 1040; background: rgba(12, 24, 41, .45); }
.pp-dialog[b-419bj43rxz] {
    position: fixed;
    z-index: 1050;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: min(640px, calc(100vw - 24px));
    max-height: calc(100vh - 40px);
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 20px;
    border-radius: 14px;
    background: #fff;
    color: var(--pp-ink);
    box-shadow: 0 24px 60px rgba(12, 24, 41, .3);
}
.pp-dialog-title[b-419bj43rxz] { margin: 0; color: var(--pp-navy); font-size: 19px; font-weight: 700; }
.pp-warn[b-419bj43rxz] { margin: 0; padding: 10px 12px; border-left: 4px solid #d98a2b; border-radius: 6px; background: #fff7eb; }
.pp-affected[b-419bj43rxz] { flex: 1 1 auto; min-height: 80px; overflow: auto; margin: 0; padding: 0; list-style: none; border: 1px solid var(--pp-line); border-radius: 8px; }
.pp-affected li[b-419bj43rxz] { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 2px 10px; padding: 7px 12px; border-bottom: 1px solid #edf0f4; font-size: 14px; }
.pp-affected li.is-selected[b-419bj43rxz] { background: var(--pp-cobalt-soft); }
.pp-affected-note[b-419bj43rxz] { color: var(--pp-muted); font-size: 13px; }
.pp-ack[b-419bj43rxz] { font-weight: 600; }
.pp-error-text[b-419bj43rxz] { margin: 0; color: #9f1d1d; font-weight: 600; }
.pp-dialog-actions[b-419bj43rxz] { display: flex; flex-wrap: wrap; gap: 10px; justify-content: flex-end; }

/* ---------- tablet ---------- */
@media (max-width: 1100px) {
    .pp-toolbar[b-419bj43rxz] { grid-template-columns: 1fr 1fr; }
    .pp-search[b-419bj43rxz] { grid-column: 1 / -1; }
    .pp-actions[b-419bj43rxz] { grid-column: 1 / -1; justify-content: flex-start; }
}

/* ---------- phone: each product becomes a card, its sizes stacked inside ---------- */
@media (max-width: 760px) {
    .pp-toolbar[b-419bj43rxz] { grid-template-columns: 1fr; }
    .pp-actions[b-419bj43rxz] { flex-wrap: wrap; }
    .pp-actions > *[b-419bj43rxz] { flex: 1 1 auto; }
    .pp-bulk .pp-btn[b-419bj43rxz] { width: 100%; }
    .pp-menu[b-419bj43rxz] { left: 0; right: auto; width: 100%; }

    .pp-table-wrap[b-419bj43rxz] { border: 0; background: none; overflow: visible; }
    .pp-table[b-419bj43rxz], .pp-table tbody[b-419bj43rxz], .pp-table tr[b-419bj43rxz], .pp-table td[b-419bj43rxz], .pp-table tbody th[b-419bj43rxz] { display: block; width: 100%; }
    .pp-table thead[b-419bj43rxz] { display: none; }
    .pp-table tbody.pp-group[b-419bj43rxz] {
        position: relative;
        margin-bottom: 14px;
        border: 1px solid var(--pp-line) !important;
        border-radius: 12px;
        background: #fff;
        overflow: hidden;
    }
    /* Rows dissolve so every cell is a direct item of the card: product first, sizes in order, Edit last. */
    .pp-table tbody.pp-group[b-419bj43rxz] { display: flex; flex-direction: column; }
    .pp-table tr[b-419bj43rxz] { display: contents; }
    .pp-table .pp-product[b-419bj43rxz] { order: -1; }
    .pp-table .pp-col-edit[b-419bj43rxz] { order: 99; }
    .pp-table td[b-419bj43rxz], .pp-table tbody th[b-419bj43rxz] { border: 0; padding: 4px 14px; }
    .pp-table .pp-col-select[b-419bj43rxz] { position: absolute; top: 14px; right: 10px; width: auto; padding: 0; }
    .pp-table .pp-product[b-419bj43rxz] { padding: 14px 48px 10px 14px; border-bottom: 1px solid #edf0f4; min-width: 0; }
    .pp-table .pp-col-edit[b-419bj43rxz] { padding: 8px 14px 14px; text-align: left !important; width: 100%; }
    .pp-edit[b-419bj43rxz] { width: 100%; justify-content: center; }
    .pp-table td[data-label][b-419bj43rxz] { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 8px; text-align: left; }
    .pp-table td[data-label][b-419bj43rxz]::before { content: attr(data-label); flex: 0 0 112px; color: var(--pp-muted); font-size: 13px; font-weight: 600; }
    .pp-table td[data-label] .pp-sub[b-419bj43rxz] { flex: 1 1 100%; padding-left: 120px; }
    .pp-table td[data-label="Size"] span[b-419bj43rxz] { display: inline; }
    .pp-table td[data-label="Size"][b-419bj43rxz] { padding-top: 12px; font-weight: 650; }
    .pp-table tr:not(.pp-first) td[data-label="Size"][b-419bj43rxz] { border-top: 1px dashed #dde2ea; margin-top: 6px; }
    .pp-table .num[b-419bj43rxz] { text-align: left; }
    .pp-stock[b-419bj43rxz] { min-width: 0; }
}
/* _content/ApexSupps.Client.Admin/Pages/Admin/Products/ProductReportsPanel.razor.rz.scp.css */
/* Moved from ProductManagementPage.razor.css (round 15); light admin canvas. */
.report-actions[b-4li56k3w8z] {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
    margin: 1.25rem 0 1rem;
}

.report-actions-label[b-4li56k3w8z] {
    color: #4a5870;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .06em;
    margin-right: .35rem;
    text-transform: uppercase;
}

.report-actions .report-btn[b-4li56k3w8z] {
    align-items: center;
    background-color: #fff;
    border: 1px solid #c6ccd6;
    border-radius: 8px;
    color: #10213a;
    display: inline-flex;
    font-size: 14px;
    font-weight: 600;
    gap: .5rem;
    min-height: 40px;
    padding: 0 .9rem;
}

    .report-actions .report-btn i[b-4li56k3w8z] { color: #2346b8; font-size: 13px; }
    .report-actions .report-btn:hover:not(:disabled)[b-4li56k3w8z] { border-color: #10213a; background-color: #e8edfb; }
    .report-actions .report-btn.is-open[b-4li56k3w8z] { border-color: #2346b8; background-color: #e8edfb; }
    .report-actions .report-btn:disabled[b-4li56k3w8z] { opacity: .55; }

/* ---------- Report cards ----------
   These sit on the black site background, so the surface and its text colour are set
   explicitly rather than inherited. */
.report-card[b-4li56k3w8z] {
    background-color: #fff;
    border-radius: 14px;
    border: 1px solid #dde2ea;
    box-shadow: 0 1px 2px rgba(16, 24, 40, .06);
    color: #212529;
    margin-bottom: 1.25rem;
    padding: 1.25rem;
}

.report-card-head[b-4li56k3w8z] {
    align-items: flex-start;
    border-bottom: 1px solid #eaecf0;
    display: flex;
    gap: 1rem;
    justify-content: space-between;
    margin: -.25rem 0 1rem;
    padding-bottom: .85rem;
}

.report-card-title[b-4li56k3w8z] {
    color: #101828;
    font-family: 'Inter', sans-serif;
    font-size: 16px;
    font-weight: 600;
    letter-spacing: -.01em;
    margin: 0;
}

.report-card-sub[b-4li56k3w8z] {
    color: #667085;
    font-size: 12px;
    margin: .2rem 0 0;
}

.report-close[b-4li56k3w8z] {
    align-items: center;
    background: none;
    border: 1px solid transparent;
    border-radius: 8px;
    color: #98a2b3;
    display: inline-flex;
    flex: 0 0 auto;
    height: 30px;
    justify-content: center;
    padding: 0;
    transition: background-color .15s ease, color .15s ease;
    width: 30px;
}

    .report-close:hover[b-4li56k3w8z] {
        background-color: #f2f4f7;
        color: #101828;
    }

.report-stats[b-4li56k3w8z] {
    background-color: #f9fafb;
    border: 1px solid #eaecf0;
    border-radius: 10px;
    color: #475467;
    font-size: 13px;
    margin-bottom: .85rem;
    padding: .75rem 1rem;
}

    .report-stats strong[b-4li56k3w8z] {
        color: #101828;
    }

.report-scroll[b-4li56k3w8z] {
    border: 1px solid #eaecf0;
    border-radius: 10px;
    max-height: 60vh;
    overflow-y: auto;
}

    .report-scroll[b-4li56k3w8z]::-webkit-scrollbar {
        height: 10px;
        width: 10px;
    }

    .report-scroll[b-4li56k3w8z]::-webkit-scrollbar-track {
        background: transparent;
    }

    .report-scroll[b-4li56k3w8z]::-webkit-scrollbar-thumb {
        background: #d0d5dd;
        border: 2px solid #fff;
        border-radius: 8px;
    }

        .report-scroll[b-4li56k3w8z]::-webkit-scrollbar-thumb:hover {
            background: #98a2b3;
        }

.report-table[b-4li56k3w8z] {
    --bs-table-bg: #fff;
    --bs-table-color: #475467;
    --bs-table-hover-bg: #f4f8ff;
    --bs-table-hover-color: #101828;
    box-shadow: none;
    margin-bottom: 0;
}

    .report-table .report-thead th[b-4li56k3w8z] {
        background-color: #fbfcfd;
        border-bottom: 1px solid #eaecf0;
        color: #667085;
        font-size: 11px;
        font-weight: 600;
        letter-spacing: .06em;
        position: sticky;
        text-transform: uppercase;
        top: 0;
        z-index: 1;
    }

    .report-table > :not(caption) > * > *[b-4li56k3w8z] {
        padding: .6rem .75rem;
    }

    .report-table tbody td[b-4li56k3w8z] {
        border-bottom-color: #f2f4f7;
    }

    .report-table tbody tr:last-child > td[b-4li56k3w8z] {
        border-bottom: 0;
    }

    /* Softer than Bootstrap's stock contextual rows, which shout on a white card. */
    .report-table tbody tr.table-danger[b-4li56k3w8z] {
        --bs-table-bg: #fef3f2;
        --bs-table-color: #912018;
    }

    .report-table tbody tr.table-warning[b-4li56k3w8z] {
        --bs-table-bg: #fffaeb;
        --bs-table-color: #93370d;
    }

    .report-table .badge[b-4li56k3w8z] {
        border-radius: 999px;
        font-size: 11px;
        font-weight: 600;
        letter-spacing: .01em;
        padding: .3rem .6rem;
    }

@media screen and (max-width: 767.98px) {
    .page-header[b-4li56k3w8z] {
        margin-top: 1.25rem;
    }

    .report-card[b-4li56k3w8z] {
        border-radius: 10px;
        padding: 1rem;
    }
}
/* _content/ApexSupps.Client.Admin/Pages/Admin/Users/AddUserToGroupForm.razor.rz.scp.css */
.close-icon[b-e9nj009vjn] {
    vertical-align: text-top;
    filter: invert(100%) sepia(100%) saturate(0%) hue-rotate(171deg) brightness(106%) contrast(107%);
}
/* _content/ApexSupps.Client.Admin/Pages/Admin/Users/CreateUpdateUserForm.razor.rz.scp.css */
.access-permissions[b-r9nj3yoyng] {
    max-height: 35vh;
    overflow-y: scroll;
    overflow-x: hidden;
}
/* _content/ApexSupps.Client.Admin/Pages/Admin/Users/UserDetailsPage.razor.rz.scp.css */
/* Customers & Staff account page (round 16): light admin canvas, white cards, navy text, cobalt actions. Same tokens
   as the list (UserManagementPage.razor.css) and Order Details. */
.ud[b-cyqzmc7y81] {
    --ud-ink: var(--ca-ink, #172033);
    --ud-navy: var(--ca-navy, #10213a);
    --ud-muted: var(--ca-muted, #4a5870);
    --ud-line: var(--ca-line, #dde2ea);
    --ud-cobalt: var(--ca-cobalt, #2346b8);
    --ud-cobalt-dark: var(--ca-cobalt-dark, #1a3590);
    --ud-cobalt-soft: var(--ca-cobalt-soft, #e8edfb);
    color: var(--ud-ink);
    font-size: 15px;
    width: 100%;
    max-width: 1320px;
    min-width: 0;
}

.ud-back[b-cyqzmc7y81] { display: inline-block; margin-bottom: 10px; color: var(--ud-cobalt-dark); font-size: 14px; font-weight: 650; text-decoration: none; }
.ud-back:hover[b-cyqzmc7y81] { text-decoration: underline; }

.ud-card[b-cyqzmc7y81] { min-width: 0; padding: 16px 18px; border: 1px solid var(--ud-line); border-radius: 12px; background: #fff; }
.ud-card-head[b-cyqzmc7y81] { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 6px 12px; margin-bottom: 8px; }
.ud-card-head .ud-h2[b-cyqzmc7y81] { margin: 0; }
.ud-h2[b-cyqzmc7y81] { margin: 0 0 10px; color: var(--ud-navy); font-size: 16px; font-weight: 700; }

/* ---------- header ---------- */
.ud-head[b-cyqzmc7y81] { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: 12px 20px; margin-bottom: 14px; }
.ud-head-text[b-cyqzmc7y81] { min-width: 0; }
.ud-title[b-cyqzmc7y81] { margin: 0; color: var(--ud-navy); font-family: 'Space Grotesk', 'Inter', sans-serif; font-size: 22px; font-weight: 700; overflow-wrap: anywhere; }
.ud-email[b-cyqzmc7y81] { margin: 2px 0 6px; color: var(--ud-ink); overflow-wrap: anywhere; }
.ud-pills[b-cyqzmc7y81] { display: flex; flex-wrap: wrap; gap: 6px; margin: 0; }
.ud-pill[b-cyqzmc7y81] { display: inline-block; padding: 2px 10px; border-radius: 999px; font-size: 13px; font-weight: 650; }
.ud-pill.type-customer[b-cyqzmc7y81] { background: #eef1f6; color: #33415a; }
.ud-pill.type-staff[b-cyqzmc7y81] { background: var(--ud-cobalt-soft); color: var(--ud-cobalt-dark); }
.ud-pill.status-active[b-cyqzmc7y81] { background: #dcfce7; color: #14532d; }
.ud-pill.status-inactive[b-cyqzmc7y81] { background: #fff1db; color: #7a4100; }
.ud-pill.status-deleted[b-cyqzmc7y81] { background: #fde2e2; color: #8a1c1c; }
.ud-pill.is-test[b-cyqzmc7y81] { background: #f3e8ff; color: #5b21b6; }
.ud-pill.is-hero[b-cyqzmc7y81] { background: #e0f2fe; color: #075985; }
.ud-head-actions[b-cyqzmc7y81] { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; justify-content: flex-end; }
.ud-note[b-cyqzmc7y81] { margin: 0; color: var(--ud-muted); font-size: 14px; }

.ud-btn[b-cyqzmc7y81] {
    display: inline-flex; align-items: center; justify-content: center; gap: 6px;
    min-height: 40px; padding: 7px 14px;
    border: 1.5px solid var(--ud-cobalt); border-radius: 8px;
    background: #fff; color: var(--ud-cobalt-dark);
    font-size: 14.5px; font-weight: 650; text-decoration: none; white-space: nowrap; cursor: pointer;
}
.ud-btn:hover:not(:disabled)[b-cyqzmc7y81] { background: var(--ud-cobalt-soft); }
.ud-btn.primary[b-cyqzmc7y81] { background: var(--ud-cobalt); color: #fff; }
.ud-btn.primary:hover:not(:disabled)[b-cyqzmc7y81] { background: var(--ud-cobalt-dark); }
.ud-btn.danger[b-cyqzmc7y81] { border-color: #b42318; color: #8a1c1c; }
.ud-btn.danger:hover:not(:disabled)[b-cyqzmc7y81] { background: #fff1f1; }
.ud-btn.subtle[b-cyqzmc7y81] { border-color: #b9c1ce; color: var(--ud-navy); }
.ud-btn:disabled[b-cyqzmc7y81] { border-color: #b9c1ce; color: #6b768a; background: #f1f3f7; cursor: not-allowed; }
.ud-btn:focus-visible[b-cyqzmc7y81], .ud-link:focus-visible[b-cyqzmc7y81], .ud-back:focus-visible[b-cyqzmc7y81], .ud-linkbtn:focus-visible[b-cyqzmc7y81], .ud-table a:focus-visible[b-cyqzmc7y81], .ud-advanced summary:focus-visible[b-cyqzmc7y81] {
    outline: 3px solid rgba(35, 70, 184, .45); outline-offset: 2px;
}
.ud-actions-row[b-cyqzmc7y81] { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 6px; }

.ud-banner[b-cyqzmc7y81] { margin: 0 0 14px; padding: 10px 14px; border-left: 4px solid #c53030; border-radius: 8px; background: #fff5f5; color: var(--ud-ink); }

/* ---------- grid ---------- */
.ud-grid[b-cyqzmc7y81] { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; align-items: start; }
.ud-wide[b-cyqzmc7y81] { grid-column: 1 / -1; }

.ud-facts[b-cyqzmc7y81] { display: grid; grid-template-columns: 1fr; gap: 0; margin: 0; }
.ud-facts > div[b-cyqzmc7y81] { display: grid; grid-template-columns: minmax(130px, 38%) minmax(0, 1fr); gap: 4px 12px; padding: 7px 0; border-bottom: 1px solid #edf0f4; }
.ud-facts > div:last-child[b-cyqzmc7y81] { border-bottom: 0; }
.ud-facts dt[b-cyqzmc7y81] { color: var(--ud-muted); font-size: 13.5px; font-weight: 600; }
.ud-facts dd[b-cyqzmc7y81] { margin: 0; color: var(--ud-ink); min-width: 0; overflow-wrap: anywhere; }
.ud-facts-tight > div[b-cyqzmc7y81] { padding: 5px 0; }
.ud-break[b-cyqzmc7y81] { overflow-wrap: anywhere; }
.ud-mono[b-cyqzmc7y81] { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 13px; }

.ud-muted[b-cyqzmc7y81] { color: var(--ud-muted); }
.ud-small[b-cyqzmc7y81] { margin: 8px 0 0; color: var(--ud-muted); font-size: 13.5px; }
.ud-link[b-cyqzmc7y81] { display: inline-block; margin-top: 8px; color: var(--ud-cobalt-dark); font-weight: 650; }
.ud-linkbtn[b-cyqzmc7y81] { padding: 0 2px; border: 0; background: none; color: var(--ud-cobalt-dark); font-weight: 650; text-decoration: underline; cursor: pointer; }
.ud-inline-error[b-cyqzmc7y81] { padding: 10px 12px; border: 1px solid #e3a1a1; border-radius: 8px; background: #fff7f7; color: #8a1c1c; }

.ud-roles[b-cyqzmc7y81] { margin: 0; padding-left: 18px; }
.ud-roles li[b-cyqzmc7y81] { margin: 2px 0; }

.ud-table-wrap[b-cyqzmc7y81] { width: 100%; border: 1px solid var(--ud-line); border-radius: 10px; overflow: hidden; }
.ud-table[b-cyqzmc7y81] { width: 100%; border-collapse: collapse; }
.ud-table thead th[b-cyqzmc7y81] { padding: 9px 12px; background: #f3f5f9; color: var(--ud-navy); font-size: 13px; font-weight: 700; text-align: left; border-bottom: 1px solid var(--ud-line); }
.ud-table td[b-cyqzmc7y81], .ud-table tbody th[b-cyqzmc7y81] { padding: 9px 12px; border-bottom: 1px solid #edf0f4; color: var(--ud-ink); font-weight: 400; text-align: left; }
.ud-table tbody tr:last-child td[b-cyqzmc7y81], .ud-table tbody tr:last-child th[b-cyqzmc7y81] { border-bottom: 0; }
.ud-table a[b-cyqzmc7y81] { color: var(--ud-cobalt-dark); font-weight: 650; }
.ud-table .num[b-cyqzmc7y81] { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }

.ud-addresses[b-cyqzmc7y81] { display: flex; flex-direction: column; gap: 8px; margin: 10px 0 0; padding: 0; list-style: none; }
.ud-addresses li[b-cyqzmc7y81] { display: flex; flex-direction: column; padding: 10px 12px; border: 1px solid var(--ud-line); border-radius: 8px; }
.ud-addresses .ud-small[b-cyqzmc7y81] { margin-top: 2px; }

.ud-legacy[b-cyqzmc7y81] { background: #fbfaf6; }
.ud-legacy-tag[b-cyqzmc7y81] { margin-left: 6px; padding: 1px 8px; border-radius: 999px; background: #f3e8d6; color: #6b3f12; font-size: 12px; font-weight: 650; vertical-align: middle; }

.ud-activity[b-cyqzmc7y81] { overflow-x: auto; }
.ud-advanced summary[b-cyqzmc7y81] { cursor: pointer; color: var(--ud-navy); font-weight: 700; }
.ud-advanced[open] summary[b-cyqzmc7y81] { margin-bottom: 8px; }

.ud-state[b-cyqzmc7y81] { display: flex; flex-direction: column; gap: 6px; align-items: flex-start; padding: 20px; border: 1px dashed #b9c1ce; border-radius: 12px; background: #fff; }
.ud-state strong[b-cyqzmc7y81] { color: var(--ud-navy); font-size: 16px; }
.ud-state.is-error[b-cyqzmc7y81] { border-style: solid; border-color: #e3a1a1; background: #fff7f7; }
.ud-state[data-test="ud-loading"][b-cyqzmc7y81] { flex-direction: row; align-items: center; gap: 12px; }
.ud-spinner[b-cyqzmc7y81] { width: 20px; height: 20px; border: 3px solid var(--ud-cobalt-soft); border-top-color: var(--ud-cobalt); border-radius: 50%; animation: ud-spin-b-cyqzmc7y81 .8s linear infinite; }
@keyframes ud-spin-b-cyqzmc7y81 { to { transform: rotate(360deg); } }

@media (max-width: 1000px) {
    .ud-grid[b-cyqzmc7y81] { grid-template-columns: 1fr; }
    .ud-head-actions[b-cyqzmc7y81] { justify-content: flex-start; }
}

@media (max-width: 600px) {
    .ud-card[b-cyqzmc7y81] { padding: 14px; }
    .ud-head-actions .ud-btn[b-cyqzmc7y81] { flex: 1 1 calc(50% - 8px); white-space: normal; text-align: center; }
    .ud-facts > div[b-cyqzmc7y81] { grid-template-columns: 1fr; gap: 0; }
    .ud-table thead[b-cyqzmc7y81] { display: none; }
    .ud-table[b-cyqzmc7y81], .ud-table tbody[b-cyqzmc7y81], .ud-table tr[b-cyqzmc7y81], .ud-table td[b-cyqzmc7y81], .ud-table tbody th[b-cyqzmc7y81] { display: block; width: 100%; }
    .ud-table tbody tr[b-cyqzmc7y81] { padding: 8px 0; border-bottom: 1px solid #edf0f4; }
    .ud-table tbody tr:last-child[b-cyqzmc7y81] { border-bottom: 0; }
    .ud-table td[b-cyqzmc7y81], .ud-table tbody th[b-cyqzmc7y81] { display: flex; gap: 8px; padding: 2px 12px; border: 0; }
    .ud-table td[b-cyqzmc7y81]::before, .ud-table tbody th[b-cyqzmc7y81]::before { content: attr(data-label); flex: 0 0 72px; color: var(--ud-muted); font-size: 13px; font-weight: 600; }
    .ud-table .num[b-cyqzmc7y81] { text-align: left; }
}
/* _content/ApexSupps.Client.Admin/Pages/Admin/Users/UserManagementPage.razor.rz.scp.css */
/* Customers & Staff (round 16): light admin canvas (.ca-light), navy text, cobalt actions. Tokens come from
   cosmetics-admin.css (--ca-*), with fallbacks so the page stays readable if that sheet is missing. Same vocabulary as
   Products & Inventory (ProductManagementPage.razor.css). */
.ua[b-595b4ljtpa] {
    --ua-ink: var(--ca-ink, #172033);
    --ua-navy: var(--ca-navy, #10213a);
    --ua-muted: var(--ca-muted, #4a5870);
    --ua-line: var(--ca-line, #dde2ea);
    --ua-cobalt: var(--ca-cobalt, #2346b8);
    --ua-cobalt-dark: var(--ca-cobalt-dark, #1a3590);
    --ua-cobalt-soft: var(--ca-cobalt-soft, #e8edfb);
    color: var(--ua-ink);
    font-size: 15px;
    width: 100%;
    max-width: 1320px;
    min-width: 0;
}

.ua-titlebar[b-595b4ljtpa] { margin: 0 0 12px; }
.ua-title[b-595b4ljtpa] { margin: 0; color: var(--ua-navy); font-family: 'Space Grotesk', 'Inter', sans-serif; font-size: 22px; font-weight: 700; letter-spacing: -.01em; }
.ua-subtitle[b-595b4ljtpa] { margin: 2px 0 0; color: var(--ua-muted); font-size: 14px; }

/* ---------- toolbar ---------- */
.ua-toolbar[b-595b4ljtpa] {
    display: grid;
    grid-template-columns: minmax(240px, 1.8fr) minmax(170px, 1fr) minmax(170px, 1fr) auto;
    gap: 12px 14px;
    align-items: end;
    margin-bottom: 8px;
}
.ua-field[b-595b4ljtpa] { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.ua-field label[b-595b4ljtpa] { color: var(--ua-navy); font-size: 13px; font-weight: 650; }
.ua-field input[b-595b4ljtpa], .ua-field select[b-595b4ljtpa] {
    min-height: 42px;
    padding: 8px 12px;
    border: 1px solid #8e99ab;
    border-radius: 8px;
    background: #fff;
    color: var(--ua-ink);
    font-size: 15px;
    width: 100%;
}
.ua-field input[b-595b4ljtpa]::placeholder { color: #5f6b80; }
.ua-field input:focus-visible[b-595b4ljtpa], .ua-field select:focus-visible[b-595b4ljtpa] { outline: 3px solid rgba(35, 70, 184, .35); outline-offset: 1px; border-color: var(--ua-cobalt); }
.ua-search-box[b-595b4ljtpa] { position: relative; }
.ua-search-box input[b-595b4ljtpa] { padding-right: 40px; }
.ua-search-box input[b-595b4ljtpa]::-webkit-search-cancel-button { display: none; }
.ua-clear-search[b-595b4ljtpa] {
    position: absolute; top: 50%; right: 4px; transform: translateY(-50%);
    width: 34px; height: 34px; border: 0; border-radius: 6px; background: none;
    color: var(--ua-muted); font-size: 22px; line-height: 1; cursor: pointer;
}
.ua-clear-search:hover[b-595b4ljtpa] { background: var(--ua-cobalt-soft); color: var(--ua-navy); }

.ua-actions[b-595b4ljtpa] { position: relative; display: flex; justify-content: flex-end; }

.ua-btn[b-595b4ljtpa] {
    display: inline-flex; align-items: center; justify-content: center; gap: 6px;
    min-height: 42px; padding: 8px 16px;
    border: 1.5px solid var(--ua-navy); border-radius: 8px;
    background: #fff; color: var(--ua-navy);
    font-size: 15px; font-weight: 650; text-decoration: none; white-space: nowrap; cursor: pointer;
}
.ua-btn:hover:not(:disabled)[b-595b4ljtpa] { background: var(--ua-cobalt-soft); }
.ua-btn:disabled[b-595b4ljtpa] { border-color: #b9c1ce; color: #6b768a; cursor: not-allowed; background: #f1f3f7; }
.ua-btn.primary[b-595b4ljtpa] { border-color: var(--ua-cobalt); background: var(--ua-cobalt); color: #fff; }
.ua-btn.primary:hover:not(:disabled)[b-595b4ljtpa] { background: var(--ua-cobalt-dark); }
.ua-btn:focus-visible[b-595b4ljtpa], .ua-linkbtn:focus-visible[b-595b4ljtpa], .ua-menu > *:focus-visible[b-595b4ljtpa], .ua-table a:focus-visible[b-595b4ljtpa], .ua-clear-search:focus-visible[b-595b4ljtpa] {
    outline: 3px solid rgba(35, 70, 184, .45); outline-offset: 2px;
}

.ua-menu[b-595b4ljtpa] {
    position: absolute; right: 0; top: calc(100% + 6px); z-index: 20;
    min-width: 270px; padding: 6px;
    border: 1px solid var(--ua-line); border-radius: 10px; background: #fff;
    box-shadow: 0 12px 28px rgba(16, 33, 58, .16);
}
.ua-menu > button[b-595b4ljtpa], .ua-menu > a[b-595b4ljtpa] {
    display: block; width: 100%; padding: 10px 12px;
    border: 0; border-radius: 6px; background: none;
    color: var(--ua-ink); font-size: 15px; text-align: left; text-decoration: none; cursor: pointer;
}
.ua-menu > a[b-595b4ljtpa] { border-top: 1px solid #edf0f4; border-radius: 0 0 6px 6px; color: var(--ua-cobalt-dark); font-weight: 600; }
.ua-menu > button:hover:not(:disabled)[b-595b4ljtpa], .ua-menu > a:hover[b-595b4ljtpa] { background: var(--ua-cobalt-soft); }
.ua-menu > button:disabled[b-595b4ljtpa] { color: #6b768a; cursor: not-allowed; }

.ua-meta[b-595b4ljtpa] {
    display: flex; flex-wrap: wrap; gap: 6px 16px; align-items: center;
    min-height: 28px; margin: 4px 0 10px; color: var(--ua-muted); font-size: 14px;
}
.ua-meta [data-test="ua-count"][b-595b4ljtpa] { color: var(--ua-ink); font-weight: 600; }
.ua-linkbtn[b-595b4ljtpa] { padding: 2px 4px; border: 0; background: none; color: var(--ua-cobalt-dark); font-size: 14px; font-weight: 650; text-decoration: underline; text-underline-offset: 2px; cursor: pointer; }

/* ---------- states ---------- */
.ua-state[b-595b4ljtpa] {
    display: flex; flex-direction: column; gap: 6px; align-items: flex-start;
    padding: 20px; border: 1px dashed #b9c1ce; border-radius: 12px; background: #fff; color: var(--ua-ink);
}
.ua-state strong[b-595b4ljtpa] { color: var(--ua-navy); font-size: 16px; }
.ua-state .ua-btn[b-595b4ljtpa] { margin-top: 6px; }
.ua-state.is-error[b-595b4ljtpa] { border-style: solid; border-color: #e3a1a1; background: #fff7f7; }
.ua-state.is-error strong[b-595b4ljtpa] { color: #8a1c1c; }
.ua-error-detail[b-595b4ljtpa] { color: var(--ua-muted); font-size: 13.5px; overflow-wrap: anywhere; }
.ua-state[data-test="ua-loading"][b-595b4ljtpa] { flex-direction: row; align-items: center; gap: 12px; }
.ua-spinner[b-595b4ljtpa] { width: 20px; height: 20px; border: 3px solid var(--ua-cobalt-soft); border-top-color: var(--ua-cobalt); border-radius: 50%; animation: ua-spin-b-595b4ljtpa .8s linear infinite; }
@keyframes ua-spin-b-595b4ljtpa { to { transform: rotate(360deg); } }

/* ---------- table ---------- */
.ua-table-wrap[b-595b4ljtpa] { width: 100%; border: 1px solid var(--ua-line); border-radius: 12px; background: #fff; overflow: hidden; }
.ua-table[b-595b4ljtpa] { width: 100%; border-collapse: collapse; }
.ua-table thead th[b-595b4ljtpa] {
    position: sticky; top: 0; z-index: 1;
    padding: 11px 14px; border-bottom: 1px solid var(--ua-line);
    background: #f3f5f9; color: var(--ua-navy);
    font-size: 13px; font-weight: 700; text-align: left; white-space: nowrap;
}
.ua-table td[b-595b4ljtpa], .ua-table tbody th[b-595b4ljtpa] {
    padding: 11px 14px; border-bottom: 1px solid #edf0f4;
    color: var(--ua-ink); font-weight: 400; text-align: left; vertical-align: middle;
}
.ua-table tbody tr:last-child td[b-595b4ljtpa], .ua-table tbody tr:last-child th[b-595b4ljtpa] { border-bottom: 0; }
.ua-table tbody tr:hover td[b-595b4ljtpa], .ua-table tbody tr:hover th[b-595b4ljtpa] { background: #fafbfe; }
.ua-name a[b-595b4ljtpa] { color: var(--ua-cobalt-dark); font-weight: 650; text-decoration: none; overflow-wrap: anywhere; }
.ua-name a:hover[b-595b4ljtpa] { text-decoration: underline; }
.ua-email[b-595b4ljtpa] { overflow-wrap: anywhere; }
.ua-date[b-595b4ljtpa] { white-space: nowrap; color: var(--ua-ink); }
.ua-tag[b-595b4ljtpa] { display: inline-block; margin-left: 8px; padding: 1px 8px; border-radius: 999px; background: #f3e8ff; color: #5b21b6; font-size: 12.5px; font-weight: 650; }

.ua-type[b-595b4ljtpa], .ua-status[b-595b4ljtpa] { display: inline-block; padding: 2px 10px; border-radius: 999px; font-size: 13px; font-weight: 650; white-space: nowrap; }
.ua-type.is-customer[b-595b4ljtpa] { background: #eef1f6; color: #33415a; }
.ua-type.is-staff[b-595b4ljtpa] { background: var(--ua-cobalt-soft); color: var(--ua-cobalt-dark); }
.ua-status.is-active[b-595b4ljtpa] { background: #dcfce7; color: #14532d; }
.ua-status.is-inactive[b-595b4ljtpa] { background: #fff1db; color: #7a4100; }
.ua-status.is-deleted[b-595b4ljtpa] { background: #fde2e2; color: #8a1c1c; }

.ua-pager[b-595b4ljtpa] { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 10px; margin-top: 12px; color: var(--ua-ink); font-size: 14px; }

/* ---------- tablet ---------- */
@media (max-width: 1100px) {
    .ua-toolbar[b-595b4ljtpa] { grid-template-columns: 1fr 1fr; }
    .ua-search[b-595b4ljtpa] { grid-column: 1 / -1; }
    .ua-actions[b-595b4ljtpa] { grid-column: 1 / -1; justify-content: flex-start; }
    .ua-menu[b-595b4ljtpa] { left: 0; right: auto; }
}

/* ---------- phone: each account becomes a card ---------- */
@media (max-width: 760px) {
    .ua-toolbar[b-595b4ljtpa] { grid-template-columns: 1fr; }
    .ua-actions .ua-btn[b-595b4ljtpa] { width: 100%; }
    .ua-menu[b-595b4ljtpa] { width: 100%; min-width: 0; }

    .ua-table-wrap[b-595b4ljtpa] { border: 0; background: none; overflow: visible; }
    .ua-table[b-595b4ljtpa], .ua-table tbody[b-595b4ljtpa], .ua-table tr[b-595b4ljtpa], .ua-table td[b-595b4ljtpa], .ua-table tbody th[b-595b4ljtpa] { display: block; width: 100%; }
    .ua-table thead[b-595b4ljtpa] { display: none; }
    .ua-table tbody tr[b-595b4ljtpa] { margin-bottom: 10px; padding: 10px 0 8px; border: 1px solid var(--ua-line); border-radius: 12px; background: #fff; }
    .ua-table td[b-595b4ljtpa], .ua-table tbody th[b-595b4ljtpa] { border: 0; padding: 3px 14px; }
    .ua-table tbody tr:hover td[b-595b4ljtpa], .ua-table tbody tr:hover th[b-595b4ljtpa] { background: none; }
    .ua-table tbody th.ua-name[b-595b4ljtpa] { padding-bottom: 6px; font-size: 16px; }
    .ua-table tbody th.ua-name a[b-595b4ljtpa] { display: inline-block; min-height: 32px; padding-top: 4px; }
    .ua-table td[data-label][b-595b4ljtpa] { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 8px; }
    .ua-table td[data-label][b-595b4ljtpa]::before { content: attr(data-label); flex: 0 0 104px; color: var(--ua-muted); font-size: 13px; font-weight: 600; }
    .ua-table td.ua-email[b-595b4ljtpa] { overflow-wrap: anywhere; }
    .ua-pager[b-595b4ljtpa] { justify-content: space-between; }
}
/* _content/ApexSupps.Client.Admin/Pages/Admin/Wholesale/WholesaleAdminPage.razor.rz.scp.css */
/* Wholesale admin (round 16): light admin canvas (.ca-light), navy text, cobalt actions, white cards. Same vocabulary as
   Products & Inventory (ProductManagementPage.razor.css). Tokens come from cosmetics-admin.css (--ca-*) with fallbacks. */
.ws[b-u8h36bqnoc] {
    --ws-ink: var(--ca-ink, #172033);
    --ws-navy: var(--ca-navy, #10213a);
    --ws-muted: var(--ca-muted, #4a5870);
    --ws-line: var(--ca-line, #dde2ea);
    --ws-cobalt: var(--ca-cobalt, #2346b8);
    --ws-cobalt-dark: var(--ca-cobalt-dark, #1a3590);
    --ws-cobalt-soft: var(--ca-cobalt-soft, #e8edfb);
    display: flex;
    flex-direction: column;
    gap: 14px;
    width: 100%;
    max-width: 1320px;
    min-width: 0;
    color: var(--ws-ink);
    font-size: 15px;
}

/* ---------- status badges ---------- */
.ws-status[b-u8h36bqnoc] { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 10px; }
.ws-badge[b-u8h36bqnoc] {
    display: inline-flex; align-items: center; gap: 8px;
    min-height: 34px; padding: 4px 12px;
    border: 1px solid var(--ws-line); border-radius: 999px;
    background: #fff; color: var(--ws-navy);
    font-size: 14px; font-weight: 650; white-space: nowrap;
}
.ws-dot[b-u8h36bqnoc] { width: 9px; height: 9px; border-radius: 50%; background: #8a94a6; flex: none; }
.ws-badge.is-on[b-u8h36bqnoc] { border-color: #9ad5b0; background: #effaf3; color: #14532d; }
.ws-badge.is-on .ws-dot[b-u8h36bqnoc] { background: #1f8a4c; }
.ws-badge.is-off[b-u8h36bqnoc] { border-color: #c6ccd6; background: #f1f3f7; color: #33415a; }
.ws-badge.is-off .ws-dot[b-u8h36bqnoc] { background: #6b7588; }
.ws-badge.is-warn[b-u8h36bqnoc] { border-color: #f0c98f; background: #fff7eb; color: #7a4100; }
.ws-badge.is-neutral[b-u8h36bqnoc] { color: #33415a; font-weight: 600; }
.ws-link[b-u8h36bqnoc], .ws-back[b-u8h36bqnoc] { color: var(--ws-cobalt-dark); font-size: 14px; font-weight: 650; text-decoration: underline; text-underline-offset: 2px; }
.ws-back[b-u8h36bqnoc] { align-self: flex-start; display: inline-flex; align-items: center; min-height: 40px; text-decoration: none; }
.ws-back:hover[b-u8h36bqnoc] { text-decoration: underline; }

.ws-result[b-u8h36bqnoc] { margin: 0; padding: 10px 14px; border-radius: 8px; font-size: 14.5px; font-weight: 600; }
.ws-result.ok[b-u8h36bqnoc] { background: #dcfce7; color: #14532d; }
.ws-result.bad[b-u8h36bqnoc] { background: #fde8e7; color: #8a1c13; }

/* ---------- summary counts ---------- */
.ws-summary[b-u8h36bqnoc] { display: grid; grid-template-columns: repeat(3, minmax(0, 180px)); gap: 10px; }
.ws-kpi[b-u8h36bqnoc] {
    display: flex; flex-direction: column; align-items: flex-start; gap: 0;
    padding: 10px 14px; border: 1px solid var(--ws-line); border-radius: 12px;
    background: #fff; color: var(--ws-ink); text-align: left; cursor: pointer; font: inherit;
}
.ws-kpi:hover[b-u8h36bqnoc] { border-color: var(--ws-cobalt); }
.ws-kpi.is-active[b-u8h36bqnoc] { border-color: var(--ws-cobalt); box-shadow: inset 0 0 0 1px var(--ws-cobalt); background: #f8faff; }
.ws-kpi-value[b-u8h36bqnoc] { color: var(--ws-navy); font-size: 26px; font-weight: 700; line-height: 1.15; font-variant-numeric: tabular-nums; }
.ws-kpi-label[b-u8h36bqnoc] { color: var(--ws-ink); font-size: 14px; font-weight: 600; }

/* ---------- toolbar, chips, fields ---------- */
.ws-toolbar[b-u8h36bqnoc] { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 10px 16px; }
.ws-chips[b-u8h36bqnoc] { display: flex; flex-wrap: wrap; gap: 6px; }
.ws-chip-btn[b-u8h36bqnoc] {
    display: inline-flex; align-items: center; gap: 6px; min-height: 40px; padding: 6px 14px;
    border: 1px solid #b9c1ce; border-radius: 999px; background: #fff; color: #33415a;
    font: inherit; font-size: 14px; font-weight: 650; cursor: pointer;
}
.ws-chip-btn:hover[b-u8h36bqnoc] { border-color: var(--ws-navy); color: var(--ws-navy); }
.ws-chip-btn.is-active[b-u8h36bqnoc] { border-color: var(--ws-navy); background: var(--ws-navy); color: #fff; }
.ws-chip-n[b-u8h36bqnoc] { padding: 0 7px; border-radius: 999px; background: #eef1f6; color: #33415a; font-size: 12.5px; font-variant-numeric: tabular-nums; }
.ws-chip-btn.is-active .ws-chip-n[b-u8h36bqnoc] { background: rgba(255, 255, 255, .2); color: #fff; }

.ws-field[b-u8h36bqnoc] { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.ws-field label[b-u8h36bqnoc], .ws-label[b-u8h36bqnoc] { color: var(--ws-navy); font-size: 13.5px; font-weight: 650; }
.ws-search[b-u8h36bqnoc] { width: min(320px, 100%); }
.ws input:not([type=checkbox])[b-u8h36bqnoc], .ws select[b-u8h36bqnoc], .ws textarea[b-u8h36bqnoc] {
    width: 100%; min-height: 42px; padding: 8px 12px;
    border: 1px solid #b9c1ce; border-radius: 8px; background: #fff; color: var(--ws-ink);
    font: inherit; font-size: 15px;
}
.ws textarea[b-u8h36bqnoc] { resize: vertical; line-height: 1.45; }
.ws input[b-u8h36bqnoc]::placeholder, .ws textarea[b-u8h36bqnoc]::placeholder { color: #6b7588; }
.ws input:focus-visible[b-u8h36bqnoc], .ws select:focus-visible[b-u8h36bqnoc], .ws textarea:focus-visible[b-u8h36bqnoc] { outline: 3px solid rgba(35, 70, 184, .3); border-color: var(--ws-cobalt); }
.ws [aria-invalid=true][b-u8h36bqnoc] { border-color: #b42318; box-shadow: 0 0 0 1px #b42318; }
.ws-meta[b-u8h36bqnoc] { margin: 0; color: var(--ws-muted); font-size: 14px; }
.ws-hint[b-u8h36bqnoc] { display: block; margin: 2px 0 0; color: var(--ws-muted); font-size: 13px; }
.ws-error[b-u8h36bqnoc] { margin: 0; color: #9f1d1d; font-size: 14px; font-weight: 650; }
.ws-check[b-u8h36bqnoc] { display: inline-flex; align-items: center; gap: 10px; min-height: 44px; font-weight: 650; color: var(--ws-navy); cursor: pointer; }
.ws-check input[b-u8h36bqnoc] { width: 20px; height: 20px; }

/* ---------- buttons ---------- */
.ws-btn[b-u8h36bqnoc] {
    display: inline-flex; align-items: center; justify-content: center; gap: 6px;
    min-height: 42px; padding: 8px 16px;
    border: 1.5px solid var(--ws-navy); border-radius: 8px; background: #fff; color: var(--ws-navy);
    font: inherit; font-size: 15px; font-weight: 650; text-decoration: none; white-space: nowrap; cursor: pointer;
}
.ws-btn:hover:not(:disabled)[b-u8h36bqnoc] { background: var(--ws-cobalt-soft); color: var(--ws-navy); }
.ws-btn:disabled[b-u8h36bqnoc] { border-color: #b9c1ce; color: #6b7588; background: #f1f3f7; cursor: not-allowed; }
.ws-btn.primary[b-u8h36bqnoc] { border-color: var(--ws-cobalt); background: var(--ws-cobalt); color: #fff; }
.ws-btn.primary:hover:not(:disabled)[b-u8h36bqnoc] { background: var(--ws-cobalt-dark); color: #fff; }
.ws-btn.is-approve[b-u8h36bqnoc] { border-color: var(--ws-cobalt); color: var(--ws-cobalt-dark); }
.ws-btn.is-approve.primary[b-u8h36bqnoc] { background: var(--ws-cobalt); color: #fff; }
.ws-btn.is-danger[b-u8h36bqnoc] { border-color: #b42318; color: #9f1d1d; }
.ws-btn.is-danger:hover:not(:disabled)[b-u8h36bqnoc] { background: #fde8e7; color: #8a1c13; }
.ws-btn.is-danger.primary[b-u8h36bqnoc] { background: #b42318; border-color: #b42318; color: #fff; }
.ws-btn.is-danger.primary:hover:not(:disabled)[b-u8h36bqnoc] { background: #8a1c13; color: #fff; }
.ws-btn.is-quiet[b-u8h36bqnoc] { border-color: #b9c1ce; }
.ws-row-actions[b-u8h36bqnoc] { display: flex; flex-wrap: wrap; gap: 8px; }

/* ---------- states ---------- */
.ws-state[b-u8h36bqnoc] {
    display: flex; flex-direction: column; align-items: flex-start; gap: 6px;
    padding: 20px; border: 1px dashed #c6ccd6; border-radius: 12px; background: #fff; color: var(--ws-ink);
}
.ws-state strong[b-u8h36bqnoc] { color: var(--ws-navy); font-size: 16px; }
.ws-state.is-error[b-u8h36bqnoc] { border-style: solid; border-color: #f0b4b4; background: #fff7f7; }
.ws-state[role=status][b-u8h36bqnoc] { flex-direction: row; align-items: center; gap: 12px; }
.ws-spinner[b-u8h36bqnoc] { width: 20px; height: 20px; border: 3px solid var(--ws-cobalt-soft); border-top-color: var(--ws-cobalt); border-radius: 50%; animation: ws-spin-b-u8h36bqnoc .8s linear infinite; }
@keyframes ws-spin-b-u8h36bqnoc { to { transform: rotate(360deg); } }

.ws-note[b-u8h36bqnoc] { margin: 0; padding: 10px 14px; border-left: 4px solid var(--ws-cobalt); border-radius: 8px; background: var(--ws-cobalt-soft); color: #1d2b4a; font-size: 14px; }
.ws-note.is-plain[b-u8h36bqnoc] { border-left-color: #8a94a6; background: #fff; border: 1px solid var(--ws-line); border-left: 4px solid #8a94a6; }
.ws-note[data-test=ws-tax-note][b-u8h36bqnoc] { border-left-color: #d98a2b; background: #fff7eb; color: #4a2a00; }

/* ---------- tables ---------- */
.ws-table-wrap[b-u8h36bqnoc] { width: 100%; min-width: 0; max-width: 100%; border: 1px solid var(--ws-line); border-radius: 12px; background: #fff; overflow-x: auto; }
.ws > *[b-u8h36bqnoc] { min-width: 0; max-width: 100%; }
.ws-table[b-u8h36bqnoc] { width: 100%; border-collapse: collapse; }
.ws-table thead th[b-u8h36bqnoc] {
    padding: 11px 14px; border-bottom: 1px solid var(--ws-line); background: #f3f5f9;
    color: var(--ws-navy); font-size: 13px; font-weight: 700; text-align: left; white-space: nowrap;
}
.ws-table td[b-u8h36bqnoc], .ws-table tbody th[b-u8h36bqnoc] {
    padding: 11px 14px; border-bottom: 1px solid #edf0f4; color: var(--ws-ink);
    font-weight: 400; text-align: left; vertical-align: middle;
}
.ws-table tbody tr:last-child td[b-u8h36bqnoc], .ws-table tbody tr:last-child th[b-u8h36bqnoc] { border-bottom: 0; }
.ws-table .num[b-u8h36bqnoc] { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
.ws-app-row[b-u8h36bqnoc] { cursor: pointer; }
.ws-app-row:hover td[b-u8h36bqnoc], .ws-app-row:hover th[b-u8h36bqnoc] { background: #fafbfe; }
.ws-name[b-u8h36bqnoc] { display: block; color: var(--ws-navy); font-weight: 650; overflow-wrap: anywhere; }
.ws-sub[b-u8h36bqnoc] { display: block; margin: 0; color: var(--ws-muted); font-size: 13.5px; }
.ws-email[b-u8h36bqnoc] { overflow-wrap: anywhere; }
.ws-nowrap[b-u8h36bqnoc] { white-space: nowrap; }
.ws-cell-open[b-u8h36bqnoc] { width: 1%; text-align: right !important; white-space: nowrap; }
.ws-open[b-u8h36bqnoc] {
    display: inline-flex; align-items: center; min-height: 38px; padding: 6px 14px;
    border: 1.5px solid var(--ws-cobalt); border-radius: 8px; background: #fff; color: var(--ws-cobalt-dark);
    font: inherit; font-size: 14.5px; font-weight: 650; text-decoration: none; cursor: pointer; white-space: nowrap;
}
.ws-open:hover[b-u8h36bqnoc] { background: var(--ws-cobalt-soft); color: var(--ws-cobalt-dark); }

.ws-status-badge[b-u8h36bqnoc] { display: inline-block; padding: 2px 10px; border-radius: 999px; font-size: 13px; font-weight: 700; white-space: nowrap; }
.ws-status-badge.is-new[b-u8h36bqnoc] { background: #e0e9ff; color: #1a3590; }
.ws-status-badge.is-reviewing[b-u8h36bqnoc] { background: #fff1db; color: #7a4100; }
.ws-status-badge.is-approved[b-u8h36bqnoc] { background: #dcfce7; color: #14532d; }
.ws-status-badge.is-declined[b-u8h36bqnoc] { background: #eef1f6; color: #33415a; }
.ws-status-badge.is-suspended[b-u8h36bqnoc] { background: #fde2e2; color: #9f1d1d; }

.ws-chip[b-u8h36bqnoc] { display: inline-block; padding: 1px 9px; border-radius: 999px; font-size: 13px; font-weight: 650; white-space: nowrap; }
.ws-chip.is-ok[b-u8h36bqnoc] { background: #dcfce7; color: #14532d; }
.ws-chip.is-warn[b-u8h36bqnoc] { background: #fff1db; color: #7a4100; }
.ws-chip.is-off[b-u8h36bqnoc] { background: #eef1f6; color: #33415a; }

.ws-product-cell[b-u8h36bqnoc] { display: flex; gap: 12px; align-items: center; min-width: 200px; }
.ws-thumb[b-u8h36bqnoc] { flex: 0 0 auto; width: 48px; height: 48px; border-radius: 8px; object-fit: cover; background: #f1f3f7; border: 1px solid var(--ws-line); }
.ws-thumb.is-empty[b-u8h36bqnoc] { display: inline-flex; align-items: center; justify-content: center; color: #5d6b82; font-size: 10.5px; text-align: center; line-height: 1.1; }
.ws-product-text[b-u8h36bqnoc] { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.ws-tags[b-u8h36bqnoc] { display: flex; flex-wrap: wrap; gap: 6px; }
.ws-tag[b-u8h36bqnoc] { padding: 1px 8px; border-radius: 999px; background: #eef1f6; color: #33415a; font-size: 12.5px; font-weight: 600; }
.ws-tag.is-warn[b-u8h36bqnoc] { background: #fff1db; color: #7a4100; }
.ws-product-row.is-muted .ws-name[b-u8h36bqnoc] { color: #4a5870; }
.ws-margin[b-u8h36bqnoc] { display: block; color: var(--ws-muted); font-size: 12.5px; font-weight: 500; }
.ws-missing[b-u8h36bqnoc] { color: #8a1c13; font-size: 13.5px; font-weight: 600; }

/* ---------- application detail ---------- */
.ws-detail[b-u8h36bqnoc] { display: flex; flex-direction: column; gap: 14px; }
.ws-card[b-u8h36bqnoc] { display: flex; flex-direction: column; gap: 12px; padding: 16px 18px; border: 1px solid var(--ws-line); border-radius: 12px; background: #fff; color: var(--ws-ink); min-width: 0; }
.ws-detail-head[b-u8h36bqnoc] { flex-direction: row; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; }
.ws-detail-head .ws-status-badge[b-u8h36bqnoc] { font-size: 14.5px; padding: 4px 14px; }
.ws-h2[b-u8h36bqnoc] { margin: 0; color: var(--ws-navy); font-family: 'Space Grotesk', 'Inter', sans-serif; font-size: 22px; font-weight: 700; letter-spacing: -.01em; overflow-wrap: anywhere; }
.ws-h3[b-u8h36bqnoc] { margin: 0; color: var(--ws-navy); font-family: 'Inter', sans-serif; font-size: 16.5px; font-weight: 700; }
.ws-detail-grid[b-u8h36bqnoc] { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 14px; align-items: start; }
.ws-col[b-u8h36bqnoc] { display: flex; flex-direction: column; gap: 14px; min-width: 0; }
.ws-dl[b-u8h36bqnoc] { display: flex; flex-direction: column; gap: 0; margin: 0; }
.ws-dl > div[b-u8h36bqnoc] { display: grid; grid-template-columns: 150px minmax(0, 1fr); gap: 4px 12px; padding: 8px 0; border-top: 1px solid #edf0f4; }
.ws-dl > div:first-child[b-u8h36bqnoc] { border-top: 0; padding-top: 0; }
.ws-dl dt[b-u8h36bqnoc] { color: var(--ws-muted); font-size: 13.5px; font-weight: 600; }
.ws-dl dd[b-u8h36bqnoc] { margin: 0; color: var(--ws-ink); overflow-wrap: anywhere; }
.ws-dl dd a[b-u8h36bqnoc] { color: var(--ws-cobalt-dark); font-weight: 600; }
.ws-dl.is-tight > div[b-u8h36bqnoc] { padding: 5px 0; }
.ws-pre[b-u8h36bqnoc] { white-space: pre-wrap; }
.ws-mono[b-u8h36bqnoc] { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 13px; overflow-wrap: anywhere; }
.ws-form-row[b-u8h36bqnoc] { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 10px; }
.ws-confirm[b-u8h36bqnoc] { display: flex; flex-direction: column; gap: 8px; padding: 14px; border: 1.5px solid var(--ws-cobalt); border-radius: 10px; background: #f8faff; }
.ws-confirm-title[b-u8h36bqnoc] { margin: 0; color: var(--ws-navy); font-size: 16px; font-weight: 700; overflow-wrap: anywhere; }
.ws-history[b-u8h36bqnoc] { display: flex; flex-direction: column; margin: 0; padding: 0; list-style: none; }
.ws-history li[b-u8h36bqnoc] { display: grid; grid-template-columns: 170px minmax(0, 1fr); gap: 2px 12px; padding: 8px 0; border-top: 1px solid #edf0f4; }
.ws-history li:first-child[b-u8h36bqnoc] { border-top: 0; padding-top: 0; }
.ws-history-when[b-u8h36bqnoc] { color: var(--ws-muted); font-size: 13px; }
.ws-history-kind[b-u8h36bqnoc] { color: var(--ws-navy); font-weight: 650; font-size: 14px; }
.ws-history-text[b-u8h36bqnoc] { grid-column: 2; overflow-wrap: anywhere; font-size: 14px; }

/* ---------- tiers ---------- */
.ws-tier-cards[b-u8h36bqnoc] { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.ws-tier-pct[b-u8h36bqnoc] { margin: -6px 0 0; color: var(--ws-cobalt-dark); font-size: 24px; font-weight: 700; }
.ws-tier-table input[b-u8h36bqnoc] { min-width: 70px; }

/* ---------- product editor dialog ---------- */
.ws-overlay[b-u8h36bqnoc] { position: fixed; inset: 0; z-index: 1040; background: rgba(12, 24, 41, .45); }
.ws-dialog[b-u8h36bqnoc] {
    position: fixed; z-index: 1050; top: 50%; left: 50%; transform: translate(-50%, -50%);
    width: min(560px, calc(100vw - 24px)); max-height: calc(100vh - 40px); overflow-y: auto;
    display: flex; flex-direction: column; gap: 12px; padding: 20px;
    border-radius: 14px; background: #fff; color: var(--ws-ink); box-shadow: 0 24px 60px rgba(12, 24, 41, .3);
}
.ws-advanced-inline summary[b-u8h36bqnoc] { cursor: pointer; color: var(--ws-navy); font-weight: 650; min-height: 32px; }
.ws-advanced-inline[open][b-u8h36bqnoc] { display: flex; flex-direction: column; gap: 10px; }

/* ---------- Advanced ---------- */
.ws-advanced[b-u8h36bqnoc] { margin-top: 10px; border: 1px solid var(--ws-line); border-radius: 12px; background: #fff; }
.ws-advanced summary[b-u8h36bqnoc] { display: flex; align-items: center; min-height: 44px; padding: 0 16px; color: var(--ws-navy); font-weight: 650; cursor: pointer; }
.ws-advanced-body[b-u8h36bqnoc] { display: flex; flex-direction: column; gap: 8px; padding: 0 16px 14px; }
.ws-advanced .ws-dl > div[b-u8h36bqnoc] { grid-template-columns: 200px minmax(0, 1fr); }

.ws a:focus-visible[b-u8h36bqnoc], .ws button:focus-visible[b-u8h36bqnoc], .ws summary:focus-visible[b-u8h36bqnoc] { outline: 3px solid var(--ca-copper, #e7a96b); outline-offset: 2px; }

/* ---------- tablet ---------- */
@media (max-width: 1100px) {
    .ws-detail-grid[b-u8h36bqnoc] { grid-template-columns: minmax(0, 1fr); }
    .ws-tier-cards[b-u8h36bqnoc] { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

/* ---------- tablet (820): the wide tables (products, tier editor) become cards ---------- */
@media (max-width: 1000px) {
    .ws-wrap-products[b-u8h36bqnoc], .ws-wrap-tier-table[b-u8h36bqnoc] { border: 0; background: none; overflow: visible; }
    .ws-products[b-u8h36bqnoc], .ws-tier-table[b-u8h36bqnoc], .ws-products tbody[b-u8h36bqnoc], .ws-tier-table tbody[b-u8h36bqnoc], .ws-products tr[b-u8h36bqnoc], .ws-tier-table tr[b-u8h36bqnoc], .ws-products td[b-u8h36bqnoc], .ws-tier-table td[b-u8h36bqnoc], .ws-products tbody th[b-u8h36bqnoc], .ws-tier-table tbody th[b-u8h36bqnoc] { display: block; width: 100%; }
    .ws-products thead[b-u8h36bqnoc], .ws-tier-table thead[b-u8h36bqnoc] { display: none; }
    .ws-products tbody tr[b-u8h36bqnoc], .ws-tier-table tbody tr[b-u8h36bqnoc] {
        margin-bottom: 12px; padding: 12px 14px; border: 1px solid var(--ws-line); border-radius: 12px; background: #fff;
    }
    .ws-products td[b-u8h36bqnoc], .ws-tier-table td[b-u8h36bqnoc], .ws-products tbody th[b-u8h36bqnoc], .ws-tier-table tbody th[b-u8h36bqnoc] { padding: 4px 0; border: 0; text-align: left; }
    .ws-products .num[b-u8h36bqnoc], .ws-tier-table .num[b-u8h36bqnoc] { text-align: left; white-space: normal; }
    .ws-products td[data-label][b-u8h36bqnoc], .ws-tier-table td[data-label][b-u8h36bqnoc] { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 10px; }
    .ws-products td[data-label][b-u8h36bqnoc]::before, .ws-tier-table td[data-label][b-u8h36bqnoc]::before { content: attr(data-label); flex: 0 0 104px; color: var(--ws-muted); font-size: 13px; font-weight: 600; }
    .ws-products td[data-label] > span:not(.ws-margin):not(.ws-sub)[b-u8h36bqnoc], .ws-tier-table td[data-label] > span:not(.ws-margin):not(.ws-sub)[b-u8h36bqnoc] { flex: 0 1 auto; }
    .ws-products td[data-label] .ws-margin[b-u8h36bqnoc], .ws-tier-table td[data-label] .ws-margin[b-u8h36bqnoc], .ws-products td[data-label] .ws-sub[b-u8h36bqnoc], .ws-tier-table td[data-label] .ws-sub[b-u8h36bqnoc] { flex: 1 1 100%; padding-left: 114px; }
    .ws-products .ws-cell-open[b-u8h36bqnoc], .ws-tier-table .ws-cell-open[b-u8h36bqnoc] { width: 100%; padding-top: 8px; text-align: left !important; }
    .ws-products .ws-open[b-u8h36bqnoc], .ws-tier-table .ws-open[b-u8h36bqnoc] { width: 100%; justify-content: center; }
    .ws-products .ws-product-cell[b-u8h36bqnoc], .ws-tier-table .ws-product-cell[b-u8h36bqnoc] { min-width: 0; }
    .ws-products .ws-cell-business[b-u8h36bqnoc], .ws-tier-table .ws-cell-business[b-u8h36bqnoc], .ws-cell-product[b-u8h36bqnoc] { padding-bottom: 8px !important; }
    .ws-tier-table td[data-label] input[b-u8h36bqnoc] { flex: 1 1 140px; }
}

/* ---------- phone: rows become cards ---------- */
@media (max-width: 760px) {
    .ws-summary[b-u8h36bqnoc] { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
    .ws-kpi[b-u8h36bqnoc] { padding: 8px 10px; }
    .ws-kpi-value[b-u8h36bqnoc] { font-size: 22px; }
    .ws-kpi-label[b-u8h36bqnoc] { font-size: 13px; }
    .ws-search[b-u8h36bqnoc] { width: 100%; }
    .ws-chips[b-u8h36bqnoc] { flex-wrap: nowrap; overflow-x: auto; max-width: 100%; padding-bottom: 2px; }
    .ws-chip-btn[b-u8h36bqnoc] { flex: none; min-height: 44px; }
    .ws-tier-cards[b-u8h36bqnoc] { grid-template-columns: minmax(0, 1fr); }
    .ws-form-row[b-u8h36bqnoc] { grid-template-columns: minmax(0, 1fr); }
    .ws-dl > div[b-u8h36bqnoc], .ws-advanced .ws-dl > div[b-u8h36bqnoc] { grid-template-columns: minmax(0, 1fr); }
    .ws-history li[b-u8h36bqnoc] { grid-template-columns: minmax(0, 1fr); }
    .ws-history-text[b-u8h36bqnoc] { grid-column: 1; }
    .ws-btn[b-u8h36bqnoc], .ws-open[b-u8h36bqnoc] { min-height: 44px; }

    .ws-table-wrap[b-u8h36bqnoc] { border: 0; background: none; overflow: visible; }
    .ws-table[b-u8h36bqnoc], .ws-table tbody[b-u8h36bqnoc], .ws-table tr[b-u8h36bqnoc], .ws-table td[b-u8h36bqnoc], .ws-table tbody th[b-u8h36bqnoc] { display: block; width: 100%; }
    .ws-table thead[b-u8h36bqnoc] { display: none; }
    .ws-table tbody tr[b-u8h36bqnoc] {
        margin-bottom: 12px; padding: 12px 14px; border: 1px solid var(--ws-line); border-radius: 12px; background: #fff;
    }
    .ws-table td[b-u8h36bqnoc], .ws-table tbody th[b-u8h36bqnoc] { padding: 4px 0; border: 0; text-align: left; }
    .ws-table .num[b-u8h36bqnoc] { text-align: left; white-space: normal; }
    .ws-table td[data-label][b-u8h36bqnoc] { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 10px; }
    .ws-table td[data-label][b-u8h36bqnoc]::before { content: attr(data-label); flex: 0 0 104px; color: var(--ws-muted); font-size: 13px; font-weight: 600; }
    .ws-table td[data-label] > span:not(.ws-margin):not(.ws-sub)[b-u8h36bqnoc] { flex: 0 1 auto; }
    .ws-table td[data-label] .ws-margin[b-u8h36bqnoc], .ws-table td[data-label] .ws-sub[b-u8h36bqnoc] { flex: 1 1 100%; padding-left: 114px; }
    .ws-table .ws-cell-open[b-u8h36bqnoc] { width: 100%; padding-top: 8px; text-align: left !important; }
    .ws-open[b-u8h36bqnoc] { width: 100%; justify-content: center; }
    .ws-product-cell[b-u8h36bqnoc] { min-width: 0; }
    .ws-cell-business[b-u8h36bqnoc], .ws-cell-product[b-u8h36bqnoc] { padding-bottom: 8px !important; }
    .ws-tier-table td[data-label] input[b-u8h36bqnoc] { flex: 1 1 140px; }
}
@media (prefers-reduced-motion: reduce) {
    .ws-spinner[b-u8h36bqnoc] { animation: none; }
}
