/*
Theme Name: Hello Elementor Child
Description: Child theme for Hello Elementor
Author: Mohammad Danish
Template: hello-elementor
Version: 1.0.0
Text Domain: hello-elementor-child
*/


.wc-swiper-gallery {
    max-width: 100%;
}

.wc-main-swiper img {
    width: 100%;
    cursor: zoom-in;
    border-radius: 12px;
}

.wc-thumb-swiper {
    margin-top: 12px;
}

.wc-thumb-swiper img {
    opacity: 0.6;
    cursor: pointer;
    border-radius: 8px;
}

.wc-thumb-swiper .swiper-slide-thumb-active img {
    opacity: 1;
    border: 2px solid #000;
}

/* Lightbox */
.wc-lightbox {
    position: fixed;
    inset: 0;
    z-index: 9999;
}

.wc-lightbox-overlay {
    position: absolute;
    inset: 0;
    background: rgba(0,0,0,0.8);
}

.wc-lightbox-inner {
    position: relative;
    max-width: 90%;
    margin: 40px auto;
    z-index: 10;
}

.wc-lightbox-main img {
    width: 100%;
    border-radius: 12px;
}

.wc-lightbox-thumbs {
    margin-top: 15px;
}

.wc-lightbox-thumbs img {
    border-radius: 8px;
    opacity: 0.6;
}

.wc-lightbox-thumbs .swiper-slide-thumb-active img {
    opacity: 1;
    border: 2px solid #fff;
}

.wc-lightbox-close {
    position: absolute;
    top: -40px;
    right: 0;
    color: #fff;
    font-size: 32px;
    cursor: pointer;
}

.wc-main-swiper .swiper-slide img.wc-main-image {
    height: 350px;
    width: auto;
    max-width: 100%;
    margin: 0 auto;
}
.wc-main-swiper .swiper-slide {
    text-align: center;
}
.wc-lightbox .wc-lightbox-main img {
    max-height: 70vh;
    width: auto;
    max-width: 100%;
    margin: 0 auto;
}
.wc-lightbox .wc-lightbox-main  .swiper-slide {
    text-align: center;
}


.wc-lightbox .swiper-button-next,
.wc-lightbox .swiper-button-prev {
    color: #fff;
}

.wc-lightbox .swiper-button-next::after,
.wc-lightbox .swiper-button-prev::after {
    font-size: 28px;
}

.wc-lightbox .swiper-button-prev {
    left: 10px;
}

.wc-lightbox .swiper-button-next {
    right: 10px;
}

.elementor-element.gro-product-item-btns {
    position: absolute;
    bottom: 0;
}

.e-loop-item.product {
    padding-bottom: 60px;
}