.woocommerce-product-gallery {
    display: flex;
    flex-wrap: wrap;
    gap: var(--wd-gallery-gap, 10px)
}

    .woocommerce-product-gallery > * {
        flex: 1 1 100%;
        max-width: 100%
    }

    .woocommerce-product-gallery img {
        width: 100%;
        border-radius: var(--wd-brd-radius)
    }

    .woocommerce-product-gallery .wd-carousel-inner {
        margin: 0
    }

    .woocommerce-product-gallery .wd-carousel {
        --wd-gap: var(--wd-gallery-gap, 10px);
        padding: 0;
        border-radius: var(--wd-brd-radius)
    }

    .woocommerce-product-gallery .wd-nav-arrows.wd-pos-sep {
        --wd-arrow-offset-h: calc(var(--wd-arrow-width, var(--wd-arrow-size, 50px)) / -1)
    }

    .woocommerce-product-gallery .wd-nav-pagin-wrap {
        position: absolute;
        inset-inline: 15px;
        bottom: 15px;
        z-index: 2
    }

    .woocommerce-product-gallery .woocommerce-product-gallery__image {
        position: relative;
        overflow: hidden;
        border-radius: var(--wd-brd-radius)
    }

    .woocommerce-product-gallery.image-action-none .wd-carousel-item figure a {
        cursor: default;
        pointer-events: none
    }

    .woocommerce-product-gallery .zoomImg[src$=".png"] {
        background-color: var(--wd-main-bgcolor);
        backface-visibility: hidden;
        -webkit-backface-visibility: hidden
    }

    .woocommerce-product-gallery .wd-carousel-wrap[style*="grabbing"] .zoomImg {
        opacity: 0 !important;
        transition: opacity .25s ease
    }

.wd-gallery-thumb .wd-carousel-item {
    cursor: pointer;
    transition: opacity .25s ease
}

.wd-gallery-thumb :is(.wd-carousel-item:hover,.wd-thumb-active,.wd-carousel:not(.wd-initialized) .wd-carousel-item:first-child) {
    opacity: .5
}

.woocommerce-product-gallery:not(.wd-has-thumb) .wd-gallery-thumb {
    display: none
}

.woocommerce-product-gallery .wd-carousel[data-center_mode="yes"] .wd-carousel-wrap:not([style]) {
    transform: translate3d(calc(50% - (100% / var(--wd-col)) * 1.5), 0, 0)
}

.rtl .woocommerce-product-gallery .wd-carousel[data-center_mode="yes"] .wd-carousel-wrap:not([style]) {
    transform: translate3d(calc(-50% + (100% / var(--wd-col)) * 1.5), 0, 0)
}

.woocommerce-product-gallery .wd-carousel[data-center_mode="yes"] .wd-carousel-wrap:not([style]) .wd-carousel-item:first-child:last-child {
    margin-inline-start: auto
}

.product-additional-galleries {
    position: absolute;
    bottom: 0;
    inset-inline-start: 0;
    z-index: 3;
    display: flex;
    align-items: flex-start;
    flex-direction: column;
    gap: 10px;
    padding: 15px;
    transition: all .3s ease
}

.wd-action-btn.wd-style-icon-bg-text {
    --icon-bg-size: 50px;
    --action-btn-color: var(--color-gray-600);
    --action-btn-hover-color: var(--color-gray-800)
}

    .wd-action-btn.wd-style-icon-bg-text > a {
        flex-wrap: nowrap;
        overflow: hidden;
        min-width: var(--icon-bg-size);
        height: var(--icon-bg-size);
        border-radius: 30px;
        background-color: var(--bgcolor-white);
        box-shadow: 0 0 5px rgba(0,0,0,0.08)
    }

        .wd-action-btn.wd-style-icon-bg-text > a:before {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            width: var(--icon-bg-size);
            height: var(--icon-bg-size);
            font-size: calc(var(--icon-bg-size) / 2.7)
        }

        .wd-action-btn.wd-style-icon-bg-text > a > span {
            overflow: hidden;
            max-width: 0;
            white-space: nowrap;
            font-size: 90%;
            font-weight: 600;
            color:black;
            transition: padding 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.15),max-width 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.15)
        }

        .wd-action-btn.wd-style-icon-bg-text > a:hover > span {
            padding-inline-end: calc(var(--icon-bg-size) / 2);
            max-width: 280px
        }

.product-360-button > a:before {
    content: "\f102"
}

.wd-show-product-gallery-wrap > a:before {
    content: "\f127"
}

.wd-play-icon > a:before {
    content: "\f101"
}

.product-360-view-wrapper {
    --wd-popup-width: 700px
}

    .product-360-view-wrapper.wd-popup {
        --wd-popup-padding: .001px;
        background-color: transparent
    }

.woocommerce-product-gallery .product-labels {
    inset-inline-start: auto;
    z-index: 10;
    align-items: flex-end;
    max-width: 30%
}

    .woocommerce-product-gallery .product-labels.labels-rectangular {
        inset-inline: auto 0
    }

    .woocommerce-product-gallery .product-labels[class*="labels-rounded"] {
        top: 15px;
        inset-inline-end: 15px
    }

    .woocommerce-product-gallery .product-labels.labels-rounded .product-label {
        min-width: 55px;
        min-height: 55px
    }

    .woocommerce-product-gallery .product-labels.labels-rounded .label-with-img {
        min-height: auto
    }

@media (min-width: 1025px) {
    [style*="col-lg:auto"] .wd-carousel-item {
        flex: 0 0 auto;
        max-width: unset
    }

    .wd-builder-on :is(.thumbs-grid-bottom_grid,.thumbs-grid-bottom_column) .wd-carousel {
        --wd-col: var(--wd-col-lg) !important
    }
}

@media (max-width: 1024px) {
    .wd-action-btn.wd-style-icon-bg-text {
        --icon-bg-size: 40px
    }
}

@media (max-width: 768.98px) {
    [style*="col-sm:auto"] .wd-carousel-item {
        flex: 0 0 auto;
        max-width: unset
    }

    .wd-builder-on :is(.thumbs-grid-bottom_grid,.thumbs-grid-bottom_column) .wd-carousel {
        --wd-col: var(--wd-col-sm) !important
    }
}

@media (max-width: 576px) {
    .woocommerce-product-gallery .product-labels[class*="labels-rounded"] {
        top: 10px;
        inset-inline-end: 10px
    }

    .woocommerce-product-gallery .product-labels.labels-rounded .product-label {
        min-width: 40px;
        min-height: 40px
    }

    .woocommerce-product-gallery .product-labels.labels-rounded .label-with-img {
        min-height: auto
    }
}

@media (min-width: 769px) and (max-width: 1024px) {
    [style*="col-md:auto"] .wd-carousel-item {
        flex: 0 0 auto;
        max-width: unset
    }

    .wd-builder-on :is(.thumbs-grid-bottom_grid,.thumbs-grid-bottom_column) .wd-carousel {
        --wd-col: var(--wd-col-md) !important
    }
}