/* ILPET: continuous pale gallery/carousel track with a dark active segment.
   Native slide controls, selected states and visibility are preserved. */

body .slick-dots {
  display: flex;
  justify-content: center;
  gap: 0;
  box-sizing: border-box;
  width: 100%;
  max-width: calc(100vw - 32px);
  margin-inline: auto !important;
  padding-inline: 0 !important;
}

body .slick .slick-dots {
  margin-inline: auto !important;
}

body .slick-dots li {
  flex: 1 1 0;
  width: 0 !important;
  min-width: 0;
  max-width: none;
  height: 24px !important;
  margin: 0 !important;
  padding: 0 !important;
  vertical-align: middle;
}

body .slick-dots li button {
  display: block;
  box-sizing: content-box !important;
  width: 100% !important;
  height: 2px !important;
  margin: 0 !important;
  padding: 11px 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background-color: rgba(73, 73, 72, 0.1) !important;
  background-clip: content-box !important;
  box-shadow: none !important;
}

body .slick-dots li.slick-active button {
  background-color: #494948 !important;
}

/* Preserve the theme's light controls on dark images/sections. */
body .wpb_column.et-light-column .slick .slick-dots li button {
  background-color: rgba(255, 255, 255, 0.4) !important;
}

.product-showcase-light-text .slick-dots li button {
  background-color: rgba(255, 255, 255, 0.2) !important;
}

body .wpb_column.et-light-column .slick .slick-dots li.slick-active button,
.product-showcase-light-text .slick-dots li.slick-active button {
  background-color: #fff !important;
}

body .slick-dots li button:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 2px;
}

/* Goya uses dot controls below 992px. Keep desktop thumbnail images intact. */
@media (max-width: 991px) {
  body .thumbnails-mobile-dots .woocommerce-product-gallery .flex-control-thumbs {
    box-sizing: border-box;
    width: calc(100% - 32px);
    margin-inline: 16px;
    padding: 0;
  }

  body .thumbnails-mobile-dots .woocommerce-product-gallery .flex-control-thumbs:not(.slick-slider),
  body .thumbnails-mobile-dots .woocommerce-product-gallery .flex-control-thumbs.slick-slider .slick-track {
    display: flex;
    justify-content: center;
    gap: 0;
  }

  body .thumbnails-mobile-dots .woocommerce-product-gallery .flex-control-thumbs.slick-slider .slick-track {
    width: 100% !important;
  }

  body .thumbnails-mobile-dots .woocommerce-product-gallery .flex-control-thumbs li {
    flex: 1 1 0;
    width: 0 !important;
    min-width: 0;
    max-width: none;
    height: 24px !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  body .thumbnails-mobile-dots .woocommerce-product-gallery .flex-control-thumbs li img {
    box-sizing: content-box !important;
    width: 0 !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 24px 100% 0 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: linear-gradient(rgba(73, 73, 72, 0.1), rgba(73, 73, 72, 0.1)) center / 100% 2px no-repeat !important;
    opacity: 1 !important;
    box-shadow: none !important;
  }

  body .thumbnails-mobile-dots .woocommerce-product-gallery .flex-control-thumbs li img.flex-active {
    background-image: linear-gradient(#494948, #494948) !important;
  }
}

/* ILPET: hide main product-gallery arrows on phones; keep swipe and track navigation. */
@media (max-width: 767px) {
  body.single-product .product-gallery .woocommerce-product-gallery > .flex-direction-nav {
    display: none !important;
  }
}