/* Quotes v2: one-page quote builder (quote-builder.js).
   The line cards, the Add switch, segmented buttons, More options and the
   template editor reuse the worksheet components in quote-worksheets.css,
   whose rules cover :is(#quoteBuilder,.ux-scope) too, so both screens look and act the same.
   Only builder-specific layout lives here. Navy/gold/neutral tokens (--ws-*). */
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
body.qb-on #quoteTab .quote-steps,body.qb-on #quoteTab .quote-footer{display:none!important}
:is(#quoteBuilder,#invoiceBuilder){display:flex;flex-direction:column;gap:12px;margin-top:12px}
:is(#quoteBuilder,.ux-scope) .section{margin:0}
:is(#quoteBuilder,.ux-scope) h2{margin:0 0 10px;font-size:18px}
/* Service chips */
.qb-chips{display:flex;flex-wrap:wrap;gap:8px}
:is(#quoteBuilder,.ux-scope) .qb-chip{min-height:44px;padding:0 14px;border-radius:999px;background:var(--ws-card);color:var(--ws-text);border:1px solid var(--ws-border);font-weight:600;font-size:15px;box-shadow:none}
:is(#quoteBuilder,.ux-scope) .qb-chip[aria-pressed="true"]{background:var(--ws-primary);border-color:var(--ws-primary);color:#fff}
:is(#quoteBuilder,.ux-scope) .qb-chip:focus-visible{outline:3px solid var(--ws-focus);outline-offset:2px}
/* Section header: name, subtotal, Copy/Edit, remove */
.qb-sec-head{display:flex;align-items:center;gap:6px;margin-bottom:8px}
.qb-sec-head h2{flex:1 1 auto;min-width:0;margin:0!important;overflow-wrap:anywhere}
.qb-sec-total{font-size:16px;color:var(--ws-text);white-space:nowrap}
:is(#quoteBuilder,.ux-scope) .qb-remove{min-width:44px;min-height:44px;padding:0;background:transparent;border:0;box-shadow:none;color:var(--ws-icon);font-size:26px;line-height:1}
:is(#quoteBuilder,.ux-scope) .qb-edit{min-height:44px;padding:0 8px}
.qb-field{display:flex;flex-direction:column;gap:6px;margin:0 0 12px}
.qb-field>label,.qb-label{font-weight:600;font-size:14px;color:var(--ws-text-2)}
.qb-inline{max-width:180px}
.qb-lot-hint{margin:-6px 0 12px}
/* Line cards (worksheet card + Add switch) */
.qb-lines{margin-top:4px}
.qb-line{cursor:pointer;-webkit-tap-highlight-color:transparent;transition:border-color .12s,background .12s}
.qb-line-row{display:flex;align-items:center;gap:10px}
.qb-line-text{flex:1 1 auto;min-width:0}
.qb-line .ws-ck-title{display:flex;align-items:flex-start;gap:6px;margin:0 0 2px}
.qb-line .ws-ck-hint{margin:0;font-size:14px;color:var(--ws-text-2)}
.qb-check{display:none;flex:0 0 20px;width:20px;height:20px;margin-top:1px;border-radius:50%;background:var(--ws-primary);color:#fff;align-items:center;justify-content:center}
.qb-check svg{width:14px;height:14px}
:is(#quoteBuilder,.ux-scope) .ws-ck.qb-on{border:2px solid var(--ws-primary);background:var(--ws-tint);padding:11px}
.qb-on .qb-check{display:inline-flex}
.qb-qty{display:flex;align-items:center;gap:10px;margin-top:10px;padding-top:10px;border-top:1px solid var(--ws-border)}
.qb-qty label{font-weight:600;font-size:14px;color:var(--ws-text-2);white-space:nowrap}
:is(#quoteBuilder,.ux-scope) .qb-qty input{width:120px;flex:0 1 120px}
.qb-qty-flat{border-top:0;margin-top:4px;padding-top:0;justify-content:flex-end}
.qb-line-amt{margin-left:auto;font-weight:700;font-size:16px;color:var(--ws-text);white-space:nowrap}
.qb-pending .qb-line-amt{color:#8a5a00;font-weight:600;font-size:14px;white-space:normal;text-align:right;min-width:0;flex:1 1 auto}
[data-theme='dark'] .qb-pending .qb-line-amt{color:#e4c48a}
/* Custom lines */
.qb-custom-line{margin-bottom:10px}
.qb-custom-row{display:flex;gap:10px;align-items:flex-end}
.qb-custom-row .qb-field{flex:1 1 0}
:is(#quoteBuilder,.ux-scope) .qb-custom-remove{min-height:44px}
:is(#quoteBuilder,.ux-scope) .qb-switch-row{flex-direction:row;justify-content:space-between;width:100%;gap:12px;margin:0 0 12px}
:is(#quoteBuilder,.ux-scope) .qb-switch-row .ws-switch-text{font-size:15px;letter-spacing:0;color:var(--ws-text)}
/* Template editor */
.qb-tiers{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:8px}
.qb-tier{min-width:0;margin:0}
:is(#quoteBuilder,.ux-scope) .qb-tier input,:is(#quoteBuilder,.ux-scope) .qb-tier select{width:100%;min-width:0}
.qb-tpl-items .ws-switch{margin-top:6px}
/* Phone: keep the last controls above the total bar and bottom nav */
@media(max-width:700px){
  body.qb-on[data-view=quoteTab] #appContainer{padding-bottom:180px!important}
  .qb-actions{display:flex;flex-wrap:wrap;gap:8px}
}
@media print{:is(#quoteBuilder,#invoiceBuilder){display:none!important}}
/* Checkmark only on lines that are on (beats the generic title span rule). */
:is(#quoteBuilder,.ux-scope) .qb-line:not(.qb-on) .qb-check{display:none}
:is(#quoteBuilder,.ux-scope) .qb-line.qb-on .qb-check{display:inline-flex}
:is(#quoteBuilder,.ux-scope) .qb-seg button{white-space:normal;line-height:1.15;text-overflow:clip;min-height:44px;padding:4px 6px}
/* Row-style switch (More options, editor "On by default"): keep the track 48px wide. */
:is(#quoteBuilder,.ux-scope) .qb-switch-row .ws-switch-track{flex:0 0 48px;width:48px;height:28px}
/* Fold toggle: "Show all N lines" / "Show fewer" (navy link, 44px+ target). */
:is(#quoteBuilder,.ux-scope) .qb-fold{display:flex;align-items:center;justify-content:center;width:100%;min-height:48px;margin-top:6px;font-size:15px;font-weight:700}
/* Custom line: Qty | Unit price | line total, then Remove. */
.qb-custom-row{align-items:flex-end}
.qb-custom-row .qb-custom-qty{flex:0 0 84px}
:is(#quoteBuilder,.ux-scope) .qb-custom-qty input{width:100%;min-width:0}
.qb-custom-amt{flex:0 0 auto;align-self:flex-end;min-height:44px;display:flex;align-items:center;margin:0 0 12px auto}
.qb-custom-tools{display:flex;justify-content:flex-end}
:is(#quoteBuilder,.ux-scope) .qb-custom-tools .qb-custom-remove{margin:0}

/* What each line includes (quote scope), shown on switched-on cards */
:is(#quoteBuilder,.ux-scope) .qb-scope{margin:8px 0 0;font-size:13px;line-height:1.4;color:var(--ws-text-2);font-weight:400}
:is(#quoteBuilder,.ux-scope) .qb-scope-field{margin-top:8px}
:is(#quoteBuilder,.ux-scope) .qb-scope-field textarea{width:100%;min-height:92px;font-size:16px;line-height:1.35;resize:vertical}
/* Why this price (Quotes v2) */
#priceWhyBody .qb-why-row{padding:10px 0;border-bottom:1px solid var(--border)}
#priceWhyBody .qb-why-row:first-child{padding-top:0}
#priceWhyBody .qb-why-head{display:flex;justify-content:space-between;gap:12px;margin:0;font-variant-numeric:tabular-nums}
#priceWhyBody .qb-why-head span{font-weight:650;white-space:nowrap}
#priceWhyBody .qb-why-list{margin:6px 0 0;padding-left:18px;font-size:14px;line-height:1.45;color:var(--text-secondary)}
#priceWhyBody .qb-why-list li{margin:2px 0}
#priceWhyBody .qb-why-notes{margin:10px 0 8px}