/* Video carousel - START */
.video-carousel-wrapper{
  position: relative;
  z-index: 0;
}
.video-carousel-wrapper swiper-container{
  position: relative;
}
.video-carousel-wrapper .video-carousel-button-prev,
.video-carousel-wrapper .video-carousel-button-next{
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 1;
  border-radius: calc(0.22px * var(--layout-radius));
  transition: background-color 200ms ease-in-out, color 200ms ease-in-out, opacity 200ms ease-in-out;
}
.video-carousel-wrapper .video-carousel-button-prev.btn-secondary:not(:hover):not(:disabled):not(:focus-visible),
.video-carousel-wrapper .video-carousel-button-next.btn-secondary:not(:hover):not(:disabled):not(:focus-visible){
  background-color: rgb(var(--secondary-button-background) / 0.5);
}
.video-carousel-wrapper .video-carousel-button-prev:disabled,
.video-carousel-wrapper .video-carousel-button-next:disabled{
  opacity: 0;
  pointer-events: none;
}
.video-carousel-wrapper .video-carousel-button-prev:not(:disabled),
.video-carousel-wrapper .video-carousel-button-next:not(:disabled){
  cursor: pointer;
}
.video-carousel-wrapper .video-carousel-button-prev{
  inset-inline-start: 0.5rem;
}
.video-carousel-wrapper .video-carousel-button-next{
  inset-inline-end: 0.5rem;
}
.video-carousel-wrapper .video-wrapper{
  aspect-ratio: var(--_video-ratio, 1); 
  display: flex; 
  align-items: center; 
  justify-content: center; 
  border-radius: calc(0.22px * var(--layout-radius));
  overflow: hidden;
}
.video-carousel-wrapper .video-wrapper.show-background{
  background-color: rgb(var(--secondary-background));
}
.video-carousel-wrapper .internal-video{
  width: 100%;
  height: 100%;
  position: relative;
}
.video-carousel-wrapper video{
  width: 100%;
  height: 100%;
  object-fit: var(--_video-fit, cover);
}
.video-carousel-wrapper .video-toggle{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  cursor: pointer;
  display: flex;
  justify-content: flex-end;
  align-items: flex-end;
  background-color: transparent;
  padding: 0.625rem;
}
.video-carousel-wrapper .video-toggle .icon-btn,
.video-carousel-wrapper .video-sound-toggle{
  border-radius: calc(0.22px * var(--button-radius));
  transition: background-color 200ms ease-in-out, color 200ms ease-in-out, opacity 200ms ease-in-out;
}

.video-carousel-wrapper .video-actions{
  position: absolute;
  top: 0.625rem;
  inset-inline-end: 0.625rem;
}
.video-carousel-wrapper .video-actions button:not(:disabled){
  cursor: pointer;
}

@media (hover: hover) and (pointer: fine) {
  .video-carousel-wrapper swiper-container[data-video-play-on="hover"] .video-toggle{
    align-items: center;
    justify-content: center;
    pointer-events: none;
    transition: opacity 200ms ease-in-out;
  }
  .video-carousel-wrapper swiper-container[data-video-play-on="hover"] .video-toggle.playing{
    opacity: 0;
  }
  .video-carousel-wrapper .video-toggle .icon-btn.btn-secondary:not(:hover):not(:disabled):not(:focus-visible),
  .video-carousel-wrapper .video-sound-toggle.btn-secondary:not(:hover):not(:disabled):not(:focus-visible){
    background-color: rgb(var(--secondary-button-background) / 0.8);
  }
  .video-carousel-wrapper .video-actions button:not(:focus-visible){
    opacity: 0;
  }
  .video-carousel-wrapper .video-wrapper:hover .video-actions button,
  .video-carousel-wrapper .video-toggle:focus-visible ~ .video-actions button{
    opacity: 1;
  }
}
/* Video carousel - END */