/* ===== GT Product Video – front.css | v1.2.0 ===== */

/* ------ Thumbnail con badge play ------ */
.thumb-container.gtpv-thumb {
  position: relative;
  cursor: pointer;
  overflow: hidden;
}

.thumb-container.gtpv-thumb .gtpv-play-badge {
  position: absolute;
  right: 6px;
  bottom: 6px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: rgba(0, 0, 0, .60);
  color: #fff;
  font-size: 13px;
  line-height: 1;
  pointer-events: none;
  transition: background .2s;
}

.thumb-container.gtpv-thumb:hover .gtpv-play-badge {
  background: rgba(0, 0, 0, .85);
}

/* ------ Slide grande video ------ */

/* Disabilita zoom/expander sulle slide video */
.gtpv-slide .easyzoom,
.gtpv-slide .expander,
.gtpv-slide .product-flags,
.gtpv-slide [data-zoom-image] {
  display: none !important;
}

/* Contenitore 16:9 responsive (sovrascrivibile via --gtpv-ratio) */
.gtpv-slide {
  --gtpv-ratio: 56.25%; /* 16:9 */
  position: relative;
  z-index: 5;
}

.gtpv-slide .gtpv-slide-holder {
  position: relative;
  width: 100%;
}

.gtpv-slide .gtpv-slide-holder::before {
  content: '';
  display: block;
  padding-top: var(--gtpv-ratio);
}

/* Il player occupa interamente il contenitore */
.gtpv-slide .gtpv-player,
.gtpv-slide .gtpv-frame {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  display: block;
  background: #000;
  object-fit: contain;
  border: none;
}

/* ------ Mobile ------ */
@media (max-width: 480px) {
  .thumb-container.gtpv-thumb .gtpv-play-badge {
    width: 24px;
    height: 24px;
    font-size: 11px;
    right: 4px;
    bottom: 4px;
  }
}
