/**
 * Custom Quotes workspace (B2B quote redesign) — admin list + detail.
 *
 * Built entirely on the Storelly design tokens (_tokens.css) and the shared
 * component library (storelly-admin-ui.css). This file only adds the few
 * quote-specific pieces that the shared library does not provide: extra status
 * pill variants, the two-column detail layout, the line-item builder table,
 * the totals block, and the activity timeline.
 *
 * @package Storelly
 */

/* ── Status pill variants (extend .spbwc-pill from the shared library) ── */
.spbwc-pill--info {
    background: var(--st-pill-featured-bg);
    color: var(--st-pill-featured-text);
}
.spbwc-pill--danger {
    background: var(--st-pill-danger-bg);
    color: var(--st-pill-danger-text);
}
.spbwc-pill--success {
    background: var(--st-pill-active-bg);
    color: var(--st-pill-active-text);
}

/* ── KPI summary cards (list header) ──────────────────────────────────── */
.spbwc-q-kpis {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: var(--nbd-space-4);
    margin: 0 0 var(--nbd-space-5);
}
.spbwc-q-kpi {
    display: grid;
    grid-template-columns: auto 1fr;
    grid-template-rows: auto auto;
    align-items: center;
    column-gap: var(--nbd-space-3);
    padding: var(--nbd-space-4) var(--nbd-space-5);
    background: var(--nbd-st-bg);
    border: 1px solid var(--nbd-st-border-light);
    border-left: 3px solid var(--nbd-st-border-strong);
    border-radius: var(--nbd-radius-md);
    box-shadow: var(--shadow-sm);
}
.spbwc-q-kpi__icon { grid-row: 1 / 3; font-size: var(--st-icon-xl); width: var(--st-icon-xl); height: var(--st-icon-xl); color: var(--nbd-st-text-mute); }
.spbwc-q-kpi__value { font-size: var(--text-2xl); font-weight: var(--font-extrabold); line-height: 1.1; color: var(--nbd-st-text); }
.spbwc-q-kpi__label { font-size: 12px; color: var(--nbd-st-text-soft); text-transform: uppercase; letter-spacing: .03em; }
.spbwc-q-kpi__sub { grid-column: 2; font-size: 12px; color: var(--nbd-st-text-mute); margin-top: 2px; }
.spbwc-q-kpi--warn { border-left-color: var(--nbd-color-warning); }
.spbwc-q-kpi--warn .spbwc-q-kpi__icon { color: var(--nbd-color-warning); }
.spbwc-q-kpi--info { border-left-color: var(--st-brand); }
.spbwc-q-kpi--info .spbwc-q-kpi__icon { color: var(--st-brand); }
.spbwc-q-kpi--ok { border-left-color: var(--nbd-color-success); }
.spbwc-q-kpi--ok .spbwc-q-kpi__icon { color: var(--nbd-color-success); }

/* ── List: per-row action links ───────────────────────────────────────── */
.spbwc-q-rowtitle {
    display: flex;
    flex-direction: column;
    gap: 2px;
}
.spbwc-q-rowtitle__num {
    font-weight: var(--font-bold);
    color: var(--nbd-st-text-brand);
}
.spbwc-q-rowtitle__sub {
    font-size: var(--text-xs);
    color: var(--nbd-st-text-mute);
}
.spbwc-q-expires--soon { color: var(--nbd-color-danger); font-weight: var(--font-semibold); }

/* ── Detail: two-column layout ────────────────────────────────────────── */
.spbwc-q-detail {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 320px;
    gap: var(--nbd-space-5);
    align-items: start;
}
@media (max-width: 1100px) {
    .spbwc-q-detail { grid-template-columns: 1fr; }
}
.spbwc-q-detail__main,
.spbwc-q-detail__side {
    display: flex;
    flex-direction: column;
    gap: var(--nbd-space-5);
    min-width: 0;
}

/* ── Request recap (definition list) ──────────────────────────────────── */
.spbwc-q-recap {
    display: grid;
    grid-template-columns: 160px 1fr;
    gap: var(--nbd-space-2) var(--nbd-space-4);
}
.spbwc-q-recap__label {
    font-size: var(--text-xs);
    text-transform: uppercase;
    letter-spacing: .03em;
    color: var(--nbd-st-text-mute);
    font-weight: var(--font-semibold);
    padding-top: 2px;
}
.spbwc-q-recap__value {
    font-size: 13px;
    color: var(--nbd-st-text);
    word-break: break-word;
}
.spbwc-q-recap__items { margin: 0; padding: 0; list-style: none; }
.spbwc-q-recap__items li { padding: 2px 0; }
.spbwc-q-recap__qty { color: var(--nbd-st-text-soft); font-weight: 600; }

/* ── Template bar (P3.12) ─────────────────────────────────────────────── */
.spbwc-q-tmpl-bar {
    display: flex;
    align-items: center;
    gap: var(--nbd-space-2);
    flex-wrap: wrap;
    margin-bottom: var(--nbd-space-4);
    padding-bottom: var(--nbd-space-3);
    border-bottom: 1px solid var(--nbd-st-border-subtle);
}
.spbwc-q-tmpl-bar .spbwc-input--sm { width: auto; min-width: 200px; height: 30px; padding: 4px 10px; }
.spbwc-q-tmpl-bar .spbwc-q-spacer { flex: 1; }

/* ── Line-item builder ────────────────────────────────────────────────── */
.spbwc-q-lines { width: 100%; border-collapse: collapse; }
.spbwc-q-lines th {
    font-size: var(--text-xs);
    text-transform: uppercase;
    letter-spacing: .03em;
    color: var(--nbd-st-text-mute);
    text-align: left;
    padding: var(--nbd-space-2) var(--nbd-space-3);
    border-bottom: 1px solid var(--nbd-st-border-light);
}
.spbwc-q-lines th.spbwc-q-num,
.spbwc-q-lines td.spbwc-q-num { text-align: right; width: 110px; }
.spbwc-q-lines th.spbwc-q-act,
.spbwc-q-lines td.spbwc-q-act { width: 40px; text-align: center; }
.spbwc-q-lines td {
    padding: var(--nbd-space-2) var(--nbd-space-3);
    border-bottom: 1px solid var(--nbd-st-border-subtle);
    vertical-align: top;
}
.spbwc-q-line-input {
    width: 100%;
    padding: var(--st-field-pad);
    border: 1px solid var(--st-field-border);
    border-radius: var(--st-field-radius);
    font-size: var(--st-field-font);
    background: var(--st-field-bg);
    box-shadow: var(--st-field-shadow);
}
.spbwc-q-line-input:focus {
    border-color: var(--st-brand);
    box-shadow: var(--st-field-focus-shadow);
    outline: none;
}
.spbwc-q-line-input--num { text-align: right; }
/* Inline validation: highlight a line that needs a name before sending. */
.spbwc-q-line-input--error {
    border-color: var(--nbd-color-danger);
    background: var(--nbd-color-danger-soft);
}
.spbwc-q-line-input--error:focus {
    border-color: var(--nbd-color-danger);
    box-shadow: 0 0 0 1px var(--nbd-color-danger);
}
.spbwc-q-line-total {
    font-variant-numeric: tabular-nums;
    font-weight: var(--font-semibold);
    color: var(--nbd-st-text);
    white-space: nowrap;
}

/* ── Totals block ─────────────────────────────────────────────────────── */
.spbwc-q-totals {
    margin-left: auto;
    width: 320px;
    max-width: 100%;
    display: flex;
    flex-direction: column;
    gap: var(--nbd-space-1);
}
.spbwc-q-totals__row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: var(--nbd-space-4);
    padding: 4px 0;
    font-size: 13px;
    color: var(--nbd-st-text-soft);
}
.spbwc-q-totals__row input {
    width: 120px;
    text-align: right;
}
.spbwc-q-totals__row--grand {
    border-top: 1px solid var(--nbd-st-border-light);
    margin-top: var(--nbd-space-1);
    padding-top: var(--nbd-space-2);
    font-size: var(--text-lg);
    font-weight: var(--font-bold);
    color: var(--nbd-st-text);
}

/* ── Terms grid ───────────────────────────────────────────────────────── */
.spbwc-q-terms {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: var(--nbd-space-4);
}
.spbwc-q-field { display: flex; flex-direction: column; gap: 6px; }
.spbwc-q-field > label {
    font-size: var(--text-xs);
    text-transform: uppercase;
    letter-spacing: .03em;
    color: var(--nbd-st-text-mute);
    font-weight: var(--font-semibold);
}
.spbwc-q-field--full { grid-column: 1 / -1; }

/* Flush hint utility (replaces inline overrides) */
.spbwc-q-hint--flush { margin: 0; border: 0; padding-left: 0; }
.spbwc-q-hint--top { margin-top: var(--nbd-space-2); }

/* ── Activity timeline ────────────────────────────────────────────────── */
.spbwc-q-timeline { display: flex; flex-direction: column; gap: 0; }
.spbwc-q-timeline__item {
    position: relative;
    padding: 0 0 var(--nbd-space-4) var(--nbd-space-5);
    border-left: 2px solid var(--nbd-st-border-light);
}
.spbwc-q-timeline__item:last-child { border-left-color: transparent; padding-bottom: 0; }
.spbwc-q-timeline__dot {
    position: absolute;
    left: -6px;
    top: 2px;
    width: 10px;
    height: 10px;
    border-radius: var(--nbd-radius-pill);
    background: var(--st-brand);
    box-shadow: 0 0 0 3px var(--st-brand-tint);
}
.spbwc-q-timeline__body { font-size: 13px; color: var(--nbd-st-text); }
.spbwc-q-timeline__time { font-size: var(--text-xs); color: var(--nbd-st-text-mute); margin-top: 2px; }
/* Optimistic (in-flight) entry: muted text + pulsing dot until the server confirms. */
.spbwc-q-timeline__item--pending .spbwc-q-timeline__body { color: var(--nbd-st-text-soft); font-style: italic; }
.spbwc-q-timeline__item--pending .spbwc-q-timeline__dot {
    background: var(--nbd-st-text-mute);
    box-shadow: 0 0 0 3px var(--nbd-st-bg-soft);
    animation: spbwc-q-pulse 1s ease-in-out infinite;
}

/* ── Sidebar meta card ────────────────────────────────────────────────── */
.spbwc-q-meta { display: flex; flex-direction: column; gap: var(--nbd-space-2); }
.spbwc-q-meta__row { display: flex; justify-content: space-between; gap: var(--nbd-space-3); font-size: 13px; }
.spbwc-q-meta__label { color: var(--nbd-st-text-mute); }
.spbwc-q-meta__value { color: var(--nbd-st-text); font-weight: var(--font-medium); text-align: right; word-break: break-word; }
/* Quote value: emphasised so the live total stays scannable in the sidebar. */
.spbwc-q-meta__row--total {
    padding-top: var(--nbd-space-2);
    margin-top: var(--nbd-space-1);
    border-top: 1px solid var(--nbd-st-border-subtle);
    align-items: baseline;
}
.spbwc-q-meta__total {
    font-size: var(--text-lg);
    font-weight: var(--font-bold);
    color: var(--nbd-st-text-brand);
    font-variant-numeric: tabular-nums;
}

/* ── Action bar (detail footer) ───────────────────────────────────────── */
.spbwc-q-actionbar {
    display: flex;
    flex-wrap: wrap;
    gap: var(--nbd-space-3);
    align-items: center;
}
.spbwc-q-actionbar .spbwc-q-spacer { flex: 1; }

/* Sticky action footer — keep Save/Send reachable on a long quote form. */
.spbwc-q-actionblock {
    position: sticky;
    bottom: var(--nbd-space-4);
    z-index: 5;
    box-shadow: var(--shadow-lg);
}
/* Busy button: dim + wait cursor while the AJAX request is in flight. */
.spbwc-q-actionbar .spbwc-cta-btn.is-busy { opacity: .65; cursor: progress; }

/* Save-state badge (dirty indicator next to the primary actions). */
.spbwc-q-savestate {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: var(--text-xs);
    font-weight: var(--font-medium);
    color: var(--nbd-st-text-mute);
}
.spbwc-q-savestate:empty { display: none; }
.spbwc-q-savestate::before {
    content: "";
    width: 7px;
    height: 7px;
    border-radius: var(--nbd-radius-pill);
    background: currentColor;
    flex: none;
}
.spbwc-q-savestate--saved   { color: var(--nbd-color-success); }
.spbwc-q-savestate--unsaved { color: var(--nbd-color-warning); }
.spbwc-q-savestate--busy    { color: var(--nbd-st-text-soft); }
.spbwc-q-savestate--busy::before { animation: spbwc-q-pulse 1s ease-in-out infinite; }
@keyframes spbwc-q-pulse { 0%, 100% { opacity: 1; } 50% { opacity: .3; } }

@media (max-width: 782px) {
    /* On small screens the sticky footer eats too much height — let it flow. */
    .spbwc-q-actionblock { position: static; box-shadow: var(--shadow-sm); }
}

/* ── List screen: bridge WP_List_Table to the design system ───────────── */
.spbwc-quotes-listwrap .spbwc-list-toolbar {
    justify-content: space-between;
    gap: var(--nbd-space-4);
    flex-wrap: wrap;
}
.spbwc-quotes-searchform { margin: 0; display: flex; }

/* Status tabs (WP .subsubsub) → token text */
.spbwc-quotes-listwrap .subsubsub {
    float: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 2px 4px;
    font-size: 13px;
    color: var(--nbd-st-text-mute);
}
.spbwc-quotes-listwrap .subsubsub li { margin: 0; color: var(--nbd-st-border); }
.spbwc-quotes-listwrap .subsubsub a {
    text-decoration: none;
    color: var(--nbd-st-text-soft);
    padding: 2px 4px;
    border-radius: var(--nbd-radius-sm);
}
.spbwc-quotes-listwrap .subsubsub a:hover { color: var(--st-brand); background: var(--nbd-st-bg-brand); }
.spbwc-quotes-listwrap .subsubsub a.current { color: var(--st-brand); font-weight: var(--font-semibold); }
.spbwc-quotes-listwrap .subsubsub .count { color: var(--nbd-st-text-mute); font-weight: var(--font-normal); }

/* Bulk-action toolbar (WP .tablenav): keep only the bottom one, tokenized */
.spbwc-quotes-listwrap .tablenav.top { display: none; }
.spbwc-quotes-listwrap .tablenav {
    height: auto;
    margin: 0;
    padding: var(--nbd-space-3) var(--nbd-space-5);
    background: var(--nbd-st-bg-soft);
    border-top: 1px solid var(--nbd-st-border-subtle);
    display: flex;
    align-items: center;
    gap: var(--nbd-space-3);
}
.spbwc-quotes-listwrap .tablenav .clear { display: none; }
.spbwc-quotes-listwrap .tablenav .actions { padding: 0; }
.spbwc-quotes-listwrap .tablenav .tablenav-pages { margin: 0 0 0 auto; float: none; }
.spbwc-quotes-listwrap .tablenav select,
.spbwc-quotes-listwrap .tablenav input.button {
    height: 32px;
    line-height: 1;
    border-radius: var(--nbd-radius-sm);
}

/* The list table itself → match .spbwc-admin-table */
.spbwc-quotes-listwrap .wp-list-table { border: 0; background: transparent; }
.spbwc-quotes-listwrap .wp-list-table thead th,
.spbwc-quotes-listwrap .wp-list-table thead td {
    font-size: var(--text-xs);
    text-transform: uppercase;
    letter-spacing: .03em;
    font-weight: var(--font-semibold);
    color: var(--nbd-st-text-mute);
    background: transparent;
    border-bottom: 1px solid var(--nbd-st-border-light);
    padding: var(--nbd-space-3) var(--nbd-space-4);
}
.spbwc-quotes-listwrap .wp-list-table tbody td {
    padding: var(--nbd-space-3) var(--nbd-space-4);
    font-size: 13px;
    color: var(--nbd-st-text);
    border-top: 0;
    border-bottom: 1px solid var(--nbd-st-border-subtle);
    vertical-align: middle;
}
.spbwc-quotes-listwrap .wp-list-table.striped > tbody > :nth-child(odd),
.spbwc-quotes-listwrap .wp-list-table > tbody > tr { background: transparent; }
.spbwc-quotes-listwrap .wp-list-table tbody tr:hover td { background: var(--nbd-st-bg-brand); }
.spbwc-quotes-listwrap .wp-list-table tfoot { display: none; }   /* drop the duplicate header row */
.spbwc-quotes-listwrap .wp-list-table .check-column { padding-left: var(--nbd-space-5); width: 2.2em; }
.spbwc-quotes-listwrap .wp-list-table thead .check-column { vertical-align: middle; }
.spbwc-quotes-listwrap .wp-list-table .row-actions { color: var(--nbd-st-text-mute); font-size: var(--text-xs); }
.spbwc-quotes-listwrap .wp-list-table .row-actions a { color: var(--nbd-st-text-soft); }

/* ── Customer change request (negotiating) ────────────────────────────── */
.spbwc-q-asks { list-style: none; margin: 0 0 8px; padding: 0; display: flex; flex-wrap: wrap; gap: 6px 10px; }
.spbwc-q-asks li {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    margin: 0;
    padding: 4px 10px;
    border-radius: var(--nbd-radius-pill);
    background: var(--nbd-st-bg);
    border: 1px solid var(--nbd-st-border-light);
    font-size: 12.5px;
    color: var(--nbd-st-text);
}
.spbwc-q-asks li .dashicons { font-size: var(--st-icon-sm); width: var(--st-icon-sm); height: var(--st-icon-sm); color: var(--nbd-color-warning); }
.spbwc-q-asks__details { margin: 6px 0 0; font-size: 13px; color: var(--nbd-st-text); }

/* ── Detail top bar (back + document actions) ─────────────────────────── */
.spbwc-q-detailbar {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: var(--nbd-space-3);
    margin-bottom: var(--nbd-space-3);
}
.spbwc-q-detailbar .spbwc-q-back { margin-bottom: 0; }

/* Group Preview + Download as one right-aligned segmented toolbar. */
.spbwc-q-detailbar__tools {
    display: inline-flex;
    align-items: center;
    gap: var(--nbd-space-2);
    margin-inline-start: auto; /* push the action cluster to the trailing edge */
    padding: var(--nbd-space-1);
    background: var(--nbd-st-bg-soft);
    border: 1px solid var(--nbd-st-border-light);
    border-radius: var(--nbd-radius-md);
}
.spbwc-q-detailbar__tools .spbwc-cta-btn { margin: 0; }
@media (max-width: 600px) {
    .spbwc-q-detailbar__tools {
        width: 100%;
        margin-inline-start: 0;
        justify-content: stretch;
    }
    .spbwc-q-detailbar__tools .spbwc-cta-btn { flex: 1; justify-content: center; }
}

/* ── Back link ────────────────────────────────────────────────────────── */
.spbwc-q-back {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    margin-bottom: var(--nbd-space-3);
    font-size: 13px;
    text-decoration: none;
    color: var(--nbd-st-text-soft);
}
.spbwc-q-back:hover { color: var(--st-brand); }

/* ── Import tab (Quote Settings › Import) ──────────────────────────────── */
.spbwc-block__intro {
    margin: 0 0 16px;
    font-size: 13px;
    line-height: 1.6;
    color: var(--nbd-st-text-soft);
    max-width: 720px;
}
.spbwc-import-result {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0 0 16px;
    padding: 11px 14px;
    border-radius: var(--nbd-radius-md);
    background: var(--nbd-color-success-soft, #edfaf0);
    border: 1px solid var(--nbd-color-success-border, #a7e3b8);
    color: var(--nbd-color-success-text, #14532d);
    font-size: 13px;
}
.spbwc-import-result .dashicons { color: var(--nbd-color-success, #1a7f37); }
.spbwc-import-result a { margin-left: 4px; font-weight: 600; }

.spbwc-import-list { margin: 0; padding: 0; list-style: none; border: 1px solid var(--nbd-st-border-light); border-radius: var(--nbd-radius-md); overflow: hidden; }
.spbwc-import-source {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 14px 16px;
    background: var(--nbd-st-bg);
    border-bottom: 1px solid var(--nbd-st-border-light);
}
.spbwc-import-source:last-child { border-bottom: 0; }
.spbwc-import-source:nth-child(even) { background: var(--nbd-st-bg-soft); }
.spbwc-import-source__info { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.spbwc-import-source__name { font-size: 14px; font-weight: 600; color: var(--nbd-st-text); }
.spbwc-import-source__desc { font-size: 12.5px; color: var(--nbd-st-text-soft); }
.spbwc-import-source__count { flex: 0 0 auto; font-size: 12.5px; color: var(--nbd-st-text-soft); white-space: nowrap; }
.spbwc-import-source__count strong { font-size: 15px; color: var(--nbd-st-text); margin-right: 2px; }
.spbwc-import-source__action { flex: 0 0 auto; }
.spbwc-import-source__action form { margin: 0; }
.spbwc-import-source__action .spbwc-cta-btn .dashicons { font-size: var(--st-icon-md); width: var(--st-icon-md); height: var(--st-icon-md); vertical-align: text-bottom; }

.spbwc-empty-state__hint { font-size: 12.5px; color: var(--nbd-st-text-mute); margin-top: 6px; }

/* ── Import: contact-form sources + field mapping (M3) ─────────────────── */
.spbwc-import-formsrc {
    margin-top: 18px;
    padding-top: 16px;
    border-top: 1px solid var(--nbd-st-border-light);
}
.spbwc-import-formsrc__head { margin-bottom: 12px; }
.spbwc-import-formsrc__name { display: block; font-size: 14px; font-weight: 700; color: var(--nbd-st-text); }

.spbwc-import-form {
    margin: 0 0 12px;
    padding: 14px 16px;
    border: 1px solid var(--nbd-st-border-light);
    border-radius: var(--nbd-radius-md);
    background: var(--nbd-st-bg-soft);
}
.spbwc-import-form__head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 10px;
}
.spbwc-import-form__title { font-size: 13.5px; font-weight: 600; color: var(--nbd-st-text); }
.spbwc-import-form__count { font-size: 12.5px; color: var(--nbd-st-text-soft); white-space: nowrap; }

.spbwc-import-map {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 8px 16px;
    margin-bottom: 12px;
}
.spbwc-import-map__row { display: flex; flex-direction: column; gap: 3px; }
.spbwc-import-map__target { font-size: 11.5px; font-weight: 600; text-transform: uppercase; letter-spacing: .03em; color: var(--nbd-st-text-mute); }
.spbwc-import-map select.spbwc-input--sm { width: 100%; height: 30px; }
.spbwc-import-form__foot { text-align: right; }

/* ── Empty-state actions + sample banner (M6) ─────────────────────────── */
.spbwc-empty-state__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    justify-content: center;
    margin-top: 18px;
}
.spbwc-empty-state__actions form { margin: 0; }
.spbwc-empty-state__actions .spbwc-cta-btn .dashicons { font-size: var(--st-icon-md); width: var(--st-icon-md); height: var(--st-icon-md); vertical-align: text-bottom; }

.spbwc-sample-banner {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0 0 14px;
    padding: 10px 14px;
    border-radius: var(--nbd-radius-md);
    background: var(--nbd-color-warning-soft, #fef3c7);
    border: 1px solid var(--nbd-color-warning, #f59e0b);
    color: var(--nbd-st-text);
    font-size: 13px;
}
.spbwc-sample-banner .dashicons { color: var(--nbd-color-warning-deep, #b45309); flex: 0 0 auto; }
.spbwc-sample-banner__text { flex: 1 1 auto; }
.spbwc-sample-banner form { margin: 0; flex: 0 0 auto; }
.spbwc-sample-banner__remove {
    border: 1px solid var(--nbd-st-border, #c3c4c7);
    background: var(--nbd-st-bg, #fff);
    color: var(--nbd-st-text);
    border-radius: var(--st-btn-radius);
    padding: var(--st-btn-pad-sm);
    font-size: var(--st-btn-font-sm);
    cursor: pointer;
}
.spbwc-sample-banner__remove:hover { border-color: var(--nbd-color-error, #ef4444); color: var(--nbd-color-error, #ef4444); }

/* "Sample" badge on a quote row */
.spbwc-q-sample-tag {
    display: inline-block;
    margin-left: 6px;
    padding: 1px 7px;
    border-radius: 999px;
    font-size: 10.5px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .03em;
    background: var(--nbd-color-warning-soft, #fef3c7);
    color: var(--nbd-color-warning-deep, #b45309);
    vertical-align: middle;
}