/* Product Gallery-only additions. Core widget styles live in core.css. */

/* Product video gallery integration */
.woocustom-product-gallery {
    --woocustom-gallery-video-play-size: 56px;
    --woocustom-gallery-video-play-bg: rgba(15, 23, 42, .78);
    --woocustom-gallery-video-play-color: #fff;
}

.woocustom-product-gallery-media-wrap {
    position: relative;
    display: block;
    width: 100%;
    height: 100%;
    line-height: 0;
}

.woocustom-product-gallery-thumb .woocustom-product-gallery-media-wrap,
.woocustom-product-gallery-mobile-slide .woocustom-product-gallery-media-wrap {
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    border-radius: inherit;
}

.woocustom-product-gallery-media-wrap--video img {
    filter: saturate(.96) contrast(.98);
}

.woocustom-product-gallery-video-play {
    position: absolute;
    inset: 50% auto auto 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: var(--woocustom-gallery-video-play-size, 56px);
    height: var(--woocustom-gallery-video-play-size, 56px);
    border-radius: 999px;
    background: var(--woocustom-gallery-video-play-bg, rgba(15, 23, 42, .78));
    color: var(--woocustom-gallery-video-play-color, #fff);
    transform: translate(-50%, -50%);
    box-shadow: 0 14px 34px rgba(15, 23, 42, .24);
    pointer-events: none;
}

.woocustom-product-gallery-video-play svg {
    width: 44%;
    height: 44%;
    margin-left: -2px;
    color: currentColor;
}

.woocustom-product-gallery-video-play path {
    fill: currentColor;
    stroke: currentColor;
    stroke-width: 1.4;
    stroke-linejoin: round;
}

.woocustom-product-gallery-thumb .woocustom-product-gallery-video-play,
.woocustom-product-gallery-mobile-slide .woocustom-product-gallery-video-play {
    width: 34px;
    height: 34px;
    box-shadow: 0 8px 20px rgba(15, 23, 42, .22);
}

.woocustom-product-gallery-lightbox-video {
    display: none;
    width: min(100%, 1060px);
    aspect-ratio: 16 / 9;
    max-height: calc(100vh - 170px);
    border-radius: var(--woocustom-lightbox-image-radius, 14px);
    overflow: hidden;
    background: #020617;
}

.woocustom-product-gallery-lightbox-video iframe,
.woocustom-product-gallery-lightbox-video video {
    display: block;
    width: 100%;
    height: 100%;
    border: 0;
    background: #020617;
}

@media (max-width: 767px) {
    .woocustom-product-gallery-video-play {
        width: 46px;
        height: 46px;
    }

    .woocustom-product-gallery-thumb .woocustom-product-gallery-video-play,
    .woocustom-product-gallery-mobile-slide .woocustom-product-gallery-video-play {
        width: 32px;
        height: 32px;
    }

    .woocustom-product-gallery-lightbox-video {
        max-height: calc(100vh - 156px);
    }
}