/* ===== Video Slider (scoped) ===== */
.video-slider-wrap{ width:100%; max-width:100%; overflow-x:hidden; }
.video-slider-wrap .video-slider{ width:100%; overflow:hidden; } /* len náš slider */

/* len naše slidy, nie globálne */
.video-slider-wrap .swiper-slide{
  display:flex;
  justify-content:center;
  flex:0 0 auto;
  max-width:92vw; /* mobil – nepretŕča */
}

.video-slider-wrap .vs-card{
  width:100%;
  aspect-ratio:9/16;
  max-width:260px;
  background:#111;
  border-radius:9px;
  overflow:hidden;
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
}

.video-slider-wrap .vs-frame{
  width:100%;
  height:100%;
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  background:#000;
  overflow:hidden; /* pre YT cover */
}

.video-slider-wrap .vs-poster{
  width:100%;
  height:100%;
  object-fit:cover;
  border-radius:inherit;
  display:block;
}

.video-slider-wrap .vs-poster-fallback{
  width:100%;
  height:100%;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#fff;
  font-weight:600;
}

/* ✅ play button len v rámci nášho slidera – upravené */
.video-slider-wrap .vs-play {
  position: absolute;
  width: 52px;
  height: 52px;
  border-radius: 50%;
  border: 0;
  background: rgba(255, 255, 255, 0.35); /* viac transparentné */
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.25);
  transition: transform 0.2s, background 0.2s;
  backdrop-filter: blur(4px); /* jemný glass efekt */
}
.video-slider-wrap .vs-play:hover {
  transform: scale(1.08);
  background: rgba(255, 255, 255, 0.45);
}
.video-slider-wrap .vs-triangle {
  width: 0;
  height: 0;
  border-left: 16px solid #42ffd4; /* 🔹 tvoje brandové #42FFD4 */
  border-top: 10px solid transparent;
  border-bottom: 10px solid transparent;
  margin-left: 3px;
}

.video-slider-wrap[data-show-buttons="no"] .vs-play{ display:none; }

/* vložené video/iframe len u nás */
.video-slider-wrap .vs-video,
.video-slider-wrap .vs-embed{
  width:100%;
  height:100%;
  object-fit:cover;
  border:0;
  border-radius:inherit;
}

/* YouTube 16:9 -> cover do 9:16 karty (iba u nás) */
.video-slider-wrap .vs-embed{ position:absolute; left:0; width:100%; }
.video-slider-wrap .vs-embed.yt-cover{ height:177.78%; top:-38.89%; }

/* pagination/šípky len pre náš slider */
.video-slider-wrap .video-slider .swiper-pagination{ bottom:-14px; position:relative; }
.video-slider-wrap .video-slider .swiper-button-prev,
.video-slider-wrap .video-slider .swiper-button-next{ top:50%; transform:translateY(-50%); }

/* desktop limit šírky len u nás */
@media (min-width:1024px){
  .video-slider-wrap .swiper-slide{ max-width:240px; }
}

/* MOBIL – 3 videá vedľa seba a prispôsobená výška */
@media (max-width: 767px) {

  /* 3 slidy vedľa seba */
  .video-slider-wrap .video-slider .swiper-slide {
    flex: 0 0 33.333%;
    max-width: 33.333%;
  }

  /* zmenený pomer stránky tak, aby sa tam 3 videá zmestili pekne */
  .video-slider-wrap .vs-card {
    aspect-ratio: 9 / 14 !important; /* môžeš upraviť podľa optiky */
    max-width: 100%;
  }
}


/* MOBIL – odstrániť kruhové pozadie, ponechať trojuholník */
@media (max-width: 767px) {

  /* odstránenie kruhu */
  .video-slider-wrap .vs-play {
    background: none !important;
    width: auto !important;
    height: auto !important;
    box-shadow: none !important;
    padding: 0 !important;
  }

  /* trojuholník zostáva, nech je dobre viditeľný */
  .video-slider-wrap .vs-triangle {
    border-left-width: 16px !important;
    border-top-width: 10px !important;
    border-bottom-width: 10px !important;
    margin-left: 0 !important;
    transform: translateX(0);
  }
}