/**
 * OnePageCheckout — Block Mode: other plugins' checkout content.
 *
 * WooCommerce additional checkout fields (`.opcw-field--addl`, rendered with
 * our field components, so checkout.css styles them) and the extension host
 * (`.opcw-ext`, src/app/extensions/host.js): spacing of the anchors and the
 * WooCommerce block primitives extension blocks render, on our tokens.
 * Everything is scoped to `.opcw-ext` / `.opcw-addl` — never an unscoped
 * `wc-block-components-*` rule (the payment host renders gateways with those
 * classes). WooCommerce's own block stylesheets are not loaded on this page.
 * Logical properties throughout (RTL).
 */

/* ---- anchors -------------------------------------------------------- */
.opcw .opcw-ext { margin-block: 14px 0; font-size: 14px; line-height: 1.5; color: var(--opcw-text); }
.opcw .opcw-ext:empty { display: none; }
.opcw .opcw-ext > * + * { margin-block-start: 12px; }
/* Between two sections: the section rhythm. */
.opcw .opcw-ext--form-before { margin-block: 0 var(--opcw-section-gap); }
.opcw .opcw-ext--contact-after,
.opcw .opcw-ext--delivery-after,
.opcw .opcw-ext--shipping-after { margin-block: calc( var(--opcw-section-gap) * -0.5 ) var(--opcw-section-gap); }
/* Inside .place-order: above the terms, above and below the Pay button. */
.opcw .opcw-ext--payment-before-terms,
.opcw .opcw-ext--payment-before-submit { margin-block: 16px 0; }
.opcw .opcw-ext--payment-before-submit { margin-block-end: 16px; }
.opcw .opcw-ext--payment-after-submit { margin-block: 14px 0; font-size: 13px; color: var(--opcw-muted); }
.opcw .opcw-ext--payment-after-methods { margin-block: 14px; }
/* Order summary (aside) and its flow variant below 1000 px. */
.opcw .opcw-summary .opcw-ext { margin-block: 14px; font-size: 13px; }
.opcw .opcw-ext--summary-flow { margin-block: 24px 0; font-size: 13px; }

.opcw .opcw-ext__html > :first-child { margin-block-start: 0; }
.opcw .opcw-ext__html > :last-child { margin-block-end: 0; }
/* Spacer <br>s printed between blocks (a captcha widget's): the anchor spaces its content. */
.opcw .opcw-ext__html > br { display: none; }
.opcw .opcw-ext__error { margin: 8px 0 0; padding: 8px 12px; border: 1px dashed var(--opcw-error); border-radius: var(--opcw-radius-sm); font-size: 13px; color: var(--opcw-error); }
.opcw .opcw-ext p { margin-block: 0 8px; }
.opcw .opcw-ext a { color: inherit; text-decoration: underline; text-underline-offset: 2px; }

/* ---- WooCommerce block primitives inside an extension --------------- */
.opcw .opcw-ext .wc-block-components-checkbox { display: block; margin: 12px 0 0; }
.opcw .opcw-ext .wc-block-components-checkbox label { display: flex; align-items: flex-start; gap: 10px; font-size: 14px; line-height: 1.5; color: var(--opcw-text); cursor: pointer; }
.opcw .opcw-ext .wc-block-components-checkbox__input { width: 18px; height: 18px; margin: 2px 0 0; padding: 0; flex: none; accent-color: var(--opcw-accent); appearance: auto; -webkit-appearance: checkbox; position: static; opacity: 1; }
.opcw .opcw-ext .wc-block-components-checkbox__mark { display: none; }
.opcw .opcw-ext .wc-block-components-checkbox__label { margin: 0; }
.opcw .opcw-ext .wc-block-components-text-input input,
.opcw .opcw-ext .wc-block-components-textarea,
.opcw .opcw-ext .wc-block-components-select-input select { width: 100%; min-height: var(--opcw-field-h); padding: 14px 14px 6px; border: 1px solid var(--opcw-line); border-radius: var(--opcw-radius-sm); background: var(--opcw-surface); font: inherit; font-size: 15px; color: var(--opcw-ink); box-sizing: border-box; }
.opcw .opcw-ext .wc-block-components-text-input input:focus,
.opcw .opcw-ext .wc-block-components-textarea:focus,
.opcw .opcw-ext .wc-block-components-select-input select:focus { outline: none; border-color: var(--opcw-accent); box-shadow: var(--opcw-focus); }
.opcw .opcw-ext .wc-block-components-validation-error { margin: 6px 0 0; font-size: 13px; color: var(--opcw-error); }
.opcw .opcw-ext .wc-block-components-validation-error p { margin: 0; }
.opcw .opcw-ext .wc-block-components-validation-error svg { display: none; }
.opcw .opcw-ext .wc-block-components-notice-banner { display: block; margin: 0; padding: 12px 14px; border: 1px solid var(--opcw-line); border-radius: var(--opcw-radius-sm); background: var(--opcw-bg-summary); font-size: 13px; }
.opcw .opcw-ext .wc-block-components-notice-banner > svg { display: none; }
.opcw .opcw-ext .wc-block-components-radio-control__option { display: flex; gap: 10px; align-items: flex-start; }
.opcw .opcw-ext .wc-block-components-panel { margin: 0; }
.opcw .opcw-ext .wc-block-components-totals-wrapper { padding: 0; border: 0; }

/* ---- additional checkout fields ------------------------------------- */
.opcw .opcw-addl--contact { margin-block-start: 4px; }
.opcw .opcw-addl--order { margin-block: 16px 0; }
.opcw .opcw-addl__title { margin: 0 0 4px; font-size: 12px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--opcw-muted); }
.opcw .opcw-field--addl.opcw-field--checkbox { margin: 0; }
.opcw .opcw-field--addl.opcw-field--checkbox .opcw-check { margin-block-start: 12px; }
.opcw .opcw-field--addl.opcw-field--checkbox .opcw-field__error { display: block; margin-block-start: 6px; }
