/* Commerce OS 0.9.19 — taller sticky product gallery (desktop only).
   Sticky gallery is limited to native WooCommerce PDP desktop.
   No global WooCommerce gallery, Elementor, checkout or archive overrides. */
@media (min-width: 1024px) {
  /* overflow:clip on the parent can prevent the browser from establishing sticky travel. */
  body.lco-editorial.single-product:has(.lco-pdp-columns) .lco-page {
    overflow: visible;
  }
  body.lco-editorial.single-product .lco-pdp-columns {
    align-items: stretch;
  }
  body.lco-editorial.single-product .lco-pdp-columns > .lco-pdp-media {
    position: sticky;
    top: var(--lco-pdp-gallery-offset, 116px);
    align-self: start;
    width: 100%;
    min-width: 0;
    height: max-content;
    z-index: 2;
  }
  /* Keep the full gallery (including thumbnails) inside shorter desktop viewports. */
  body.lco-editorial.single-product .lco-pdp-media .woocommerce-product-gallery__image img {
    width: 100% !important;
    height: min(78svh, 860px) !important;
    max-height: none !important;
    aspect-ratio: auto !important;
    object-fit: cover;
  }
  body.lco-editorial.single-product .lco-pdp-media .flex-viewport {
    height: min(78svh, 860px) !important;
    max-height: min(78svh, 860px);
  }
}
/* Natural stacked gallery on tablet and phone; do not interfere with swipe/zoom. */
@media (max-width: 1023px) {
  body.lco-editorial.single-product .lco-pdp-columns > .lco-pdp-media {
    position: static;
    top: auto;
  }
}

/* Keep the zoom layer aligned with the displayed image height. */
@media (min-width: 1024px) {
  body.lco-editorial.single-product .lco-pdp-media .woocommerce-product-gallery__image {
    min-width: 0;
  }
  body.lco-editorial.single-product .lco-pdp-media .woocommerce-product-gallery__image img {
    object-fit: cover;
    object-position: center center;
  }
}
@media (min-width: 1024px) and (max-height: 650px) {
  body.lco-editorial.single-product .lco-pdp-media .woocommerce-product-gallery__image img {
    height: min(66svh, 560px) !important;
  }
  body.lco-editorial.single-product .lco-pdp-media .flex-viewport {
    max-height: min(66svh, 560px);
  }
}
