.youtube-carousel {
  position: relative;
  padding: 0 70px;
  padding-bottom: 50px;
}

.youtube-carousel *{
    -webkit-user-select: none; /* Safari */
  -ms-user-select: none; /* IE 10 and IE 11 */
  user-select: none; /* Standard syntax */
}

.youtube-carousel .swiper-container {
  width: 100%;
  overflow: hidden;
}

.youtube-carousel .swiper-wrapper {
  display: flex;
}

.youtube-carousel .swiper-slide {
    border-radius: 20px;
    overflow: hidden;
}

.youtube-carousel .video-wrapper {
  position: relative;
  padding-bottom: 56.25%; /* 16:9 aspect ratio */
  height: 0;
}

.youtube-carousel .video-wrapper iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
}

.video-wrapper .play-overlay {
  position: absolute;
  top: 0; left: 0; right: 0; bottom: 0;
  cursor: pointer;
}

/* pagination bullets */
.youtube-carousel .swiper-pagination {
  text-align: center;
  margin-top: 1rem;
}

/* navigation buttons */
.youtube-carousel .swiper-button-prev-yt,
.youtube-carousel .swiper-button-next-yt {
  position: absolute;
  top: calc(50% - 25px);
  width: 48px;
  height: 48px;
  transform: translateY(-50%);
  cursor: pointer;
  z-index: 10;
}

.youtube-carousel .swiper-button-prev-yt.swiper-button-disabled,
.youtube-carousel .swiper-button-next-yt.swiper-button-disabled{
    opacity: 0.3;
}

.youtube-carousel .swiper-button-prev-yt {
  left: 0;
}

.youtube-carousel .swiper-button-next-yt {
  right: 0;
}

/* GAP: remove margin on last slide */
.youtube-carousel .swiper-slide:last-child {
  margin-right: 0;
}

/* Responsive: below 782px, show only 1 slide and hide nav */
@media (max-width: 781px) {
  .youtube-carousel {
    padding-left: 0;
    padding-right: 0;
  }
  .youtube-carousel .swiper-button-prev-yt,
  .youtube-carousel .swiper-button-next-yt {
    display: none;
  }
}
