/* Product detail: video thumbnails on mobile (poster + aspect ratio) */
.product-slider .product.video {
  width: 100%;
}

.product-slider .product.video video,
.video-slide video {
  width: 100%;
  max-width: 100%;
  aspect-ratio: 16 / 9;
  height: auto;
  display: block;
  object-fit: contain;
  background: #000;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
}

/* Slick fade can prevent iOS from painting the video frame until the slide is active */
.product-slider .slick-slide.slick-active .product.video video,
.video-slider .slick-slide.slick-active video {
  visibility: visible;
}

/* Bottom video section (from _video-carousel.scss) */
.video-section {
  padding-top: 62px;
  padding-bottom: 62px;
}

.video-slider-wrapper {
  display: flex;
  align-items: center;
  gap: 12px;
}

.video-slider-wrapper .video-slider {
  flex: 1;
  min-width: 0;
}

.video-slider--prev,
.video-slider--next {
  cursor: pointer;
  display: block;
  line-height: 0;
  flex-shrink: 0;
}

.video-slider--prev svg {
  transform: rotate(180deg);
}

.wp-child-theme-kleanstrip .video-section {
  background: #0167b2;
}

.wp-child-theme-kleanstrip .video-slide svg path {
  fill: #0167b2;
}

.wp-child-theme-citristrip .video-section {
  background: #247e07;
}

.wp-child-theme-citristrip .video-slide svg path {
  fill: #247e07;
}

.wp-child-theme-goofoff .video-section {
  background: #fedd00;
}

.wp-child-theme-goofoff .video-slide svg path {
  fill: #fedd00;
}

.wp-child-theme-jasco-help .video-section {
  background: #00499a;
}

.wp-child-theme-jasco-help .video-slide svg path {
  fill: #00499a;
}

.wp-child-theme-rustaid .video-section {
  background: #8b3a2a;
}

.wp-child-theme-rustaid .video-slide svg path {
  fill: #8b3a2a;
}