/* video item style (compatible) */
.item.video { position: relative; cursor: pointer; }
.item.video img { display:block; width:100%; border-radius:6px; object-fit:cover; }

/* optional play button if template doesn't render one */
.item.video .play-btn {
  position: absolute;
  left:50%; top:50%;
  transform: translate(-50%,-50%);
  background: rgba(0,0,0,0.6);
  color:#fff;
  border-radius:50%;
  font-size:20px;
  width: 50px; height:50px;
  pointer-events:none;
  display:inline-flex;
  align-items:center; justify-content:center;
  z-index: 2;
  opacity: 0;
  transition: all .3s;
}
.video-thumb-wrapper {
  position: relative;
  background: #000;
}
.video-thumb-wrapper iframe,
.video-thumb-wrapper .fade-img {
  transition: opacity 0.6s ease;
}
/* ✅ Ngăn iframe nền chặn click */
.video-thumb-wrapper iframe.video-thumb {
  pointer-events: none;
}

/* Nếu muốn hover vẫn thấy nút play rõ hơn */
.item.video:hover .play-btn {
  background: rgba(0,0,0,0.75);
  transform: translate(-50%, -50%) scale(1.05);
  opacity: 1;
}

/* popup overlay */
.video-popup-overlay {
  display:none;
  position:fixed;
  inset:0;
  background: rgba(0,0,0,0.82);
  z-index:99999;
  align-items:center;
  justify-content:center;
}
.video-popup-overlay.active { display:flex; }

/* popup box */
.video-popup {
  width:90%;
  max-width:960px;
  aspect-ratio: 16/9;
  background:#000;
  border-radius:10px;
  overflow:hidden;
  position:relative;
      padding: 10px;
    background-color: #fff;
}
.video-popup .video-iframe-wrapper {
  width:100%;
  height:100%;
  border-radius:6px;
}
.video-popup iframe { width:100%; height:100%; border:0; display:block; }

/* close button */
.video-popup .close-btn {
  font-size: 30px;
    line-height: 40px;
    color: #000;
    border: none;
    cursor: pointer;
    width: 40px;
    height: 40px;
    position: absolute;
    top: 0;
    right: 0;
    z-index: 1;
    background-color: #fff;
    border-radius: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
}