/**
 * Single product gallery fixes (loaded on is_product() only).
 */

/* Fallback when Slick is not initialized */
.ppp-gallery:not(.slick-initialized) a[data-gallery-link] {
  display: block;
  width: 100%;
}

.ppp-gallery:not(.slick-initialized) img {
  width: 100%;
  height: auto !important;
  max-height: calc(100vh - 4.5rem);
  object-fit: contain;
}

.ppp-gallery:not(.slick-initialized) .iframe-vr-container {
  display: none;
}

/*
 * main.css forces height:100% on the whole slick chain; with only max-height
 * on the grid column, that collapses images to 0px once Slick runs.
 */
.ppp-single-product .product-gallery > .galleryContainer {
  min-height: 50vh;
}

@media (min-width: 760px) {
  .ppp-single-product .product-gallery > .galleryContainer {
    min-height: calc(100vh - 8.5rem);
  }
}

.ppp-single-product .product-gallery .ppp-gallery.slick-initialized .slick-list,
.ppp-single-product .product-gallery .ppp-gallery.slick-initialized .slick-track,
.ppp-single-product .product-gallery .ppp-gallery.slick-initialized .slick-slide,
.ppp-single-product .product-gallery .ppp-gallery.slick-initialized .slick-slide > div,
.ppp-single-product .product-gallery .ppp-gallery.slick-initialized a[data-gallery-link] {
  height: auto !important;
}

.ppp-single-product .product-gallery .ppp-gallery.slick-initialized img {
  height: auto !important;
  max-height: calc(100vh - 8.5rem);
  width: 100%;
  object-fit: contain;
}

@media (min-width: 760px) {
  .ppp-single-product .product-gallery .ppp-gallery.slick-initialized img {
    max-height: calc(100vh - 8.5rem);
  }
}
