:root {
    --color-primary: #2C3F5D;
    --color-secondary: #AE0B23;
    --color-primary100: #9BA8BD;
    --color-secondary100: #EA2340;
    --color-gray: #777777;
    --background-color: #f4f4f4;
    --text-color: #333;
    --gray: #F3F3F3;

    --primary-font: "IRANSansX", sans-serif;
    --secondary-font: "Kalameh", serif;
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html,
body {
    overflow-x: hidden;
}

p {
    margin-top: 0;
    margin-bottom: 0
}

a{
    text-decoration: none;
    color: var(--color-primary);
}

/* iransans font */
@font-face {
    font-family: IRANSansX;
    font-style: normal;
    font-weight: 300;
    src: url('../fonts/woff/IRANSansX/IRANSansXFaNum-Light.woff') format('woff'),
        url('../fonts/woff2/IRANSansX/IRANSansXFaNum-Light.woff2') format('woff2');
}

@font-face {
    font-family: IRANSansX;
    font-style: normal;
    font-weight: 500;
    src: url('../fonts/woff/IRANSansX/IRANSansXFaNum-Medium.woff') format('woff'),
        url('../fonts/woff2/IRANSansX/IRANSansXFaNum-Medium.woff2') format('woff2');
}


@font-face {
    font-family: IRANSansX;
    font-style: normal;
    font-weight: 800;
    src: url('../fonts/woff/IRANSansX/IRANSansXFaNum-ExtraBold.woff') format('woff'),
        url('../fonts/woff2/IRANSansX/IRANSansXFaNum-ExtraBold.woff2') format('woff2');
}


@font-face {
    font-family: IRANSansX;
    font-style: normal;
    font-weight: bold;
    src: url('../fonts/woff/IRANSansX/IRANSansXFaNum-Bold.woff') format('woff'),
        url('../fonts/woff2/IRANSansX/IRANSansXFaNum-Bold.woff2') format('woff2');
}

@font-face {
    font-family: IRANSansX;
    font-style: normal;
    font-weight: normal;
    src: url('../fonts/woff/IRANSansX/IRANSansXFaNum-Regular.woff') format('woff'),
        url('../fonts/woff2/IRANSansX/IRANSansXFaNum-Regular.woff2') format('woff2');
}
/* iransans font */

/* kalameh font */
@font-face {
    font-family: "Kalameh";
    font-style: normal;
    font-weight: 300;
    src: url('../fonts/woff/kalameh/Kalameh-Light.woff') format('woff'),
        url('../fonts/woff2/kalameh/Kalameh-Light.woff2') format('woff2');
}

@font-face {
    font-family: "Kalameh";
    font-style: normal;
    font-weight: 500;
    src: url('../fonts/woff/kalameh/Kalameh-Medium.woff') format('woff'),
        url('../fonts/woff2/kalameh/Kalameh-Medium.woff2') format('woff2');
}


@font-face {
    font-family: "Kalameh";
    font-style: normal;
    font-weight: 800;
    src: url('../fonts/woff/kalameh/Kalameh-ExtraBold.woff') format('woff'),
        url('../fonts/woff2/kalameh/Kalameh-ExtraBold.woff2') format('woff2');
}


@font-face {
    font-family: "Kalameh";
    font-style: normal;
    font-weight: bold;
    src: url('../fonts/woff/kalameh/Kalameh-Bold.woff') format('woff'),
        url('../fonts/woff2/kalameh/Kalameh-Bold.woff2') format('woff2');
}

@font-face {
    font-family: "Kalameh";
    font-style: normal;
    font-weight: normal;
    src: url('../fonts/woff/kalameh/Kalameh-Regular.woff') format('woff'),
        url('../fonts/woff2/kalameh/Kalameh-Regular.woff2') format('woff2');
}
/* kalameh font */


body {
    font-family: IRANSansX;
}

/* header style */

.main-header {
    box-shadow: 0px 0px 10px #00000061;
}

.rounded-tab {
    --r: 15px;
    /* line-height: 1.8;
    padding-inline: .5em; */
    border-inline: var(--r) solid #0000;
    border-radius: calc(2*var(--r)) calc(2*var(--r)) 0 0/var(--r);
    mask:
        radial-gradient(var(--r) at var(--r) 0, #0000 94%, #000 100%) calc(-1*var(--r)) 99%/99% var(--r) repeat-x,
        conic-gradient(#000 0 0) padding-box;
    background: #bd5532 border-box;
    width: fit-content;
    -webkit-filter: drop-shadow(1px 1px 4px rgba(0, 0, 0, 0.75));
    -moz-filter: drop-shadow(1px 1px 4px rgba(0, 0, 0, 0.75));
    -ms-filter: drop-shadow(1px 1px 4px rgba(0, 0, 0, 0.75));
    -o-filter: drop-shadow(1px 1px 4px rgba(0, 0, 0, 0.75));
}


.menu-item-with-icon:before {
    font-family: 'dashicons';
    content: attr(data-icon);
    margin-left: 10px;
}

.select-icon .dashicons {
    cursor: pointer;
    transition: background-color 0.3s, transform 0.2s;
}

.select-icon .dashicons:hover {
    background-color: #0073aa;
    color: #fff;
    transform: scale(1.1);
}

#close-dashicon-popup {
    background-color: #0073aa;
    color: #fff;
    border: none;
    padding: 10px;
    border-radius: 4px;
    cursor: pointer;
}

#close-dashicon-popup:hover {
    background-color: #005a8d;
}

.htmega-menu-container ul li {
    display: flex !important;
    position: relative;
    align-items: center;
    gap: 14px;
}

ul.htmega-megamenu {
    gap: 32px;
}

/* archive page wordpress */
.archive-page{
    padding: 40px 0;
}

.custom-breadcrumbs{
    color: #474747;
    font-size: 15px;
    font-weight: 600;
    line-height: 30px;
}

.custom-breadcrumbs a{
    color: #929292;
    font-size: 15px;
    font-weight: 600;
    line-height: 30px;
}
/* archive page wordpress */

/* استایل برای منو */
.mega-menu-item {
    position: relative;
}

.mega-menu-item .mega-menu-template {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    z-index: 9999;
    background: #fff;
    box-shadow: 0 10px 15px rgba(0, 0, 0, 0.1);
    padding: 20px;
}

/* استایل هاور برای نمایش مگا منو */
.mega-menu-item:hover .mega-menu-template {
    display: block;
}

/* برای نمایش مگا منو با کلیک، می‌توان از کلاس‌های جاوا اسکریپت استفاده کرد */
.mega-menu-item.active .mega-menu-template {
    display: block;
}


/*    */

.ht-mega-menu {
    direction: rtl;
}

.ht-mega-menu .submenu {
    left: auto;
    right: 0;
}

.ht-mega-menu li {
    text-align: right;
}


.ht-mega-menu .submenu {
    left: auto;
    right: 0;
}

.buttom-box-curve {
    position: relative;
    display: inline-block;
    width: 200px;
    height: 200px;
    overflow: hidden;
    transition: filter 0.4s ease-in-out;
}

.shape {
    --r: 20px;
    --s: 70px;
    --a: 60deg;

    background: #fff;
    border-radius: var(--r);
    --_m: 100% / calc(2 * var(--r)) var(--r) no-repeat radial-gradient(50% 100% at top, #000 calc(100% - 1px), #0000);
    --_d: (var(--s) + var(--r)) * cos(var(--a));
    mask: calc(50% + var(--_d)) var(--_m), calc(50% - var(--_d)) var(--_m),
        radial-gradient(var(--s) at 50% calc(100% + sin(var(--a)) * var(--s)),
            #0000 100%,
            #000 calc(100% + 1px)) 0 calc(var(--r) * (sin(var(--a)) - 1)) no-repeat,
        linear-gradient(90deg,
            #000 calc(50% - var(--_d)),
            #0000 0 calc(50% + var(--_d)),
            #000 0);
    width: 100%;
    height: 100%;
}

.buttom-box-curve:hover {
    filter: drop-shadow(0px 0px 15px rgba(203, 213, 230, 0.4));
}

.buttom-box-curve .elementor-icon svg {
    transition: all 0.4s ease-in-out;
}

.buttom-box-curve:hover .elementor-icon svg {
    fill: #fff;
    background-color: var(--color-secondary100);
    border-radius: 50%;
    padding: 10px;
}

.buttom-box-curve::after {
    content: '';
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 80px;
    height: 80px;
    background: url('../images/shape.svg') no-repeat center / contain;
    opacity: 0;
    z-index: -1;
    transition: all 0.4s ease-in-out;
}

.buttom-box-curve:hover::after {
    top: 55px;
    opacity: 1;
}

.inner-curve-footer {
    --r: 30px;
    --s: 120px;
    --a: 60deg;

    border-radius: var(--r);
    --_m: 0/calc(2*var(--r)) var(--r) no-repeat radial-gradient(50% 100% at bottom, #000 calc(100% - 1px), #0000);
    --_d: (var(--s) + var(--r))*cos(var(--a));
    mask:
        calc(50% + var(--_d)) var(--_m), calc(50% - var(--_d)) var(--_m),
        radial-gradient(var(--s) at 50% calc(-1*sin(var(--a))*var(--s)),
            #0000 100%, #000 calc(100% + 1px)) 0 calc(var(--r)*(1 - sin(var(--a)))) no-repeat,
        linear-gradient(90deg, #000 calc(50% - var(--_d)), #0000 0 calc(50% + var(--_d)), #000 0);
}


.inner-curve-footer {
    position: relative;
}

.inner-curve-footer::after {
    content: '';
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 80px;
    height: 80px;
    background: url('../images/footer-shape.svg') no-repeat center / contain;
    opacity: 0;
    z-index: -1;
    transition: all 0.4s ease-in-out;
}

.highli-sider-left::before {
    content: " ";
    position: absolute;
    top: 0;
    width: 150px;
    left: 0;
    height: -webkit-fill-available;
    z-index: 3;
    background: linear-gradient(270deg, rgba(247, 248, 248, 0) 0%, rgba(247, 248, 248, 0.8827906162464986) 60%, rgba(255, 255, 255, 1) 100%);
}

.highli-sider-right::after {
    content: " ";
    position: absolute;
    top: 0;
    width: 150px;
    height: -webkit-fill-available;
    right: -10px;
    z-index: 1;
    background: linear-gradient(90deg, rgba(247, 248, 248, 0) 0%, rgba(247, 248, 248, 0.8827906162464986) 60%, rgba(255, 255, 255, 1) 100%);
}

.blog-box-curve {
    position: relative;
    display: inline-block;
    width: 200px;
    height: 200px;
    overflow: hidden;
    transition: filter 0.4s ease-in-out;
    filter: drop-shadow(0px 0px 15px rgba(203, 213, 230, 0.4));
}

.blog-shape {
    --r: 35px;
    --s: 80px;
    --a: 60deg;

    background: #fff;
    border-radius: var(--r);
    --_m: 100% / calc(2 * var(--r)) var(--r) no-repeat radial-gradient(50% 100% at top, #000 calc(100% - 1px), #0000);
    --_d: (var(--s) + var(--r)) * cos(var(--a));
    mask: calc(50% + var(--_d)) var(--_m), calc(50% - var(--_d)) var(--_m),
        radial-gradient(var(--s) at 50% calc(100% + sin(var(--a)) * var(--s)),
            #0000 100%,
            #000 calc(100% + 1px)) 0 calc(var(--r) * (sin(var(--a)) - 1)) no-repeat,
        linear-gradient(90deg,
            #000 calc(50% - var(--_d)),
            #0000 0 calc(50% + var(--_d)),
            #000 0);
    width: 100%;
    height: 100%;
    position: relative;
}

.blog-box-curve .e-con-inner::before {
    content: '';
    position: absolute;
    bottom: 5px;
    left: 50%;
    width: 80px;
    height: 80px;
    transform: translateX(-50%);
    background: #F3F3F3;
    border-radius: 50%;
    z-index: -1;
}


.blog-box-curve::after {
    content: '';
    position: absolute;
    bottom: 50%;
    left: 50%;
    width: 85px;
    height: 85px;
    transform: translateX(-50%);
    border-bottom: 1px solid var(--color-secondary100);
    border-radius: 50px;
    z-index: -2;
    transition: bottom 0.4s ease;
}

.blog-box-curve:hover::after {
    bottom: 0;
}

.blog-box-curve:hover .elementor-button-text{
    color: var(--color-secondary100);
}

.blog-box-curve:hover .elementor-button-icon path{
    stroke: var(--color-secondary100);
}

/* تبلت (پیش‌فرض المنتور: حداکثر عرض 1024px) */
@media (max-width: 1024px) {}

/* موبایل (پیش‌فرض المنتور: حداکثر عرض 768px) */
@media (max-width: 768px) {
    .buttom-box-curve {
        filter: drop-shadow(0px 0px 15px rgba(203, 213, 230, 0.4));
    }

    .buttom-box-curve::after {
        top: 55px;
        opacity: 1;
    }

    .buttom-box-curve .elementor-icon svg {
        fill: #fff;
        background-color: var(--color-secondary100);
        border-radius: 50%;
        padding: 10px;
    }

    .woocommerce #customer_login img{
        position: absolute;
        z-index: -1;
        top: -20px;
    }
}


.download-box {
    background:
        linear-gradient(180deg, rgba(44, 63, 93, 0.9) 0%, rgba(44, 63, 93, 0.4) 73.25%, rgba(44, 63, 93, 0) 100%),
        url('http://localhost/online-shop/wp-content/uploads/2025/01/14f09bd5cc91d5e5def5d7f79178a4cd.png') lightgray -119px 20px / 242.7% 104% no-repeat,
        linear-gradient(180deg, #2C3F5D 0%, #23324A 100%);
    background-blend-mode: normal, normal, overlay;
    height: 100%;
    width: 100%;
}

.testimonial-box-curve {
    position: relative;
    display: inline-block;
    width: 200px;
    height: 200px;
    overflow: hidden;
    transition: filter 0.4s ease-in-out;
    filter: drop-shadow(0px 0px 15px rgba(203, 213, 230, 0.4));
}

.herman-testimonial {
    position: relative;
    display: inline-block;
    width: 200px;
    height: 200px;
    overflow: hidden;
    transition: filter 0.4s ease-in-out;
    filter: drop-shadow(0px 0px 15px rgba(203, 213, 230, 0.4));
}

.herman-testimonial .swiper-slide {
    padding-top: 15px !important;
    background: unset;
}

.herman-testimonial .swiper-slide::before {
    position: absolute;
    content: '';
    top: 0;
    left: 50px;
    width: 38px;
    height: 30px;
    background-image: url('../images/testimonial.svg');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    z-index: 1;
}

.herman-testimonial .elementor-testimonial {
    padding: 24px 24px 30px 24px;
}

.herman-testimonial.elementor-testimonial--layout-image_right .elementor-testimonial__footer {
    padding-inline-start: 0px;
}

.herman-testimonial .swiper-slide {
    position: relative;
    display: inline-block;
    overflow: hidden;
    transition: filter 0.4s ease-in-out;
}

.herman-testimonial .swiper-slide .elementor-testimonial {
    --r: 24px;
    --s: 80px;
    --a: 60deg;

    background: #fff;
    border-radius: var(--r);
    --_m: 100% / calc(2 * var(--r)) var(--r) no-repeat radial-gradient(50% 100% at top, #000 calc(100% - 1px), #0000);
    --_d: (var(--s) + var(--r)) * cos(var(--a));
    mask: calc(50% + var(--_d)) var(--_m), calc(50% - var(--_d)) var(--_m),
        radial-gradient(var(--s) at 50% calc(100% + sin(var(--a)) * var(--s)),
            #0000 100%,
            #000 calc(100% + 1px)) 0 calc(var(--r) * (sin(var(--a)) - 1)) no-repeat,
        linear-gradient(90deg,
            #000 calc(50% - var(--_d)),
            #0000 0 calc(50% + var(--_d)),
            #000 0);
    width: 100%;
    height: 100%;
    position: relative;
    overflow: hidden;
}

.herman-testimonial .swiper-slide::after {
    content: '';
    position: absolute;
    bottom: 25%;
    left: 50%;
    width: 85px;
    height: 85px;
    transform: translateX(-40%);
    border: 1px solid var(--color-secondary100);
    border-radius: 50px;
    z-index: -2;
    transition: bottom 0.4s ease;
}

.extra-item {
    height: 80px;
    width: 80px;
    background: #F3F3F3;
    position: absolute;
    left: calc(50% - 30px);
    border-radius: 50%;
    bottom: 5px;
    z-index: -1;
}

.herman-testimonial .swiper-slide:hover::after {
    bottom: 0;
}

.header-with-icon-widget .header-title.center .header-line {
    flex-grow: 1;
    margin: 0 10px;
}

.herman-testimonial.elementor-testimonial--skin-bubble .elementor-testimonial__content:after {
    display: none;
}

.herman-testimonial.elementor-testimonial--skin-bubble .elementor-testimonial__content {
    background-color: transparent;
}

.herman-testimonial .elementor-testimonial__footer {
    justify-content: center !important;
}

.herman-testimonial .elementor-testimonial__image {
    position: relative;
}

.herman-testimonial.elementor-widget-testimonial-carousel .swiper-slide {
    padding: unset;
    padding-left: 20px !important;
}

.herman-testimonial .elementor-testimonial__image:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 50px;
    height: 50px;
    background-image: url('../images/Group 38.png');
    background-size: cover;
    background-position: center;
    z-index: -1;
    transform: scale(1.5);
}

.herman-testimonial .elementor-testimonial__image:after {
    content: '';
    position: absolute;
    bottom: -5px;
    right: -5px;
    width: 20px;
    height: 20px;
    background-image: url('../images/person.svg');
    background-size: 12px 12px;
    background-position: center;
    background-repeat: no-repeat;
    z-index: 0;
    background-color: var(--color-secondary100);
    border-radius: 50%;
}

.swiper-container {
    box-sizing: border-box;
}

.thumbs-vertical-slider {
    overflow: hidden;
}

.main-vertical-slider {
    width: 70%;
    height: 220px;
    overflow: hidden;
}

.thumbs-vertical-slider {
    width: 30%;
    height: 220px;
}

.main-vertical-slider .swiper-slide {
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 20px;
    font-weight: bold;
    height: 220px;
    width: 100% !important;
}

.thumbs-vertical-slider .swiper-slide {
    display: flex;
    font-size: 16px;
    font-weight: bold;
    cursor: pointer;
    padding: 10px 24px;
    justify-content: center;
    gap: 10px;
    flex-shrink: 0;
    border-radius: 50px;
    background: #F3F3F3;
    width: calc(100% - 20px) !important;
    transition: all 0.4s ease-in-out;
}

.thumbs-vertical-slider .swiper-slide:hover {
    background-color: var(--color-secondary100);
    margin-right: 20px;
}
.thumbs-vertical-slider .swiper-slide:hover h4{
    color: #fff;
}

.thumbs-vertical-slider .swiper-slide .icon-wrapper {
    opacity: 0; 
    position: relative;
    transition: opacity 0.4s ease-in-out; 
}

.thumbs-vertical-slider .swiper-slide:hover .icon-wrapper {
    opacity: 1; 
}

.thumbs-vertical-slider .swiper-slide .icon-wrapper {
    display: flex;
    align-items: center;
    margin-right: 6px;
}

.thumbs-vertical-slider .swiper-slide .icon-wrapper .line1{
    width: 19px;
    height: 9px;
    border-top-left-radius: 100px;
    border-top-right-radius: 100px;
    border: 1px solid #ffffff71;
    border-bottom: 0;
    transform: rotate(90deg);
}

.thumbs-vertical-slider .swiper-slide .icon-wrapper .line2{
    width: 20px;
    height: 10px;
    border-top-left-radius: 100px;
    border-top-right-radius: 100px;
    border: 1px solid #fff;
    border-bottom: 0;
    transform: rotate(90deg);
}

.thumbs-vertical-slider .swiper-slide .icon-wrapper .line2,
.thumbs-vertical-slider .swiper-slide .icon-wrapper .icon{
    margin-right: -8px;
}

.thumbs-vertical-slider .swiper-slide .icon-wrapper .icon{
    color: #FFF;
}

.thumbs-vertical-slider .swiper-slide h4{
    color: #777;
    font-size: 15px;
    font-weight: 400;
    letter-spacing: -0.45px;
    display: flex;
    align-items: center;
    margin-bottom: 0;
}

.thumbs-vertical-slider .swiper-slide .icon-wrapper{
    display: none !important;
}

.thumbs-vertical-slider .swiper-slide.swiper-slide-active .icon-wrapper{
    display: flex !important;
}

/* wishlist style */
.empty-wishlist{
    display: flex;
    justify-content: center;
    flex-direction: column;
    height: 420px;
    align-items: center;
    gap: 10px;
    font-family: var(--primary-font);
    font-size: 15px;
    color: #777;
    line-height: 27px;
}

.herman-wishlist {
    position: absolute;
    top:20px;
    right:20px;
    width: 25px;
    height: 25px;
    z-index: 99;
}

.custom-wishlist {
    display: grid;
    grid-template-columns: repeat(3, 1fr); 
    gap: 20px;
    padding: 0;
}

.custom-wishlist .wishlist-shape{
    position: relative;
    display: inline-block;
    overflow: hidden;
    filter: drop-shadow(0px 0px 15px rgba(203, 213, 230, 0.4));
}

.custom-wishlist .remove-from-wishlist{
    cursor: pointer;
}

.custom-wishlist .wishlist-shape::after{
    content: '';
    position: absolute;
    bottom: 5px;
    left: 50%;
    width: 80px;
    height: 80px;
    transform: translateX(-50%);
    background: #DADADA;
    border-radius: 50%;
    z-index: -1;
}

.custom-wishlist .wishlist-item {
    --r: 24px;
    --s: 90px;
    --a: 60deg;

    background: #fff;
    border-radius: var(--r);
    --_m: 100% / calc(2 * var(--r)) var(--r) no-repeat radial-gradient(50% 100% at top, #000 calc(100% - 1px), #0000);
    --_d: (var(--s) + var(--r)) * cos(var(--a));
    mask: calc(50% + var(--_d)) var(--_m), calc(50% - var(--_d)) var(--_m),
        radial-gradient(var(--s) at 50% calc(100% + sin(var(--a)) * var(--s)),
            #0000 100%,
            #000 calc(100% + 1px)) 0 calc(var(--r) * (sin(var(--a)) - 1)) no-repeat,
        linear-gradient(90deg,
            #000 calc(50% - var(--_d)),
            #0000 0 calc(50% + var(--_d)),
            #000 0);
    width: 100%;
    height: 100%;
    padding: 20px;
    display: flex;
    gap: 22px;
    align-items: center;
}

.custom-wishlist .wishlist-item .image-box {
    width: 30%;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}

.custom-wishlist .wishlist-item .image-box img{
    position: absolute;
    width: 100px;
    height: 100px;
    object-fit: contain;
}

.custom-wishlist .wishlist-item .info {
    width: 70%;
}

.custom-wishlist .wishlist-item .info .title {
    font-family: var(--secondary-font);
    font-weight: 700;
    font-size: 15px;
    color: var(--color-primary);
    margin-bottom: 24px;
}

.custom-wishlist .wishlist-item .info .detail {
    display: flex;
    gap: 12px;
}

@media screen and (max-width: 768px) {
    .custom-wishlist {
        grid-template-columns: repeat(2, 1fr); 
    }
}

@media screen and (max-width: 480px) {
    .custom-wishlist {
        grid-template-columns: repeat(1, 1fr); 
    }
}
/* wishlist style */

/* login and register */
.woocommerce #customer_login{
    display: flex;
    justify-content: center;
    left: 0;
    right: 0;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
}
.woocommerce #customer_login img{
    position: absolute;
    z-index: -1;
    top: -80px;
}

.woocommerce #customer_login h2{
    color: var(--color-primary);
    text-align: right;
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 32px; 
    font-family: 'kalameh','IRANSansX';
    margin-bottom: 16px;
}

.woocommerce #customer_login .text{
    color: var(--GRAY, #777);
    font-size: 15px;
    font-style: normal;
    font-weight: 400;
    line-height: 180%;
    margin-bottom: 20px;
}

.woocommerce #customer_login .woocommerce-form-row .input-icon {
    position: absolute;
    left: 15px;
    top: 50%;
    transform: translateY(-50%);
    z-index: 1;
}

.woocommerce #customer_login .woocommerce-form-row.woocommerce-form-row--wide.form-row.form-row-wide {
    position: relative;
}
.woocommerce #customer_login .woocommerce-form-row.woocommerce-form-row--wide.form-row.form-row-wide input{
    border-radius: 12px;
    font-size: 14px;
    font-weight: 400;
    line-height: 28px;
    height: 50px;
    background: #FFF;
    position: relative;
    outline: none; 
    border: none;
    padding: 11px 16px 11px 40px;
    text-align: right;
}

.woocommerce #customer_login .password-input .show-password-input{
    display: none;
}

.woocommerce #customer_login .woocommerce-form-row .toggle-password {
    position: absolute;
    left: 15px;
    top: 50%;
    transform: translateY(-50%);
    padding: 0;
}

.woocommerce form .form-row{
    padding: 0px;
}

.woocommerce #customer_login .woocommerce-form__label.woocommerce-form__label-for-checkbox.woocommerce-form-login__rememberme{
    display: flex;
    align-items: center;
    gap: 8px;
}

.woocommerce #customer_login .woocommerce-form__label.woocommerce-form__label-for-checkbox.woocommerce-form-login__rememberme span{
    color: #929292;
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 26px; 
}

.woocommerce #customer_login .woocommerce-form__label-for-checkbox.woocommerce-form-login__rememberme input {
    width: 20px;
    height: 20px !important;
    border-radius: 5px !important;
    border: 1px solid #C9C9C9 !important;
    background: #FFF;
    box-shadow: 0px 0px 20px 0px rgba(76, 86, 134, 0.07);
}

.woocommerce #customer_login .woocommerce-LostPassword.lost_password{
    text-align: left;
}

.woocommerce #customer_login .woocommerce-LostPassword.lost_password a{
    color: var(--color-secondary100);
    font-size: 12px;
    font-weight: 600;
    line-height: 24px; 
    text-decoration: underline;
}

.woocommerce #customer_login .custom-register-message{
    color: #929292;
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 26px; 
    letter-spacing: -0.39px;
    margin-bottom: 5px;
}

.woocommerce #customer_login .custom-register-message .register-btn{
    color: var(--color-secondary100);
    font-size: 13px;
    font-weight: 600;
    line-height: 24px; 
    text-decoration: underline;
    border: none;
    background: transparent;
}

.woocommerce #customer_login .woocommerce-form-login__submit,
.woocommerce #customer_login .woocommerce-form-register__submit{
    border-radius: 12px;
    background: var(--color-secondary100);
    display: inline-flex;
    padding: 8px 44px;
    justify-content: center;
    align-items: center;
    color: #F5F6F7;
    line-height: 32px;
}

.woocommerce #customer_login .back-to-home{
    padding-right: 35px;
    padding-top: 10px;
}

.woocommerce #customer_login .back-to-home a{
    color: #fff;
    font-size: 13px;
    font-style: normal;
    font-weight: 600;
    line-height: 26px; 
    
}

.herman-login-register .herman-login,
#customer_login .herman-register{
    padding: 32px;
    background: var(--gray);
    border-radius: 24px;
}

body.woocommerce-account.logged-out header,
body.woocommerce-account.logged-out footer {
    display: none;
}

@media (max-width: 768px) {
    .woocommerce #customer_login img{
        position: absolute;
        z-index: -1;
        top: -20px;
    }
}
/* end login register */

/* woocommerce */
.herman-woocommerce{
    padding: 40px 0;
}

.woocommerce-breadcrumb{
    padding: 40px 0 !important;
    margin-bottom: 0 !important;
}

.top-archive-product .woocommerce-page-title{
    display: inline-flex;
    align-items: center;
    flex-direction: column;
    white-space: nowrap;
    font-weight: 800;
    font-size: 20px;
    gap: 8px;
}

.top-archive-product{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    gap: 20px;
    padding-bottom: 24px;
}
.top-archive-product .woocommerce-ordering{
    float: none;
}

.separator-line {
    border: 0;
    border-top: 1px solid #CBD5E6; 
    width: 100%; 
}

.woocommerce-ordering .orderby:focus{
    border: none;
}
.woocommerce-ordering .orderby{
    display: flex;
    padding: 5px 14px;
    justify-content: flex-end;
    align-items: center;
    gap: 3px;
    border-radius: 12px;
    background: #F7F7F7;
    border: none;
}

.all-product{
    grid-template-columns: repeat(4, 1fr);
    display: grid;
    gap: 24px;
    padding-right: 0;
    list-style-type: none;    
}

.product-archive-container {
    position: relative;
    transition: filter 0.4s ease-in-out;
    filter: drop-shadow(0px 0px 15px rgba(203, 213, 230, 0.4));
}

.product-archive-container:hover .shape .product-bottom .add-to-cart a {
    background: var(--color-secondary100);
    box-shadow: 0px 0px 9px 0px var(--color-secondary100);    
}

.product-archive-container .shape {
    --r: 35px;
    --s: 80px;
    --a: 60deg;

    background: #fff;
    border-radius: var(--r);
    --_m: 100% / calc(2 * var(--r)) var(--r) no-repeat radial-gradient(50% 100% at top, #000 calc(100% - 1px), #0000);
    --_d: (var(--s) + var(--r)) * cos(var(--a));
    mask: calc(50% + var(--_d)) var(--_m), calc(50% - var(--_d)) var(--_m),
        radial-gradient(var(--s) at 50% calc(100% + sin(var(--a)) * var(--s)),
            #0000 100%,
            #000 calc(100% + 1px)) 0 calc(var(--r) * (sin(var(--a)) - 1)) no-repeat,
        linear-gradient(90deg,
            #000 calc(50% - var(--_d)),
            #0000 0 calc(50% + var(--_d)),
            #000 0);
    width: 100%;
    height: 100%;
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 32px 16px;
}

.product-archive-container::before{
    content: '';
    position: absolute;
    bottom: 5px;
    left: 50%;
    width: 80px;
    height: 80px;
    transform: translateX(-50%);
    background: #F3F3F3;
    border-radius: 50%;
    z-index: -1;
}

.product-archive-container::after{
    content: '';
    position: absolute;
    bottom: 50%;
    left: 50%;
    width: 85px;
    height: 85px;
    transform: translateX(-50%);
    border-bottom: 1px solid var(--color-secondary100);
    border-radius: 50px;
    z-index: -2;
    transition: bottom 0.4s ease;
}

.product-archive-container:hover::after {
    bottom: 0; 
}

.product-thumbnail {
    position: relative;
    width: auto; 
    height: 120px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%; 
}

.product-thumbnail svg{
    width: 100%;
}


.product-thumbnail img {
    position: absolute;
    width: 100px;
    height: 100px;
    object-fit: contain; 
}


.product-archive-container .shape .title {
    color: var(--color-primary);
    font-size: 15px;
    font-weight: 700;
}

.product-archive-container .shape .product-bottom .add-to-cart a {
    display: flex;
    align-items: center;
    border-radius: 50%;
    background: #D5D5D5;
    justify-content: center;
    width: 38px;
    height: 38px;
    transition: all 0.3s ease-in-out;
}

.product-archive-container .shape .product-bottom .add-to-cart .add_to_cart_button {
    color: #FFF;
    font-size: 16px;
    font-weight: 600;
    line-height: normal;
}

.product-archive-container .shape .product-bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.product-archive-container .shape .carousel.slide {
    width: 30%;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.product-archive-container .shape .product-info {
    width: 70%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 30px;
}

.carousel-attr .carousel .carousel-item {
    width: 100px;
    height: 80px;
    object-fit: contain;
    object-position: center;
}

.product-archive-container .carousel .carousel-thumbnails{
    display: flex;
}

.product-archive-container .carousel .carousel-thumbnails .item{
    position: relative;
}

.product-archive-container .product-price .price {
    display: flex;
    flex-direction: column;
}

.product-archive-container .product-price .price .old-price {
    color: var(--color-primary100);
    font-size: 14px;
    font-weight: 400;
    text-decoration: line-through;
    direction: ltr;
}

.product-archive-container .product-price .price .old-price .discount {
    font-size: 14px;
    direction: ltr;
    background: var(--color-secondary100);
    color: #fff;
    padding: 0 5px;
    border-radius: 6px;
    margin-right: 5px;
}

.product-archive-container .product-price .price .new-price {
    display: flex;
    gap: 4px;
    color: var(--color-primary);
    font-size: 15px;
    font-weight: 500;
    text-decoration: none;
}

.product-archive-container .product-price .price .new-price label {
    color: var(--color-primary100);
    font-size: 14px;
    font-weight: 400;
    line-height: 28px;
}

.product-archive-container .ribbon {
    --f: .5em;
    --r: .8em;

    position: absolute;
    left: 30px;
    top: calc(-1*var(--f));
    background: var(--color-secondary100);
    border-left: var(--f) solid #0005;
    border-bottom: var(--r) solid #0000;
    clip-path: polygon(var(--f) 0, 100% 0, 100% 100%, calc(50% + var(--f)/2) calc(100% - var(--r)), var(--f) 100%, var(--f) var(--f), 0 var(--f));
    z-index: 2;
    font-size: 13px;
    border-top-left-radius: 10px;
    border-top-right-radius: 6px;
    padding: 8px 3px;
    /* width: 28px; */
    display: flex;
    justify-content: center;
    font-weight: bold;
    color: #fff;
}

.archive-with-sidebar{
    display: flex;
}

/* woocommerce pagination */
.woocommerce nav.woocommerce-pagination ul{
    border: none;
}

.woocommerce nav.woocommerce-pagination ul li{
    border-left: none;
}

.woocommerce nav.woocommerce-pagination ul li a, .woocommerce nav.woocommerce-pagination ul li span{
    height: 50px;
    width: 50px;
    display: flex;
    justify-content: center;
    align-items: center;
    color: var(--color-gray);
}

.woocommerce nav.woocommerce-pagination ul li a:focus, .woocommerce nav.woocommerce-pagination ul li a:hover, .woocommerce nav.woocommerce-pagination ul li span.current{
    background-color: var(--color-secondary100);
    border-radius: 50%;
    color: #fff;
}

.woocommerce nav.woocommerce-pagination .prev:hover path,
.woocommerce nav.woocommerce-pagination .next:hover path{
    stroke: #fff;
}
/* end woocommerce pagination */

/* widget search */
.widget.widget_search form{
    border-radius: 50px;
    background: #FFF;
    box-shadow: 0px 0px 15px 0px rgba(203, 213, 230, 0.40);
}
.widget.widget_search .wp-block-search__input{
    border: none;
    border-radius: 50px;
    font-family: inherit;
}

.widget.widget_search .wp-block-search__inside-wrapper{
    height: 64px;
    padding: 16px;
    border: none;
}

.widget.widget_search .wp-block-search__input:focus{
    outline: none;
}

.widget_search .wp-block-search__button.has-icon.wp-element-button{
    margin-right: 0;
    border: none;
    background: transparent;
    border-right: 1px solid #C9C9C9;
}

.widget_search .wp-block-search__button svg{
    height: unset;
    min-height: auto;
    min-width: auto;
    width: unset;
    fill: none;
    vertical-align: text-bottom;
}

.widget_search .wp-block-search__button:hover svg path{
    stroke: red;
}
/* end widget search */

/* post widget */
.widget .wp-block-latest-posts{
    padding: 16px;
    padding-top: 10px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.widget .wp-block-latest-posts li{
    display: grid;
    grid-template-columns: 0.5fr 1.5fr;
    grid-template-rows: auto auto;
    column-gap: 8px;
}

.widget .wp-block-latest-posts .wp-block-latest-posts__featured-image img{
    height: 70px;
    width: 70px;
    object-fit: contain;
    border-radius: 8px;
}

.widget .wp-block-latest-posts .wp-block-latest-posts__featured-image{
    grid-row: span 2 / span 2;
}

.widget .wp-block-latest-posts__post-excerpt{
    grid-column-start: 2;
}
.widget .wp-block-latest-posts .wp-block-latest-posts__post-title{
    color: var(--color-primary);
    font-family: var(--secondary-font);
    font-size: 14px;
    font-weight: 700;
}
.widget .wp-block-latest-posts .wp-block-latest-posts__post-excerpt{
    color: var(--color-gray);
    text-align: justify;
    font-family: var(--secondary-font);
    font-size: 13px;
    font-weight: 400;
    line-height: 22px;
    letter-spacing: -0.39px;
    margin: 0;
}
.widget .wp-block-latest-posts__post-excerpt .wp-block-latest-posts__read-more{
    display: none;
}

/* post widget */
 
@media only screen and (max-width: 767px) {
    .woocommerce ul.products li.product-archive-container.product, .woocommerce-page ul.products li.product-archive-container.product {
        width: 100% !important; 
        margin-bottom: 1.5rem; 
        margin-left: 0px !important;
    }

    .product-archive-container .shape .product-bottom .add-to-cart a{
        background: var(--color-secondary100);
        box-shadow: 0px 0px 9px 0px var(--color-secondary100);
    }

    .product-archive-container::after{
        bottom: 0;
    }

    .product-thumbnail{
        height: 220px;
    }

    .product-thumbnail img{
        width: 180px;
        height: 180px;
    }

    .top-archive-product{
        flex-wrap: wrap;
    }
} 

@media screen and (max-width: 1024px) {
    .woocommerce ul.products li.product-archive-container.product, .woocommerce-page ul.products li.product-archive-container.product {
        width: calc(50% - 12px); 
        margin-bottom: 1.5rem; 
    }

    .woocommerce ul.products li.product-archive-container.product:nth-child(odd), 
    .woocommerce-page ul.products li.product-archive-container.product:nth-child(odd) {
        margin-left: 24px; 
    }

    .woocommerce ul.products li.product-archive-container.product:nth-child(even), 
    .woocommerce-page ul.products li.product-archive-container.product:nth-child(even) {
        margin-left: 0; 
    }

    .product-archive-container .shape .product-bottom .add-to-cart a{
        background: var(--color-secondary100) !important;
        box-shadow: 0px 0px 9px 0px var(--color-secondary100);
    }

    .product-archive-container::after{
        bottom: 0;
    }

    .product-thumbnail{
        height: 220px;
    }

    .product-thumbnail img{
        width: 180px;
        height: 180px;
    }
}

@media only screen and (min-width: 1400px) {
    .woocommerce ul.products li.product-archive-container.product, .woocommerce-page ul.products li.product-archive-container.product {
        width: calc(25% - 28px); 
        margin-bottom: 1.5rem; 
    }
}


.archive .wcapf-before-products .woocommerce-ordering,
.archive .wcapf-before-products .woocommerce-result-count{
    display: none;
}

.wcapf-range-wrapper:not(.wcapf-range-spinbox) .range-values>span {
    width: 100%;
    justify-content: space-between;
    border-radius: 8px;
    background: #F0F0F0;
}

.wcapf-filter-item input[type="checkbox"] {
    display: none !important;
}

li.wcapf-filter-option label[for^="__stock_status-outofstock-"] {
    display: none !important;
}

.woocommerce div.product form.cart .reset_variations{
    display: block;
}

.woocommerce div.product form.cart .variations{
    border-collapse: separate;
}

/* استایل‌های ابتدایی */
.wcapf-filter-item label {
    position: relative;
    display: inline-block;
    cursor: pointer;
    width: 100% !important;
}

.wcapf-filter-item label[for^="__stock_status-instock-"]:before, 
.wcapf-filter-item label[for^="product-status-on_sale"]:before{
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 44px;
    height: 24px;
    border-radius: 20px;
    background-color: #ccc; 
    transition: background-color 0.3s ease;
}

.wcapf-filter-item label[for^="__stock_status-instock-"]:after, 
.wcapf-filter-item label[for^="product-status-on_sale"]:after{
    content: "";
    position: absolute;
    left: 5px;
    top: 2px;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background-color: white;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
    transition: transform 0.3s ease;
}

.wcapf-filter-item.item-active label:before {
    background-color: var(--color-secondary100); 
}

.wcapf-filter-item.item-active label:after {
    transform: translateX(16px);
}

.best-selling-products{
    list-style-type: none;
    padding-right: 0;
}

.best-selling-products li{
    padding-bottom: 16px;
}

.sidebar-image-holder img{
    width: 70px;
    height: 70px;
    border-radius: 8px;
    object-fit: contain;
}

.best-seller-product-sidebar-text h4{
    color: var(--color-primary);
    font-size: 15px;
    font-weight: 700;
}

.best-seller-product-sidebar-text .price .woocommerce-Price-amount.amount bdi{
    display: flex;
    flex-direction: row-reverse;
    justify-content: flex-end;
    gap: 5px;
    color: var(--color-primary);
    font-size: 15px;
    font-weight: 500;
}

.best-seller-product-sidebar-text .price .woocommerce-Price-amount.amount .woocommerce-Price-currencySymbol{
    color: var(--color-primary100);
    font-size: 14px;
    font-weight: 400;
}

.widget .herman-wishlist{
    display: none;
}

.widget.widget_block{
    position: relative;
    border-radius: 24px;
    background: #FFF;
    box-shadow: 0px 0px 15px 0px rgba(203, 213, 230, 0.40);
    margin-bottom: 20px;
}

.widget.widget_block .widget-title{
    color: var(--Color-primary, #2C3F5D);
    font-size: 15px;
    font-weight: 700;
    padding: 20px 16px 26px ;
    border-bottom: 1px solid #eee;
}

.widget.widget_block .wcapf-form{
    display: flex;
    flex-direction: column;
    gap: 18px;
}

.widget.widget_block .wcapf-form,
.widget.widget_block .best-selling-products{
    padding: 16px;
}

.wcapf-reset-filters.wcapf-reset-filters-rf-2{
    position: absolute;
    top: 20px;
    z-index: 9;
    left: 15px;
}

.wcapf-btn.wcapf-btn-secondary, .wcapf-btn.wcapf-btn-secondary:focus, .wcapf-btn.wcapf-btn-secondary:hover {
    color: var(--color-secondary100) !important;
    background-color: transparent !important;
    border: none !important;
    padding: 0;
    text-decoration: underline;
    font-size: 14px;
    font-weight: 600;
}

.wcapf-filter .wcapf-filter-title .wcapf-filter-title-inner{
    color: var(--color-gray);
    font-size: 15px;
    font-weight: 500;
}

.wcapf-filter:not(:last-child){
    border-bottom: 1px solid #CBD5E6;
    padding-bottom: 25px;
    margin-bottom: 0;
}
/* end woocommerce */

/* archive wordpress */
.archive-list {
    display: grid;
    grid-template-columns: repeat(3, 1fr); 
    gap: 24px;
}

.archive-list .item{
    position: relative;
    display: inline-block;
    width: auto;
    height: auto;
    overflow: hidden;
    transition: filter 0.4s ease-in-out;
    filter: drop-shadow(0px 0px 15px rgba(203, 213, 230, 0.4));
}

.archive-list .item::before {
    content: '';
    position: absolute;
    bottom: 5px;
    left: 50%;
    width: 80px;
    height: 80px;
    transform: translateX(-50%);
    background: #F3F3F3;
    border-radius: 50%;
    z-index: -1;
}
.archive-list .item::after{
    content: '';
    position: absolute;
    bottom: 50%;
    left: 50%;
    width: 85px;
    height: 85px;
    transform: translateX(-50%);
    border-bottom: 1px solid var(--color-secondary100);
    border-radius: 50px;
    z-index: -2;
    transition: bottom 0.4s ease;
}

.archive-list .box-shape {
    --r: 35px;
    --s: 80px;
    --a: 60deg;
    background: #fff;
    border-radius: var(--r);
    --_m: 100% / calc(2* var(--r)) var(--r) no-repeat radial-gradient(50% 100% at top, #000 calc(100% - 1px), #0000);
    --_d: (var(--s) + var(--r))* cos(var(--a));
    mask: calc(50% + var(--_d)) var(--_m), calc(50% - var(--_d)) var(--_m), radial-gradient(var(--s) at 50% calc(100% + sin(var(--a))* var(--s)), #0000 100%, #000 calc(100% + 1px)) 0 calc(var(--r)*(sin(var(--a)) - 1)) no-repeat, linear-gradient(90deg, #000 calc(50% - var(--_d)), #0000 0 calc(50% + var(--_d)), #000 0);
    width: 100%;
    height: 100%;
    position: relative;
    padding: 24px 28px 24px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    justify-content: space-between;
}

.archive-list .item:hover::after {
    bottom: 0;
}

.archive-list .item:hover .read-more span,
.archive-list .item:hover .archive-list .box-shape .info .read-more a{
    color: var(--color-secondary100);
}

.archive-list .item:hover .read-more  path{
    stroke: var(--color-secondary100);
}

.archive-list .box-shape .icon {
    display: flex;
    width: 48px;
    height: 48px;
    justify-content: center;
    align-items: center;
    border-radius: 50px;
    background: var(--color-secondary100);
}

.archive-list .box-shape .title{
    color: var(--color-primary);
    font-size: 15px;
    font-weight: 700;
    font-family: var(--secondary-font);
    line-height: 28px;
}

.archive-list .box-shape .decription{
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 3; 
    line-clamp: 3; 
    -webkit-box-orient: vertical;
    color: #8D8D8D;
    text-align: justify;
    font-family: var(--primary-font);
    font-size: 15px;
    font-weight: 400;
    line-height: 27px; 
    letter-spacing: -0.45px;
}

.archive-list .box-shape .info{
    display: flex;
    justify-content: space-between;
}

.archive-list .box-shape .info .author{
    display: flex;
    gap: 5px;
}

.archive-list .box-shape .info .author{
    color: var(--color-primary);
    font-family: var(--primary-font);
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 28px; 
    letter-spacing: -0.42px;
}

.archive-list .box-shape .info .author svg{
    display: flex;
    width: 20px;
    height: 20px;
    padding-top: 2px;
    justify-content: center;
    align-items: center;
}

.archive-list .box-shape .info .read-more a{
    color: #8D8D8D;
    font-family: var(--secondary-font);
    font-size: 16px;
    font-weight: 600;
}

.archive-page .title-box{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    gap: 20px;
    padding-bottom: 22px;
    padding-top: 40px;
}

.archive-page .title-box .archive-title{
    white-space: nowrap;
    font-weight: 800;
    font-size: 20px;
    font-family: var(--secondary-font);
    color: var(--color-primary);
}

.archive-page .title-box .archive-title svg{
    display: block;
    margin:  10px auto 0;
}

@media only screen and (max-width: 1024px) {
    .archive-list {
        grid-template-columns: repeat(2, 1fr); 
    }
}

@media only screen and (max-width: 767px) {
    .archive-list {
        grid-template-columns: 1fr; 
        padding: 0 10px;
    }
    .archive-list .item::after {
        bottom: 0; 
    }

    .archive-list .item .read-more span,
    .archive-list .item .archive-list .box-shape .info .read-more a{
        color: var(--color-secondary100);
    }
}

.archive-pagination .navigation.pagination{
    justify-content: center;
}

.archive-pagination .navigation.pagination .nav-links{
    display: flex;
}

.archive-pagination .navigation.pagination .nav-links .page-numbers{
    height: 50px;
    width: 50px;
    display: flex;
    justify-content: center;
    align-items: center;
    color: var(--color-gray);
}

.archive-pagination .navigation.pagination .nav-links .page-numbers:hover,
.archive-pagination .navigation.pagination .nav-links .page-numbers.current{

    background-color: var(--color-secondary100);
    border-radius: 50%;
    color: #fff;
}

.archive-pagination .navigation.pagination .nav-links .page-numbers:hover path{
    stroke: #fff;
}
/* archive wordpress */

/* single wordpress */
.single-post .container{
    padding: 40px 10px 0;
}
.single-post .title{
    color:var(--color-primary);
    font-family: var(--secondary-font);
    font-size: 20px;
    font-weight: 700;
}
.single-post .info .vr{
    height: 24px;
    align-self: auto;
}

.single-post .detail .share,
.single-product .share{
    background-color: var(--color-secondary100);
    border-radius: 50%;
    display: flex;
    justify-items: center;
    align-items: center;
    width: 52px;
    height: 52px;
    justify-content: center;
}

.single-post .post-thumbnail img{
    width: 100%;
    border-radius: 24px;
    max-height: 430px;
    object-fit: cover;
    margin-bottom: 32px;
}

.single-post .post-content{
    color: var(--color-gray);
    text-align: justify;
    font-family: var(--primary-font);
    font-size: 15px;
    font-weight: 400;
    line-height: 27px; 
    letter-spacing: -0.45px;
}

.single-post blockquote {
    position: relative;
    padding: 50px 60px 80px;
    background: #F3F3F3;
    border-radius: 24px;
}

.single-post blockquote::before,
.single-post blockquote::after {
    font-family: "bootstrap-icons"; 
    font-weight: 900;
    font-size: 2rem;
    color: var(--color-secondary100);
    position: absolute;
}

.single-post blockquote::before {
    content: "\F6B0";
    top: 28px;
    right: 28px;
    rotate: 180deg;
}

.single-post blockquote::after {
    content: "\F6B0"; 
    bottom: 28px;
    left: 28px;
}

.single-post .post-content img{
    border-radius: 24px;
}

.single-post .post-content ul{
    padding-right: 0.5rem;
    list-style: none;
}

.single-post .post-content ul li{
    background-color: #eee;
    border-radius: 50px;
    width: fit-content;
    padding: 8px 25px 8px 30px;
    margin-bottom: 18px;
    position: relative;
}

.single-post .post-content ul li::before {
    content: "\F272"; 
    font-family: "bootstrap-icons"; 
    position: absolute;
    right: -10px;
    top: 50%;
    transform: translateY(-50%);
    width: 26px;
    height: 26px;
    border-radius: 50%;
    background-color: var(--color-secondary100);
    color: white; 
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
}

.single-post .post-content ol {
    list-style: none; 
    counter-reset: list-counter;
    padding-right: 0;
}

.single-post .post-content ol li {
    counter-increment: list-counter;
    position: relative;
    padding-right: 40px; 
    margin-bottom: 16px;
}

.single-post .post-content ol li::before {
    content: counter(list-counter);
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 26px;
    height: 26px;
    border: 1px solid var(--color-secondary100);
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
}

.single-post .post-categories,
.single-post .post-tags{
    display: flex;
    gap: 8px;
}

.single-post .post-categories,
.single-post .post-tags{
    color: var(--color-gray);
    font-family: var(--primary-font);
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: 28px; 
}

.single-post .post-categories .all-category a{
    color:  #929292;
    font-family: var(--primary-font);
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: 28px; 
}

.single-post .post-tags{
    padding: 0;
    margin: 0;
    list-style-type: none;
    display: flex;
    gap: 10px;
    align-items: center;
}

.single-post .post-tags li{
    padding: 10px 20px;
    background-color: #f3f3f3;
    border-radius: 7px;
}

.single-post .post-tags li:hover{
    background-color: var(--color-secondary100);
    border-radius: 7px;
}
.single-post .post-tags li:hover a{
    color: #fff;
}

.single-post .share .info span{
    color: var(--color-gray);
    font-family: var(--primary-font);
    font-size: 15px;
    font-style: normal;
    font-weight: 600;
    line-height: 30px;
}

.single-post .share .link {
    display: flex;
    gap: 18px;
}
.single-post .share .link svg {
    transition: fill 3s ease;
}
.single-post .share .link svg path{
    fill: var(--color-gray);
}

.single-post .share .link svg:hover path{
    fill: var(--color-secondary100);
}

.single-post .share {
    position: relative;
    display: inline-block;
    cursor: pointer;
}

.single-post .share-popup,
.single-product .share-popup {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    background: #222;
    padding: 10px;
    border-radius: 8px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.2);
    z-index: 1000;
    width: 100px;
}

.single-post .share-popup a ,
.single-product .share-popup a {
    display: block;
    color: white;
    text-decoration: none;
    padding: 5px 0;
}

.single-post .share-popup a:hover ,
.single-product .share-popup a:hover {
    color: #1da1f2;
}

@media (max-width: 768px) {
    .single-post .title{
        text-align: center;
        line-height: 27px;
        margin-bottom: 20px;
    }

    .single-post .detail{
        justify-content: space-evenly !important;
    }

    .single-post .detail .info {
        display: grid !important;
        grid-template-columns: repeat(2, 1fr);
        justify-items: start;
    }
    
    .single-post .detail .info .vr{
        display: none;
    }
}

.center-dvider{
    display: flex;
    align-items: center;
}
.center-dvider .dvider{
    flex-grow: 1;
    height: 1px;
    background-color: #CBD5E6;
}

.center-dvider .content{
    margin: 0 60px;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.center-dvider .content .title{
    color: var(--color-primary);
    font-family: var(--secondary-font);
    font-size: 20px;
    font-weight: 800;
}

.related-posts .show-all-btn{
    background-color: #D5D5D5;
    padding: 10px 24px;
    margin: 20px auto;
    width: fit-content;
    border-radius: 40px;
    display: flex;
    gap: 12px;
    align-items: center;
    color: #fff;
    font-family: var(--secondary-font);
    transition: all 1s;
}

.related-posts .show-all-btn:hover{
    background-color: var(--color-secondary100);
}

/* sidebar single blog */
.sidebar-single-blog .wp-block-image img{
    width: 100%;
}

.wp-block-tnp-minimal p{
    color: var(--color-primary);
    font-family: var(--secondary-font);
    font-size: 15px;
    font-weight: 700;
}

.wp-block-tnp-minimal .tnp-subscription-minimal{
    margin-top: 20px;
}

.wp-block-tnp-minimal .tnp-email{
    text-align: right !important;
    margin-right: 0px !important;
    margin-left: 10px;
    border: none !important;
    border-radius: 50px !important;
    background: #F3F3F3 !important;
}

.wp-block-tnp-minimal .tnp-email:focus{
    outline: none !important;
}

.wp-block-tnp-minimal .tnp-submit{
    border-radius: 40px !important;
    background: var(--color-secondary100) !important;
    box-shadow: 0px 0px 9px 0px var(--color-secondary100);
    border: none !important;
}

@media (max-width: 525px) {
    .tnp-subscription-minimal input.tnp-email{
        width: 100% !important;
        margin-bottom: 10px;
        margin-left: 0 !important;
    }

    .tnp-subscription-minimal input.tnp-submit{
        width: 92% !important;
        margin: 0 auto !important;
    }
}

.sidebar-single-blog .containerUserRate{
    padding: 18px;
}

.sidebar-single-blog .containerUserRate .widgettitle{
    color: var(--color-primary);
    font-family: var(--secondary-font);
    font-size: 15px;
    font-weight: 700;
    margin-bottom: 20px;
}

.single-cat{
    padding: 0px;
}
/* sidebar single blog  /

/* comment wordpress */
.comment-list{
    list-style: none;
    padding: 0;
    border-radius: 24px;
    background: #FFF;
    box-shadow: 0px 0px 15px 0px rgba(203, 213, 230, 0.40);
}

.comment-body{
    display: flex;
    gap: 22px;
    padding: 36px;
}

.comment-body .avatar,
.woocommerce #reviews #comments ol.commentlist li img.avatar{
    border-radius: 50px;
}

.woocommerce #reviews #comments ol.commentlist li img.avatar{
    width: 75px;
    height: 75px;
    border: none;
    background-color: none;
}

.woocommerce #reviews #comments ol.commentlist li .comment-text{
    margin: 0 70px 0 0;
    border:none;
    padding:0; 
}

.comment-body .comment-content{
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.comment-body .info{
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.comment-body .info .name{
    color: var(--color-primary);
    font-family: var(--primary-font);
    font-size: 15px;
    font-weight: 700;
    line-height: 27px; 
    letter-spacing: -0.45px;
    margin-bottom: 0;
}

.comment .info .rate:has(svg){
    width: 40px;
    height: 40px;
    background-color: #F3F3F3;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 50%;

}

.comment-body .comment-content .text{
    color: var(--color-gray);
    font-family: var(--primary-font);
    font-size: 15px;
    font-weight: 400;
    line-height: 27px; 
    letter-spacing: -0.45px;
}

.comment-body .comment-content .reply{
    color: var(--color-primary);
    font-family: var(--primary-font);
    font-size: 15px;
    font-weight: 700;
    line-height: 27px; 
}

.comment-list .children{
    list-style-type: none;
}

.comment-list .children .comment-body{
    padding-top: 0;
}

.comment-list > li + .children {
    border-bottom: 1px solid #CBD5E6;
    margin-left: 36px;
    margin-right: 36px;
}

.comment-list > li:not(:has(+ .children)) {
    border-bottom: 1px solid #CBD5E6;
    margin-left: 36px;
    margin-right: 36px;
}

.comment-list > li:last-child {
    border-bottom: none;
}

.comment-respond{
    border-radius: 24px;
    background: #FFF;
    box-shadow: 0px 0px 15px 0px rgba(203, 213, 230, 0.40);
    padding: 32px !important;
}

.comment-respond .comment-form{
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    /* grid-template-rows: repeat(4, 1fr); */
    gap: 19px;
}

.comment-respond .comment-form .comment-notes,
.comment-respond .comment-form .comment-form-comment{
    grid-column: span 2 / span 2;
}

.comment-respond .comment-reply-title,
.comment-respond .comment-notes .required-field-message{
    display: none;
}

.comment-form-author,
.comment-form-email{
    position: relative;
    height: fit-content;
}

.comment-form-author label,
.comment-form-email label{
    position: absolute;
    left: 25px;
    top: 50%;
    transform: translateY(-50%);
}

.comment-form-author #author,
.comment-form-email #email,
.comment-form-comment #comment{
    width: 100%;
    border-radius: 12px;
    background: #F3F3F3;
    padding: 11px 16px 11px 50px;
    border: none;
}

.comment-form-author #author:focus,
.comment-form-email #email:focus,
.comment-form-comment #comment:focus{
    outline: none;
}

.comment-form-email #email{
    text-align: right;
}

.svg-rating input[type="radio"] {
    display: none;
}

.comment-respond .svg-rating {
    display: flex;
    align-items: center;
    gap: 5px;
}

.comment-respond .svg-rating .all-rate{
    display: flex;
    flex-direction: row;
    gap: 5px;
}

.svg-rating label:has(svg){
    background: #eee;
    border-radius: 50%;
    width: 40px;
    height: 40px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.svg-rating label svg {
    cursor: pointer;
    transition: fill 0.3s ease;
}

.woocommerce img, .woocommerce-page img {
    height: fit-content;
}

.svg-rating label:hover{
    background: var(--color-secondary100);
    border-radius: 50%;
    width: 40px;
    height: 40px;
    display: flex;
    justify-content: center;
    align-items: center;  
}

.comment-respond .form-submit{
    text-align: left;
}

.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) #respond input#submit,
.comment-respond .form-submit .submit{
    border-radius: 40px;
    background: var(--color-secondary100);
    box-shadow: 0px 0px 9px 0px var(--color-secondary100);
    color: #FFF;
    font-family: var(--secondary-font);
    font-size: 16px;
    font-weight: 600;
    border: none;
    padding: 10px 35px;
}

.logged-in .comment-respond .form-submit {
    text-align: right;
}

.woocommerce #reviews #comments h2,
.woocommerce #review_form .content h2{
    color: var(--color-primary);
    font-family: var(--secondary-font);
    font-size: 20px;
    font-weight: 800;
}

.woocommerce .star-rating{
    visibility: hidden;
}

@media only screen and (max-width: 767px) {
    .comment-respond .comment-form{
        display: flex;
        flex-direction: column;
        gap: 10px;
    }

    .comment-respond .svg-rating {
        display: flex;
        align-items: flex-start;
        gap: 5px;
        flex-direction: column;
    }
}
/* comment wordpress */

/* single wordpress */


/* single product */
.woocommerce-breadcrumb{
    color: #474747 !important;
    font-size: 15px;
    font-weight: 600;
    line-height: 30px;
}

.woocommerce-breadcrumb a{
    color: #929292;
    font-size: 15px;
    font-weight: 600;
    line-height: 30px;
}

.product .product-main-detail{
    border-radius: 24px;
    background: #FFF;
    box-shadow: -4px 0px 4px 0px rgba(0, 0, 0, 0.05), -2px 0px 4px 0px rgba(0, 0, 0, 0.05) inset;
    padding: 32px;
    display: flex;
    align-items: flex-start;
    gap: 34px;
}

.product .herman-summary{
    width: 65%;
}

.product .herman-product-images{
    width: 35%;
}

.woocommerce div.product .product_title{
    color: var(--Color-primary, #2C3F5D);
    font-family: var(--secondary-font);
    font-size: 20px;
    font-weight: 700;
    margin-bottom: 26px;
}

.woocommerce .woocommerce-product-details__short-description{
    border-radius: 20px;
    background: #F3F3F3;
    padding: 16px 18px 12px;
    color: #777;
}

.woocommerce .woocommerce-product-details__short-description h4{
    color: var(--color-gray);
    font-size: 18px;
    font-weight: 700;
    line-height: 36px;
}

.woocommerce .woocommerce-product-details__short-description,
.woocommerce .woocommerce-product-details__short-description ul li{
    font-family: var(--primary-font);
    font-size: 15px;
    font-weight: 400;
    line-height: 27px;
}

.woocommerce .woocommerce-product-details__short-description ul{
    display: flex;
    column-gap: 40px;
    row-gap: 8px;
    flex-wrap: wrap;
}

.woocommerce .woocommerce-product-details__short-description .more-info{
    display: flex;
    justify-content: space-between;
}

.woocommerce .woocommerce-product-details__short-description .more-info .category{
    max-width: 70%;
}

.woocommerce .woocommerce-product-details__short-description .more-info .category,
.woocommerce .woocommerce-product-details__short-description .more-info .sku{
    display: flex;
    align-items: center;
}

.woocommerce .woocommerce-product-details__short-description .more-info .category .product-cat,
.woocommerce .woocommerce-product-details__short-description .more-info .sku .product-sku{
    color: var(--color-gray);
    font-family: var(--secondary-font);
    font-size: 14px;
    font-weight: 600;
    line-height: 28px; 
}

.woocommerce .woocommerce-product-details__short-description .more-info .category .category-list{
    list-style-type: none;
    margin-bottom: 0;
    gap: 5px;
    padding-right: 15px;
}

.woocommerce .woocommerce-product-details__short-description .more-info .category .category-list,
.woocommerce .woocommerce-product-details__short-description .more-info .sku{
    color: var(--color-gray);
    font-size: 13px;
    font-weight: 400;
    line-height: 26px;
}

.woocommerce .woocommerce-product-details__short-description .more-info .sku{
    max-width: 30%;
    color: var(--color-primary);
    font-size: 13px;
    font-weight: 400;
    line-height: 26px;
    gap: 5px;
}

.custom-product-info{
    display: flex;
    justify-content: space-between;
    padding-top: 26px;
    padding-bottom: 33px;
    background-image: repeating-linear-gradient(90deg, #C9C9C9, #C9C9C9 8px, transparent 8px, transparent 15px, #C9C9C9 15px);
    background-size: 100% 1px;
    background-position: bottom;
    background-repeat: no-repeat;
}

.custom-product-info .carousel-attr .product-price .price {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
}

.custom-product-info .price .old-price {
    color: var(--color-primary100);
    font-size: 14px;
    font-weight: 400;
    text-decoration: line-through;
    direction: ltr;
}

.custom-product-info .price .discount {
    font-size: 14px;
    direction: ltr;
    background: var(--color-secondary100);
    color: #fff;
    padding: 0 5px;
    border-radius: 6px;
    margin-right: 5px;
}

.custom-product-info .price .new-price {
    display: flex;
    gap: 4px;
    color: var(--color-primary);
    font-size: 15px;
    font-weight: 500;
    text-decoration: none;
}

.custom-product-info .price .new-price label {
    color: var(--color-primary100);
    font-size: 14px;
    font-weight: 400;
    line-height: 28px;
}

.custom-product-info .left-info{
    display: flex;
    gap:17px;
    align-items: center;
}

.custom-product-info .left-info .product-comments{
    color: var(--color-gray);
    font-family: var(--primary-font);
    font-size: 14px;
    font-weight: 600;
    line-height: 28px; 
}

.custom-product-info .left-info .in-stock,
.custom-product-info .left-info .out-of-stock{
    color: var(--color-secondary100);
    text-align: center;
    font-family: var(--secondary-font);
    font-size: 16px;
    font-weight: 600;
    border-radius: 50px;
    background: #F3F3F3;
    padding: 8px 22px;
}

.woocommerce div.product form.cart div.quantity{
    border-radius: 50px;
    background: #F3F3F3;
    padding: 7px 4px;
}

.woocommerce .quantity{
    display: flex;
}

.woocommerce .quantity .qty{
    border: none;
    background: none;
    width: 3rem;
    pointer-events: none;
}

.woocommerce .quantity .qty_button.plus,
.woocommerce .quantity .qty_button.minus{
    display: flex;
    width: 32px;
    height: 32px;
    border: none;
    justify-content: center;
    align-items: center;
    border-radius: 50px;
    color: #fff;
}

.woocommerce .quantity .qty_button.plus{
    background: var(--color-secondary100);
}

.woocommerce .quantity .qty_button.minus{
    background: var(--color-gray);
}

.product-main-detail .single_add_to_cart_button{
    display: flex;
    gap: 12px;
    background-color: var(--color-secondary100);
    box-shadow: 0px 0px 9px 0px var(--color-secondary100);
    border-radius: 40px;
    padding: 10px 60px;
    color: #fff;
    border: none;
}

.product-main-detail .cart{
    display: flex;
    justify-content: flex-end;
}

.woocommerce p.stars a::before {
    content: "\e020"; /* ستاره پر */
    font-family: WooCommerce;
    color: #BBBBBB  !important; /* زرد */
    font-size: 18px; /* اندازه ستاره */
}


.woocommerce div.product .woocommerce-tabs ul.tabs li::before,
.woocommerce div.product .woocommerce-tabs ul.tabs li::after{
    display: none;
}

.woocommerce div.product .woocommerce-tabs ul.tabs{
    padding: 0;
    display: flex;
    gap: 16px;
    overflow: visible;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li{
    border-radius: 50px;
    background: #F3F3F3;
    margin: 0px;
    border:none;
    padding: 0 24px;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li.active{
    background-color: var(--color-secondary100);
    color: #fff;
}

.woocommerce div.product .woocommerce-tabs .panel{
    border-radius: 24px;
    background: #FFF;
    box-shadow: 0px 0px 15px 0px rgba(203, 213, 230, 0.40);
    padding: 32px;
    text-align: justify;
    font-size: 15px;
    font-family: var(--primary-font);
    line-height: 32px;
    color: var(--color-gray);
}

.woocommerce table.shop_attributes{
    border-top: none;
}

.woocommerce table.shop_attributes td{
    font-style: normal;
    border-bottom: none;
}

.woocommerce-product-attributes {
    width: 100%;
}

.woocommerce-product-attributes tr {
    display: flex;
    justify-content: space-between;
    margin-bottom: 24px;
}

.woocommerce-product-attributes-item {
    width: 49%; 
    display: flex;
    align-items: center;
    gap: 20px; 
    white-space: nowrap; 
    border-radius: 32px;
    background: #F3F3F3 !important;
    padding: 0 16px !important;
}

.woocommerce-product-attributes-item .woocommerce-product-attributes-item__label{
    color: var(--color-primary);
    font-family: var(--secondary-font);
    font-size: 16px;
    font-weight: 600;
}

.woocommerce-product-attributes-item .woocommerce-product-attributes-item__value{
    color: var(--color-gray);
    font-family: var(--primary-font);
    font-size: 16px;
    font-weight: 400;
    line-height: 28px; 
}

.product-tags,
.product-tags ul{
    padding: 0;
    margin: 0;
    list-style-type: none;
    display: flex;
    gap: 10px;
    align-items: center;
}

.product-tags ul li{
    padding: 5px 20px;
    background-color: #f3f3f3;
    border-radius: 7px;
}
.product-tags ul li:hover {
    background-color: var(--color-secondary100);
    border-radius: 7px;
}

.product-tags ul li:hover a{
    color: #fff;
}

.woocommerce-Tabs-panel hr{
    margin:10px 0;
}

.woocommerce-tabs.wc-tabs-wrapper{
    padding-top: 50px;
}

.woocommerce div.product .woocommerce-tabs ul.tabs{
    padding-bottom: 20px;
}

.product-share{
    position: absolute;
    left: 0;
}

.woocommerce-Tabs-panel--description p {
    margin-bottom: 20px; 
}

.woocommerce-tabs .product-cat-summery{
    display: flex;
    flex-wrap: wrap;
}

.related.products .content .title{
    color: var(--color-primary);
    font-family: var(--secondary-font);
    font-size: 20px;
    font-weight: 800;
}

@media only screen and (max-width: 767px) {
    .woocommerce-product-attributes-item {
        width: 100%; 
    }

    .woocommerce-product-attributes tr {
        flex-wrap: wrap;
        gap: 24px;
    }

    .product-tags ul {
        flex-wrap: wrap;
    }

    .comment-list > li:not(:has(+ .children)){
        margin-left: 16px;
        margin-right: 16px;
    }

    .comment-body {
        padding: 16px;
    }
}

/* related product */

.relatedSlider-section {
    position: relative;
}

.relatedSlider-section .herman-wishlist{
    display: block !important;
}

.relatedSlider-section .swiper {
    width: 100%;
    margin: 0 auto;
}

@media (min-width: 992px) {
    .relatedSlider-section .swiper .swiper-wrapper {
        display: grid;
        grid-template-columns: repeat(5, 1fr);
        gap: 28px;
    }
}

.relatedSlider-section .swiper .swiper-wrapper .cardItem {
    height: auto;
}
.relatedSlider-section .swiper .swiper-wrapper .cardItem .card__wrapper{
    height: 100%;
    width: 100%;
}

@media (max-width: 991px) {
    .relatedSlider-section .swiper-button-prev,
    .relatedSlider-section .swiper-button-next {
        display: flex;
    }

    .relatedSlider-section .swiper .swiper-wrapper {
        display: flex;
        flex-flow: row nowrap;
    }

    .relatedSlider-section .swiper .swiper-wrapper .cardItem {
        width: 100%;
        padding-left: 10px;
        padding-right: 10px;
    }
}

.relatedSlider-section .swiper .swiper-wrapper .cardItem {
    position: relative;
    transition: filter 0.4s ease-in-out;
    filter: drop-shadow(0px 0px 10px rgba(203, 213, 230, 0.4));
    margin-top: 6px;
    padding: 1px;
    overflow: visible;
    background: none;
}

.relatedSlider-section .swiper-slide:hover .shape .product-bottom .add-to-cart a {
    background: var(--color-secondary100);
    box-shadow: 0px 0px 9px 0px var(--color-secondary100);    
}

.relatedSlider-section .swiper .swiper-wrapper .cardItem .shape {
    --r: 35px;
    --s: 80px;
    --a: 60deg;
    background: #fff;
    border-radius: var(--r);
    --_m: 100% / calc(2 * var(--r)) var(--r) no-repeat radial-gradient(50% 100% at top, #000 calc(100% - 1px), #0000);
    --_d: (var(--s) + var(--r)) * cos(var(--a));
    mask: calc(50% + var(--_d)) var(--_m), calc(50% - var(--_d)) var(--_m),
        radial-gradient(var(--s) at 50% calc(100% + sin(var(--a)) * var(--s)),
            #0000 100%,
            #000 calc(100% + 1px)) 0 calc(var(--r) * (sin(var(--a)) - 1)) no-repeat,
        linear-gradient(90deg,
            #000 calc(50% - var(--_d)),
            #0000 0 calc(50% + var(--_d)),
            #000 0);
    width: 100%;
    height: 100%;
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 32px 16px;
    gap: 10px;
}

.relatedSlider-section .swiper-slide::before{
    content: '';
    position: absolute;
    bottom: 5px;
    left: 50%;
    width: 80px;
    height: 80px;
    transform: translateX(-50%);
    background: #F3F3F3;
    border-radius: 50%;
    z-index: -1;
}
.relatedSlider-section .swiper-slide::after{
    content: '';
    position: absolute;
    bottom: 50%;
    left: 50%;
    width: 85px;
    height: 85px;
    transform: translateX(-50%);
    border-bottom: 1px solid var(--color-secondary100);
    border-radius: 50px;
    z-index: -2;
    transition: bottom 0.4s ease;
}

.relatedSlider-section .swiper-slide:hover::after {
    bottom: 0; 
}

.relatedSlider-section .swiper-slide .product-thumbnail {
    position: relative;
    width: auto; 
    height: 120px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%; 
    overflow: hidden; 
    border: 3px solid transparent; 
}

.relatedSlider-section .swiper-slide .product-thumbnail svg{
    width: 100%;
}

.relatedSlider-section .swiper-slide .product-thumbnail img {
    position: absolute;
    width: 100px;
    height: 100px;
    object-fit: contain; 
}

.relatedSlider-section .swiper-slide .shape .title {
    color: var(--color-primary);
    font-size: 15px;
    font-weight: 700;
}

.relatedSlider-section .swiper-slide .shape .product-bottom .add-to-cart a {
    display: flex;
    align-items: center;
    border-radius: 50%;
    background: #D5D5D5;
    justify-content: center;
    width: 38px;
    height: 38px;
    transition: all 0.3s ease-in-out;
}

.relatedSlider-section .swiper-slide .shape .product-bottom .add-to-cart .add_to_cart_button {
    color: #FFF;
    font-size: 16px;
    font-weight: 600;
    line-height: normal;
}

.relatedSlider-section .swiper-slide .shape .product-bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.relatedSlider-section .swiper-slide .shape .product-bottom .price{
    display: flex;
    flex-direction: column;
}

.relatedSlider-section .swiper-slide .shape .product-bottom .old-price{
    color: var(--color-primary100);
    font-size: 14px;
    font-weight: 400;
    text-decoration: line-through;
}

.relatedSlider-section .swiper-slide .shape .product-bottom .new-price{
    display: flex;
    gap: 4px;
    color: var(--color-primary);
    font-size: 15px;
    font-weight: 500;
    text-decoration: none;
}
/* related product */

/* images */
.single-product .product-slider-container {
    position: relative;
}

.single-product .herman-product-images.product-slider-container{
    filter: drop-shadow(0px 0px 15px rgba(203, 213, 230, 0.4));
}

.single-product .product-slider-container .product-shape{
    --r: 24px;
    --s: 110px;
    --a: 60deg;

    background: #fff;
    border-radius: var(--r);
    --_m: 100% / calc(2 * var(--r)) var(--r) no-repeat radial-gradient(50% 100% at top, #000 calc(100% - 1px), #0000);
    --_d: (var(--s) + var(--r)) * cos(var(--a));
    mask: calc(50% + var(--_d)) var(--_m), calc(50% - var(--_d)) var(--_m),
        radial-gradient(var(--s) at 50% calc(100% + sin(var(--a)) * var(--s)),
            #0000 100%,
            #000 calc(100% + 1px)) 0 calc(var(--r) * (sin(var(--a)) - 1)) no-repeat,
        linear-gradient(90deg,
            #000 calc(50% - var(--_d)),
            #0000 0 calc(50% + var(--_d)),
            #000 0);
    width: 100%;
    height: 100%;
}

.single-product .product-image {
    width: 100%;
    height: 400px !important;
    object-fit: contain;
    cursor: pointer;
    border-radius: 10px;
    object-fit: contain;
    padding: 20px;
}

.single-product .product-thumbnails {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
    margin-top: 10px;
}

.single-product .product-thumbnails .swiper-slide {
    width: 80px !important;
    height: 80px !important;
    flex: 0 0 80px;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: 0.3s;
}

.single-product .product-thumbnails .swiper-slide img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border: 2px solid transparent;
    border-radius: 5px;
    transition: 0.3s;
    padding: 10px;
}

.single-product .product-thumbnails .swiper-slide.active-thumbnail img {
    border-color: var(--color-secondary100) !important;
}

.single-product .product-thumbnails img:hover {
    border-color: var(--color-secondary100);
}

.single-product .custom-prev,
.single-product .custom-next {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 50px;
    height: 50px;
    background: var(--color-secondary100);
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    transition: 0.3s;
    z-index: 10;
}

.single-product .custom-prev svg,
.single-product .custom-next svg {
    width: 24px;
    height: 24px;
}

.single-product .custom-prev svg path,
.single-product .custom-next svg path{
    stroke: white;
}

.single-product .custom-prev {
    left: 0;
}

.single-product .custom-next {
    right: 0;
}

.single-product .custom-prev.swiper-button-disabled,
.single-product .custom-next.swiper-button-disabled{
    background-color: var(--color-gray);
    cursor: not-allowed;
}

.single-product .lightbox {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    justify-content: center;
    align-items: center;
    z-index: 9999;
}

.single-product .blur-background {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    backdrop-filter: blur(6px);
    background: #00000070;
    z-index: 1;
}

.single-product .lightbox-overlay {
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 2;
}

.single-product .lightbox-content {
    position: relative;
    width: 80%;
    background: white;
    padding: 15px;
    border-radius: 10px;
    text-align: center;
    z-index: 3;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.single-product .lightbox img {
    max-width: 100%;
    height: 500px; 
    object-fit: contain; 
    border-radius: 10px;
}

.single-product .close-lightbox {
    position: absolute;
    bottom: -100px;
    left: 50%;
    transform: translateX(-50%);
    background: #777;
    color: white;
    border: none;
    font-size: 18px;
    border-radius: 50%;
    cursor: pointer;
    z-index: 4;
}

.single-product .lightbox-nav {
    position: absolute;
    top: 50%;
    width: 90%;
    display: flex;
    justify-content: space-between;
    z-index: 4;
    transform: translateY(-50%);
}

.single-product .lightbox-prev, 
.single-product .lightbox-next {
    font-size: 30px;
    color: white;
    cursor: pointer;
    padding: 10px;
}

/* دکمه‌های نویگیشن */
.lightbox-dots {
    display: flex;
    justify-content: center;
    margin-top: 10px;
}

.lightbox-dots span {
    width: 10px;
    height: 10px;
    margin: 0 5px;
    border-radius: 50%;
    background-color: var(--color-gray);
    cursor: pointer;
    transition: background-color 0.3s ease;
}

.lightbox-dots span.active {
    background: var(--color-secondary100);
}

.single-product .lightbox-prev, 
.single-product .lightbox-next {
    font-size: 24px;
    color: white;
    background: var(--color-secondary100);
    padding: 0;
    border-radius: 50%;
    cursor: pointer;
    transition: background 0.3s;
    width: 38px;
    height: 38px;
}

.single-product .lightbox-prev.disabled, 
.single-product .lightbox-next.disabled {
    background: var(--color-gray) !important; 
    cursor: not-allowed;
}
/* images */

.woocommerce div.product form.cart .variations select{
    width: 150px;
    border: none;
    padding: 6px 20px;
    background-color: #F3F3F3;
    border-radius: 24px;
    color: #777;
}

.woocommerce div.product form.cart .variations select:focus,
.woocommerce div.product form.cart .variations select:active{
    outline: none;
    box-shadow: none;
    border: none;
}

.woocommerce div.product form.cart .variations select {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

.single-product .herman-wishlist,
.single-product .stock.in-stock{
    display: none;
}

.woocommerce div.product form.cart{
    margin-top: 1rem;
}

.single-product .herman-summary .variations_form{
    display: block;
}

.single-product.woocommerce div.product form.cart .variations th{
    display: none;
}

.single-product.woocommerce .single_variation_wrap .woocommerce-variation.single_variation{
    display: none !important;
}

/* Style for the popup */
.size-guide-popup {
    display: none; 
    position: fixed;
    z-index: 9999;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
}

.size-guide-popup .popup-content {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background-color: #fff;
    padding: 20px;
    border-radius: 8px;
    width: 70%;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    min-height: 300px;
}

.size-guide-popup .popup-content .close-popup {
    position: absolute;
    top: -20px;
    right: -20px;
    font-size: 20px;
    cursor: pointer;
    background: var(--color-secondary100);
    height: 40px;
    width: 40px;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #fff;
}

.size-guide-popup .popup-content .size-guide-content {
    font-size: 16px;
    color: #333;
}

/* Style for the button */
.open-size-guide {
    width: 150px;
    border: none;
    padding: 10px 20px;
    background-color: #F3F3F3;
    border-radius: 24px;
    color: #777;
    height: fit-content;
}

.open-size-guide:hover {
    background-color: var(--color-secondary100);
    color: #fff;
}

@media (max-width: 768px) {
    .product .product-main-detail{
        flex-direction: column-reverse;
        padding: 20px;
    }

    .product .herman-product-images {
        width: 100%;
    }

    .product .herman-summary {
        width: 100%;
    }

    .woocommerce .woocommerce-product-details__short-description .more-info {
        flex-direction: column;
    }

    .woocommerce .woocommerce-product-details__short-description .more-info .sku,
    .woocommerce .woocommerce-product-details__short-description .more-info .category{
        max-width: 100%;
    }

    .single.single-product .var-sec {
        flex-direction: column;
    }

    .single.single-product .all-var {
        flex-direction: column-reverse;
        gap: 16px;
    }

    .open-size-guide ,
    .woocommerce div.product form.cart .variations select{
        width: 100%;
        margin: 0;
    }
}
/* single product */

/* woocommerce dashoard */
.profile-header-background{
    position: relative;
    width: 100%;
    height: 150px; 
    /* background-image: url('../images/pattern.png'); 
    background-blend-mode: soft-light; 
    background-size: cover; 
    background-position: center; 
    background-repeat: no-repeat;*/

    --r: 24px;
    --s: 150px;
    --a: 65deg;

    background: var(--color-primary);
    border-radius: var(--r);
    --_m: 100% / calc(2 * var(--r)) var(--r) no-repeat radial-gradient(50% 100% at top, #000 calc(100% - 1px), #0000);
    --_d: (var(--s) + var(--r)) * cos(var(--a));
    mask: calc(50% + var(--_d)) var(--_m), calc(50% - var(--_d)) var(--_m),
        radial-gradient(var(--s) at 50% calc(100% + sin(var(--a)) * var(--s)),
            #0000 100%,
            #000 calc(100% + 1px)) 0 calc(var(--r) * (sin(var(--a)) - 1)) no-repeat,
        linear-gradient(90deg,
            #000 calc(50% - var(--_d)),
            #0000 0 calc(50% + var(--_d)),
            #000 0);
}

.profile-header{
    position: relative;
    overflow: hidden;
}
.profile-header::after{
    content: '';
    position: absolute;
    bottom: -80px;
    left: 50%;
    width: 150px;
    height: 90px;
    transform: translateX(-50%);
    border-top: 1px solid var(--color-secondary100);
    border-radius: 100%;
}

.profile-header .user-info{
    color: #fff;
    font-family: var(--secondary-font);
}

.profile-header .user-info .user-id {
    font-family: var(--primary-font);
}

.profile-header .user-info .user-id .id{
    color: var(--color-gray);
}

.woocommerce-MyAccount-navigation-herman{
    padding: 20px;
    box-shadow: 0px 0px 15px #CBD5E666;
    border-radius: 24px;
}

.woocommerce-MyAccount-navigation-herman ul{
    padding: 0;
    margin: 0;
    list-style-type: none;
}

.woocommerce-MyAccount-navigation-herman li a { 
    width: 100%;
    position: relative; 
    display: block;
    padding: 8px 0;
    border-radius: 50px;
    transition: background 0.3s ease, margin 0.3s ease, color 0.3s ease;
    font-family: var(--secondary-font);
    color: var(--color-gray);
}

.woocommerce-MyAccount-navigation-herman li.is-active a,
.woocommerce-MyAccount-navigation-herman li:hover a { 
    background: var(--color-secondary100);
    color: #FFF;
    margin-top: 6px;
    margin-bottom: 6px;
    padding: 10px 18px;
}

.woocommerce-MyAccount-navigation-herman li { 
    border-bottom: 1px solid #CBD5E6; 
    position: relative;
    display: flex;
    align-items: center;
    padding: 3px 0;
}

.woocommerce-MyAccount-navigation-herman li:last-child { 
    border-bottom: none; 
}

.woocommerce-MyAccount-navigation-herman li::before {
    content: "";
    width: 20px;
    height: 20px;
    background: url(../images/left-arrow.svg) no-repeat center;
    background-size: contain;
    position: absolute;
    z-index: 9;
    left: 20px;
}

.woocommerce-account .main-content{
    background-color: #F3F3F3;
    border-radius: 24px;
    min-height: 450px;
    height: 100%;
}

.woocommerce-account .main-content .woocommerce-MyAccount-content{
    font-family: var(--primary-font);
    font-size: 15px;
    line-height: 28px;
    width: 100%;
    margin-bottom: 20px;
}

.woocommerce-account .main-content .woocommerce-MyAccount-content .dashboard-text{
    display: flex;
    justify-content: center;
    flex-direction: column;
    height: 420px;
    align-items: center;
    padding: 0 50px;
}

.user-notifications {
    margin-bottom: 20px;
}

.user-notifications .notification-item {
    border-radius: 20px;
    margin-bottom: 10px;
    overflow: hidden;
    transition: all 0.3s ease-in-out;
}

.user-notifications .notification-header {
    background: #fff;
    padding: 24px;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.user-notifications .notification-left-side{
    display: flex;
    gap: 10px;
    align-items: center;
}

.user-notifications .toggle-btn {
    background: #D5D5D5;
    color: white;
    border-radius: 50%;
    border: none;
    padding: 6px;
    cursor: pointer;
    width: 40px;
}

.user-notifications .message-container {
    background-color: #fff;
    padding: 0;
    height: 0;
    overflow: hidden;
    transition: all 0.3s ease-in-out;
}

.user-notifications .message-container.open {
    padding: 15px 30px;
    height: auto;
}

.user-notifications .title {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 5px;
    color: var(--color-primary);
    font-family: var(--secondary-font);
    font-size: 14px;
}

.user-notifications .message {
    margin: 0;
    opacity: 0;
    transition: opacity 0.3s ease-in-out;
}

.user-notifications .message-container.open .message {
    opacity: 1;
}

.user-notifications .date{
    background-color: var(--color-primary100);
    border-radius: 40px;
    color: #fff;
    padding: 6px 14px;
}

.empty-notifications{
    display: flex;
    justify-content: center;
    flex-direction: column;
    height: 420px;
    align-items: center;
    gap: 10px;
    font-family: var(--primary-font);
    font-size: 15px;
    color: #777;
    line-height: 27px;
}

.woocommerce-page.woocommerce-edit-account label,
.woocommerce-page.woocommerce-edit-account #account_display_name_description em{
    font-family: var(--primary-font);
    color: #777;
    font-size: 15px;
    line-height: 27px;
    display: block;
    margin-bottom: 10px;
    padding-right: 5px;
}

.woocommerce-page.woocommerce-edit-account .woocommerce-EditAccountForm.edit-account fieldset{
    margin-top: 60px;
}

.woocommerce-page.woocommerce-edit-account #account_display_name_description em{
    margin-top: 10px;
}

.woocommerce-page.woocommerce-edit-account input{
    font-family: var(--secondary-font);
    color: var(--color-primary);
    font-size: 16px;
    background-color: #fff;
    border: none;
    border-radius: 16px;
    padding: 10px;
    width: 100%;
}

.woocommerce-page.woocommerce-edit-account input:focus{
    outline: none;
}

.woocommerce-page.woocommerce-edit-account .form-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
}

.woocommerce-page.woocommerce-edit-account .form-grid .two-columns {
    grid-column: span 2; 
    display: flex;
    flex-direction: column;
}

.woocommerce-page.woocommerce-edit-account .form-grid .one-column {
    grid-column: span 1; 
}


.show-password-input {
    display: inline-block;
    width: 20px;
    height: 20px;
    background: url('../images/Icon-eye.svg') no-repeat center center;
    background-size: contain;
    left: 10px; 
    top: 50% !important;
    transform: translateY(-50%);
}

.show-password-input.display-password {
    background: url('../images/icon-eye-2.svg') no-repeat center center;
    background-size: contain;
}

.woocommerce form .show-password-input::after, .woocommerce-page form .show-password-input::after{
    display: none;
}

.woocommerce form .password-input input[type=password]::-webkit-input-placeholder, .woocommerce-page form .password-input input[type=password]::-webkit-input-placeholder{
    font-size: 16px;
    color: #D5D5D5;
}

.woocommerce-page.woocommerce-edit-account .edit-account-title,
.woocommerce-page.woocommerce-edit-account .woocommerce-EditAccountForm.edit-account fieldset legend{
    font-family: var(--secondary-font);
    font-size: 16px;
    color: var(--color-primary);
    margin-bottom: 25px;
    font-weight: 600;
}

.woocommerce-page.woocommerce-edit-account .submit-edit-account-form{
    display: flex;
    flex-direction: row;
    justify-content: flex-end;
    margin-top: 45px;
}

.woocommerce-page.woocommerce-edit-account .submit-edit-account-form .submit-btn-account-form{
    background-color: var(--color-secondary100);
    padding: 15px 25px;
    display: flex;
    box-shadow: 0px 0px 9px var(--color-secondary100);
    border-radius: 40px;
    color: #fff;
    gap: 10px;
    font-family: var(--secondary-font);
    font-size: 16px;
    align-items: center;
}

.woocommerce-page.woocommerce-edit-address .woocommerce-Address-title{
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 20px 26px;
    background-color: #fff;
    border-radius: 20px;
}

.woocommerce-page.woocommerce-edit-address .woocommerce-Address-title:hover .left-side a,
.woocommerce-page.woocommerce-edit-address .woocommerce-Address-title:hover .right-side .icon{
    background-color: var(--color-secondary100);
}

.woocommerce-page.woocommerce-edit-address .woocommerce-Address-title:hover .right-side h2{
    color: var(--color-primary);
}

.woocommerce-account .addresses .title::after, .woocommerce-account .addresses .title::before {
    display: none;
}

.woocommerce-page.woocommerce-edit-address .woocommerce-Address-title .right-side{
    display: flex;
    gap: 16px;
    align-items: center;
}

.woocommerce-page.woocommerce-edit-address .woocommerce-Address-title .right-side .icon{
    display: flex;
    height: 48px;
    width: 48px;
    background-color: #C9C9C9;
    border-radius: 50%;
    align-items: center;
    justify-content: center;
    transition: background-color 0.3s, transform 0.2s;
}

.woocommerce-page.woocommerce-edit-address .woocommerce-Address-title .right-side h2{
    font-size: 16px;
    color: var(--color-gray);
    font-family: var(--secondary-font);
}
 
.woocommerce-page.woocommerce-edit-address .woocommerce-Address-title .left-side a{
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 7px 25px;
    background-color: #D5D5D5;
    border-radius: 40px;
    color: #fff;
    transition: background-color 0.3s, transform 0.2s;
}

.woocommerce-page.woocommerce-edit-address .woocommerce-Address-title .left-side a svg{
    padding: 5px;
}

.woocommerce form .form-row label, .woocommerce-page form .form-row label{
    font-family: var(--primary-font);
    font-size: 15px;
    color: #929292;
}

.woocommerce form .form-row input.input-text{
    background-color: #fff;
    border-radius: 12px;
    color: var(--color-primary);
    font-size: 16px;
    border: none;
    padding: 10px 18px;
}

.woocommerce-page.woocommerce-edit-address h2{
    font-family: var(--secondary-font);
    font-weight: 600;
    color: var(--color-primary);
    font-size: 16px;
    margin-bottom: 26px;
}

.woocommerce-page.woocommerce-edit-address .form-row{
    margin-bottom: 16px;
}

.select2-container--default .select2-selection--single{
    height: auto;
    background-color: #fff;
    border: 1px solid #aaa;
    border-radius: 4px;
    border: none;
    border-radius: 12px;
}

.select2-container--default .select2-selection--single .select2-selection__rendered{
    line-height: 1.6;
    font-size: 16px;
    padding: 10px 18px;
    color: var(--color-primary);
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 45px;
}

.select2-container--default[dir=rtl] .select2-selection--single .select2-selection__arrow{
    left: 5px;
}

.woocommerce-page.woocommerce-edit-address .select2-dropdown{
    border: none;
}

.select2-container--default .select2-results__option--highlighted[aria-selected], 
.select2-container--default .select2-results__option--highlighted[data-selected]{
    background-color: var(--color-secondary100);
    padding:10px ;
}

.woo-edit-address {
    width: 100%;
    display: flex;
    justify-content: flex-end;
    margin-top: 32px;
}

.woo-edit-address .edit-address-button{
    display: flex;
    background-color: var(--color-secondary100);
    color: #fff;
    border-radius: 40px;
    border: none;
    align-items: center;
    gap: 8px;
    padding: 6px 26px;
}

.empty-orders{
    display: flex;
    justify-content: center;
    flex-direction: column;
    height: 420px;
    align-items: center;
    gap: 10px;
    font-family: var(--primary-font);
    font-size: 15px;
    color: #777;
    line-height: 27px;
}

.woocommerce-account .shop_table,
.woocommerce-account .shop_table td,
.woocommerce-account .shop_table th{
    border:none !important;
    text-align: center;
}

.woocommerce-account .shop_table td,
.woocommerce-account .shop_table th{
    width: 20% !important;
} 

.woocommerce-account .shop_table thead th span{
    color: var(--color-gray);
    font-weight: 500;
    font-family: var(--secondary-font);
    font-size: 16px;
}

.woocommerce-account .shop_table tbody td,
.woocommerce-account .shop_table tbody th a{
    color: var(--color-gray);
    font-weight: 400;
    font-size: 15px;
}

.woocommerce-account .shop_table .woocommerce-orders-table__cell-order-total .woocommerce-Price-amount{
    display: inline-flex;
    flex-direction: row-reverse;
    gap: 4px;
}

.woocommerce-account .woocommerce-orders-table.woocommerce-MyAccount-orders.shop_table tbody,
.woocommerce-account .woocommerce-orders-table.woocommerce-MyAccount-orders.shop_table thead{
    background-color: #fff;
    border-radius: 20px;
    padding: 22px;
    display: table;
    width: 100%;
    margin-bottom: 10px;
}

.woocommerce-account .show-order-btn{
    color: #fff !important;
    font-family: var(--secondary-font);
    font-size: 16px !important;
    width: fit-content;
    font-weight: 400 !important;
    border-radius: 40px !important;
    padding: 12px 25px !important;
}

.woocommerce-account .show-order-btn:hover{
    background-color: var(--color-secondary100) !important;
}

.woocommerce-account .show-order-btn svg{
    margin-right: 8px;
}

.empty-download{
    display: flex;
    justify-content: center;
    flex-direction: column;
    height: 420px;
    align-items: center;
    gap: 10px;
    font-family: var(--primary-font);
    font-size: 15px;
    color: #777;
    line-height: 27px;
}

.woocommerce-downloads-list{
    padding: 0;
}

.woocommerce-downloads-list .woocommerce-download-item{
    display: flex;
    justify-content: space-between;
    align-items: center;
    background-color: #fff;
    border-radius: 20px;
    padding: 23px 40px;
    list-style-type: none;
    margin-bottom: 10px;
}

.download-header {
    display: flex;
    align-items: center;
    gap: 6px;
}

.download-header .download-thumbnail{
    height: 60px;
    width: 60px;
    object-fit: contain;
}

.download-header .download-product a {
    font-family: var(--secondary-font);
    font-size: 16px;
    color:var(--color-gray);
}

.woocommerce-downloads-list .download-remaining,
.woocommerce-downloads-list .download-expires{
    display: flex;
    flex-direction: column;
    color: var(--color-primary);
    font-size: 15px;
    font-weight: 500;
}

.woocommerce-downloads-list .download-remaining strong,
.woocommerce-downloads-list .download-expires strong{
    font-size: 14px;
    color: #929292;
    font-weight: 400;
}

.download-buttons{
    display: flex;
    gap: 6px;
}

.download-buttons .woocommerce-MyAccount-product-link{
    color: #fff !important;
    border-radius: 40px !important;
    font-family: var(--secondary-font) !important;
    font-size: 16px !important;
    padding: 8px 22px !important;
    background-color: #D5D5D5 !important;
    border: 1px solid #D5D5D5 !important;
    font-weight: 500 !important;
    line-height: 26px !important;
}

.download-buttons .woocommerce-MyAccount-product-link:hover{
    background-color: var(--color-secondary100) !important;
    box-shadow: 0px 0px 9px var(--color-secondary100) !important;
    border-color: var(--color-secondary100) !important;
}

.download-buttons .woocommerce-MyAccount-downloads-file{
    color: #D5D5D5 !important;
    border-radius: 40px !important;
    font-family: var(--secondary-font);
    font-size: 16px !important;
    padding: 8px 22px !important;
    background-color: transparent !important;
    border: 1px solid #D5D5D5 !important;
    font-weight: 500 !important;
    line-height: 26px !important;
}

.download-buttons .woocommerce-MyAccount-downloads-file:hover{
    border-color: var(--color-secondary100) !important;
    color: var(--color-secondary100) !important;
    background-color: transparent !important;
}

.tankyou-page-content {
    border-radius: 24px;
    background: var(--gray);
    padding: 44px;
}

.tankyou-page-content .woocommerce-thankyou-order-received{
    color: var(--color-primary);
    text-align: right;
    font-family: var(--secondary-font);
    font-size: 20px;
    font-weight: 700;
    margin-bottom: 50px;
}

.tankyou-page-content .woocommerce-thankyou-order-details{
    list-style-type: none !important;
    padding: 0;
    display: flex;
    justify-content: space-between;
}

.vdash{
    border-right: 1px dashed #C9C9C9;
}

.woocommerce ul.order_details{
    border-radius: 24px;
    background: #FFF;
    padding: 18px;
}

.woocommerce ul.order_details li{
    margin-left: 0;
    border-left: none;
    padding-left: 0;
    color: var(--color-gray);
    font-family: var(--secondary-font);
    font-size: 16px;
    font-weight: 400;
    margin: 0;
}

.woocommerce ul.order_details li strong{
    color: var(--color-primary);
    font-family: var(--secondary-font);
    font-size: 16px;
    font-weight: 600;
    margin-top:10px;
}

.woocommerce-order-details {
    border-radius: 24px;
    background: #FFF;
    padding: 42px;
    padding-bottom: 24px;
}

.woocommerce-order-details .peyment-method-title{
    color: var(--color-primary);
    font-family: var(--secondary-font);
    font-size: 16px;
    font-weight: 700;
    line-height: 32px; 
    margin-bottom: 16px;
}

.woocommerce table.shop_table tfoot th,
.woocommerce table.shop_table tfoot td,
.woocommerce table.shop_table td{
    border-top: none;
}

.woocommerce table.shop_table{
    border: none;
}

.order-again{
    display: none;
}

.woocommerce table.shop_table thead th{
    color: var(--color-gray);
    font-family: var(--secondary-font);
    font-size: 16px;
    font-weight: 700;
    line-height: 32px; 
    padding: 6px 0;
}

.woocommerce table.shop_table tbody td{
    color: var(--color-primary);
    font-family: var(--secondary-font);
    font-size: 15px;
    font-weight: 600;
    line-height: 30px; 
    padding: 6px 0;
}

.woocommerce table.shop_table tfoot th,
.woocommerce table.shop_table tfoot td{
    color: var(--color-gray);
    font-family: var(--secondary-font);
    font-size: 15px;
    font-weight: 400;
    line-height: 30px; 
    padding: 6px 0;
}

.woocommerce-customer-details{
    border-radius: 24px;
    background: #FFF;
    padding: 26px 32px;
}

.woocommerce .woocommerce-customer-details address{
    border:none;
}

.woocommerce-customer-details{
    display: flex;
    align-items: center;
}

.woocommerce-customer-details .woocommerce-column__title{
    color: var(--color-primary);
    margin: 0;
    font-family: var(--secondary-font);
    font-size: 16px;
    font-weight: 700;
    line-height: 32px;
    width: 200px;
}

.woocommerce-customer-details address{
    color: var(--color-gray);
    font-family: var(--primary-font);
    font-size: 15px;
    font-weight: 400;
    line-height: 180%;
    letter-spacing: -0.45px;
}

.woocommerce #customer_login .back-to-home{
    float: left;
}

.back-to-home a{
    background-color: var(--color-secondary100);
    border-radius: 40px;
    height: 40px;
    box-shadow: 0px 0px 9px var(--color-secondary100);
    padding: 0px 40px;
    display: flex;
    gap: 20px;
    align-items: center;
    color: #fff !important;
    font-family: var(--secondary-font);
    font-weight: 600 !important;
    font-size: 16px !important;
    width: fit-content;
}   

.woocommerce-notices-wrapper {
    margin: 20px 0;
}

.woocommerce-info{
    border-top: none;
    border-radius: 10px;
    color: var(--GRAY, #777);
    font-family: var(--secondary-font);
    font-size: 16px;
    font-weight: 400;
}

.woocommerce-form-coupon-toggle{
    background: var(--gray);
    border-radius: 24px;
}

.woocommerce-form-coupon-toggle .woocommerce-info{
    padding: 1em 2em 1em 2em;
    font-weight: 700;
    color: #656565;
    margin-bottom: 0;
    background-color: unset;
}

.checkout_coupon.woocommerce-form-coupon{
    margin-top: 0px !important;
    border: none !important;
    display: flex;
    flex-direction: row;
    align-items: flex-end;
    justify-content: space-between;
}

.checkout_coupon.woocommerce-form-coupon input,
.checkout_coupon.woocommerce-form-coupon input::placeholder{
    font-family: var(--secondary-font);
}

.checkout_coupon.woocommerce-form-coupon input:focus{
    outline: none;
}

.woocommerce-form-coupon-toggle .woocommerce-info a{
    color: var(--color-gray);
    font-family: var(--secondary-font);
    font-size: 16px;
    font-weight: 600;
}
.woocommerce-form-coupon-toggle .woocommerce-info:before{
    display: none;
}

.woocommerce-form-coupon-toggle .apply_coupon-btn{
    float: left;
    border:none;
    border-radius: 12px;
    background: #C9C9C9;
    color: #fff;
    padding: 13px 40px;
    font-family: var(--secondary-font);
    font-size: 15px;
    font-weight: 700;
}

.woocommerce-message{
    border-top: none;
    border-radius: 10px;
    background: var(--gray);
    color: var(--GRAY, #777);
    font-family: var(--secondary-font);
    font-size: 16px;
    font-weight: 400;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.woocommerce-message:before,
.woocommerce-message:after{
    display: none;
}

.woocommerce-message .button.wc-forward{
    background-color: var(--color-secondary100);
    border-radius: 40px;
    height: 30px;
    box-shadow: 0px 0px 9px var(--color-secondary100);
    padding: 0px 30px;
    display: flex;
    align-items: center;
    color: #fff;
    font-family: var(--secondary-font);
    font-weight: 400;
    font-size: 16px;
}

.woocommerce-message .button.wc-forward:hover{
    background-color: #fff;
    color:var(--color-secondary100);
    box-shadow: none;
}

.return-to-shop a{
    background-color: var(--color-secondary100);
    border-radius: 40px;
    height: 40px;
    box-shadow: 0px 0px 9px var(--color-secondary100);
    padding: 0px 40px;
    display: flex;
    gap: 20px;
    align-items: center;
    color: #fff;
    font-family: var(--secondary-font);
    font-weight: 600;
    font-size: 16px;
    width: fit-content;
}  

.cart-page{
    display: flex;
    gap: 24px;
}

.cart-page .woocommerce-cart-form{
    width: 70%;
}

.woocommerce .cart-collaterals, .woocommerce-page .cart-collaterals{
    width: 30%;
}

.woocommerce .cart-collaterals .cart_totals, .woocommerce-page .cart-collaterals .cart_totals{
    width: 100%;
}

.cart-page .product-thumbnail{
    height: unset;
}

.cart-page .shop_table.cart{
    border-radius: 24px !important;
    background: var(--gray);
    padding: 32px;
}

.cart-page .shop_table.cart thead{
    display: none;
}

.cart-page .woocommerce-cart-form .woocommerce-cart-form__cart-item{
    border-radius: 20px;
    background: #FFF;
    padding: 18px 24px;
}

.cart-page .woocommerce-cart-form .shop_table.cart{
    border-collapse: separate; 
    border-spacing: 0 16px;
    width: 100%;
}

.cart-page .woocommerce-cart-form .shop_table.cart .woocommerce-cart-form__cart-item {
    background: #fff; 
}

.cart-page .woocommerce-cart-form .shop_table.cart .woocommerce-cart-form__cart-item td {
    padding: 15px;
    background: #fff; 
}

.cart-page .woocommerce-cart-form .shop_table.cart .woocommerce-cart-form__cart-item td:first-child {
    border-top-right-radius: 20px;
    border-bottom-right-radius: 20px;
}
.cart-page .woocommerce-cart-form .shop_table.cart .woocommerce-cart-form__cart-item td:last-child {
    border-top-left-radius: 20px;
    border-bottom-left-radius: 20px;
}
.cart-page .woocommerce-cart-form .shop_table.cart .woocommerce-cart-form__cart-item td:first-child {
    border-bottom-right-radius: 20px;
}
.cart-page .woocommerce-cart-form .shop_table.cart .woocommerce-cart-form__cart-item td:last-child {
    border-bottom-left-radius: 20px;
}

.cart-page .woocommerce-cart-form .shop_table.cart td {
    border: none;
}

.cart-page .woocommerce-cart-form .shop_table.cart .product-thumbnail img{
    width: 80px;
    height: 80px;
    position: inherit;
}

.cart-page .woocommerce-cart-form .shop_table.cart .product-name a{
    color: var(--color-primary);
    font-family: var(--secondary-font);
    font-size: 16px;
    font-weight: 600;
}

.cart-page .woocommerce-cart-form .shop_table.cart .product-price label,
.cart-page .woocommerce-cart-form .shop_table.cart .product-subtotal label{
    color: #929292;
    font-family: var(--primary-font);
    font-size: 14px;
    font-weight: 400;
    line-height: 28px; 
    letter-spacing: -0.42px;
}

.cart-page .woocommerce-cart-form .shop_table.cart .product-quantity .quantity{
    background: #F7F7F7;
    padding: 4px;
    border-radius: 50px;
    display: inline-flex;
}

.cart-page .woocommerce-cart-form .shop_table.cart .product-quantity .quantity .qty{
    color: var(--color-gray);
}

.cart-page .woocommerce-cart-form .shop_table.cart .product-price bdi,
.cart-page .woocommerce-cart-form .shop_table.cart .product-subtotal bdi{
    display: flex;
    flex-direction: row-reverse;
    justify-content: flex-end;
    gap: 4px;
    font-size: 17px;
    font-weight: 400;
    line-height: 34px;
    color: var(--color-primary);
    align-items: center;
}

.cart-page .woocommerce-cart-form .shop_table.cart .product-price bdi .woocommerce-Price-currencySymbol,
.cart-page .woocommerce-cart-form .shop_table.cart .product-subtotal bdi .woocommerce-Price-currencySymbol{
    color: #929292;
    font-family: var(--primary-font);
    font-size: 14px;
    font-weight: 400;
    line-height: 28px; 
    letter-spacing: -0.42px;
}

.cart-page .woocommerce-cart-form .product-quantity .qty_button.minus {
    background: #C9C9C9;
}

.update-cart-btn{
    display: flex !important;
    height: 40px;
    padding: 0px 26px !important;
    align-items: center;
    gap: 12px;
    border-radius: 40px !important;
    background: #D5D5D5;
    color: #FFF !important;
    font-family: var(--secondary-font);
    font-size: 16px !important;
    flex-direction: row;
    float: left !important;
}

.cart-page .cart_totals{
    border-radius: 24px;
    background: #FFF;
    box-shadow: 0px 4px 16px 0px rgba(174, 174, 174, 0.25);
    padding: 24px 20px;
}

.cart-page .cart_totals h2{
    display: none;
}

.cart-page .cart_totals td{
    text-align: left;
}

.cart-page .cart_totals .cart-discount td{
    display: flex;
    justify-content: flex-end;
    gap: 4px;
}

.cart-page .cart_totals .woocommerce-Price-amount bdi{
    display: flex;
    flex-direction: row-reverse;
    gap: 4px;
}

.cart-page .cart_totals .cart-discount .woocommerce-Price-amount{
    display: flex;
    flex-direction: row-reverse; 
    align-items: center;
}

.cart-page .cart_totals .cart-discount td,
.cart-page .cart_totals .cart-discount th{
    background-color: #F7F7F7;
    padding: 10px 22px;
    color: var(--color-primary);
    font-size: 13px;
    font-weight: 600;
    font-family: var(--primary-font);
}

.cart-page .cart_totals .cart-discount td {
    border-top-left-radius: 20px;
    border-bottom-left-radius: 20px;
}
.cart-page .cart_totals .cart-discount th {
    border-top-right-radius: 20px;
    border-bottom-right-radius: 20px;
}

.cart-page .cart_totals tbody tr td,
.cart-page .cart_totals tbody tr th{
    color: var(--color-gray);
    font-family: var(--secondary-font);
    font-size: 16px;
    font-weight: 600;
}

.woocommerce-cart .wc-proceed-to-checkout a.checkout-button{
    margin-bottom: 0;
    display: flex;
    padding: 15px 26px;
    justify-content: center;
    align-items: center;
    gap: 12px;
    border-radius: 40px;
    background: var(--color-secondary100);
    box-shadow: 0px 0px 9px 0px var(--color-secondary100);
    color: #FFF;
    font-family: var(--secondary-font);
    font-size: 16px;
    font-weight: 600;
}

.woocommerce-cart .wc-proceed-to-checkout a.checkout-button:hover{
    background-color: var(--color-secondary100);
}

.woocommerce .cart-page table.shop_table tr,
.woocommerce .cart-page table.shop_table td,
.woocommerce .cart-page table.shop_table th {
    border: none !important;
} 

.cart-page .coupon{
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: repeat(2, 1fr);
    gap: 8px;
    border-radius: 24px;
    background: var(--gray);
    padding: 22px 32px;
    grid-template-rows: auto;
}

.cart-page .coupon .coupon-label{
    grid-column: span 2 / span 2;
    color: var(--color-gray);
    font-family: var(--primary-font);
    font-size: 15px;
    font-weight: 400;
    line-height: 27px;
    letter-spacing: -0.45px;
}

.cart-page .coupon input.input-text{
    grid-row-start: 2;
    justify-self: start;
    width: 100%;
    border-radius: 16px;
    background: #FFF;
    color: var(--color-gray);
    font-family: var(--secondary-font);
    font-size: 16px;
    font-weight: 600;
    padding: 12px 18px;
    border: none;
}

.cart-page .coupon input.input-text:focus{
    outline: none;
}

.cart-page .coupon button.button{
    grid-row-start: 2;
    justify-self: end;
    border-radius: 40px;
    background: #D5D5D5;
    display: flex;
    padding: 10px 26px;
    justify-content: center;
    align-items: center;
    gap: 12px;
    color: #fff;
}

.cart-page .coupon button.button:hover{
    background-color: var(--color-secondary100);
}

.custom-mini-cart {
    position: relative;
    display: inline-block;
}

.cart-icon {
    position: relative;
    font-size: 24px;
    text-decoration: none;
    color: #333;
}

.cart-count {
    position: absolute;
    top: -8px;
    right: -8px;
    background: red;
    color: white;
    font-size: 14px;
    border-radius: 50%;
    width: 20px;
    height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.mini-cart-content {
    position: absolute;
    top: 40px;
    right: 0;
    background: white;
    border: 1px solid #ddd;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    width: 300px;
    padding: 15px;
    display: none;
    z-index: 999;
}

.custom-mini-cart:hover .mini-cart-content {
    display: block;
}

.mini-cart-spinner {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 30px;
    height: 30px;
    border: 4px solid rgba(255, 255, 255, 0.3);
    border-top: 4px solid var(--color-secondary100);
    border-radius: 50%;
    transform: translate(-50%, -50%);
}

.woocommerce-checkout .biling-section{
    border-radius: 24px;
    background: var(--gray);
    padding: 36px 24px;
    margin-bottom: 24px;
}

.woocommerce-checkout .form-row{
    margin-bottom: 20px !important;
}

.woocommerce-checkout form .form-row label, .woocommerce-checkout-page form .form-row label{
    color: var(--color-gray);
}

.woocommerce-checkout form .form-row input.input-text,
.woocommerce-checkout .select2-selection__rendered,
.woocommerce-checkout .woocommerce-input-wrapper textarea{
    font-family: var(--secondary-font);
    color: var(--color-primary);
    font-size: 16px;
    font-weight: 600 !important;
}

.woocommerce-checkout .woocommerce-additional-fields h3{
    display: none;
}

.woocommerce-checkout #payment {
    border-radius: 24px;
    background: var(--gray);
    padding: 32px 26px;
}

.woocommerce-checkout-payment .wc_payment_methods{
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 20px;
    border-bottom:none !important;
}

.woocommerce-checkout-payment .payment_methods::before,
.woocommerce-checkout-payment .payment_methods::after{
    display: none !important;
}

.woocommerce-checkout #payment div.payment_box{
    background-color: unset;
    margin-top: 0;
    color: var(--color-gray);
    font-family: var(--primary-font);
    font-size: 15px;
    font-weight: 400;
    line-height: 27px;
    letter-spacing: -0.45px;
}

.woocommerce-checkout #payment div.payment_box::before{
    display: none;
}

.woocommerce-checkout #payment ul.payment_methods li{
    display: flex;
    align-items: flex-start;
}

.woocommerce-checkout #payment div.payment_box{
    padding: 0px;
}

.woocommerce-checkout #payment ul.payment_methods li input{
    transform: scale(2);
    accent-color: var(--color-secondary100);
}

.woocommerce-checkout .payment_methods .payment_method_cod .payment-method-detail::before{
    content: url(../images/house-2.svg);
    display: block;
    height: 36px;
    width: 36px;
}

.woocommerce-checkout .payment_methods .payment_method_cheque .payment-method-detail::before{
    content: url(../images/bitcoin-card.svg);
    display: block;
    height: 36px;
    width: 36px;
}

.woocommerce-checkout .payment-method-detail {
    display: grid;
    grid-template-columns: auto 1fr;
    grid-auto-rows: auto;
    grid-auto-columns: auto;
    align-items: start;
    column-gap: 34px;
}

.woocommerce-checkout .payment-method-detail .payment_box{
    grid-column-start: 2;
}

.woocommerce-checkout #payment ul.payment_methods li input {
    margin: 10px 0 0 1em;
}

#order_review_heading{
    color: var(--color-primary);
    font-family: var(--secondary-font);
    font-size: 16px;
    font-weight: 700;
    line-height: 32px;
}

.woocommerce-checkout #payment div.form-row {
    padding: 0 !important;
}

.woocommerce-checkout .form-row.place-order{
    margin: 0 !important;
}

.woocommerce-checkout-payment .place-order button[type="submit"]{
    border-radius: 40px;
    background: var(--color-secondary100);
    box-shadow: 0px 0px 9px 0px var(--color-secondary100);
    padding: 10px 50px;
}

.woocommerce-checkout-payment .place-order button[type="submit"]:hover{
    background-color: #fff;
    color: var(--color-secondary100);
}

#order_review_heading{
    display: none;
}

.woocommerce-checkout-review-order {
    border-radius: 24px;
    background: #FFF;
    box-shadow: 0px 4px 16px 0px rgba(174, 174, 174, 0.25);
    padding: 24px 20px;
}

.woocommerce-checkout-review-order .shop_table.woocommerce-checkout-review-order-table{
    margin: 0 !important;
}

.woocommerce-checkout-review-order .shop_table.woocommerce-checkout-review-order-table thead{
    display: none;
}

.woocommerce-checkout-review-order .shop_table.woocommerce-checkout-review-order-table tbody td,
.woocommerce-checkout-review-order .shop_table.woocommerce-checkout-review-order-table tfoot th,
.woocommerce-checkout-review-order .shop_table.woocommerce-checkout-review-order-table tfoot td{
    color: var(--color-gray);
    font-family: var(--secondary-font);
    font-size: 16px;
    font-weight: 600;
}

.woocommerce-checkout-review-order .shop_table.woocommerce-checkout-review-order-table .order-total th,
.woocommerce-checkout-review-order .shop_table.woocommerce-checkout-review-order-table .order-total td{
    color: var(--Gray-Gray-500, #474747);
    font-family: var(--secondary-font);
    font-size: 16px;
    font-weight: 600;
}

@media (max-width: 768px) {
    .woocommerce-page.woocommerce-edit-account .form-grid {
        grid-template-columns: 1fr;
    }

    .woocommerce-page.woocommerce-edit-account .form-grid .two-columns {
        grid-column: 1;
    }

    .woocommerce-page.woocommerce-edit-address .woocommerce-Address-title{
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 15px;
    }

    .woocommerce-page.woocommerce-edit-address .woocommerce-Address-title .left-side a,
    .woocommerce-page.woocommerce-edit-address .woocommerce-Address-title .right-side .icon{
        background-color: var(--color-secondary100);
    }

    .woocommerce-page.woocommerce-edit-address .woocommerce-Address-title .right-side h2{
        color: var(--color-primary);
    }

    .woocommerce-page.woocommerce-edit-address .form-row-first, .woocommerce-page.woocommerce-edit-address .form-row-last {
        width: 100%;
        float: none;
        margin-right: 0;
    }

    .woocommerce-account.woocommerce-page.woocommerce-orders .main-content{
        padding: 8px !important;
    }

    .woocommerce-account .woocommerce-orders-table.woocommerce-MyAccount-orders.shop_table tbody,
    .woocommerce-account .woocommerce-orders-table.woocommerce-MyAccount-orders.shop_table thead{
        padding: 5px 0;
    }

    .woocommerce-account .shop_table td, .woocommerce-account .shop_table th{
        width: 100% !important;
    }

    .woocommerce-downloads-list .woocommerce-download-item{
        flex-direction: column;
        align-items: flex-start;
        gap: 12px;
    }

    .download-buttons{
        flex-direction: column;
        width: 100%;
        text-align: center;
    }
    .tankyou-page-content .woocommerce-thankyou-order-details{
        flex-direction: column;
        gap: 10px;
    }
    .woocommerce-downloads-list .woocommerce-download-item,
    .woocommerce-order-details,
    .tankyou-page-content{
        padding:22px
    }

    .cart-page {
        flex-direction: column;
    }
    .cart-page .woocommerce-cart-form {
        width: 100%;
    }
    .woocommerce .cart-collaterals, .woocommerce-page .cart-collaterals {
        width: 100%;
    }

    .cart-page .shop_table.cart {
        padding: 20px;
    }

    .cart-page .woocommerce-cart-form .woocommerce-cart-form__cart-item {
        padding: 0px;
    }

    .cart-page .woocommerce-cart-form .shop_table.cart .product-price label, 
    .cart-page .woocommerce-cart-form .shop_table.cart .product-subtotal label{
        display: none;
    }

    .cart-page .woocommerce-cart-form .shop_table.cart .woocommerce-cart-form__cart-item td{
        display: flex;
        flex-direction: column;
        width: fit-content;
        text-align: right !important;
    }

    .cart-page .woocommerce-cart-form .shop_table.cart .woocommerce-cart-form__cart-item td:last-child {
        border-bottom-right-radius: 20px;
    }

    .cart-page .coupon {
        display: flex;
        flex-direction: column;
    }

    .cart-page .woocommerce-cart-form .shop_table.cart tbody{
        display: flex;
        flex-direction: column;
        gap: 20px;
    }

    .woocommerce table.shop_table_responsive tr:nth-child(2n) td, .woocommerce-page table.shop_table_responsive tr:nth-child(2n) td {
        background-color: unset;
    }

    .woocommerce table.shop_table_responsive tr .product-thumbnail::before, 
    .woocommerce-page table.shop_table_responsive tr .product-thumbnail::before {
        display: none;
    }
    
    .checkout_coupon.woocommerce-form-coupon{
        flex-direction: column;
    }

    .checkout_coupon.woocommerce-form-coupon .form-row-first,
    .checkout_coupon.woocommerce-form-coupon .form-row-last{
        width: 100%;
    }

    .checkout.woocommerce-checkout .row{
        flex-direction: column-reverse;
    }

    .checkout.woocommerce-checkout .order-review{
        margin-bottom: 20px;
    }

    .woocommerce-checkout-payment .wc_payment_methods{
        grid-template-columns: 1fr;
    }

    .checkout.woocommerce-checkout .form-row.form-row-first ,
    .checkout.woocommerce-checkout .form-row.form-row-last{
        width: 100%;
    }
}

@media (max-width: 1024px) {
    .woocommerce-downloads-list .woocommerce-download-item{
        flex-direction: column;
        align-items: flex-start;
        gap: 12px;
    }

    .cart-page {
        flex-direction: column;
    }
    .cart-page .woocommerce-cart-form {
        width: 100%;
    }
    .woocommerce .cart-collaterals, .woocommerce-page .cart-collaterals {
        width: 100%;
    }

    .cart-page .woocommerce-cart-form .shop_table.cart .woocommerce-cart-form__cart-item td {
        padding: 5px;
    }
}

/* woocommerce dashoard */

/* page 404 */
.main-404 .title{
    font-family: var(--secondary-font);
    color: var(--color-primary);
    font-weight: 700;
    font-size: 20px;
    line-height: 34px;
}

.main-404 .back-to-home{
    background-color: var(--color-secondary100);
    border-radius: 40px;
    height: 40px;
    box-shadow: 0px 0px 9px var(--color-secondary100);
    padding: 0px 40px;
    display: flex;
    gap: 20px;
    align-items: center;
    color: #fff;
    font-family: var(--secondary-font);
    font-weight: 600;
    font-size: 16px;
}   

.main-404 .previous-page{
    border-radius: 40px;
    border: 1px solid var(--color-secondary100);
    height: 40px;
    padding: 0px 26px;
    display: flex;
    gap: 20px;
    align-items: center;
    color: var(--color-secondary100);
    font-family: var(--secondary-font);
    font-weight: 600;
    font-size: 16px;
    justify-content: center;
}
/* page 404 */

.htmega-menu-container .sub-menu li a {
    padding: 0px;
    border-bottom: unset;
}

.htmega-menu-container .htmega-menu-area ul li:hover>.sub-menu, 
.htmega-menu-container .htmega-menu-area ul li:hover .htmegamenu-content-wrapper {
    margin-top: 30px;
}

.main-menu-item .main-menu-link{
    display: flex;
    gap: 12px;
    align-items: center;
}

.main-menu-item .main-menu-link:hover{
    color:var(--color-secondary100)
}

.main-menu-item .main-menu-link:hover .htmenu-icon svg path{
    stroke: var(--color-secondary100);
}

ul.sub-menu.menu-odd.menu-depth-1 {
    display: flex;
    flex-direction: column;
    align-content: flex-start;
    padding: 15px;
    gap: 15px;
    border-radius: 24px;
    box-shadow: 0px 0px 20px #00000045;
    align-items: flex-start;
}

/* archive style 2 */
.cardItemColor {
    height: auto;
}
.cardItemColor .card__wrapper{
    height: 100%;
    width: 100%;
}
@media (max-width: 991px) {
    .cardItemColor {
        width: 100%;
        padding-left: 10px;
        padding-right: 10px;
    }
}
.cardItemColor {
    position: relative;
    transition: filter 0.4s ease-in-out;
    filter: drop-shadow(0px 0px 10px rgba(203, 213, 230, 0.2));
    margin-top: 6px;
    padding: 1px;
    overflow: visible;
    background: none;
}
.cardItemColor:hover .shape .product-bottom .add-to-cart a {
    background: var(--color-secondary100);
    box-shadow: 0px 0px 9px 0px var(--color-secondary100);    
}
.cardItemColor .shape {
    --r: 35px;
    --s: 80px;
    --a: 60deg;
    background: #fff;
    border-radius: var(--r);
    --_m: 100% / calc(2* var(--r)) var(--r) no-repeat radial-gradient(50% 100% at top, #000 calc(100% - 1px), #0000);
    --_d: (var(--s) + var(--r))* cos(var(--a));
    mask: calc(50% + var(--_d)) var(--_m), calc(50% - var(--_d)) var(--_m), radial-gradient(var(--s) at 50% calc(100% + sin(var(--a))* var(--s)), #0000 100%, #000 calc(100% + 1px)) 0 calc(var(--r)*(sin(var(--a)) - 1)) no-repeat, linear-gradient(90deg, #000 calc(50% - var(--_d)), #0000 0 calc(50% + var(--_d)), #000 0);
    width: 100%;
    height: 100%;
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 32px 16px;
}
.cardItemColor::before{
    content: '';
    position: absolute;
    bottom: 5px;
    left: 50%;
    width: 80px;
    height: 80px;
    transform: translateX(-50%);
    background: #F3F3F3;
    border-radius: 50%;
    z-index: -1;
}
.cardItemColor::after{
    content: '';
    position: absolute;
    bottom: 50%;
    left: 50%;
    width: 85px;
    height: 85px;
    transform: translateX(-50%);
    border-bottom: 1px solid var(--color-secondary100);
    border-radius: 50px;
    z-index: -2;
    transition: bottom 0.4s ease;
}
.cardItemColor:hover::after {
    bottom: 0; 
}
.cardItemColor .product-thumbnail {
    position: relative;
    width: auto; 
    height: 120px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%; 
    overflow: hidden; 
    border: 3px solid transparent; 
}
.cardItemColor .product-thumbnail svg{
    width: 100%;
}
.cardItemColor .product-thumbnail img {
    position: absolute;
    width: 100px;
    height: 100px;
    object-fit: contain; 
}
.cardItemColor .shape .title {
    color: var(--color-primary);
    font-size: 15px;
    font-weight: 700;
    text-align: right;
}
.cardItemColor .shape .product-bottom .add-to-cart a {
    display: flex;
    align-items: center;
    border-radius: 24px;
    background: #D5D5D5;
    justify-content: center;
    transition: all 0.3s ease-in-out;
    gap: 8px;
}
.cardItemColor .shape .product-bottom .add-to-cart svg{
    height: 25px;
}

.cardItemColor .shape .product-bottom .add-to-cart .add_to_cart_button {
    color: #FFF;
    font-size: 16px;
    font-weight: 600;
    line-height: normal;
}
.cardItemColor .shape .product-attributes {
    position: absolute;
    left: 20px;
    top: 20px;
}
.cardItemColor .shape .product-attributes ul.color-options{
    list-style-type: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    width: fit-content;
    gap: 4px;
}
.cardItemColor .shape .product-attributes ul.color-options li{
    width: 16px;
    height: 16px;
    border-radius: 50%;
    box-shadow: 0px 0px 5px #02020214;
}
.cardItemColor .shape .product-bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.cardItemColor .shape .product-bottom .price{
    display: flex;
    flex-direction: column;
}
.cardItemColor .shape .product-bottom .old-price{
    color: var(--color-primary100);
    font-size: 14px;
    font-weight: 400;
    text-decoration: line-through;
    text-align: right;
}
.cardItemColor .shape .product-bottom .new-price{
    display: flex;
    gap: 4px;
    color: var(--color-primary);
    font-size: 15px;
    font-weight: 500;
    text-decoration: none;
}
/* end archive style 2 */

/* archive style 3 */
.cardItemSize {
    height: auto;
}
.cardItemSize .card__wrapper{
    height: 100%;
    width: 100%;
}
@media (max-width: 991px) {
    .cardItemSize {
        width: 100%;
        padding-left: 10px;
        padding-right: 10px;
    }
}
.cardItemSize {
    position: relative;
    transition: filter 0.4s ease-in-out;
    filter: drop-shadow(0px 0px 10px rgba(203, 213, 230, 0.2));
    margin-top: 6px;
    padding: 1px;
    overflow: visible;
    background: none;
}
.cardItemSize:hover .shape .product-bottom .add-to-cart a {
    background: var(--color-secondary100);
    box-shadow: 0px 0px 9px 0px var(--color-secondary100);    
}
.cardItemSize .shape {
    --r: 35px;
    --s: 80px;
    --a: 60deg;
    background: #fff;
    border-radius: var(--r);
    --_m: 100% / calc(2 * var(--r)) var(--r) no-repeat radial-gradient(50% 100% at top, #000 calc(100% - 1px), #0000);
    --_d: (var(--s) + var(--r)) * cos(var(--a));
    mask: calc(50% + var(--_d)) var(--_m), calc(50% - var(--_d)) var(--_m),
        radial-gradient(var(--s) at 50% calc(100% + sin(var(--a)) * var(--s)),
            #0000 100%,
            #000 calc(100% + 1px)) 0 calc(var(--r) * (sin(var(--a)) - 1)) no-repeat,
        linear-gradient(90deg,
            #000 calc(50% - var(--_d)),
            #0000 0 calc(50% + var(--_d)),
            #000 0);
    width: 100%;
    height: 100%;
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 32px 16px;
    gap: 10px;
}
.cardItemSize::before{
    content: '';
    position: absolute;
    bottom: 5px;
    left: 50%;
    width: 80px;
    height: 80px;
    transform: translateX(-50%);
    background: #F3F3F3;
    border-radius: 50%;
    z-index: -1;
}
.cardItemSize::after{
    content: '';
    position: absolute;
    bottom: 50%;
    left: 50%;
    width: 85px;
    height: 85px;
    transform: translateX(-50%);
    border-bottom: 1px solid var(--color-secondary100);
    border-radius: 50px;
    z-index: -2;
    transition: bottom 0.4s ease;
}
.cardItemSize:hover::after {
    bottom: 0; 
}
.cardItemSize .product-thumbnail {
    position: relative;
    width: auto; 
    height: 120px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%; 
    overflow: hidden; 
    border: 3px solid transparent; 
}
.cardItemSize .product-thumbnail svg{
    width: 100%;
}
.cardItemSize .product-thumbnail img {
    position: absolute;
    width: 100px;
    height: 100px;
    object-fit: contain; 
}
.cardItemSize .shape .title {
    color: var(--color-primary);
    font-size: 15px;
    font-weight: 700;
    text-align: right;
}
.cardItemSize .shape .product-bottom .add-to-cart a {
    display: flex;
    align-items: center;
    border-radius: 24px;
    background: #D5D5D5;
    justify-content: center;
    transition: all 0.3s ease-in-out;
    gap: 8px;
}
.cardItemSize .shape .product-bottom .add-to-cart svg{
    height: 25px;
}

.cardItemSize .shape .product-bottom .add-to-cart .svg-hover {
    display: none;
}

.cardItemSize .shape .product-bottom .add-to-cart:hover .svg-default {
    display: none;
}

.cardItemSize .shape .product-bottom .add-to-cart:hover .svg-hover {
    display: block;
}
.cardItemSize .shape .product-bottom .add-to-cart span{
    display: none;
    transition: all 0.3s ease-in-out;
}
.cardItemSize .shape .product-bottom .add-to-cart:hover a{
    padding: 8px 12px;
    width: fit-content;
}
.cardItemSize .shape .product-bottom .add-to-cart:hover span{
    display: block;
    color: #fff;
    font-family: var(--secondary-font);
    font-weight: 600;
    font-size: 16px;
}
.cardItemSize .shape .product-bottom .add-to-cart .add_to_cart_button {
    color: #FFF;
    font-size: 16px;
    font-weight: 600;
    line-height: normal;
}
.cardItemSize .shape .product-attributes {
    overflow-x: auto; 
    white-space: nowrap; 
    max-width: 100%;
}
.cardItemSize .shape .product-attributes ul.size-options{
    list-style-type: none;
    margin: 0;
    padding: 0;
    display: flex;
    gap: 4px;
    flex-wrap: wrap;
}
.cardItemSize .shape .product-attributes ul.size-options li{
    color: #fff;
    background: #D5D5D5;
    font-size: 15px;
    padding: 5px 10px;
    border-radius: 4px;
    cursor: pointer;
    padding-bottom: 0;
}
.cardItemSize .shape .product-attributes ul.size-options li:hover{
    background: var(--color-primary);
}
.cardItemSize .shape .product-bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.cardItemSize .shape .product-bottom .price{
    display: flex;
    flex-direction: column;
}
.cardItemSize .shape .product-bottom .old-price{
    color: var(--color-primary100);
    font-size: 14px;
    font-weight: 400;
    text-decoration: line-through;
    text-align: right;
}
.cardItemSize .shape .product-bottom .new-price{
    display: flex;
    gap: 4px;
    color: var(--color-primary);
    font-size: 15px;
    font-weight: 500;
    text-decoration: none;
}
/* end archive style 3 */

/* archive style 4 */
.cardItemSimple {
    width: calc(50% - 10px);
    display: inline-block; 
    vertical-align: top;
    margin-bottom: 20px; 
}

.cardItemSimple:nth-child(odd) {
    margin-left: 10px; 
}
.cardItemSimple {
    height: auto;
}

.cardItemSimple {
    position: relative;
    transition: filter 0.4s ease-in-out;
    filter: drop-shadow(0px 0px 10px rgba(203, 213, 230, 0.4));
    margin-top: 6px;
    padding: 1px;
    overflow: visible;
    background: none;
}

.cardItemSimple:hover .shape .product-bottom .add-to-cart a {
    background: var(--color-secondary100);
    box-shadow: 0px 0px 9px 0px var(--color-secondary100);    
}

.cardItemSimple .shape {
    --r: 35px;
    --s: 80px;
    --a: 60deg;
    background: #fff;
    border-radius: var(--r);
    --_m: 100% / calc(2 * var(--r)) var(--r) no-repeat radial-gradient(50% 100% at top, #000 calc(100% - 1px), #0000);
    --_d: (var(--s) + var(--r)) * cos(var(--a));
    mask: calc(50% + var(--_d)) var(--_m), calc(50% - var(--_d)) var(--_m),
        radial-gradient(var(--s) at 50% calc(100% + sin(var(--a)) * var(--s)),
            #0000 100%,
            #000 calc(100% + 1px)) 0 calc(var(--r) * (sin(var(--a)) - 1)) no-repeat,
        linear-gradient(90deg,
            #000 calc(50% - var(--_d)),
            #0000 0 calc(50% + var(--_d)),
            #000 0);
    width: 100%;
    height: 100%;
    position: relative;
    display: flex;
    flex-direction: row;
    padding: 24px;
    gap: 10px;
}

.cardItemSimple::before{
    content: '';
    position: absolute;
    bottom: 5px;
    left: 50%;
    width: 80px;
    height: 80px;
    transform: translateX(-50%);
    background: #F3F3F3;
    border-radius: 50%;
    z-index: -1;
}
.cardItemSimple::after{
    content: '';
    position: absolute;
    bottom: 50%;
    left: 50%;
    width: 85px;
    height: 85px;
    transform: translateX(-50%);
    border-bottom: 1px solid var(--color-secondary100);
    border-radius: 50px;
    z-index: -2;
    transition: bottom 0.4s ease;
}
.cardItemSimple:hover::after {
    bottom: 0; 
}
.cardItemSimple .detail {
    width: 70%;
    display: flex;
    flex-direction: column;
    justify-content: space-around;
}
.cardItemSimple .product-thumbnail {
    position: relative;
    width: auto; 
    height: 120px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%; 
    overflow: hidden; 
    border: 3px solid transparent; 
}
.cardItemSimple .product-thumbnail svg{
    width: 100%;
}
.cardItemSimple .product-thumbnail img {
    position: absolute;
    width: 100px;
    height: 100px;
    object-fit: contain; 
}
.cardItemSimple .shape .title {
    color: var(--color-primary);
    font-size: 15px;
    font-weight: 700;
    text-align: right;
}
.cardItemSimple .shape .product-bottom .add-to-cart a {
    display: flex;
    align-items: center;
    border-radius: 40px;
    background: #D5D5D5;
    justify-content: center;
    transition: all 0.3s ease-in-out;
    padding: 8px 16px;
    gap: 12px;
}

.cardItemSimple .shape .product-bottom .add-to-cart a span{
    color: #FFF;
    font-family: var(--secondary-font);
    font-size: 16px;
    font-weight: 600;
}
.cardItemSimple .shape .product-bottom .add-to-cart .add_to_cart_button {
    color: #FFF;
    font-size: 16px;
    font-weight: 600;
    line-height: normal;
}
.cardItemSimple .shape .product-bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.cardItemSimple .shape .product-bottom .price{
    display: flex;
    flex-direction: column;
}
.cardItemSimple .shape .product-bottom .price label,
.cardItemSimple .shape .product-bottom .new-price label{
    color: var(--color-primary100, #9BA8BD);
    font-family: var(--secondary-font);
    font-size: 14px;
    font-weight: 400;
    text-align: left;
}
.cardItemSimple .shape .product-bottom .old-price{
    color: var(--color-primary100);
    font-size: 14px;
    font-weight: 400;
    text-decoration: line-through;
    text-align: left;
}
.cardItemSimple .shape .product-bottom .new-price{
    display: flex;
    gap: 4px;
    color: var(--color-primary);
    font-size: 15px;
    font-weight: 500;
    text-decoration: none;
}
@media (max-width: 768px) {
    .cardItemSimple {
        width: 100%;
    }
    .cardItemSimple:nth-child(odd){
        margin-left: 0px;
    }
}
/* end archive style 4 */

/* archive style 5 */
.cardItemAttr {
    width: calc(50% - 10px);
    display: inline-block; 
    vertical-align: top;
    margin-bottom: 20px; 
}

.cardItemAttr:nth-child(odd) {
    margin-left: 10px; 
}
.cardItemAttr {
    height: auto;
}
.cardItemAttr .card__wrapper{
    height: 100%;
    width: 100%;
}
.cardItemAttr {
    position: relative;
    transition: filter 0.4s ease-in-out;
    filter: drop-shadow(0px 0px 10px rgba(203, 213, 230, 0.2));
    margin-top: 6px;
    padding: 1px;
    overflow: visible;
    background: none;
}
.cardItemAttr:hover .shape .product-bottom .add-to-cart a {
    background: var(--color-secondary100);
    box-shadow: 0px 0px 9px 0px var(--color-secondary100);    
}
.cardItemAttr .shape {
    --r: 35px;
    --s: 80px;
    --a: 60deg;

    background: #fff;
    border-radius: var(--r);
    --_m: 100% / calc(2 * var(--r)) var(--r) no-repeat radial-gradient(50% 100% at top, #000 calc(100% - 1px), #0000);
    --_d: (var(--s) + var(--r)) * cos(var(--a));
    mask: calc(50% + var(--_d)) var(--_m), calc(50% - var(--_d)) var(--_m),
        radial-gradient(var(--s) at 50% calc(100% + sin(var(--a)) * var(--s)),
            #0000 100%,
            #000 calc(100% + 1px)) 0 calc(var(--r) * (sin(var(--a)) - 1)) no-repeat,
        linear-gradient(90deg,
            #000 calc(50% - var(--_d)),
            #0000 0 calc(50% + var(--_d)),
            #000 0);
    width: 100%;
    height: 100%;
    position: relative;
    display: flex;
    padding: 20px 24px 30px;
    gap: 10px;
}
.cardItemAttr::before{
    content: '';
    position: absolute;
    bottom: 5px;
    left: 50%;
    width: 80px;
    height: 80px;
    transform: translateX(-50%);
    background: #F3F3F3;
    border-radius: 50%;
    z-index: -1;
}
.cardItemAttr::after{
    content: '';
    position: absolute;
    bottom: 50%;
    left: 50%;
    width: 85px;
    height: 85px;
    transform: translateX(-50%);
    border-bottom: 1px solid var(--color-secondary100);
    border-radius: 50px;
    z-index: -2;
    transition: bottom 0.4s ease;
}
.cardItemAttr:hover::after {
    bottom: 0; 
}
.cardItemAttr .shape .title {
    color: var(--color-primary);
    font-size: 15px;
    font-weight: 700;
    text-align: right;
    width: 80%;
}
.cardItemAttr .shape .product-bottom {
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.cardItemAttr .shape .product-bottom .add-to-cart a {
    display: flex;
    align-items: center;
    border-radius: 24px;
    background: #D5D5D5;
    justify-content: center;
    transition: all 0.3s ease-in-out;
    gap: 4px;
    padding: 4px 12px;
    font-family: var(--secondary-font);

}
.cardItemAttr .shape .product-bottom .add-to-cart .btn-text{
    font-size: 13px;
}
.cardItemAttr .shape .product-bottom .add-to-cart svg{
    height: 25px;
}
.cardItemAttr .shape .product-bottom .add-to-cart .add_to_cart_button {
    color: #FFF;
    font-size: 16px;
    font-weight: 600;
    line-height: normal;
}
.cardItemAttr .carousel.slide {
    width: 30%;
    display: flex;
    flex-direction: column;
    align-items: center;
}
.cardItemAttr .product-info {
    width: 70%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 30px;
}
.cardItemAttr .carousel .carousel-inner {
    overflow: hidden;
    width: 100px;
    position: relative;
}
.cardItemAttr .carousel .carousel-inner::after{
    content: '';
    position: absolute;
    bottom: 0;
    right: 0;
    width: 100%;
    height: 100%;
    background-image: url('../images/back-image-product.svg');
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    z-index: -1;
}
.cardItemAttr .carousel .carousel-item {
    width: 100px;
    height: 80px;
    object-fit: contain;
    object-position: center;
}
.cardItemAttr .carousel .carousel-thumbnails{
    display: flex;
    overflow-x: auto;
    white-space: nowrap;
    padding-bottom: 10px;            
}
.cardItemAttr .carousel .carousel-thumbnails::-webkit-scrollbar {
    height: 5px;
}
.cardItemAttr .carousel .carousel-thumbnails::-webkit-scrollbar-thumb {
    background: #ccc; 
    border-radius: 10px;
}
.cardItemAttr .carousel .carousel-thumbnails .item{
    position: relative;
    flex: 0 0 auto;
}
.cardItemAttr .carousel .carousel-thumbnails .item::before{
    content: '';
    position: absolute;
    right: 0;
    top: 0;
    width: 44px;
    height: 44px;
    background-color: #EAEAEA;
    border-radius: 50%;
    z-index: -1;
}
.cardItemAttr .carousel .carousel-thumbnails img {
    width: 50px;
    height: 35px;
    object-fit: contain;
    object-position: center;
    background: none;
    border: none;
}
.cardItemAttr .product-attr {
    list-style: none;
    display: flex;
    margin-bottom: unset;
    padding-right: unset;
    gap: 20px;
}
.cardItemAttr .product-attr li {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
}
.cardItemAttr .product-attr li img {
    width: 24px;
    height: 24px;
    object-fit: contain;
}
.cardItemAttr .product-attr li span {
    color: #A7A7A7;
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    letter-spacing: -0.3px;
}
.cardItemAttr .product-price .price {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
}
.cardItemAttr .product-price .price .old-price {
    color: var(--color-primary100);
    font-size: 14px;
    font-weight: 400;
    text-decoration: line-through;
    direction: ltr;
}
.cardItemAttr .product-price .price .old-price .discount {
    font-size: 14px;
    direction: ltr;
    background: var(--color-secondary100);
    color: #fff;
    padding: 0 5px;
    border-radius: 6px;
    margin-right: 5px;
}
.cardItemAttr .product-price .price .new-price {
    display: flex;
    gap: 4px;
    color: var(--color-primary);
    font-size: 15px;
    font-weight: 500;
    text-decoration: none;
}
.cardItemAttr .product-price .price .new-price label {
    color: var(--color-primary100);
    font-size: 14px;
    font-weight: 400;
    line-height: 28px;
}
.cardItemAttr .sliderAttribute::before{
    content: "";
    pointer-events: none;
    position: absolute;
    top: 0;
    bottom: 0;
    z-index: 10;
    width: 15%;
    left: 0;
    background: linear-gradient(270deg, rgba(255, 255, 255, 0.00) 0%, #FFF 100%);
}
.cardItemAttr .sliderAttribute::after{
    content: "";
    pointer-events: none;
    position: absolute;
    top: 0;
    bottom: 0;
    z-index: 10;
    width: 15%;
    right: 0;
    background: linear-gradient(90deg, rgba(255, 255, 255, 0.00) 0%, #FFF 100%);
}@media (max-width: 768px) {
    .cardItemAttr {
        width: 100%;
    }
    .cardItemAttr:nth-child(odd){
        margin-left: 0px;
    }
}
@media (max-width: 991px) {
    .cardItemAttr {
        width: 100%;
        padding-left: 0;
        padding-right: 0;
        margin-bottom: 20px;
    }
    .cardItemAttr .shape {
        padding: 40px 15px;
        gap: 10px;
    }
    .cardItemAttr .product-attr{
        gap: 8px;
    }
    .cardItemAttr .product-info {
        gap: 16px;
    }
    .cardItemAttr .product-attr li span{
        font-size: 13px;
    }
    .swiper-attribute-button-prev,
    .swiper-attribute-button-next{
        display: none;
    }
    .cardItemAttr .shape .product-bottom .add-to-cart a{
        background-color: var(--color-secondary100);
    }
}
/* end archive style 5 */
.sizeChart {
    border-collapse: collapse; 
    border-radius: 12px; 
    overflow: hidden; 
}
  
.sizeChart th, .sizeChart td {
    text-align: center; 
    padding: 15px; 
}
  
.sizeChart thead tr td{
    background-color: var(--color-primary); 
    color: white; 
     
}
.sizeChart thead tr td:first-child{
    border-top-right-radius: 12px; 
    border-bottom-right-radius: 12px;
}
.sizeChart thead tr td:last-child{
    border-top-left-radius: 12px; 
    border-bottom-left-radius: 12px;
}
  
.sizeChart tbody tr {
    border-bottom: 1px solid #ddd; 
}
  
.sizeChart td {
    background-color: #f3f3f3; 
}
  
.sizeChart tbody tr:last-child {
    border-bottom-left-radius: 10px; 
    border-bottom-right-radius: 10px;
}

.woocommerce-Reviews .comment-reply-link{
    background-color: var(--color-secondary100);
    box-shadow: 0px 0px 9px 0px var(--color-secondary100);
    border-radius: 40px;
    padding: 5px 20px;
    color: #fff;
    width: fit-content;
    font-size: 14px;
    font-weight: 600;
}


.custom-slider {
    max-width: 600px;
    margin: auto;
}

.custom-slider .back-img-slider{
    position: relative;
    height: 300px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.custom-slider .main-image {
    width: 100%;
    height: 240px;
    background-size: contain;
    background-position: center;
    cursor: grab;
    transition: background-image 0.3s ease;
    z-index: 2;
    background-repeat: no-repeat;
    position: relative;
}

.custom-slider .back-img-slider::before{
    content: '';
    position: absolute;
    bottom: 0;
    right: 0;
    width: 100%;
    height: 100%;
    background-image: url('../images/back-slider.png');
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    z-index: 1;
}

.custom-slider .thumbnails {
    display: flex;
    justify-content: center;
    gap: 10px;
    margin-top: 15px;
    flex-wrap: wrap;
}

.custom-slider .thumbnail {
    width: 90px;
    height: 90px;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    border: 2px solid transparent;
    border-radius: 50%;
    cursor: pointer;
    transition: border-color 0.3s ease;
    background-color: #EFEFEF;
    box-shadow: 0px 0px 30px 0px rgba(0, 0, 0, 0.10);
    position: relative;
}

.custom-slider .thumbnail.active:after {
    content: '';
    position: absolute;
    bottom: -5px;
    left: -2px;
    width: 90px;
    height: 90px;
    border-right: 1px solid transparent;
    border-bottom: 1px solid var(--color-secondary100);
    border-left: 1px solid transparent;
    border-top: 1px solid transparent;
    border-radius: 50px;
}

.custom-slider .thumbnails {
    display: flex;
    justify-content: center;
    gap: 10px;
    margin-top: 15px;
    flex-wrap: wrap;
}

.custom-slider .thumbnail {
    width: 90px;
    height: 90px;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    border: 2px solid transparent;
    border-radius: 50%;
    cursor: pointer;
    transition: border-color 0.3s ease;
    background-color: #EFEFEF;
    box-shadow: 0px 0px 30px 0px rgba(0, 0, 0, 0.10);
}