.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 .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 {
--wd-action-icon-size: 18px;
--wd-action-color: var(--color-gray-600);
--wd-action-color-hover: var(--color-gray-800)}
.wd-action-btn.wd-style-icon-bg-text>a {
flex-wrap:nowrap;
overflow:hidden;
min-width:calc(var(--wd-action-icon-size) * 2.8);
height:calc(var(--wd-action-icon-size) * 2.8);
border-radius:calc(var(--wd-action-icon-size) * 2);
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:calc(var(--wd-action-icon-size) * 2.8);
height:calc(var(--wd-action-icon-size) * 2.8)}
.wd-action-btn.wd-style-icon-bg-text>a>span {
overflow:hidden;
max-width:0;
white-space:nowrap;
font-size:90%;
font-weight:600;
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(--wd-action-icon-size) * 1.4);
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.image-action-zoom .wd-carousel-item figure a:last-child,.woocommerce-product-gallery.image-action-none .wd-carousel-item figure a {
cursor:default;
pointer-events:none}
.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 {
--wd-action-icon-size: 16px}
}
@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}
}