/* Performance: product CLS fixes layer.
   Added May 12, 2026.
   Keep this file isolated so fixes can be rolled back by dequeuing one handle.
   Tall variation reserves apply to bespoke shoes only (.product-layout-bespoke). */

/* CLS hygiene: neutralize prior broad reservation experiment without editing core stylesheet.
   Addresses the mobile blank-space regression from column-level min-heights. */
.single-product .order-area,
.single-product .image-description-area {
  min-height: 0;
}

/* CLS fix (Stripe-first): reserve only known Stripe express checkout wrappers so
   Pay with Link mount/unmount cycles do not move following content.
   Keep selectors narrow to avoid reintroducing mobile whitespace.
   TODO: verify exact wrapper/class on live and keep only the one in use. */
.single-product .summary .wc-stripe-product-checkout-container,
.single-product .summary .wc-stripe-express-checkout-element,
.single-product .summary .wc-stripe-express-checkout-button,
.single-product .summary .wc-stripe-payment-request-wrapper,
.single-product .summary [id*="payment-request"],
.single-product .summary [class*="payment-request"],
.single-product .summary [id*="wc-stripe-express-checkout"],
.single-product .summary [class*="wc-stripe-express-checkout"] {
  display: block;
  min-height: 56px; /* Stripe button slot + small margin buffer */
}

/* Keep nested Stripe host from collapsing while iframe/button is re-mounted. */
.single-product .summary .wc-stripe-product-checkout-container > *,
.single-product .summary .wc-stripe-express-checkout-element > *,
.single-product .summary .wc-stripe-express-checkout-button > *,
.single-product .summary .wc-stripe-payment-request-wrapper > * {
  min-height: inherit;
}

/* CLS fix: on desktop reserve the full variation/cart controls block (shoes). */
@media (min-width: 768px) {
  .product-layout-bespoke .summary form.cart,
  .product-layout-bespoke .variations_form {
    min-height: 240px; /* Reduced from 280 to avoid excess blank space while keeping stability */
  }

  .single-product .summary .wc-stripe-product-checkout-container,
  .single-product .summary .wc-stripe-express-checkout-element,
  .single-product .summary .wc-stripe-express-checkout-button,
  .single-product .summary .wc-stripe-payment-request-wrapper,
  .single-product .summary [id*="payment-request"],
  .single-product .summary [class*="payment-request"],
  .single-product .summary [id*="wc-stripe-express-checkout"],
  .single-product .summary [class*="wc-stripe-express-checkout"] {
    min-height: 60px;
  }
}

/* CLS fix: variations table renders after JS initialises (shoes only). */
.product-layout-bespoke table.variations {
  min-height: 360px; /* Mobile reserve for delayed variation rows */
}
@media (min-width: 768px) {
  .product-layout-bespoke table.variations {
    min-height: 520px; /* Desktop/tablet reserve based on reported rendered table height */
  }
}

/* Apparel: small reserve for colour/size only — avoid shoe-sized empty space. */
.product-layout-apparel table.variations {
  min-height: 0;
}
@media (min-width: 768px) {
  .product-layout-apparel .summary form.cart,
  .product-layout-apparel .variations_form {
    min-height: 120px;
  }
}

/* CLS fix: footer-leaf flagged as unsized despite width/height attrs — CSS override suspected. */
.footer-leaf {
  width: 75px;
  height: 75px;
  aspect-ratio: 1 / 1;
}