/* Obal pro slide s videem */
.video-slide-container {
  position: relative;
  background: #000;
}

/* Odkaz a jeho chování při najetí */
.video-link-wrapper {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  text-decoration: none;
}

/* Velká ikona Play uprostřed hlavního obrázku */
.play-overlay-center {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%); /* Dokonalý střed */
  text-shadow: 0 4px 20px rgba(0, 0, 0, 0.5);
  transition: all 0.3s ease;
  z-index: 5;
  pointer-events: none;
}

/* 3. Efekt při najetí na kontejner */
.video-slide-container:hover .play-overlay-center {
  /* Ikona se plynule zvětší a rozzáří */
  transform: translate(-50%, -50%) scale(1.2);
  color: #ffffff;
  /* Přidáme jemnou bílou záři (glow efekt) pro pocit hloubky */
  filter: drop-shadow(0 0 8px rgba(255, 255, 255, 0.4));
}

/* --- THUMBNAIL (Malý náhled dole) --- */
/* Slick dots/thumbnails mají obvykle třídu .slick3-dots nebo podobnou */
/* Musíme "vnutit" ikonu na malý náhled přes CSS */

/*
.slick3-dots li:last-child {
  position: relative;
}

.slick3-dots li:last-child img {
  display: block;
}
*/

.slick3-dots li:last-child:after {
  content: "\f144";
  font-family: "Font Awesome 5 Free", "Font Awesome 6 Free";
  font-weight: 900;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  color: #98ca3d;
  font-size: 2rem;
  text-shadow: 0 0 5px rgba(0,0,0,0.7);
  pointer-events: none;
  z-index: 10;
}
