/* FIX-PDP-GALLERY-20260419
 * Defensive gallery CSS that survives UCSS regeneration.
 * Excluded from UCSS/CSS-combine via optm-css_exc + optm-ucss_file_exc_inline.
 * Addresses: FlexSlider fallback state, thumbnails visibility, layout stability.
 */

/* Base gallery container */
.woocommerce div.product div.images.woocommerce-product-gallery,
.woocommerce-product-gallery {
  position: relative !important;
  display: block !important;
  opacity: 1 !important;
  visibility: visible !important;
  margin-bottom: 1.5em !important;
}

/* Gallery wrapper — must have visible height even pre-JS */
.woocommerce-product-gallery .woocommerce-product-gallery__wrapper,
.woocommerce div.product div.images .woocommerce-product-gallery__wrapper {
  margin: 0 !important;
  padding: 0 !important;
  position: relative !important;
}

/* Individual gallery images */
.woocommerce-product-gallery .woocommerce-product-gallery__image,
.woocommerce div.product div.images .woocommerce-product-gallery__image {
  display: block !important;
  max-width: 100% !important;
}

.woocommerce-product-gallery .woocommerce-product-gallery__image img,
.woocommerce div.product div.images .woocommerce-product-gallery__image img {
  display: block !important;
  max-width: 100% !important;
  height: auto !important;
  margin: 0 auto !important;
}

/* Zoom trigger button */
.woocommerce-product-gallery .woocommerce-product-gallery__trigger,
.woocommerce div.product div.images .woocommerce-product-gallery__trigger {
  background: #fff !important;
  border: none !important;
  border-radius: 100% !important;
  cursor: pointer !important;
  font-size: 2em !important;
  height: 36px !important;
  padding: 0 !important;
  position: absolute !important;
  right: 0.5em !important;
  top: 0.5em !important;
  text-indent: -9999px !important;
  width: 36px !important;
  z-index: 99 !important;
}

/* FlexSlider viewport — clip overflow on horizontal slides */
.flex-viewport,
.woocommerce div.product div.images .flex-viewport {
  max-width: 100% !important;
  overflow: hidden !important;
  position: relative !important;
}

/* FlexSlider main container */
.flexslider,
.woocommerce div.product div.images .flexslider {
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  position: relative !important;
}

.flexslider .slides,
.woocommerce div.product div.images .flexslider .slides {
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
  zoom: 1 !important;
}

.flexslider .slides > li,
.woocommerce div.product div.images .flexslider .slides > li {
  margin: 0 !important;
  padding: 0 !important;
  display: none;
  -webkit-backface-visibility: hidden;
}

.flexslider .slides img,
.woocommerce div.product div.images .flexslider .slides img {
  display: block !important;
  max-width: 100% !important;
  height: auto !important;
}

/* Thumbnails container (WC uses .flex-control-thumbs post-init) */
.flex-control-thumbs,
.woocommerce div.product div.images .flex-control-thumbs {
  overflow: hidden !important;
  zoom: 1 !important;
  margin: 1em 0 0 !important;
  padding: 0 !important;
  list-style: none !important;
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 6px !important;
}

.flex-control-thumbs li,
.woocommerce div.product div.images .flex-control-thumbs li {
  width: calc(25% - 6px) !important;
  float: none !important;
  margin: 0 !important;
  list-style: none !important;
  cursor: pointer !important;
}

.flex-control-thumbs li img,
.woocommerce div.product div.images .flex-control-thumbs li img {
  cursor: pointer !important;
  opacity: 0.5 !important;
  margin: 0 !important;
  width: 100% !important;
  height: auto !important;
  display: block !important;
  transition: opacity 0.2s ease !important;
}

.flex-control-thumbs li img.flex-active,
.flex-control-thumbs li img:hover,
.woocommerce div.product div.images .flex-control-thumbs li img.flex-active,
.woocommerce div.product div.images .flex-control-thumbs li img:hover {
  opacity: 1 !important;
}

/* Paging dots fallback (shown if FlexSlider fails to init with thumbs) */
.flex-control-paging {
  margin: 0.75em 0 !important;
  padding: 0 !important;
  list-style: none !important;
  display: flex !important;
  justify-content: center !important;
  gap: 8px !important;
}

.flex-control-paging li a {
  display: block !important;
  width: 10px !important;
  height: 10px !important;
  border-radius: 50% !important;
  background: #ccc !important;
  text-indent: -9999px !important;
  overflow: hidden !important;
}

.flex-control-paging li a.flex-active {
  background: #333 !important;
}

/* Direction nav (prev/next arrows) */
.flex-direction-nav {
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

.flex-direction-nav a {
  position: absolute !important;
  top: 50% !important;
  margin-top: -20px !important;
  z-index: 10 !important;
  display: block !important;
  width: 40px !important;
  height: 40px !important;
  cursor: pointer !important;
  text-decoration: none !important;
}

.flex-direction-nav .flex-prev { left: 10px !important; }
.flex-direction-nav .flex-next { right: 10px !important; }

/* Mobile-specific safeguards */
@media (max-width: 767px) {
  .woocommerce div.product div.images.woocommerce-product-gallery,
  .woocommerce-product-gallery {
    width: 100% !important;
    float: none !important;
    margin-bottom: 1em !important;
  }

  .woocommerce-product-gallery .woocommerce-product-gallery__image img {
    width: 100% !important;
  }

  .flex-control-thumbs li {
    width: calc(20% - 5px) !important;
  }
}

/* ============================================================
 * FIX-PDP-ROTATION-20260419
 * Defensive anti-rotation guard for PDP summary + buy panel.
 * Owner reported right column rotated 90deg CCW on desktop;
 * no CSS rule in served assets produced the rotation, so this
 * file (UCSS-safelisted) acts as insurance against rogue
 * writing-mode / transform from extensions, plugin updates,
 * or cache corruption.
 * Rollback: restore product-gallery-fix.css.bak-pre-rotation-20260419
 * ============================================================ */
.mf-product-summary,
.entry-summary,
.product-extra-summary,
.alandog-pdp-buy-panel,
.single-product-layout-6 .entry-summary,
.single-product .entry-summary {
  writing-mode: horizontal-tb !important;
  transform: none !important;
  text-orientation: mixed !important;
}
