.wvg-has-video .woocommerce-product-gallery__wrapper {
  position: relative;
}

.wvg-gallery-item-hidden {
  display: none !important;
}

.wvg-active {
  display: block !important;
}

.wvg-video-slide {
  position: relative;
  width: 100%;
  background: #000;
  display: block;
}

.wvg-video-slide.wvg-gallery-item-hidden {
  display: none !important;
}

.wvg-video-slide--main {
  display: block !important;
}

.woocommerce-product-gallery__wrapper .woocommerce-product-gallery__image:not(.wvg-gallery-item-hidden),
.woocommerce-product-gallery__wrapper .wvg-video-slide:not(.wvg-gallery-item-hidden) {
  display: block !important;
}

.wvg-splide-gallery .splide__slide,
.wvg-splide-gallery .splide__slide[style*='display: none'],
.wvg-splide-gallery .splide__slide[style*='display:none'] {
  display: block !important;
}

.wvg-splide-gallery .splide__slide > *[style*='display: none'],
.wvg-splide-gallery .splide__slide > *[style*='display:none'] {
  display: block !important;
}

.wvg-video-player {
  width: 100%;
  height: auto;
  max-width: 100%;
  display: block;
  outline: none;
}

.wvg-video-link {
  display: block;
  position: relative;
  text-decoration: none;
  color: inherit;
}

.wvg-video-link:hover {
  text-decoration: none;
}

.wvg-thumbnails-wrapper:not(.splide__list) {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 15px;
}

.wvg-splide-thumbnails .wvg-thumbnails-wrapper[style*='width'],
.splide__list.wvg-thumbnails-wrapper[style*='width'] {
  width: auto !important;
}

.wvg-thumbnail {
  position: relative;
  cursor: pointer;
  overflow: hidden;
  border: 2px solid transparent;
  transition: border-color 0.3s ease;
}

.wvg-thumbnails-wrapper:not(.splide__list) .wvg-thumbnail {
  flex: 0 0 auto;
}

.wvg-thumbnail-image {
  display: block;
  width: 100%;
  height: auto;
  max-width: 100px;
  max-height: 100px;
  object-fit: cover;
}

.wvg-thumbnail--video {
  position: relative;
}

.wvg-thumbnail--video .wvg-thumbnail-image {
  opacity: 0.9;
  transition: opacity 0.3s ease;
}

.wvg-thumbnail--video:hover .wvg-thumbnail-image {
  opacity: 1;
}

.wvg-play-icon {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  pointer-events: none;
  z-index: 1;
}

.wvg-play-icon svg {
  display: block;
  width: 48px;
  height: 48px;
  filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.3));
}

@media (max-width: 768px) {
  .wvg-thumbnail-image {
    max-width: 80px;
    max-height: 80px;
  }

  .wvg-play-icon svg {
    width: 36px;
    height: 36px;
  }
}

.wvg-has-video .flex-control-thumbnails {
  display: none;
}

.glightbox .wvg-video-player {
  max-width: 90vw;
  max-height: 90vh;
}

.wvg-thumbnail--video:not(:has(img[src])) {
  background: #f0f0f0;
  min-width: 100px;
  min-height: 100px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.wvg-thumbnail--video:not(:has(img[src]))::before {
  content: '🎬';
  font-size: 24px;
}

.wvg-splide-gallery {
  margin-bottom: 1rem;
}

.wvg-splide-main {
  margin-bottom: 1rem;
}

.wvg-splide-main .splide__pagination {
  display: none !important;
}

.wvg-splide-thumbnails {
  margin-top: 1rem;
}

.wvg-splide-thumbnails .splide__arrows {
  display: none !important;
}

.wvg-splide-thumbnails .splide__slide {
  cursor: pointer;
  opacity: 0.6;
  transition: opacity 0.3s ease;
}

.wvg-splide-thumbnails .splide__slide.is-active {
  opacity: 1;
}

.wvg-splide-thumbnails .splide__slide:hover {
  opacity: 0.8;
}

.wvg-splide-thumbnails .splide__slide {
  flex: 0 0 auto;
  width: 300px;
  aspect-ratio: 1;
}

.wvg-splide-thumbnails .wvg-thumbnail {
  width: 100%;
  height: 100%;

  display: flex;
  justify-content: center;
  align-items: center;
  overflow: hidden;
  background: #f5f5f5;
}

.wvg-splide-thumbnails .wvg-thumbnail-image {
  width: 100%;
  height: 100%;
  max-width: 300px;
  max-height: 300px;
  object-fit: contain;
  object-position: center;
}

@media (max-width: 768px) {
  .wvg-splide-thumbnails .splide__slide {
    width: 150px;
  }
  .wvg-splide-thumbnails .wvg-thumbnail {
    min-height: 150px;
  }
  .wvg-splide-thumbnails .wvg-thumbnail-image {
    max-width: 150px;
    max-height: 150px;
  }
}

.woocommerce-product-gallery__image {
  width: 100%;
  height: 100%;
  a {
    display: flex !important;
    width: 100%;
    height: 100%;
    object-fit: cover;
    justify-content: center;
  }
}
