/* Retro Junkie Media — product gallery: FlexSlider-safe slides + thumb zoom */

body.single-product .woocommerce-product-gallery .flex-viewport {
  overflow: hidden !important;
}

/* FlexSlider lays slides out with float:left + a wide wrapper. Do not
   convert the wrapper into a column flex/grid — extra images vanish. */
body.single-product .woocommerce-product-gallery .woocommerce-product-gallery__wrapper {
  display: block !important;
}

body.single-product .woocommerce-product-gallery .flex-viewport > .woocommerce-product-gallery__wrapper > .woocommerce-product-gallery__image {
  float: left !important;
}

body.single-product .woocommerce-product-gallery .flex-control-thumbs img {
  cursor: pointer;
  transform-origin: center center;
  transition: transform 0.28s cubic-bezier(0.34, 1.4, 0.64, 1), opacity 0.2s ease, border-color 0.2s ease;
}

body.single-product .woocommerce-product-gallery .flex-control-thumbs img:hover,
body.single-product .woocommerce-product-gallery .flex-control-thumbs img:focus-visible {
  opacity: 1 !important;
  transform: scale(1.22);
  z-index: 3;
}

body.single-product .woocommerce-product-gallery .flex-control-thumbs img.flex-active {
  opacity: 1 !important;
}

@media (prefers-reduced-motion: reduce) {
  body.single-product .woocommerce-product-gallery .flex-control-thumbs img {
    transition: opacity 0.15s ease, border-color 0.15s ease;
  }
  body.single-product .woocommerce-product-gallery .flex-control-thumbs img:hover,
  body.single-product .woocommerce-product-gallery .flex-control-thumbs img:focus-visible {
    transform: none;
  }
}

@media (max-width: 767px) {
  body.single-product .woocommerce-product-gallery .flex-control-thumbs,
  body.single-product .woocommerce-product-gallery ol.flex-control-nav {
    display: flex !important;
    flex-wrap: nowrap !important;
    gap: 0.5rem;
    overflow-x: auto;
    overflow-y: visible;
    -webkit-overflow-scrolling: touch;
    padding: 6px 4px !important;
  }

  body.single-product .woocommerce-product-gallery .flex-control-thumbs li,
  body.single-product .woocommerce-product-gallery ol.flex-control-nav li {
    flex: 0 0 4.5rem;
    float: none !important;
    width: 4.5rem !important;
    overflow: visible;
  }
}
