@import url("/bba-ds.css?v=8130d69785");
/* /checkout — page sections only (redesign 2026-10, checkout cell). Every color, size and radius
   is a bba-ds.css token; the markup contract (#checkout-form ids, .co-stage, .summary-*) is the
   one design/cart.js renders into — cart.js stays the only money module. */
.checkout-section{padding:var(--s-5) 0 var(--s-7)}
.checkout-grid{display:grid;gap:var(--s-5);max-width:var(--wrap);margin-inline:auto;padding-inline:var(--gutter)}
@media (min-width:960px){.checkout-grid{grid-template-columns:minmax(0,1fr) 380px;align-items:start}.checkout-heading{grid-column:1/-1}}
.checkout-back{display:inline-flex;align-items:center;min-height:44px;font:500 var(--t-sm)/1 var(--f-sans);color:var(--c-signal);text-decoration:none}
.checkout-back:hover{text-decoration:underline;text-underline-offset:3px}
.checkout-title{font-size:var(--t-h1);font-weight:600;line-height:1.06;letter-spacing:-.025em;margin:var(--s-1) 0 var(--s-2)}
.checkout-intro{max-width:var(--measure)}
.checkout-intro strong{color:var(--c-ink);font-weight:600}

/* ── form ── */
.form-fieldset{border:0;padding:0;margin:0 0 var(--s-4);min-width:0}
.form-legend{display:flex;align-items:center;gap:var(--s-2);padding:0;margin:0 0 var(--s-3);font:600 var(--t-lg)/1.2 var(--f-sans)}
.co-stepno{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;border-radius:50%;background:var(--c-ink);color:var(--c-canvas);font:600 var(--t-xs)/1 var(--f-mono)}
.form-row{display:grid;gap:var(--s-3);grid-template-columns:repeat(2,minmax(0,1fr))}
.form-field{display:flex;flex-direction:column;gap:6px;min-width:0}
.form-field.full{grid-column:1/-1}
.form-field label{font:500 var(--t-sm)/1.2 var(--f-sans)}
.form-field label span{font-weight:400;color:var(--c-ink-2)}
.form-field input,.form-field select{width:100%;min-height:48px;padding:0 var(--s-3);border:.8px solid var(--c-line);border-radius:var(--r-control);background:var(--c-surface-solid);color:var(--c-ink);font:400 16px/1.3 var(--f-sans);appearance:none}
.form-field input:focus,.form-field select:focus{outline:none;border-color:var(--c-signal);box-shadow:0 0 0 3px var(--c-signal-tint)}
.form-field input[aria-invalid="true"]{border-color:var(--c-warn)}
.field-why{font-size:var(--t-xs);line-height:16px;color:var(--c-ink-2)}
.field-err{font:500 var(--t-xs)/16px var(--f-sans);color:var(--c-warn)}
.field-err[hidden]{display:none}
.co-stage{transition:max-height var(--dur) var(--ease),opacity var(--dur) var(--ease)}
.co-stage.co-collapsed{max-height:0;opacity:0;overflow:hidden;margin:0;pointer-events:none}
.co-stage.co-open{max-height:none;opacity:1}
.co-substage.co-collapsed{display:none}
.address-autocomplete-wrap{position:relative}
.address-suggestions{position:absolute;top:100%;left:0;right:0;z-index:20;background:var(--c-surface-solid);border:.8px solid var(--c-line);border-radius:var(--r-control);box-shadow:0 12px 32px -16px var(--c-scrim);max-height:260px;overflow:auto}
.address-suggestions[hidden]{display:none}
.address-suggestion{display:block;width:100%;text-align:left;padding:10px var(--s-3);border:0;background:transparent;font:400 var(--t-sm)/1.3 var(--f-sans);cursor:pointer;min-height:44px}
.address-suggestion:hover,.address-suggestion.active{background:var(--c-signal-tint)}
.address-autocomplete-hint{font-size:var(--t-xs);line-height:16px;color:var(--c-ink-2)}
.credit-sheet{padding:var(--s-3);background:var(--c-surface);border:.8px solid var(--c-line);border-radius:var(--r-surface);margin-bottom:var(--s-3)}
.credit-sheet[hidden]{display:none}
.credit-sheet a{color:var(--c-signal)}
.credit-moment{font:600 var(--t-sm)/1.3 var(--f-sans);margin-bottom:var(--s-1)}
/* the method cards: the same radio card /pay draws (dot · name · sub, 64px, signal ring when chosen) */
.payment-toggle{display:grid;gap:var(--s-2);margin-top:var(--s-3)}
.payment-option{display:grid;grid-template-columns:24px minmax(0,1fr);grid-template-areas:"dot name" "dot sub";align-items:center;column-gap:var(--s-3);row-gap:2px;min-height:64px;padding:var(--s-2) var(--s-3);border:.8px solid var(--c-line);border-radius:var(--r-control);background:var(--c-surface-solid);cursor:pointer;text-align:left;font:inherit;color:var(--c-ink);width:100%}
.payment-option.active,.payment-option[aria-checked="true"]{border-color:var(--c-signal);box-shadow:inset 0 0 0 1px var(--c-signal)}
.payment-option:focus-visible{outline:2px solid var(--c-signal);outline-offset:2px}
.payment-dot{grid-area:dot;width:18px;height:18px;border-radius:50%;border:1.5px solid var(--c-ink-2);position:relative;margin-left:2px}
.payment-option[aria-checked="true"] .payment-dot{border-color:var(--c-signal)}
.payment-option[aria-checked="true"] .payment-dot::after{content:"";position:absolute;inset:3px;border-radius:50%;background:var(--c-signal)}
.payment-name{grid-area:name;font:600 var(--t-body)/1.3 var(--f-sans);align-self:end}
.payment-sub{grid-area:sub;font:400 var(--t-xs)/16px var(--f-mono);color:var(--c-ink-2);align-self:start}
@media (min-width:600px){.payment-toggle{grid-template-columns:repeat(2,minmax(0,1fr))}}
/* how the buyer completes off-site (ruling 4, 2026-10-11): Telegram or Text message — the same radio
   card as the payment method; the answer rides in the EXISTING phone / telegram fields below it */
.co-via .form-label{font:500 var(--t-sm)/1.2 var(--f-sans);margin:0}
.co-via .payment-toggle{margin-top:var(--s-2)}
.co-via .field-why{margin-top:var(--s-1)}
.co-via-toggle .payment-sub{font-family:var(--f-sans)}
.form-field .field-why[hidden]{display:none}
.cart-min-msg{font-size:var(--t-sm);color:var(--c-warn);margin:0}
.compliance-notice{margin:var(--s-3) 0}
.checkbox-row{display:flex;gap:var(--s-2);align-items:flex-start;font-size:var(--t-sm);line-height:1.5;cursor:pointer}
.checkbox-row input{width:20px;height:20px;margin:4px 0 0;flex:none;accent-color:var(--c-signal)}
.checkbox-row a{color:inherit}

/* ── submit: the total sits ABOVE the one primary action ── */
.checkout-submit{display:flex;flex-direction:column;gap:var(--s-3);margin-top:var(--s-3)}
.checkout-submit-main{display:flex;flex-direction:column;gap:var(--s-2)}
.checkout-submit-total{display:flex;justify-content:space-between;align-items:baseline;font:500 var(--t-sm)/1.3 var(--f-sans);padding:var(--s-2) 0;border-top:.8px solid var(--c-line)}
.checkout-submit-total strong{font:600 var(--t-lg)/1.1 var(--f-mono);font-variant-numeric:tabular-nums slashed-zero}
p[id="pay-error"]{font:500 var(--t-sm)/1.5 var(--f-sans);color:var(--c-warn);margin:0}
.co-next{font-size:var(--t-xs);line-height:16px;color:var(--c-warn);font-weight:500}
.co-next[hidden]{display:none}
.checkout-packaging{display:inline-flex;align-items:center;gap:6px;font:400 var(--t-xs)/16px var(--f-mono);color:var(--c-ink-2)}
.checkout-packaging svg{color:var(--c-signal)}

/* ── order column ── */
.co-sumbar{display:flex;align-items:center;justify-content:space-between;width:100%;min-height:52px;padding:0 var(--s-3);border:.8px solid var(--c-line);border-radius:var(--r-control);background:var(--c-surface-solid);color:var(--c-ink);font:500 var(--t-sm)/1.2 var(--f-sans);cursor:pointer;text-align:left}
.co-sumbar>span{display:inline-flex;align-items:center;gap:6px}
.co-sumbar-total{font-family:var(--f-mono);font-variant-numeric:tabular-nums slashed-zero}
.co-sumbar-chev{transition:transform var(--dur) var(--ease)}
.co-sumbar[aria-expanded="true"] .co-sumbar-chev{transform:rotate(180deg)}
.checkout-order-box{padding:var(--s-3);background:var(--c-surface);border:.8px solid var(--c-line);border-radius:var(--r-surface);margin-top:var(--s-2)}
.checkout-order-col.co-sum-collapsed .checkout-order-box{display:none}
.order-box-heading{display:flex;justify-content:space-between;align-items:center;gap:var(--s-2);margin-bottom:var(--s-2)}
.order-box-title{font:600 var(--t-lg)/1.2 var(--f-sans);margin:0}
.checkout-edit-cart{margin-right:calc(-1 * var(--s-2))} /* system .btn--quiet; pulled flush with the card edge */
.co-line{padding:6px 0;border-bottom:.8px solid var(--c-line)}
.co-line-main{display:flex;justify-content:space-between;align-items:baseline;gap:var(--s-3);font-size:var(--t-sm)}
.co-line-meta{font:400 var(--t-xs)/16px var(--f-mono);color:var(--c-ink-2);margin-top:2px}
.summary-row{display:flex;justify-content:space-between;align-items:baseline;gap:var(--s-3);padding:6px 0;font-size:var(--t-sm)}
.summary-label{color:var(--c-ink-2)}
.summary-val{font-family:var(--f-mono);font-variant-numeric:tabular-nums slashed-zero;text-align:right}
.summary-val.ship-pending{font-family:var(--f-sans);font-size:var(--t-xs);color:var(--c-ink-2)}
.summary-total{border-top:.8px solid var(--c-line);margin-top:var(--s-2);padding-top:var(--s-2)}
.summary-total .summary-label{color:var(--c-ink);font-weight:600}
.summary-total .summary-val{font-size:var(--t-lg);font-weight:600}
.discount-line .summary-label,.discount-line .summary-val{color:var(--c-signal)}
.discount-line .summary-val{white-space:nowrap;flex:none} /* "−$25.70": a break is allowed between − and $, so the amount never splits across lines */
.checkout-empty-panel{padding:var(--s-3) 0}
.checkout-empty-title{font-weight:600}
.checkout-empty-copy{font-size:var(--t-sm);color:var(--c-ink-2);margin:var(--s-1) 0 var(--s-2)}
.checkout-empty-link{min-height:44px} /* system .btn--secondary.btn--compact, lifted to the touch target */
.co-promo{margin:var(--s-2) 0}
.co-promo label{display:block;font:500 var(--t-xs)/16px var(--f-sans);margin-bottom:6px}
.co-promo-row{display:flex;gap:var(--s-2)}
.co-promo-row .promo-input{flex:1;min-width:0}
.co-promo-apply{flex:none} /* system .btn--secondary.btn--compact */
.co-promo-status{font-size:var(--t-xs);line-height:16px;color:var(--c-ink-2);margin-top:6px}
.co-promo-status[hidden]{display:none}
p[id="checkout-allin"]{font-size:var(--t-xs);line-height:16px;color:var(--c-ink-2)}
.order-code-block{margin-top:var(--s-3);padding:var(--s-3);border:.8px solid var(--c-line);border-radius:var(--r-control)}
.order-code-label{font:500 var(--t-xs)/16px var(--f-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--c-ink-2)}
.order-code-val{font:600 var(--t-lg)/1.2 var(--f-mono)}
.order-code-helper{font-size:var(--t-xs);color:var(--c-ink-2)}
.order-confirmation-msg{font-size:var(--t-sm);color:var(--c-ink-2);margin-top:var(--s-3)}
.order-confirmation-msg[hidden]{display:none}
.order-confirmation-msg a{color:var(--c-signal)}
div[id="supply-ship-meter"][hidden]{display:none}
div[id="min-gate-msg"]{margin-top:var(--s-2)}
/* the live minimum-gate control cart.js renders (same markup in the drawer and here) */
.gate-control{display:flex;flex-direction:column;gap:var(--s-2)}
.gate-control-msg{font:600 var(--t-sm)/1.3 var(--f-sans);margin:0}
.gate-control-chips{display:flex;flex-wrap:wrap;gap:var(--s-2)}
.gate-chip{white-space:normal;text-align:center} /* system .btn--secondary.btn--compact (cart.js renders the classes) */
.gate-rule-text{font:400 var(--t-xs)/16px var(--f-sans);color:var(--c-ink-2);margin:0}

@media (min-width:960px){.co-sumbar{display:none}.checkout-order-col.co-sum-collapsed .checkout-order-box{display:block}.checkout-order-box{position:sticky;top:calc(var(--hdr-h) + var(--hdr-ruo) + var(--s-3));margin-top:0}}
@media (max-width:959px){.checkout-order-col{order:-1}}
@media (max-width:600px){.form-row{grid-template-columns:1fr}}
@media (prefers-reduced-motion:reduce){.co-stage,.co-sumbar-chev{transition:none}}
@media print{.cart-drawer-root,.checkout-edit-cart,.co-sumbar{display:none !important}}