/**
 * Galeria do produto: vídeos no frontend
 * - Na faixa de miniaturas: mostra thumbnail com ícone de play
 * - Na área principal (slide): mostra o player de vídeo
 */

/* Estado padrão: mostrar thumb (miniaturas), esconder player */
.tgoo-gallery-video-wrap .tgoo-gallery-video-player {
    display: none !important;
}

.tgoo-gallery-video-wrap .tgoo-video-thumb {
    display: flex !important;
    align-items: center;
    justify-content: center;
    width: 100%;
    aspect-ratio: 1;
    min-height: 80px;
    background: #1d2327;
    border-radius: 4px;
}

/* Área principal da galeria (slide): mostrar vídeo, esconder thumbnail */
.woocommerce-product-gallery__wrapper .tgoo-gallery-video-wrap .tgoo-video-thumb,
.wd-carousel-wrap .tgoo-gallery-video-wrap .tgoo-video-thumb {
    display: none !important;
}

.woocommerce-product-gallery__wrapper .tgoo-gallery-video-wrap .tgoo-gallery-video-player,
.wd-carousel-wrap .tgoo-gallery-video-wrap .tgoo-gallery-video-player {
    display: block !important;
    width: 100%;
    height: auto;
    max-height: 70vh;
    object-fit: contain;
    background: #000;
    border-radius: inherit;
}

/* Faixa de miniaturas: garantir que thumb fique visível (redundante com padrão) */
.flex-control-thumbs .tgoo-gallery-video-wrap .tgoo-gallery-video-player,
.woocommerce-product-gallery__thumbnails .tgoo-gallery-video-wrap .tgoo-gallery-video-player,
.wd-gallery-thumb .tgoo-gallery-video-wrap .tgoo-gallery-video-player {
    display: none !important;
}

.flex-control-thumbs .tgoo-gallery-video-wrap .tgoo-video-thumb,
.woocommerce-product-gallery__thumbnails .tgoo-gallery-video-wrap .tgoo-video-thumb,
.wd-gallery-thumb .tgoo-gallery-video-wrap .tgoo-video-thumb {
    display: flex !important;
    min-height: 60px;
}

.tgoo-video-play-icon {
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 12px 0 12px 24px;
    border-color: transparent transparent transparent #fff;
    margin-left: 4px;
}

/* Garantir que o slide do vídeo ocupe espaço e seja visível */
.tgoo-gallery-video-wrap {
    position: relative;
    width: 100%;
    min-height: 120px;
}

.woocommerce-product-gallery__wrapper .tgoo-gallery-video-wrap,
.wd-carousel-wrap .tgoo-gallery-video-wrap {
    min-height: 200px;
}