:root, [data-bs-theme=light] {
    --cz-primary: #f55266;
    --cz-secondary: #6c727f;
    --cz-success: #33b36b;
    --cz-info: #2f6ed5;
    --cz-warning: #fc9231;
    --cz-danger: #f03d3d;
    --cz-light: #fff;
    --cz-dark: #222934;
    --cz-primary-rgb: 245,82,102;
    --cz-secondary-rgb: 108,114,127;
    --cz-success-rgb: 51,179,107;
    --cz-info-rgb: 47,110,213;
    --cz-warning-rgb: 252,146,49;
    --cz-danger-rgb: 240,61,61;
    --cz-light-rgb: 255,255,255;
    --cz-dark-rgb: 34,41,52;
    --cz-primary-text-emphasis: #f2223b;
    --cz-secondary-text-emphasis: #333d4c;
    --cz-success-text-emphasis: #288b53;
    --cz-info-text-emphasis: #2358ae;
    --cz-warning-text-emphasis: #f67804;
    --cz-danger-text-emphasis: #e81212;
    --cz-light-text-emphasis: #333d4c;
    --cz-dark-text-emphasis: #181d25;
    --cz-primary-bg-subtle: #feeef0;
    --cz-secondary-bg-subtle: #f5f7fa;
    --cz-success-bg-subtle: #ebf7f0;
    --cz-info-bg-subtle: #eaf1fb;
    --cz-warning-bg-subtle: #fff4ea;
    --cz-danger-bg-subtle: #feecec;
    --cz-light-bg-subtle: #fff;
    --cz-dark-bg-subtle: #edeeef;
    --cz-primary-border-subtle: #fddce0;
    --cz-secondary-border-subtle: #e0e5eb;
    --cz-success-border-subtle: #d6f0e1;
    --cz-info-border-subtle: #d5e2f7;
    --cz-warning-border-subtle: #fee9d6;
    --cz-danger-border-subtle: #fcd8d8;
    --cz-light-border-subtle: #eef1f6;
    --cz-dark-border-subtle: #e0e5eb;
    --cz-white-rgb: 255,255,255;
    --cz-black-rgb: 0,0,0;
    --cz-font-sans-serif: "Inter",sans-serif;
    --cz-font-monospace: SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;
    --cz-gradient: linear-gradient(180deg,hsla(0,0%,100%,.15),hsla(0,0%,100%,0));
    --cz-root-font-size: 1rem;
    --cz-body-font-family: var(--cz-font-sans-serif);
    --cz-body-font-size: 1rem;
    --cz-body-font-weight: 400;
    --cz-body-line-height: 1.5;
    --cz-body-color: #4e5562;
    --cz-body-color-rgb: 78,85,98;
    --cz-body-bg: #fff;
    --cz-body-bg-rgb: 255,255,255;
    --cz-emphasis-color: #222934;
    --cz-emphasis-color-rgb: 34,41,52;
    --cz-secondary-color: #6c727f;
    --cz-secondary-color-rgb: 108,114,127;
    --cz-secondary-bg: #eef1f6;
    --cz-secondary-bg-rgb: 238,241,246;
    --cz-tertiary-color: #9ca3af;
    --cz-tertiary-color-rgb: 156,163,175;
    --cz-tertiary-bg: #f5f7fa;
    --cz-tertiary-bg-rgb: 245,247,250;
    --cz-heading-color: #181d25;
    --cz-link-color: #f55266;
    --cz-link-color-rgb: 245,82,102;
    --cz-link-decoration: underline;
    --cz-link-hover-color: #f55266;
    --cz-link-hover-color-rgb: 245,82,102;
    --cz-link-hover-decoration: none;
    --cz-code-color: #d63384;
    --cz-highlight-color: #4e5562;
    --cz-highlight-bg: #fff3cd;
    --cz-border-width: 1px;
    --cz-border-style: solid;
    --cz-border-color: #e0e5eb;
    --cz-border-color-translucent: rgba(0,0,0,.1);
    --cz-border-radius: 0.5rem;
    --cz-border-radius-sm: calc(var(--cz-border-radius)*0.75);
    --cz-border-radius-lg: calc(var(--cz-border-radius)*1.5);
    --cz-border-radius-xl: calc(var(--cz-border-radius)*2);
    --cz-border-radius-xxl: calc(var(--cz-border-radius)*2.5);
    --cz-border-radius-2xl: var(--cz-border-radius-xxl);
    --cz-border-radius-pill: 50rem;
    --cz-box-shadow: 0 0.5rem 2rem -0.25rem hsla(216,9%,44%,.1);
    --cz-box-shadow-sm: 0 0.375rem 1.5rem hsla(216,9%,44%,.06);
    --cz-box-shadow-lg: 0 1.125rem 3rem -0.375rem hsla(216,9%,44%,.12);
    --cz-box-shadow-inset: unset;
    --cz-focus-ring-width: 0.25rem;
    --cz-focus-ring-opacity: 0.1;
    --cz-focus-ring-color: rgba(24,29,37,.1);
    --cz-form-valid-color: #33b36b;
    --cz-form-valid-border-color: #33b36b;
    --cz-form-invalid-color: #f03d3d;
    --cz-form-invalid-border-color: #f03d3d
}

[data-bs-theme=dark] {
    color-scheme: dark;
    --cz-body-color: #cad0d9;
    --cz-body-color-rgb: 202,208,217;
    --cz-body-bg: #181d25;
    --cz-body-bg-rgb: 24,29,37;
    --cz-emphasis-color: #eef1f6;
    --cz-emphasis-color-rgb: 238,241,246;
    --cz-secondary-color: #9ca3af;
    --cz-secondary-color-rgb: 156,163,175;
    --cz-secondary-bg: #333d4c;
    --cz-secondary-bg-rgb: 51,61,76;
    --cz-tertiary-color: #6c727f;
    --cz-tertiary-color-rgb: 108,114,127;
    --cz-tertiary-bg: #222934;
    --cz-tertiary-bg-rgb: 34,41,52;
    --cz-primary-text-emphasis: #f43a51;
    --cz-secondary-text-emphasis: #e0e5eb;
    --cz-success-text-emphasis: #2d9f5f;
    --cz-info-text-emphasis: #2762c3;
    --cz-warning-text-emphasis: #fc8518;
    --cz-danger-text-emphasis: #ee2525;
    --cz-light-text-emphasis: #e0e5eb;
    --cz-dark-text-emphasis: #fff;
    --cz-primary-bg-subtle: #2e222c;
    --cz-secondary-bg-subtle: #222934;
    --cz-success-bg-subtle: #1b2c2c;
    --cz-info-bg-subtle: #1a2537;
    --cz-warning-bg-subtle: #2f2926;
    --cz-danger-bg-subtle: #2e2027;
    --cz-light-bg-subtle: #181d25;
    --cz-dark-bg-subtle: #131920;
    --cz-primary-border-subtle: #442832;
    --cz-secondary-border-subtle: #333d4c;
    --cz-success-border-subtle: #1d3b33;
    --cz-info-border-subtle: #1d2d48;
    --cz-warning-border-subtle: #463427;
    --cz-danger-border-subtle: #43232a;
    --cz-light-border-subtle: #333d4c;
    --cz-dark-border-subtle: #131920;
    --cz-heading-color: #fff;
    --cz-link-color: #f997a3;
    --cz-link-hover-color: #f997a3;
    --cz-link-color-rgb: 249,151,163;
    --cz-link-hover-color-rgb: 249,151,163;
    --cz-code-color: #e685b5;
    --cz-highlight-color: #cad0d9;
    --cz-highlight-bg: #664d03;
    --cz-border-color: #333d4c;
    --cz-border-color-translucent: hsla(0,0%,100%,.15);
    --cz-form-valid-color: #33b36b;
    --cz-form-valid-border-color: #33b36b;
    --cz-form-invalid-color: #f03d3d;
    --cz-form-invalid-border-color: #f03d3d
}
/*----------------------------------
----------product-grid------------------
---------------------------------*/

.product-grid h1 {
    padding: 0 0 30px;
}

.product-grid a {
    text-decoration: none;
}

    .product-grid a:hover {
        text-decoration: none;
    }

.product-grid {
    text-align: center;
    padding: 10px 10px;
    margin: 0 auto;
    border: 2px solid #dedade;
    overflow: hidden;
    transition: all 0.3s ease-in-out;
    background-color: black;
    border-radius: 10px;
}

    .product-grid:hover {
        border: 2px solid #00c00c;
    }

    .product-grid .product-image {
        position: relative;
    }

        .product-grid .product-image a.image {
            display: block;
        }

        .product-grid .product-image img {
            width: 100%;
            height: auto;
            border-radius: 10px;
        }

    .product-grid .product-image {
        aspect-ratio: 1 / 1;
    }

        .product-grid .product-image .pic-1 {
            transition: all .5s ease;
        }

    .product-grid:hover .product-image .pic-1 {
        opacity: 0;
    }

    .product-grid .product-image .pic-2 {
        width: 100%;
        backface-visibility: hidden;
        opacity: 0;
        position: absolute;
        top: 0;
        left: 0;
        transform: scale(0.8);
        transition: all 0.5s cubic-bezier(0.68, -0.55, 0.265, 1.55); /* انیمیشن elastic */
    }

    .product-grid:hover .product-image .pic-2 {
        opacity: 1;
    }

    .product-grid:hover .product-image .pic-2 {
        opacity: 1;
        transform: scale(1);
    }

    .product-grid .product-links {
        padding: 0;
        margin: 0;
        list-style: none;
        opacity: 1;
        border: 1px solid #aaa;
        position: absolute;
        top: 0;
        right: 0;
        transition: all .3s ease 0.3s;
        border-radius: 0 10px 0 0;
    }

    .product-grid:hover .product-links {
        opacity: 1;
    }

    .product-grid .product-links li {
        margin: 0;
        display: block;
    }

        .product-grid .product-links li:first-child a {
            border-radius: 0 10px 0 0;
        }

        .product-grid .product-links li a i {
            line-height: inherit;
        }

        .product-grid .product-links li a {
            color: #aaa;
            background-color: #fff;
            font-size: 16px;
            font-weight: 600;
            line-height: 37px;
            height: 40px;
            width: 40px;
            margin: 0;
            border-bottom: 1px solid #aaa;
            display: block;
            position: relative;
            transition: all 0.3s ease 0.1s;
        }

            .product-grid .product-links li a:before,
            .product-grid .product-links li a:after {
                content: attr(data-tip);
                color: #fff;
                background: #000;
                font-size: 12px;
                line-height: 20px;
                padding: 5px 10px;
                border-radius: 5px 5px;
                white-space: nowrap;
                display: none;
                transform: translateY(-50%);
                position: absolute;
                right: 53px;
                top: 50%;
            }

            .product-grid .product-links li a:after {
                content: "";
                height: 15px;
                width: 15px;
                padding: 0;
                border-radius: 0;
                transform: translateY(-50%) rotate(45deg);
                right: 50px;
            }

            .product-grid .product-links li a:hover:before,
            .product-grid .product-links li a:hover:after {
                display: block;
            }

            .product-grid .product-links li a:hover {
                color: #fff;
                background-color: #00c00c;
            }

    .product-grid .product-content {
        padding: 10px 0 0;
    }

    .product-grid .rating {
        color: #ffd200;
        font-size: 14px;
        padding: 0;
        margin: 0 0 10px;
        list-style: none;
        display: inline-block;
    }

        .product-grid .rating li:last-child {
            color: #111;
            display: inline-block;
        }

    .product-grid .title {
        font-size: 17px;
        font-weight: 600;
        text-transform: capitalize;
        margin: 0 0 5px;
        height: 48px;
        min-height: 48px;
        max-height: 48px;
        display: block;
    }

        .product-grid .title a {
            color: #fff;
            transition: all 0.3s ease 0s;
        }

            .product-grid .title a:hover {
                color: #00c00c;
            }

    .product-grid .costs {
        display: block;
    }

    .product-grid .price {
        color: #fff;
        font-size: 20px;
        font-weight: 500;
        display: contents;
        margin: 0 auto;
    }

    .product-grid .original-price {
        color: #c0c2c5;
        margin: 0 0 5px;
        float: left;
        text-decoration-line: line-through;
        display: block;
    }

    .product-grid .discount {
        color: #000;
        margin: 0 0 5px;
        float: right;
        background-color: #d32f2f;
        padding-left: 4px;
        padding-right: 4px;
        color: #ffffff;
        border-radius: 15px;
        display: block;
    }

    .product-grid .add-cart {
        color: #00c00c;
        font-size: 14px;
        font-weight: 700;
        text-transform: uppercase;
        padding: 11px 12px 10px;
        border: 1px solid #00c00c;
        display: block;
        position: relative;
        transition: all .3s ease;
        z-index: 1;
        border-radius: 5px;
    }

        .product-grid .add-cart i {
            margin: 0 5px 0 0;
        }

        .product-grid .add-cart:hover {
            color: #fff;
        }

        .product-grid .add-cart:before {
            content: "";
            background: #00c00c;
            width: 0;
            height: 100%;
            position: absolute;
            top: 0;
            left: 0;
            transition: all 0.3s ease-in-out;
            z-index: -1;
        }

        .product-grid .add-cart:hover:before {
            width: 100%;
        }

@media screen and (max-width: 990px) {
    .product-grid {
        margin-bottom: 30px;
    }
}
/*----------------------------------------------*/
.fs-lg {
    font-size: 1.125rem !important
}

.fs-base {
    font-size: 1rem !important
}

.fs-sm {
    font-size: .875rem !important
}

.fs-xs {
    font-size: .75rem !important
}
/*----------------------------------------------*/
.breadcrumb {
    --cz-breadcrumb-font-weight: 500;
    --cz-breadcrumb-color: var(--cz-component-color);
    --cz-breadcrumb-hover-color: var(--cz-component-hover-color);
    flex-direction: row;
    font-weight: var(--cz-breadcrumb-font-weight);
    gap: 0
}

.breadcrumb-item > a {
    color: var(--cz-breadcrumb-color);
    text-decoration: none;
    transition: color .2s ease-in-out
}

    .breadcrumb-item > a:focus-visible, .breadcrumb-item > a:hover {
        color: var(--cz-breadcrumb-hover-color)
    }

.breadcrumb-item + .breadcrumb-item:before {
    height: 1.125em;
    line-height: 2em;
    padding-left: var(--cz-breadcrumb-item-padding-x);
    padding-right: 0;
    width: 1.125em
}

[data-bs-theme=dark] .breadcrumb:not([data-bs-theme=light]) .breadcrumb-item + .breadcrumb-item:before {
    content: var(--cz-breadcrumb-divider,url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23e0e5eb' viewBox='0 0 24 24'%3E%3Cpath d='M8.381 5.381a.874.874 0 0 1 1.237 0l6 6a.874.874 0 0 1 0 1.237l-6 6a.874.874 0 1 1-1.237-1.237L13.763 12 8.381 6.619a.874.874 0 0 1 0-1.237z'/%3E%3C/svg%3E"))
}
/*--------------------------------------------------*/
.drift-zoom-pane {
    background-color: #181d25;
    border: 1px solid #333d4c;
    border-radius: 24px;
}
/*--------------------------------------------------*/


.swiper-button-lock {
    display: none !important
}

.swiper-pagination-bullets {
    --swiper-pagination-bottom: 1.5rem;
    --swiper-pagination-right: 1.5rem;
    --swiper-pagination-bullet-inactive-color: #cad0d9;
    --swiper-pagination-color: #222934;
    --swiper-pagination-bullet-border-radius: 50%;
    --swiper-pagination-bullet-inactive-opacity: 1;
    --swiper-pagination-bullet-opacity: 1;
    --swiper-pagination-bullet-horizontal-gap: 0.375rem;
    --swiper-pagination-bullet-vertical-gap: 0.375rem;
    --swiper-pagination-bullet-transition: background-color 0.2s ease-in-out
}

.swiper-pagination-bullet {
    transition: background-color 0.2s ease-in-out
}

.swiper-pagination-progressbar {
    --swiper-pagination-progressbar-size: 0.25rem;
    --swiper-pagination-progressbar-border-radius: 50rem;
    --swiper-pagination-progressbar-bg-color: #eef1f6;
    --swiper-pagination-color: #222934;
    border-radius: var(--swiper-pagination-progressbar-border-radius);
    overflow: hidden
}

.swiper-scrollbar {
    --swiper-scrollbar-bottom: .25rem;
    --swiper-scrollbar-right: .25rem;
    --swiper-scrollbar-size: 0.25rem;
    --swiper-scrollbar-border-radius: 50rem;
    --swiper-scrollbar-bg-color: #eef1f6;
    --swiper-scrollbar-drag-bg-color: #222934;
    display: none
}

    .swiper-scrollbar.swiper-scrollbar-horizontal, .swiper-scrollbar.swiper-scrollbar-vertical {
        display: block
    }

.swiper-thumbs {
    --swiper-thumbnail-border-width: 1px;
    --swiper-thumbnail-border-color: var(--cz-border-color);
    --swiper-thumbnail-active-border-color: var(--cz-component-active-color);
    --swiper-thumbnail-border-radius: var(--cz-border-radius);
    --swiper-thumbnail-opacity: .5;
    --swiper-thumbnail-active-opacity: 1
}

.swiper-thumb-img {
    border-radius: var(--swiper-thumbnail-border-radius);
    opacity: var(--swiper-thumbnail-opacity);
    transition: opacity .2s ease-in-out
}

.swiper-thumb {
    align-items: center;
    border: var(--swiper-thumbnail-border-width) solid var(--swiper-thumbnail-border-color);
    border-radius: var(--swiper-thumbnail-border-radius);
    cursor: pointer;
    display: flex;
    height: auto;
    justify-content: center;
    transition: border-color .2s ease-in-out;
    width: auto
}

    .swiper-thumb.active .swiper-thumb-img, .swiper-thumb.swiper-slide-thumb-active .swiper-thumb-img, .swiper-thumb:hover .swiper-thumb-img {
        opacity: var(--swiper-thumbnail-active-opacity)
    }

    .swiper-thumb.active, .swiper-thumb.swiper-slide-thumb-active {
        border-color: var(--swiper-thumbnail-active-border-color)
    }

.swiper-load {
    visibility: hidden
}

    .swiper-load.swiper-initialized {
        visibility: visible
    }

[data-bs-theme=dark] .swiper-pagination-bullets:not([data-bs-theme=light]) {
    --swiper-pagination-bullet-inactive-color: hsla(0,0%,100%,.3);
    --swiper-pagination-color: #fff
}

[data-bs-theme=dark] .swiper-pagination-progressbar:not([data-bs-theme=light]) {
    --swiper-pagination-progressbar-bg-color: hsla(0,0%,100%,.3);
    --swiper-pagination-color: #fff
}

[data-bs-theme=dark] .swiper-scrollbar:not([data-bs-theme=light]) {
    --swiper-scrollbar-bg-color: hsla(0,0%,100%,.3);
    --swiper-scrollbar-drag-bg-color: #fff
}

/*---------product--detail---------------------------------*/
.p-d .btn {
    border: 1px solid #333d4c;
    color: #e0e5eb;
    font-weight: 500;
}

    .p-d .btn-check:checked + .btn, .p-d :not(.btn-check) + .btn:active, .p-d .btn:first-child:active, .p-d .btn.active, .p-d .btn.show {
        border: 1px solid #333d4c;
        color: #fff;
        background-color: transparent;
        border-color: #fff;
    }


.p-d .btn-color {
    --cz-btn-active-border-color: var(--cz-tertiary-color);
    border-radius: 50%;
    display: inline-block;
    flex-shrink: 0;
    height: 22px;
    padding: .125rem;
    width: 22px;
}

    .p-d .btn-color:before {
        background-color: currentcolor;
        border-radius: 50%;
        content: "";
        display: flex;
        height: 100%;
        width: 100%
    }


.p-d .h1, .p-d .h2, .p-d .h3, .p-d .h4, .p-d .h5, .p-d .h6, .p-d h1, .p-d h2, .p-d h3, .p-d h4, .p-d h5, .p-d h6 {
    color: #fff;
    font-weight: 600;
}


.p-d .count-input {
    display: inline-flex;
    overflow: hidden;
    background-color: #fff;
    border: var(--cz-border-width) solid #cad0d9;
    border-radius: var(--cz-border-radius);
    transform: translateZ(0);
}

.p-d .count-input {
    background-color: transparent;
}

    .p-d .count-input .btn {
        font-size: 16px;
    }

    .p-d .count-input .form-control {
        width: 2.5rem;
        padding: 0 0.25rem;
        font-weight: 500;
        text-align: center;
        /* stylelint-disable property-no-vendor-prefix */
        -moz-appearance: textfield;
        appearance: textfield;
        /* stylelint-enable property-no-vendor-prefix */
        background-color: transparent;
        border: 0;
        border-radius: 0;
    }

        .p-d .count-input .form-control::-webkit-outer-spin-button, .p-d .count-input .form-control::-webkit-inner-spin-button {
            margin: 0;
            -webkit-appearance: none;
        }

    .p-d .count-input .btn {
        border: 0;
        border-radius: 0;
    }

        .p-d .count-input .btn:not(.btn-primary) {
            --cz-btn-hover-color: var(--cz-component-hover-color);
            --cz-btn-hover-bg: var(--cz-secondary-bg);
            --cz-btn-active-bg: var(--cz-secondary-bg);
        }

    .p-d .count-input .btn-sm + .form-control, .p-d .count-input .btn-group-sm > .btn + .form-control {
        width: 2rem;
    }

    .p-d .count-input .btn-lg + .form-control, .p-d .count-input .btn-group-lg > .btn + .form-control {
        width: 3rem;
    }

    .p-d .count-input.disabled {
        background-color: var(--cz-tertiary-bg);
        border-color: var(--cz-border-color);
        border-style: dashed;
    }

.p-d .count-input-collapsible.collapsed [data-decrement],
.p-d .count-input-collapsible.collapsed .form-control {
    display: none;
}

.p-d .ratio > * {
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
}

.p-d .product-card .ratio {
    height: 200px;
}

.p-d .h1 a, .p-d .h2 a, .p-d .h3 a, .p-d .h4 a, .p-d .h5 a, .p-d .h6 a,
.p-d h1 a, .p-d h2 a, .p-d h3 a, .p-d h4 a, .p-d h5 a, .p-d h6 a {
    color: var(--cz-heading-color);
    text-decoration: none;
}
.hover-effect-opacity:focus-visible .hover-effect-target.opacity-0, 
.hover-effect-opacity:focus-within .hover-effect-target.opacity-0, 
.hover-effect-opacity:hover .hover-effect-target.opacity-0 {
    opacity: 1 !important;
    visibility: visible !important;
}
.product-card.hover-effect-opacity .hover-effect-target {
    transition: none;
}

.footer .nav-link {
    font-size: 14px;
}

.footer a {
    color: var(--cz-heading-color);
    text-decoration: none;
}