/* BasisOrbit checkout page theme — restyles the WooCommerce Checkout Block (address, shipping,
   payment accordion, order summary, place-order button) to the same design as the payment
   block. Best effort on third-party sections (agreements, notifications…): they keep their own
   markup, this only sets type, colour, spacing and the numbered step rail. Opt-in per shop
   (Settings → "Style the whole checkout page"). */
/* Full default set (CHECKOUT-APPEARANCE-CONTRACT.md) so the tenant appearance injected by the
   plugin (also on :root, later in the cascade) overrides them; body/elements only read them. (A
   body-level `--bo-accent: var(--bo-accent, …)` is a cycle and silently computes to nothing — it
   made the pay button transparent.) */
:root{
  --bo-accent:#ff2aa6; --bo-accent-deep:#b80e72; --bo-accent-text:#ffffff;
  --bo-surface-c:#ffffff; --bo-page:#ffffff;
  --bo-ink:#0b0f17; --bo-ink-2:#4b5563; --bo-ink-3:#8a919c; --bo-hair:#e6e7eb; --bo-hair-2:#d3d6dc;
  --bo-tint:color-mix(in srgb, var(--bo-accent) 7%, #fff);
  /* Added for the checkout shell (t-checkout-shell) below: this file previously had no tokens for
     radius, card background or accent-on-text — every other rule here used the literal values
     (14px/10px/#fff) directly. Same values, now named so the new shell rules can share them. */
  --bo-radius:14px; --bo-radius-control:10px; --bo-surface-c:#fff; --bo-accent-text:#fff;
  background:#fff; color:var(--bo-ink);

  --bo-tint:color-mix(in srgb, var(--bo-accent) 7%, var(--bo-surface-c));
  --bo-font:Inter,-apple-system,"SF Pro Text",system-ui,sans-serif;
  --bo-font-heading:Inter,-apple-system,"SF Pro Text",system-ui,sans-serif;
  --bo-radius:14px; --bo-radius-control:10px;
}
body.woocommerce-checkout{
  background:var(--bo-page); color:var(--bo-ink);
}
.wc-block-checkout{font-family:var(--bo-font);font-feature-settings:"tnum"}
.wc-block-checkout .wc-block-components-title,.wc-block-checkout h1,.wc-block-checkout h2,.wc-block-checkout h3{letter-spacing:-.02em;font-weight:700;font-family:var(--bo-font-heading)}

/* step rail */
.wc-block-checkout .wc-block-components-checkout-step{padding:22px 0 26px;border-top:1px solid var(--bo-hair)}
.wc-block-checkout .wc-block-components-checkout-step:first-of-type{border-top:0;padding-top:0}
.wc-block-checkout .wc-block-components-checkout-step--with-step-number .wc-block-components-checkout-step__container::before{
  width:28px;height:28px;border-radius:50%;border:1.5px solid var(--bo-ink);background:transparent;color:var(--bo-ink);
  font-size:12.5px;font-weight:700;display:grid;place-items:center;left:0;top:0
}
.wc-block-checkout .wc-block-components-checkout-step--with-step-number{padding-left:44px}
.wc-block-checkout .wc-block-components-checkout-step__title{font-size:17px;font-weight:700;margin:0;font-family:var(--bo-font-heading)}
.wc-block-checkout .wc-block-components-checkout-step__description{color:var(--bo-ink-2);font-size:13px}

/* inputs */
.wc-block-checkout .wc-block-components-text-input input,
.wc-block-checkout .wc-block-components-combobox .components-combobox-control__input,
.wc-block-checkout .wc-block-components-select .components-custom-select-control__button,
.wc-block-checkout .wc-block-components-textarea textarea{
  border:1px solid var(--bo-hair-2);border-radius:var(--bo-radius-control);min-height:46px;font:inherit;color:var(--bo-ink);box-shadow:none
}
.wc-block-checkout .wc-block-components-text-input.is-active input,
.wc-block-checkout .wc-block-components-text-input input:focus{border-color:var(--bo-ink);box-shadow:0 0 0 3px #0b0f1714}
.wc-block-checkout .wc-block-components-text-input label{color:var(--bo-ink-3)}
.wc-block-checkout .wc-block-components-checkbox .wc-block-components-checkbox__input[type=checkbox]{border-radius:5px;border-color:var(--bo-hair-2)}
.wc-block-checkout .wc-block-components-checkbox .wc-block-components-checkbox__input[type=checkbox]:checked{background:var(--bo-accent);border-color:var(--bo-accent)}

/* choice rows: shipping rates + payment accordion get the same card treatment as the block */
.wc-block-checkout .wc-block-components-radio-control__option,
.wc-block-checkout .wc-block-components-radio-control-accordion-option{
  border:1px solid var(--bo-hair);border-radius:var(--bo-radius);padding:15px 16px 15px 46px;margin:0 0 8px;background:var(--bo-surface-c);position:relative
}
.wc-block-checkout .wc-block-components-radio-control--highlight-checked .wc-block-components-radio-control-accordion-option--checked-option-highlighted,
.wc-block-checkout .wc-block-components-radio-control__option-checked{border-color:var(--bo-accent);background:var(--bo-tint);box-shadow:none}
.wc-block-checkout .wc-block-components-radio-control__option::before,
.wc-block-checkout .wc-block-components-radio-control__option::after{display:none}
.wc-block-checkout .wc-block-components-radio-control__input{left:16px;width:18px;height:18px;border:1.5px solid var(--bo-hair-2);background:var(--bo-surface-c)}
.wc-block-checkout .wc-block-components-radio-control__input:checked{border-color:var(--bo-accent)}
.wc-block-checkout .wc-block-components-radio-control__input:checked::before{background:var(--bo-accent);width:10px;height:10px}
.wc-block-checkout .wc-block-components-radio-control__label{font-weight:600;font-size:14.5px}
.wc-block-checkout .wc-block-components-radio-control__description,.wc-block-checkout .wc-block-components-radio-control__secondary-description{color:var(--bo-ink-2);font-size:12.5px}
.wc-block-checkout .wc-block-components-radio-control__secondary-label{font-weight:700}
.wc-block-checkout .wc-block-components-radio-control-accordion-content{padding:0}
.wc-block-checkout .wc-block-components-radio-control-accordion-option .wc-block-components-radio-control__label-group{font-weight:600}
/* our block draws its own rows: hide the accordion's payment-method title row padding */
.wc-block-checkout .wc-block-components-radio-control-accordion-option .basisorbit-block{margin-top:12px}

/* place order */
.wc-block-checkout .wc-block-components-checkout-place-order-button{
  background:var(--bo-accent);color:var(--bo-accent-text);border:0;border-radius:var(--bo-radius-control);height:54px;font-weight:700;font-size:16px;
  box-shadow:0 10px 24px -10px color-mix(in srgb, var(--bo-accent) 65%, transparent)
}
.wc-block-checkout .wc-block-components-checkout-place-order-button:hover{background:var(--bo-accent-deep)}

/* order summary */
.wc-block-checkout .wc-block-components-sidebar .wc-block-components-order-summary,
.wc-block-checkout .wc-block-components-sidebar .wc-block-components-totals-wrapper{border-color:var(--bo-hair)}
.wc-block-checkout .wc-block-components-sidebar{background:#fafafb;border:1px solid var(--bo-hair);border-radius:16px;padding:6px 18px 14px}
.wc-block-checkout .wc-block-components-order-summary-item__quantity{background:var(--bo-ink);color:#fff;border:0}
.wc-block-checkout .wc-block-components-totals-item{font-size:14px}
.wc-block-checkout .wc-block-components-totals-item__label{color:var(--bo-ink-2)}
.wc-block-checkout .wc-block-components-totals-footer-item .wc-block-components-totals-item__label,
.wc-block-checkout .wc-block-components-totals-footer-item .wc-block-components-totals-item__value{font-size:17px;font-weight:800;letter-spacing:-.01em}
.wc-block-checkout .wc-block-components-totals-discount .wc-block-components-totals-item__value{color:#d12e2e;font-weight:700}
.wc-block-checkout .wc-block-components-totals-coupon .wc-block-components-button{border:1px solid var(--bo-ink);background:var(--bo-surface-c);color:var(--bo-ink);border-radius:var(--bo-radius-control);font-weight:600}

/* Specificity fixes measured on WooCommerce 11.1 + Twenty Twenty-Five: WC paints the highlighted
   option border with currentColor and the theme makes buttons transparent — both need !important. */
.wc-block-checkout .wc-block-components-radio-control--highlight-checked .wc-block-components-radio-control-accordion-option--checked-option-highlighted,
.wc-block-checkout .wc-block-components-radio-control__option--checked-option-highlighted{border-color:var(--bo-accent)!important;background:var(--bo-tint)!important}
.wc-block-checkout .wc-block-components-radio-control-accordion-option,.wc-block-checkout .wc-block-components-radio-control__option{border:1px solid var(--bo-hair)!important;border-radius:var(--bo-radius)!important}
/* single gateway: the accordion wrapper is just a container — no outer chrome, our rows carry the design */
.wc-block-checkout .wc-block-components-radio-control--highlight-checked--first-selected.wc-block-components-radio-control--highlight-checked--last-selected .wc-block-components-radio-control-accordion-option{border:0!important;background:transparent!important;padding:0!important}
.wc-block-checkout .wc-block-components-radio-control--highlight-checked--first-selected.wc-block-components-radio-control--highlight-checked--last-selected .wc-block-components-radio-control-accordion-option>label{display:none}
.wc-block-checkout .wc-block-components-radio-control--highlight-checked--first-selected.wc-block-components-radio-control--highlight-checked--last-selected .basisorbit-block{margin-top:0}
.wc-block-checkout .wc-block-components-checkout-place-order-button,
.wc-block-checkout .wc-block-components-checkout-place-order-button:hover{background:var(--bo-accent)!important;color:var(--bo-accent-text)!important;border:0!important;border-radius:var(--bo-radius-control)!important;height:54px!important;font-weight:700!important;font-size:16px!important}
.wc-block-checkout .wc-block-components-checkout-place-order-button:hover{background:var(--bo-accent-deep)!important}
.wc-block-checkout .wc-block-components-radio-control__input{border-color:var(--bo-hair-2)!important;background:var(--bo-surface-c)!important;width:18px!important;height:18px!important}
.wc-block-checkout .wc-block-components-radio-control__input:checked{border-color:var(--bo-accent)!important}
.wc-block-checkout .wc-block-components-radio-control__input:checked::before{background:var(--bo-accent)!important}

.wc-block-checkout .wc-block-components-radio-control__option,
.wc-block-checkout .wc-block-components-radio-control__option--checked-option-highlighted,
.wc-block-checkout .wc-block-components-radio-control-accordion-option{box-shadow:none!important;outline:none!important}

/* ════════════════════════════════════════════════════════════════════════════════════════════
   Checkout shell (t-checkout-shell): page title/subtitle, numbered steps, Ship-to/Notifications/
   Agreements, and the extra order-summary rows. Works on BOTH checkout paths:
   - Classic: markup below is rendered server-side by Basisorbit_Checkout_Shell (classic hooks),
     targeting classic WooCommerce selectors (.woocommerce-checkout, #order_review, #place_order…).
   - Blocks: the SAME .bo-shell-*/.bo-cstep*/.bo-notif*/.bo-agree* classes are used, but the
     markup is inserted client-side by assets/checkout-shell.js (WooCommerce Blocks renders its
     own React tree — there is no PHP template hook inside it). The .wc-block-components-address-
     card rule below restyles Woo Blocks' own native read-only address summary (its "Ship to"
     step already collapses to this component once the address step is complete); unlike every
     other selector in this file, that exact class name is a best-effort match, not one already
     proven against a real WooCommerce install by this plugin — see the shell's own PR notes.
   ════════════════════════════════════════════════════════════════════════════════════════════ */

/* shared tokens for the amber "Required" pill / pink notice, on top of the :root set above */
:root{--bo-amber-bg:#fdf1d9; --bo-amber-ink:#8a5a00}

/* title + subtitle */
.bo-shell-head{margin:0 0 28px}
.bo-shell-title{font-size:28px;font-weight:800;letter-spacing:-.02em;margin:0 0 6px;color:var(--bo-ink)}
.bo-shell-sub{color:var(--bo-ink-2);font-size:14px;margin:0}

/* classic-only numbered step rail (Blocks already has its own — see the step-rail rules above) */
.bo-cstep{padding:22px 0 26px;border-top:1px solid var(--bo-hair)}
.bo-cstep:first-of-type{border-top:0;padding-top:0}
.bo-cstep__head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 14px}
.bo-cstep__badge{width:28px;height:28px;border-radius:50%;border:1.5px solid var(--bo-ink);display:inline-grid;place-items:center;font-size:12.5px;font-weight:700;flex-shrink:0;margin-right:12px;vertical-align:middle}
.bo-cstep__title{font-size:17px;font-weight:700;margin:0;display:inline-flex;align-items:center;font-family:inherit}

/* classic: address fields as a card (no collapse-to-summary — see report) */
.woocommerce-checkout .woocommerce-billing-fields__field-wrapper,
.woocommerce-checkout .woocommerce-shipping-fields__field-wrapper{border:1px solid var(--bo-hair);border-radius:var(--bo-radius);padding:16px;background:var(--bo-surface-c)}
.woocommerce-checkout input.input-text,.woocommerce-checkout textarea,.woocommerce-checkout select,
.woocommerce-checkout .select2-selection{border:1px solid var(--bo-hair-2);border-radius:var(--bo-radius-control);min-height:46px;font:inherit;color:var(--bo-ink);box-shadow:none}
.woocommerce-checkout input.input-text:focus,.woocommerce-checkout textarea:focus{border-color:var(--bo-ink);box-shadow:0 0 0 3px #0b0f1714;outline:0}

/* classic: shipping-method radio cards, same look as the Blocks version above */
.woocommerce-checkout ul#shipping_method{list-style:none;margin:0;padding:0}
.woocommerce-checkout ul#shipping_method li{border:1px solid var(--bo-hair);border-radius:var(--bo-radius);padding:15px 16px 15px 46px;margin:0 0 8px;position:relative;background:var(--bo-surface-c)}
.woocommerce-checkout ul#shipping_method li input[type=radio]{position:absolute;left:16px;top:16px;width:18px;height:18px;accent-color:var(--bo-accent)}
.woocommerce-checkout ul#shipping_method li:has(input:checked){border-color:var(--bo-accent);background:var(--bo-tint)}
.woocommerce-checkout ul#shipping_method li label{font-weight:600;font-size:14.5px}

/* classic: payment box + place-order button */
.woocommerce-checkout #payment{background:none;border:0;border-radius:0}
.woocommerce-checkout #payment ul.payment_methods{border:0;padding:0;margin:0 0 8px}
.woocommerce-checkout #payment ul.payment_methods li{padding:0;margin:0 0 8px}
.woocommerce-checkout #place_order{width:100%;background:var(--bo-accent);color:var(--bo-accent-text);border:0;border-radius:var(--bo-radius-control);height:54px;font-weight:700;font-size:16px;box-shadow:0 10px 24px -10px color-mix(in srgb, var(--bo-accent) 65%, transparent)}
.woocommerce-checkout #place_order:hover{background:var(--bo-accent-deep)}
.woocommerce-checkout #place_order:disabled{opacity:.55;cursor:not-allowed}
.bo-secure-line{display:flex;align-items:center;justify-content:center;gap:6px;color:var(--bo-ink-3);font-size:12px;margin:12px 0 0}
.bo-secure-line svg{color:var(--bo-accent);flex-shrink:0}

/* Notifications (classic + Blocks-injected) */
.bo-notif{border-top:1px solid var(--bo-hair);padding:22px 0 26px}
.bo-notif__head{display:flex;align-items:center;justify-content:space-between;cursor:pointer;gap:12px}
.bo-notif__toggle{color:var(--bo-ink-2);font-size:14px;display:inline-flex;align-items:center;gap:4px;white-space:nowrap}
.bo-notif__toggle svg{transition:transform .15s}
.bo-notif.open .bo-notif__toggle svg{transform:rotate(180deg)}
.bo-notif__body{display:none;margin-top:18px}
.bo-notif.open .bo-notif__body{display:block}
.bo-notif__row{display:flex;gap:12px;padding:14px 0;border-top:1px solid var(--bo-hair)}
.bo-notif__row:first-child{border-top:0}
.bo-notif__row input[type=checkbox]{width:20px;height:20px;margin-top:2px;border-radius:5px;border:1.5px solid var(--bo-hair-2);accent-color:var(--bo-accent);flex-shrink:0}
.bo-notif__row label{display:flex;flex-direction:column;gap:3px;cursor:pointer}
.bo-notif__label{font-weight:700;font-size:14.5px;color:var(--bo-ink)}
.bo-notif__sub{color:var(--bo-ink-2);font-size:12.5px}
.bo-notif__legal{color:var(--bo-ink-3);font-size:12px;margin:14px 0 0;line-height:1.55}

/* Agreements (classic + Blocks-injected) */
.bo-agree{border-top:1px solid var(--bo-hair);padding:22px 0 26px}
.bo-agree__head{display:flex;align-items:center;justify-content:space-between;margin:0 0 8px;gap:12px}
.bo-agree__pill{display:inline-flex;align-items:center;height:24px;padding:0 12px;border-radius:20px;background:var(--bo-amber-bg);color:var(--bo-amber-ink);font-size:12px;font-weight:700;white-space:nowrap}
.bo-agree__desc{color:var(--bo-ink-2);font-size:13px;margin:0 0 14px}
.bo-agree__row{display:flex;align-items:center;justify-content:space-between;gap:12px;border:1px solid var(--bo-hair);border-radius:var(--bo-radius);padding:15px 16px;margin:0 0 8px;cursor:pointer;background:var(--bo-surface-c);font-weight:700;font-size:14.5px;color:var(--bo-ink);text-decoration:none}
.bo-agree__row svg{transition:transform .15s;flex-shrink:0;color:var(--bo-ink-3)}
.bo-agree__row.open svg{transform:rotate(90deg)}
.bo-agree__panel{display:none;border:1px solid var(--bo-hair);border-top:0;border-radius:0 0 var(--bo-radius) var(--bo-radius);margin:-8px 0 8px;padding:14px 16px;font-size:13px;color:var(--bo-ink-2);max-height:220px;overflow:auto}
.bo-agree__row.open + .bo-agree__panel{display:block}
.bo-agree__consent{display:flex;gap:12px;border:1.5px dashed var(--bo-hair-2);border-radius:var(--bo-radius);padding:15px 16px;margin:14px 0;transition:border-color .15s}
.bo-agree__consent input[type=checkbox]{width:20px;height:20px;margin-top:2px;border-radius:5px;border:1.5px solid var(--bo-hair-2);accent-color:var(--bo-accent);flex-shrink:0}
.bo-agree__consent label{font-weight:600;font-size:14px;color:var(--bo-ink);cursor:pointer}
.bo-agree__consent.bo-consent-missing{border-color:#d12e2e}
.bo-agree__error{color:#d12e2e;font-size:12.5px;margin:-8px 0 14px}
.bo-agree__error[hidden]{display:none}
.bo-agree__notice{background:var(--bo-tint);border:1px solid color-mix(in srgb, var(--bo-accent) 35%, var(--bo-surface-c));border-radius:var(--bo-radius);padding:16px 18px;margin:0 0 18px}
.bo-agree__notice-head{display:flex;align-items:center;gap:8px;color:var(--bo-accent-deep);font-weight:800;font-size:14.5px;margin:0 0 8px}
.bo-agree__notice-icon{width:18px;height:18px;border-radius:50%;background:var(--bo-accent);color:#fff;display:inline-grid;place-items:center;font-size:12px;font-weight:800;flex-shrink:0}
.bo-agree__notice p{margin:0 0 8px;font-size:13px;color:var(--bo-ink)}
.bo-agree__notice p:last-child{margin-bottom:0}

/* order summary extras — classic (table rows in .woocommerce-checkout-review-order-table) */
.woocommerce-checkout .bo-savings-tr th,.woocommerce-checkout .bo-savings-tr td{color:#d12e2e;font-weight:700}
.woocommerce-checkout .bo-protect-tr label{display:flex;align-items:center;gap:8px;font-weight:400;cursor:pointer}
.woocommerce-checkout .bo-protect-tr input[type=checkbox]{width:18px;height:18px;border-radius:5px;border:1.5px solid var(--bo-hair-2);accent-color:var(--bo-accent)}
.woocommerce-checkout .bo-loyalty-line{font-size:12.5px;color:var(--bo-ink-2);margin:4px 0;line-height:1.5}

/* order summary extras — Blocks (plain rows injected into .wc-block-components-sidebar by
   checkout-shell.js, next to the totals WooCommerce itself renders there) */
.wc-block-checkout .bo-savings-row,
.wc-block-checkout .bo-protect-row{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:14px;padding:8px 0}
.wc-block-checkout .bo-savings-row__value{color:#d12e2e;font-weight:700}
.wc-block-checkout .bo-protect-row label{display:flex;align-items:center;gap:10px;cursor:pointer;font-weight:400}
.wc-block-checkout .bo-protect-row input[type=checkbox]{width:18px;height:18px;border-radius:5px;border:1.5px solid var(--bo-hair-2);accent-color:var(--bo-accent)}
.wc-block-checkout .bo-loyalty-line{font-size:12.5px;color:var(--bo-ink-2);margin:10px 0 0;line-height:1.5}

/* Ship-to summary card — Woo Blocks' own native "address card" component (best-effort selector,
   see the header comment above this section) */
.wc-block-checkout .wc-block-components-address-card{border:1px solid var(--bo-hair);border-radius:var(--bo-radius);padding:16px 18px;background:var(--bo-surface-c)}
.wc-block-checkout .wc-block-components-address-card button,
.wc-block-checkout .wc-block-components-address-card a{color:var(--bo-accent);font-weight:700;text-decoration:none}

/* mobile: single column, same breakpoint the Blocks layout already collapses at */
@media (max-width:640px){
  .bo-shell-title{font-size:24px}
  .bo-agree__head,.bo-notif__head{flex-wrap:wrap}
}