/* Shared control defaults. Native block/global styles still control individual
   buttons; payment iframes and provider marks keep their provider's styling. */
.bhq-main .wc-block-components-button {
  min-height: var(--bhq-button-height); padding: .7rem 1.125rem;
  font-family: var(--wp--preset--font-family--body); font-size: .9375rem; font-weight: 700; line-height: 1.4;
}
.woocommerce :is(a.button, button.button, input.button),
.woocommerce #respond input#submit,
.woocommerce table.shop_table .button {
  min-height: var(--bhq-button-height);
  border-radius: var(--bhq-button-radius);
  background: var(--bhq-button-background);
  color: var(--bhq-button-text);
  border: 1px solid transparent;
  font-weight: 700;
  transition: background-color .18s, box-shadow .18s;
}
.woocommerce :is(a.button, button.button, input.button):hover {
  background: var(--bhq-button-hover);
  color: var(--bhq-button-text);
}
:is(.bhq-main, .editor-styles-wrapper) :is(.wc-block-components-button, .wp-element-button):disabled,
.woocommerce button.button:disabled {
  cursor: not-allowed; opacity: 1; box-shadow: none;
  background: #e8edf3; color: #506074; border-color: #cbd4df;
}
.bhq-main .wc-block-components-button .wc-block-components-button__text { color: inherit; font: inherit; opacity: 1; }
.bhq-main .wc-block-components-totals-coupon__form { align-items: flex-end; gap: .625rem; }
.bhq-main .wc-block-components-totals-coupon__button {
  flex: 0 0 auto; align-self: flex-end; min-width: 80px;
  height: var(--bhq-field-height); min-height: 44px; margin: 0;
  padding: .625rem .875rem; font-size: .875rem; line-height: 1.25;
}

/* Theme-owned icon styles can be selected for individual Button blocks. Icons
   are decorative pseudo-elements, leaving the visible text as the accessible name. */
:is(.is-style-bhq-arrow, .is-style-bhq-back, .is-style-bhq-mail) .wp-block-button__link,
.bhq-main :is(.wc-block-cart__submit-button, .wc-block-components-checkout-place-order-button) {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  gap: .75rem;
}
:is(.is-style-bhq-arrow, .is-style-bhq-back, .is-style-bhq-mail) .wp-block-button__link::after,
.bhq-main :is(.wc-block-cart__submit-button, .wc-block-components-checkout-place-order-button)::after {
  content: '';
  flex: 0 0 var(--bhq-icon-size);
  width: var(--bhq-icon-size);
  height: var(--bhq-icon-size);
  background: currentColor;
  mask: url('../icons/arrow.svg') center / contain no-repeat;
}
.bhq-main :is(.wc-block-cart__submit-button, .wc-block-components-checkout-place-order-button)::after {
  display: var(--bhq-action-icon-display);
  mask-image: var(--bhq-action-icon);
}
.is-style-bhq-back .wp-block-button__link::after { mask-image: url('../icons/back.svg'); order: -1; }
.is-style-bhq-mail .wp-block-button__link::after { mask-image: url('../icons/mail.svg'); }
.bhq-back-link a, .bhq-help-link a { display: inline-flex; align-items: center; gap: .5rem; }
.bhq-back-link a::before, .bhq-help-link a::before {
  content: ''; display: inline-block; vertical-align: middle; width: var(--bhq-icon-size); height: var(--bhq-icon-size); flex-shrink: 0;
  background: var(--bhq-icon-color); mask: url('../icons/back.svg') center / contain no-repeat;
}
.bhq-help-link a::before { mask-image: url('../icons/mail.svg'); }
/* Navigation's own link display rule can override the generic anchor style,
   collapsing the gap between the icon and its label. */
.bhq-header-row .wp-block-navigation :is(.bhq-back-link, .bhq-help-link) > .wp-block-navigation-item__content {
  display: inline-flex; align-items: center; gap: .5rem; white-space: nowrap; line-height: 1.4;
}
.bhq-header-row .wp-block-navigation :is(.bhq-back-link, .bhq-help-link) > .wp-block-navigation-item__content::before {
  display: block; flex: 0 0 var(--bhq-icon-size); width: var(--bhq-icon-size); height: var(--bhq-icon-size); margin: 0;
}

/* Reference-inspired separated cards, with WooCommerce retaining column order,
   mobile order-summary disclosure, sticky summary and submit behavior. */
.wp-block-woocommerce-checkout { padding: 0; border: 0; background: transparent; box-shadow: none; }
:is(.bhq-main, .editor-styles-wrapper) :is(
  .wp-block-woocommerce-checkout-contact-information-block,
  .wp-block-woocommerce-checkout-billing-address-block,
  .wp-block-woocommerce-checkout-shipping-address-block,
  .wp-block-woocommerce-checkout-payment-block) {
  padding: clamp(1rem, 2.2vw, 1.5rem);
  margin-bottom: 1.25rem;
  border: 1px solid var(--wp--preset--color--line);
  border-radius: var(--bhq-card-radius);
  background: var(--wp--preset--color--white);
}
.wp-block-woocommerce-checkout-order-summary-block {
  border-radius: var(--bhq-card-radius);
  background: var(--wp--preset--color--white);
  box-shadow: 0 8px 28px #192d4406;
}
.wc-block-components-checkout-step__title { letter-spacing: -.015em; }
.wc-block-components-checkout-step__heading-container { margin-bottom: 1.125rem; }
.wp-block-woocommerce-checkout .wc-block-components-order-summary-item .wc-block-components-order-summary-item__quantity {
  background: var(--wp--preset--color--navy); border-color: var(--wp--preset--color--white);
  color: var(--wp--preset--color--white); box-shadow: 0 0 0 2px var(--wp--preset--color--white);
}
.wc-block-cart__submit-container { background: var(--wp--preset--color--white); }

/* WooCommerce has no field-style UI. Keep these component selectors together
   and recheck labels, validation and payment selection when upgrading Woo. */
:is(.bhq-main, .editor-styles-wrapper) .wc-block-components-text-input { display: flex; flex-direction: column; }
body :is(.bhq-main, .editor-styles-wrapper) .wc-block-components-text-input[class] label {
  position: static; order: -1; transform: none; transform-origin: initial;
  inset: auto; align-self: stretch; text-align: start; text-indent: 0;
  max-width: none; margin: 0 0 .5rem; padding: 0; color: var(--wp--preset--color--navy);
  font-size: .875rem; font-weight: 600; line-height: 1.4; pointer-events: auto;
}
body :is(.bhq-main, .editor-styles-wrapper) .wc-block-components-text-input[class] input[type],
:is(.bhq-main, .editor-styles-wrapper) .wc-blocks-components-select .wc-blocks-components-select__select,
:is(.bhq-main, .editor-styles-wrapper) .wc-block-components-textarea,
.woocommerce form .form-row :is(input.input-text, textarea, select),
.woocommerce-EditAccountForm input.input-text {
  width: 100%; min-height: var(--bhq-field-height); padding: .8rem .875rem;
  background: var(--bhq-field-background); color: var(--bhq-field-text);
  border: 1px solid var(--bhq-field-border); border-radius: var(--bhq-field-radius);
  font-size: 1rem; line-height: 1.4; box-shadow: none;
  transition: border-color .18s, box-shadow .18s;
}
:is(.bhq-main, .editor-styles-wrapper) .wc-blocks-components-select .wc-blocks-components-select__container {
  height: auto; margin: 0; padding: 0; border: 0; background: transparent;
}
/* Labels sit above the controls. Woo's focused/active/autofill rules otherwise
   reserve 24px at the top for a floating label, shifting the typed text down. */
body :is(.bhq-main, .editor-styles-wrapper) .wc-block-components-text-input[class].is-active input[type],
body :is(.bhq-main, .editor-styles-wrapper) .wc-block-components-text-input[class] input[type]:is(:focus, :autofill) {
  padding: .8rem .875rem; margin: 0;
}
:is(.bhq-main, .editor-styles-wrapper) .wc-blocks-components-select .wc-blocks-components-select__label {
  display: block; position: static; max-width: none; margin: 0 0 .5rem; padding: 0;
  color: var(--wp--preset--color--navy); font-size: .875rem; font-weight: 600; line-height: 1.4; pointer-events: auto;
}
:is(.bhq-main, .editor-styles-wrapper) .wc-blocks-components-select .wc-blocks-components-select__select { padding-right: 2.5rem; }
:is(.bhq-main, .editor-styles-wrapper) .wc-blocks-components-select .wc-blocks-components-select__expand { top: auto; bottom: calc((var(--bhq-field-height) - 24px) / 2); right: 12px; fill: var(--bhq-icon-color); }
:is(.bhq-main, .editor-styles-wrapper) :is(input, select, textarea):focus {
  outline: 2px solid var(--bhq-focus-color); outline-offset: 2px;
}
body :is(.bhq-main, .editor-styles-wrapper) .wc-block-components-text-input[class] input[aria-invalid="true"],
body :is(.bhq-main, .editor-styles-wrapper) .wc-block-components-text-input[class].has-error input[type],
:is(.bhq-main, .editor-styles-wrapper) .wc-blocks-components-select select[aria-invalid="true"] { border-color: #b32d2e; }
body :is(.bhq-main, .editor-styles-wrapper) .wc-block-components-text-input[class].has-error label { color: #b32d2e; }
:is(.bhq-main, .editor-styles-wrapper) :is(input, select, textarea):disabled { opacity: .6; cursor: not-allowed; }

/* Keep native radio/checkbox semantics and selection indicators. */
:is(.bhq-main, .editor-styles-wrapper) :is(input[type="checkbox"], input[type="radio"]) { accent-color: var(--bhq-choice-accent); }
:is(.bhq-main, .editor-styles-wrapper) .wc-block-components-checkbox .wc-block-components-checkbox__input {
  border-color: var(--bhq-field-border); border-radius: 5px;
}
:is(.bhq-main, .editor-styles-wrapper) .wc-block-components-checkbox .wc-block-components-checkbox__input:checked { background: var(--bhq-choice-accent); border-color: var(--bhq-choice-accent); }
:is(.bhq-main, .editor-styles-wrapper) .wc-block-components-checkbox .wc-block-components-checkbox__mark { fill: #fff; }
:is(.bhq-main, .editor-styles-wrapper) .wc-block-components-radio-control .wc-block-components-radio-control__input { border-color: var(--bhq-field-border); color: var(--bhq-choice-accent); }
:is(.bhq-main, .editor-styles-wrapper) .wc-block-components-radio-control .wc-block-components-radio-control__input:checked { border-color: var(--bhq-choice-accent); }
:is(.bhq-main, .editor-styles-wrapper) .wc-block-components-radio-control .wc-block-components-radio-control__input::before { background: var(--bhq-choice-accent); }
:is(.bhq-main, .editor-styles-wrapper) .wc-block-components-radio-control__option { min-height: 56px; }
:is(.bhq-main, .editor-styles-wrapper) .wc-block-components-radio-control__option-checked { background: var(--bhq-choice-background); }
:is(.bhq-main, .editor-styles-wrapper) .wc-block-components-radio-control-accordion-option { border-radius: var(--bhq-field-radius); overflow: hidden; }
:is(.bhq-main, .editor-styles-wrapper) .wc-block-components-radio-control-accordion-option--checked-option-highlighted { border-radius: var(--bhq-field-radius); box-shadow: inset 0 0 0 1px var(--bhq-choice-accent); }
:is(.bhq-main, .editor-styles-wrapper) .wc-block-components-radio-control--highlight-checked:after { border: 0; box-shadow: none; }
.wc-block-components-radio-control-accordion-content { font-size: .875rem; }
.bhq-main .wc-block-components-radio-control-accordion-content :where(p) { margin: .5rem 0 0; padding: 0; text-align: start; }
.wc-block-components-quantity-selector { border-color: var(--bhq-field-border); border-radius: var(--bhq-field-radius); }
.wc-block-components-quantity-selector button { color: var(--bhq-icon-color); min-width: 32px; }
.wc-block-components-quantity-selector button:focus-visible { outline: 2px solid var(--bhq-focus-color); outline-offset: 2px; }

.is-style-bhq-card, .bhq-empty-state,
.woocommerce form.login, .woocommerce form.register, .woocommerce form.lost_reset_password,
.woocommerce .woocommerce-MyAccount-content, .woocommerce #order_review,
.woocommerce-MyAccount-navigation ul { border-radius: var(--bhq-card-radius); }

/* Price and progress are the strongest anchors after the page title. */
.bhq-steps { font-family: var(--wp--preset--font-family--heading); font-size: .875rem; gap: .5rem; }
.bhq-steps li { min-height: 44px; padding: .625rem 1rem; font-weight: 500; }
.bhq-steps li::before { width: 28px; height: 28px; font-size: .75rem; }
.bhq-steps .is-current { background: var(--wp--preset--color--navy); color: var(--wp--preset--color--white); }
.bhq-steps .is-complete { background: var(--bhq-choice-background); color: var(--wp--preset--color--blue); }
.bhq-main :is(.wp-block-woocommerce-checkout-order-summary-block, .wp-block-woocommerce-cart-order-summary-block) { border-top: 3px solid var(--wp--preset--color--orange); }
.bhq-main .wc-block-components-checkout-order-summary__title-text { font-family: var(--wp--preset--font-family--heading); font-size: 1.125rem; font-weight: 700; }
.bhq-main .wc-block-components-order-summary-item__total-price { font-size: 1.0625rem; font-weight: 700; }
.bhq-main .wc-block-components-totals-footer-item { background: var(--wp--preset--color--navy); color: var(--wp--preset--color--white); padding: 1.125rem 1rem; }
/* Woo's large-cart rule resets horizontal padding after theme styles load. */
:is(.bhq-main, .editor-styles-wrapper) :is(.wp-block-woocommerce-cart, .wp-block-woocommerce-checkout) .wc-block-components-totals-footer-item.wc-block-components-totals-item {
  padding-inline: 1.25rem;
  column-gap: 1rem;
}
.bhq-main .wc-block-components-totals-footer-item .wc-block-components-totals-item__label { font-family: var(--wp--preset--font-family--heading); font-size: 1rem; color: inherit; }
.bhq-main .wc-block-components-totals-footer-item .wc-block-components-totals-item__value { font-family: var(--wp--preset--font-family--heading); font-size: 1.5rem; font-weight: 700; line-height: 1.3; color: var(--wp--preset--color--orange); }
/* The label and amount have different type sizes. Center their line boxes and
   remove Woo's empty description row so the total sits in the middle of its bar. */
:is(.bhq-main, .editor-styles-wrapper) :is(.wp-block-woocommerce-cart, .wp-block-woocommerce-checkout) .wc-block-components-totals-footer-item.wc-block-components-totals-item {
  display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center;
  min-height: 72px; padding-block: 1rem; row-gap: .5rem;
}
.bhq-main .wc-block-components-totals-footer-item :is(.wc-block-components-totals-item__label, .wc-block-components-totals-item__value) {
  align-self: center; margin: 0; padding-block: 0; min-width: 0; line-height: 1.3;
}
.bhq-main .wc-block-components-totals-footer-item .wc-block-components-totals-item__value { text-align: end; }
.bhq-main .wc-block-components-totals-footer-item .wc-block-components-totals-item__description { grid-column: 1 / -1; margin: 0; }
.bhq-main .wc-block-components-totals-footer-item .wc-block-components-totals-item__description:empty { display: none; }
.bhq-main .wc-block-components-product-badge { background: var(--bhq-choice-background); color: var(--wp--preset--color--blue); border-radius: 6px; padding: .25rem .5rem; font-size: .75rem; }

/* Keep the native line total inside narrow cart cards, including 320px screens. */
@container (max-width: 399px) {
  :is(.bhq-main, .editor-styles-wrapper) table.wc-block-cart-items { table-layout: fixed; width: 100%; }
  :is(.bhq-main, .editor-styles-wrapper) table.wc-block-cart-items .wc-block-cart-items__row { grid-template-columns: 64px minmax(0, 1fr); }
  :is(.bhq-main, .editor-styles-wrapper) table.wc-block-cart-items .wc-block-cart-items__row .wc-block-cart-item__product { grid-column: 2; min-width: 0; }
  :is(.bhq-main, .editor-styles-wrapper) table.wc-block-cart-items .wc-block-cart-items__row .wc-block-cart-item__total { grid-column: 2; grid-row: 2; margin-top: .5rem; }
}

/* A measured desktop presentation keeps the native action in its original form
   and React tree. The script removes this class on Woo's mobile layout. */
.bhq-summary-action { position: relative; min-height: var(--bhq-summary-stack-height, 0px); }
.bhq-summary-action .wp-block-woocommerce-checkout-fields-block,
.bhq-summary-action .wc-block-checkout__form { position: static; }
.bhq-summary-action .wp-block-woocommerce-checkout-totals-block { position: relative; align-self: flex-start; height: fit-content; inset: auto; top: var(--bhq-summary-shift, 0px); }
.bhq-summary-action .wp-block-woocommerce-checkout-order-summary-block { border-bottom: 0; border-radius: var(--bhq-card-radius) var(--bhq-card-radius) 0 0; }
.bhq-summary-action :is(.wp-block-woocommerce-checkout-terms-block, .wp-block-woocommerce-checkout-actions-block) {
  position: absolute; left: var(--bhq-summary-left); width: var(--bhq-summary-width);
  box-sizing: border-box; margin: 0; background: var(--wp--preset--color--white);
  border: 1px solid var(--wp--preset--color--line); border-block-width: 0;
}
.bhq-summary-action .wp-block-woocommerce-checkout-terms-block {
  top: calc(var(--bhq-summary-top) + var(--bhq-summary-shift, 0px)); padding: 1rem; font-size: .8125rem; line-height: 1.65;
}
.bhq-summary-action .wp-block-woocommerce-checkout-actions-block {
  top: calc(var(--bhq-summary-top) + var(--bhq-summary-terms-height, 0px) + var(--bhq-summary-shift, 0px));
  padding: 0 1rem 1rem; border-bottom-width: 1px; border-radius: 0 0 var(--bhq-card-radius) var(--bhq-card-radius);
}
.bhq-summary-action .wc-block-checkout__actions_row { margin: 0; }
.bhq-summary-action .wc-block-components-checkout-place-order-button { width: 100%; }
.bhq-summary-action .wc-block-components-checkout-place-order-button .wc-block-components-button__text { flex: 0 1 auto; }
@media (max-width: 480px) {
  .bhq-steps { font-size: .75rem; gap: .25rem; }
  .bhq-steps li { padding: .5rem; gap: .375rem; }
  .bhq-steps li::before { width: 24px; height: 24px; font-size: .6875rem; }
}
@media (max-width: 420px) {
  .bhq-header-row .bhq-brand { width: 146px; }
  .bhq-back-link a::before, .bhq-help-link a::before { width: 16px; height: 16px; }
  .bhq-back-link a, .bhq-help-link a { gap: .25rem; }
}
@media (prefers-reduced-motion: reduce) {
  :is(.bhq-main, .editor-styles-wrapper) :is(input, select, textarea, button, .wp-element-button) { transition: none; }
}