/*#region header*/
header {
    padding: 24px 0px 16px;
    /*padding: 24px 0px 0px;*/
    position: fixed;
    top: 0px;
    z-index: 100;
    background-color: var(--body-color);
    width: 100%;
}

.header-top {
    padding: 0px 24px;
    /*height: 43px;*/
}

.header-image {
    width: 35px;
    height: 35px;
    border: 1px solid var(--primary-color);
    border-radius: 50%;
}

.header-title {
    font-family: Persian-Bold;
    font-size: 14px;
    color: var(--base-color);
}

.header-cart-badge {
    width: 21px;
    height: 21px;
    background-color: var(--primary-color);
    border-radius: 50%;
    font-family: Persian-Medium;
    font-size: 12px;
    color: var(--contrast-color);
    position: absolute;
    top: -10px;
    right: -10px;
    padding-top: 1px;
}

.header-cart-badge-number {
    position: relative;
    top: 2px;
}

.header-back-link {
    /*padding: 7px;*/
    width: 35px;
    height: 35px;
    border-radius: 50%;
    background-color: var(--contrast-color);
    box-shadow: 0px 2px 4px 0px var(--base-color-25);
}


/* vitrino-page */
.vitrino-page-banner {
    padding: 24px 0px;
    /*border-top: 0.1px solid var(--primary-color);*/
    /*border-bottom: 0.1px solid var(--primary-color);*/
    box-shadow: 0px 2px 4px 0px var(--primary-color-25),0px -2px 4px 0px var(--primary-color-25);
}

.vitrino-page-banner-title {
    font-family: Persian-Bold;
    font-size: 16px;
    color: var(--base-color);
    position: relative;
    top: 2px;
}

.vitrino-page-empty-text {
    padding: 24px 16px 16px;
    font-family: Persian-Medium;
    font-size: 14px;
    color: var(--base-color);
    text-align: center;
    height: calc(100vh - 204px);
    /*padding-bottom: 172px;*/
}


/*#endregion header*/

/*#region header-filter*/
.header-filter {
    padding: 0px 16px;
    width: 100%;
}

.dropdown-toggle::after {
    display: none;
}

.header-filter-dropdown-button {
    width: 56px;
    height: 36px;
    border-radius: 20px;
    border: 1px solid var(--primary-color);
    background-color: var(--contrast-color);
    box-shadow: 0px 2px 4px 0px var(--primary-color-25);
}

.header-filter-dropdown-button-active {
    border: none !important;
    background-color: var(--primary-color) !important;
}

.header-filter-dropdown-menu {
    width: 100px;
    background-color: var(--secondary-color);
    border-radius: 20px;
    border: 1px solid var(--primary-color);
    box-shadow: -2px 2px 4px 0px var(--primary-color-25);
    min-width: 10px;
    padding: 0px;
}

.header-filter-dropdown-menu-item {
    width: 100%;
    /*height: 50px;*/
    padding: 8px 0px;
    /*padding: 16px;*/
    font-family: Persian-Medium;
    font-size: 12px;
    color: var(--base-color);
    text-align: center;
    border-bottom: 0.25px solid var(--primary-color-25);
    /*border-bottom: 0.5px solid var(--primary-color);*/
}

.header-filter-dropdown-menu-item-last {
    border-bottom: none;
}

.header-filter-search {
    width: 100%;
    height: 36px;
    border: 1px solid var(--primary-color);
    border-radius: 20px;
    padding: 0px 46px 0px 36px;
    box-shadow: 0px 2px 4px 0px var(--base-color-25);
    background-color: var(--contrast-color);
    font-family: Persian-Medium;
    font-size: 14px;
    color: var(--base-color);
}

    .header-filter-search::placeholder {
        color: var(--base-color);
        opacity: 1;
        /* Firefox */
    }

    .header-filter-search::-ms-input-placeholder {
        /* Edge 12 -18 */
        color: var(--base-color);
    }

.header-filter-search-icon {
    position: absolute;
    top: 4px;
    right: 16px;
    cursor: pointer;
}

.header-filter-clear-search-icon {
    position: absolute;
    top: 4px;
    left: 8px;
    cursor: pointer;
}

/*#endregion header-filter*/

/*#region main*/
.main-vitrin {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-bottom: 71px;
    width: 100%;
}

.main-vitrin-products {
    margin-top: 128px;
    min-height: calc(100dvh - 199px);
}

.main-vitrino-page {
    margin-top: 169px;
    min-height: calc(100dvh - 240px);
}

.main-product-page {
    margin-bottom: 71px;
    height: calc(100dvh - 71px);
}

/*#endregion main*/

/*#region product-cards*/
.product-cards-container {
    /*padding: 36px 16px 132px;*/
    /*padding: 16px 16px 92px;*/
    padding: 16px;
}

.product-card-container {
    margin-bottom: 24px;
}

.product-card {
    background-color: var(--contrast-color);
    border-radius: 20px;
    box-shadow: 0px 3px 4px 0px var(--base-color-25);
    width: 160px;
}

.product-card-image-container {
    overflow: hidden;
}

.product-card-image {
    /*width: 160px;*/
    /*height: 200px;*/
    aspect-ratio: 4/5;
    border-radius: 20px 20px 0px 0px;
}

.product-card-content {
    padding: 8px 8px 26px 16px;
    border-radius: 0px 0px 20px 20px;
}

.product-card-name {
    font-family: Persian-SemiBold;
    font-size: 12px;
    color: var(--base-color);
    height: 36px;
    overflow: hidden;
}

.product-card-price-number {
    font-family: Persian-Bold;
    font-size: 12px;
    color: var(--base-color);
}

.product-card-price-tooman {
    font-family: Persian-Regular;
    font-size: 10px;
    color: var(--base-color);
}

.favorite-button {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background-color: var(--contrast-color);
    box-shadow: 0px 3px 4px 0px var(--base-color-25);
    position: absolute;
    bottom: -18px;
    left: 62px;
}

.product-card-labels {
    position: absolute;
    top: -10px;
    right: -5px;
}

.product-card-cart-label-value {
    width: 27px;
    height: 29px;
    font-family: Persian-Medium;
    font-size: 14px;
    color: var(--contrast-color);
    position: absolute;
    top: 0px;
    right: 0px;
}

.product-card-cart-label-value-number {
    position: relative;
    top: 4px;
}

.product-card-discount-label-icon {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background-color: var(--primary-color);
}

.product-card-discount-label-value {
    width: 30px;
    height: 30px;
    font-family: Persian-Medium;
    font-size: 10px;
    color: var(--contrast-color);
    position: absolute;
    top: 0px;
    right: 0px;
}

.product-card-discount-label-value-number {
    position: relative;
    top: 2px;
}

.product-card-outOfStock {
    /*filter: brightness(50%);*/
    filter: brightness(75%);
    background-color: rgba(255,255,255,0.5);
}

.product-card-outOfStock-label {
    background-color: var(--contrast-color);
    width: 100px;
    height: 30px;
    transform: rotate(-45deg);
    position: absolute;
    top: 9px;
    left: -26px;
}

.product-card-outOfStock-label-text {
    font-family: Persian-SemiBold;
    font-size: 12px;
    color: var(--primary-color);
    position: relative;
    top: 1px;
}

.product-card-cart-icon {
    position: absolute;
    top: -16px;
    right: -8px;
}

.product-card-cart-icon-badge {
    width: 20px;
    height: 20px;
    position: absolute;
    top: -5px;
    right: -2px;
    font-family: Persian-SemiBold;
    font-size: 12px;
    color: var(--base-color);
}

.product-card-label {
    background-color: var(--contrast-color);
    width: 44px;
    height: 44px;
    border-radius: 8px 0px 44px 0px;
    position: absolute;
    top: 0px;
    left: 0px;
    box-shadow: 0px 2px 2px 0px var(--base-color-25);
}

.product-card-label-icon {
    position: relative;
    top: 4px;
    right: 14px;
}


.show-more-product-cards-button {
    width: 114px;
    height: 37px;
    /*padding: 8px 16px;*/
    border-radius: 20px;
    background-color: var(--secondary-color);
    border: none;
    outline: none;
    box-shadow: -3px 3px 4px 0px var(--primary-color-25);
    font-family: Persian-SemiBold;
    font-size: 14px;
    color: var(--primary-color);
    margin-bottom: 24px;
}

.show-more-product-cards-button-text {
    position: relative;
    top: 1px;
}

/*#endregion product-cards*/

/*#region product-page*/
.product-image {
    aspect-ratio: 4 / 5;
    object-fit: cover;
    object-position: center;
    /*padding:0px 83px;*/
}

.interactive-buttons {
    position: absolute;
    top: 24px;
    right: 24px;
}

.interactive-button {
    width: 35px;
    height: 35px;
    border-radius: 50%;
    background-color: var(--contrast-color);
    box-shadow: 0px 2px 4px 0px var(--base-color-25);
}

.interactive-button-heart-icon {
    position: relative;
    top: 0px;
    right: 0px;
}

.interactive-button-share-icon {
    position: relative;
    top: -1px;
    right: 1px;
}

.back-button {
    width: 35px;
    height: 35px;
    border-radius: 50%;
    background-color: var(--contrast-color);
    box-shadow: 0px 2px 4px 0px var(--base-color-25);
    position: absolute;
    top: 24px;
    left: 24px;
}

.product-content {
    border-radius: 30px 30px 0px 0px;
    width: 100%;
    padding: 0px 24px 24px;
    position: fixed;
    bottom: 140px;
    left: 0;
    right: 0;
    background-color: var(--body-color);
    /*box-shadow: 0 -5px 30px rgba(0,0,0,.2);*/
    /*height: 95vh;*/
    height: calc(100dvh - 140px);
    z-index: 9999;
    touch-action: none;
}

.show-gallery-button {
    position: absolute;
    top: -46px;
    right: 24px;
    background-color: var(--body-color);
    padding: 6px 8px;
    border-radius: 55px;
    box-shadow: 0px 2px 4px 0px var(--base-color-25);
}

.show-gallery-button-text {
    font-family: Persian-Regular;
    font-size: 10px;
    color: var(--base-color);
    position: relative;
    top: 1px;
}

.product-content-header {
    padding-bottom: 8px;
    border-bottom: 1px solid var(--primary-color);
}

.product-name {
    font-family: Persian-Bold;
    font-size: 16px;
    color: var(--base-color);
    position: relative;
}







.product-oldPrice-number {
    font-family: Persian-Medium;
    font-size: 16px;
    color: var(--grey-color);
}

.product-oldPrice-tooman {
    font-family: Persian-Regular;
    font-size: 10px;
    color: var(--grey-color);
}

.product-price-number {
    font-family: Persian-ExtraBold;
    font-size: 16px;
    color: var(--base-color);
}

.product-price-tooman {
    font-family: Persian-Regular;
    font-size: 10px;
    color: var(--base-color);
}




.product-discount-percent-label {
    width: 35px;
    height: 35px;
    border-radius: 50%;
    background-color: var(--primary-color);
    box-shadow: 0px 2px 4px 0px var(--base-color-25);
    font-family: Persian-SemiBold;
    font-size: 12px;
    color: var(--contrast-color);
}

.product-discount-percent-label-value {
    position: relative;
    top: 2px;
}

/*#region bs dropdown*/
.btn-dropdown-product-page {
    min-width: 76px;
    /*width: 76px;*/
    height: 34px;
    padding: 5px 8px;
    border-radius: 55px;
    background-color: var(--contrast-color);
    box-shadow: 0px 2px 4px 0px var(--base-color-25);
}

    .btn-dropdown-product-page.show {
        background-color: var(--secondary-color);
        box-shadow: none;
    }

        .btn-dropdown-product-page.show .btn-dropdown-chevron-down-svg {
            transform: rotate(180deg);
        }

/*.dropdown-toggle::after {
    display: none;
}*/

.custom-dropdown-product-page-menu {
    box-shadow: none;
    border-radius: 15px;
    background-color: var(--secondary-color);
    border: 1px solid var(--base-color-25);
}

.custom-dropdown-product-page-menu-item {
    width: 100%;
    padding: 8px 16px;
    border-bottom: 1px solid var(--base-color-25);
    font-family: Persian-Medium;
    font-size: 12px;
    color: var(--base-color);
    text-wrap: nowrap;
}

.custom-dropdown-product-page-menu li:last-of-type button {
    border-bottom: none;
}
/*#endregion bs dropdown*/

.product-feature-container {
    /*width: 110px;*/
}

.product-feature-title {
    font-family: Persian-SemiBold;
    font-size: 14px;
    color: var(--base-color);
    display: inline-block;
    width: 30px;
}

.product-feature-select-button {
    min-width: 76px;
    /*width: 76px;*/
    height: 34px;
    padding: 5px 8px;
    border-radius: 55px;
    background-color: var(--contrast-color);
    box-shadow: 0px 2px 4px 0px var(--base-color-25);
}

.product-feature-selected-text {
    font-family: Persian-Medium;
    font-size: 14px;
    color: var(--base-color);
    text-wrap: nowrap;
}

.product-color-selected-sample {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    border: 1px solid var(--base-color-25);
}

.product-feature-select-options {
    border-radius: 15px;
    background-color: var(--secondary-color);
    position: absolute;
    top: 36px;
    right: 0px;
    border: 1px solid var(--base-color-25);
    z-index: 1;
}

.product-feature-select-option {
    min-width: 76px;
    padding: 8px 16px;
    border-bottom: 1px solid var(--base-color-25);
    font-family: Persian-Medium;
    font-size: 12px;
    color: var(--base-color);
    text-wrap: nowrap;
}

    .product-feature-select-option:last-of-type {
        border-bottom: none;
    }

.product-feature-select-option-sample {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    border: 1px solid var(--base-color-25);
}






.product-code {
    font-family: Persian-Regular;
    font-size: 14px;
    color: var(--base-color);
}






.product-description-container {
}

.product-description {
    font-family: Persian-Regular;
    font-size: 12px;
    color: var(--base-color);
    line-height: 24px;
}

.product-description-text {
    padding: 0px 16px;
    height: calc(100dvh - 582px);
    overflow-y: auto;
}

    /* width */
    .product-description-text::-webkit-scrollbar {
        width: 3px;
    }

    /* Track */
    .product-description-text::-webkit-scrollbar-track {
        background: var(--primary-color-25);
    }

    /* Handle */
    .product-description-text::-webkit-scrollbar-thumb {
        background: var(--primary-color);
        border-radius: 8px;
    }

.product-description-button {
    font-family: Persian-SemiBold;
    font-size: 12px;
    color: var(--primary-color);
    margin-right: 8px;
}

.product-content-footer {
    padding: 16px 24px;
    position: fixed;
    bottom: 72px;
    z-index: 10000;
    width: 100%;
    background-color: var(--body-color);
}

.product-addToCart-button {
    height: 50px;
    border: none;
    border-radius: 47px;
    background-color: var(--primary-color);
    box-shadow: -3px 3px 4px 0px var(--primary-color-25);
    font-family: Persian-SemiBold;
    font-size: 16px;
    color: var(--contrast-color);
    width: 100%;
}

.cart-button-icon {
    position: relative;
    top: -1px;
}

.cart-button-icon-badge {
    width: 21px;
    height: 21px;
    border-radius: 50%;
    background-color: var(--primary-color);
    font-family: Persian-Medium;
    font-size: 12px;
    color: var(--contrast-color);
    position: absolute;
    top: -16px;
    left: 16px;
}

.cart-button-icon-badge-number {
    position: relative;
    top: 2px;
}

.product-outOfStock-button {
    height: 50px;
    /*border: 1px solid var(--primary-color);*/
    border-radius: 47px;
    background-color: var(--contrast-color);
    box-shadow: -3px 3px 4px 0px var(--primary-color-25);
    font-family: Persian-SemiBold;
    font-size: 14px;
    color: var(--primary-color);
    width: 100%;
}

.main-product-page-bottom {
    width: 100vw;
    height: 71px;
    position: fixed;
    bottom: 0px;
    z-index: 9999;
    background-color: var(--body-color);
}
/*#endregion product-page*/

/*#region VitrinoFooter*/
.vitrino-footer {
    width: 100%;
    padding: 16px 8px 8px 16px;
    background-color: var(--light-grey-color);
    justify-self: flex-end;
    align-self: flex-end;
    position: relative;
}

.vitrino-footer-landing-page {
    margin-bottom: 71px !important;
}

.vitrino-footer-text {
    font-family: Persian-Regular;
    font-size: 12px;
    color: var(--grey-color);
}

.vitrino-footer-link {
    font-family: Persian-Regular;
    font-size: 12px;
    color: var(--blue-color);
}

.vitrino-footer-enamad {
    cursor: pointer;
    /*width: 45px;*/
    width: 49px;
    height: 49px;
}

.vitrino-footer-enamad-image {
    cursor: pointer;
    width: 49px;
    height: 49px;
    object-fit: cover;
    object-position: center;
}

.vitrino-footer-copyRight {
    font-family: Persian-Regular;
    font-size: 10px;
    color: var(--grey-color);
}

/*#endregion VitrinoFooter*/

/*#region VitrinoFooterMenu*/
.vitrino-footer-menu {
    width: calc(100% - 32px);
    margin: 0px 16px;
    padding: 0px 24px;
    height: 55px;
    background-color: var(--contrast-color);
    border-radius: 35px;
    box-shadow: 0px 2px 6px 0px var(--primary-color-25);
    position: fixed;
    bottom: 16px;
    z-index: 9999;
}

.vitrino-footer-menu-link {
    font-family: Persian-Medium;
    font-size: 12px;
    color: var(--primary-color);
}

/*#endregion VitrinoFooterMenu*/

/*#region go-to-top*/
.go-to-top-btn-container {
    position: sticky;
    bottom: 79px;
    width: 100%;
    margin-bottom: 16px;
}

.go-to-top-btn {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    border: 0.5px solid var(--primary-color);
    background-color: var(--body-color);
    box-shadow: 0px 3px 4px 0px var(--primary-color-25);
    outline: none;
    position: absolute;
    bottom: 0px;
    right: 16px;
}

/*#endregion go-to-top*/

/*#region modal*/
.modal-close-button {
    width: 35px;
    height: 35px;
    border-radius: 50%;
    background-color: var(--contrast-color);
    box-shadow: 0px 2px 4px 0px var(--base-color-25);
    position: absolute;
    top: 16px;
    left: 16px;
}
/*#endregion modal*/

/*#region productGallery*/
.modal {
    z-index: 11111 !important;
}

#productGalleryModalContent {
    border-radius: 20px;
    box-shadow: 0px 0px 8px 4px var(--base-color-25);
}

.productGallery {
    /* width: 330px; */
    /* height: 504px; */
    background-color: var(--body-color);
    /* border: 1px solid var(--base-color); */
    border-radius: 20px;
    /*padding: 64px 0px 24px;*/
    /*padding: 32px 0px 16px;*/
    padding: 44px 0px 16px;
    width: 100%;
}

.productGallery-title {
    font-family: Persian-Bold;
    font-size: 18px;
    color: var(--base-color);
}



/* swiperGallery */

.swiperGallery {
    width: 100%;
    height: 360px;
    margin-left: auto;
    margin-right: auto;
    --swiper-pagination-color: var(--contrast-color);
    /*--swiper-navigation-color: var(--primary-color);*/
}

    .swiperGallery .swiper-slide {
        background-size: cover;
        background-position: center;
        text-align: center;
        display: flex;
        justify-content: center;
        align-items: center;
    }

        .swiperGallery .swiper-slide img {
            display: block;
            width: 260px;
            height: 325px;
            border-radius: 20px;
            object-fit: cover;
            object-position: center;
            border: 1px solid var(--primary-color);
        }

    .swiperGallery .swiper-button-next,
    .swiperGallery .swiper-button-prev {
        color: var(--primary-color);
        /*border: 1.75px solid var(--primary-color);*/
        /*border-radius: 50%;*/
        width: 24px;
        height: 24px;
    }

        .swiperGallery .swiper-button-next:after,
        .swiperGallery .swiper-button-prev:after {
            font-size: 14px;
            font-weight: 800;
        }



.swiperGalleryThumbs {
    height: 20%;
    box-sizing: border-box;
    padding: 8px;
}

    .swiperGalleryThumbs .swiper-slide img {
        display: block;
        width: 84px;
        height: 105px;
        border-radius: 20px;
        object-fit: cover;
        object-position: center;
        border: 1px solid var(--primary-color);
    }

    .swiperGalleryThumbs .swiper-slide {
        width: 84px !important;
        height: 105px;
        border-radius: 20px;
        /*opacity: 0.4;*/
        filter: brightness(0.5);
    }

    .swiperGalleryThumbs .swiper-slide-thumb-active {
        /*opacity: 1;*/
        filter: brightness(1);
    }

/*#endregion productGallery*/

/* #region cart */
#cartModal .modal-content {
    border-radius: 20px;
    background-color: var(--body-color);
}

#cartModal .modal-header {
    padding: 24px 0px 16px;
    border-bottom: 0px;
}

.cart-title {
    width: 100%;
    font-family: Persian-Bold;
    font-size: 16px;
    color: var(--base-color);
    text-align: center;
}

#cartModal .modal-body {
    padding: 0px 0px 24px;
}

.cart-cards {
    width: 100%;
    padding: 0px 16px;
}

.cart-card {
    width: 100%;
    padding: 16px 8px 16px 16px;
    border-radius: 10px;
    background-color: var(--contrast-color);
    box-shadow: -1px 1px 4px 0 var(--primary-color-25);
}

.cart-card-image {
    width: 80px;
    height: 100px;
    /*aspect-ratio: 4 / 5;*/
    object-fit: cover;
    object-position: center;
    border-radius: 10px;
}

.cart-card-details {
    /*padding: 8px 0px;*/
}

.cart-card-details-title {
    font-family: Persian-Bold;
    font-size: 12px;
    color: var(--base-color);
}

.cart-card-details-old-price {
    top: 1px;
}

.cart-card-details-old-price-number {
    font-family: Persian-Medium;
    font-size: 12px;
    color: var(--grey-color);
}

.cart-card-details-old-price-tooman {
    font-family: Persian-Regular;
    font-size: 10px;
    color: var(--base-color);
}

.cart-card-details-price-number {
    font-family: Persian-Bold;
    font-size: 14px;
    color: var(--base-color);
}

.cart-card-details-price-tooman {
    font-family: Persian-Regular;
    font-size: 10px;
    color: var(--base-color);
}

.cart-card-details-code {
    top: 4px;
}

.cart-card-details-code-text {
    font-family: Persian-Medium;
    font-size: 12px;
    color: var(--base-color);
}

.cart-card-details-code-value {
    font-family: Persian-Medium;
    font-size: 12px;
    color: var(--base-color);
}

.cart-card-details-feature-size {
    height: 22px;
    padding: 0px 16px;
    border-radius: 15px;
    border: 1.5px solid var(--primary-color);
    font-family: Persian-Medium;
    font-size: 12px;
    color: var(--base-color);
}

.cart-card-details-feature-size-value {
    position: relative;
    top: 2px;
}

.cart-card-details-feature-color {
    width: 22px;
    height: 22px;
    border-radius: 50%;
}

.cart-card-details-feature-color-name {
    font-family: Persian-Medium;
    font-size: 12px;
    color: var(--base-color);
    position: relative;
    top: 1px;
}

.cart-card-trash-button {
    position: absolute;
    top: 8px;
    left: 8px;
}

.cart-card-quantity {
    position: absolute;
    bottom: 16px;
    left: 16px;
}

.cart-card-quantity-number {
    font-family: Persian-Medium;
    font-size: 16px;
    color: var(--primary-color);
    position: relative;
    top: 2px;
}

.cart-card-quantity-button {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    border: 1.5px solid var(--primary-color);
    background-color: var(--contrast-color);
    cursor: pointer;
}

.cart-summary {
    width: 100%;
}

.cart-summary-items {
    width: 100%;
    padding: 8px 24px;
    border-top: 0.5px solid var(--primary-color);
    /*border-bottom: 0.5px solid var(--primary-color);*/
}

.cart-summary-item {
    padding-bottom: 8px;
    border-bottom: 0.5px dashed var(--primary-color);
    margin-bottom: 8px;
}

    .cart-summary-item:last-of-type {
        padding-bottom: 0px;
        border-bottom: 0px;
        margin-bottom: 0px;
    }

.cart-summary-item-title {
    font-family: Persian-SemiBold;
    font-size: 12px;
    color: var(--base-color);
}

.cart-summary-item-value {
    font-family: Persian-SemiBold;
    font-size: 12px;
    color: var(--base-color);
}

.cart-summary-tooman {
    font-family: Persian-Regular;
    font-size: 10px;
    color: var(--base-color);
}

.cart-summary-payable {
    width: 100%;
    padding: 16px 24px 32px;
    border-top: 0.5px solid var(--primary-color);
}

.cart-summary-payable-title {
    font-family: Persian-Bold;
    font-size: 14px;
    color: var(--base-color);
}

.cart-summary-payable-value {
    font-family: Persian-Bold;
    font-size: 14px;
    color: var(--base-color);
}

.cart-summary-payable-tooman {
    font-family: Persian-Medium;
    font-size: 12px;
    color: var(--base-color);
}

.cart-payment-button {
    width: 235px;
    height: 52px;
    /*padding: 14px 91px;*/
    border-radius: 49px;
    background-color: var(--primary-color);
    box-shadow: -3px 3px 4px 0 var(--primary-color-25);
    font-family: Persian-SemiBold;
    font-size: 16px;
    color: var(--contrast-color);
}

.cart-empty-text {
    font-family: Persian-Medium;
    font-size: 14px;
    color: var(--base-color);
}
/* #endregion cart */

/*#region TestPaymentGateway*/
.test-payment-gateway-container {
    width: 100vw;
    height: 100vh;
    background-color: var(--contrast-color);
    padding: 80px 56px 100px;
}

.payment-gateway-title {
    font-family: Persian-Bold;
    font-size: 18px;
    color: var(--base-color);
    margin-bottom: 24px;
}

.payment-gateway-description {
    font-family: Persian-Medium;
    font-size: 14px;
    line-height: 24px;
    color: var(--base-color);
    text-align: center;
    margin-bottom: 48px;
}

.payment-gateway-value-title {
    font-family: Persian-SemiBold;
    font-size: 14px;
    line-height: 24px;
    color: var(--base-color);
}

.payment-gateway-value-number {
    font-family: Persian-SemiBold;
    font-size: 14px;
    line-height: 24px;
    color: var(--base-color);
}

.payment-gateway-value-small {
    font-family: Persian-Medium;
    font-size: 14px;
    line-height: 24px;
    color: var(--base-color);
}

.payment-gateway-value-text {
    font-family: Persian-Medium;
    font-size: 14px;
    line-height: 24px;
    color: var(--base-color);
    text-align: center;
    margin-bottom: 56px;
}

.payment-gateway-btn {
    width: 126px;
    height: 44px;
    border-radius: 51px;
    box-shadow: -3px 3px 4px 0px var(--primary-color-25);
    font-family: Persian-Medium;
    font-size: 14px;
    color: var(--contrast-color);
}

.payment-gateway-successful {
    background-color: var(--green-color);
}

.payment-gateway-unsuccessful {
    background-color: var(--yellow-color);
}

.payment-gateway-cancelled {
    background-color: var(--red-color);
}

/*#endregion TestPaymentGateway*/

/* #region PaymentResult */
.payment-result-container {
    /*margin-top: 179px;*/
    /*margin-top: 94px;*/
    padding: 56px 0px 0px;
    height: 100vh;
    gap: 100px;
}

.payment-result-date-time {
    padding: 0px 64px;
}

.payment-result-date {
    font-family: Persian-Medium;
    font-size: 14px;
    line-height: 25px;
    color: var(--base-color);
}

.payment-result-time {
    font-family: Persian-Medium;
    font-size: 14px;
    line-height: 25px;
    color: var(--base-color);
}

.payment-result-title-successful {
    font-family: Persian-Bold;
    font-size: 16px;
    line-height: 42px;
    color: var(--green-color);
}

.payment-result-title-unsuccessful {
    font-family: Persian-Bold;
    font-size: 16px;
    line-height: 42px;
    color: var(--red-color);
}

.payment-result-text {
    font-family: Persian-Bold;
    font-size: 14px;
    line-height: 25px;
    color: var(--base-color);
    text-align: center;
}

.payment-result-description {
    font-family: Persian-Medium;
    font-size: 12px;
    line-height: 25px;
    color: var(--base-color);
    text-align: center;
    padding: 0px 50px;
}

.payment-result-details {
    width: 100%;
    padding: 0px 85px;
    margin-bottom: 32px;
}

.payment-result-details-text {
    font-family: Persian-SemiBold;
    font-size: 14px;
    line-height: 25px;
    color: var(--base-color);
}

.payment-result-details-value {
    font-family: Persian-SemiBold;
    font-size: 14px;
    line-height: 25px;
    color: var(--base-color);
}

.payment-result-button {
    padding: 12px 24px;
    outline: none;
    border-radius: 51px;
    box-shadow: -3px 3px 4px 0px var(--primary-color-25);
    font-family: Persian-Medium;
    font-size: 14px;
    line-height: 25px;
}

.back-to-vitrin-button {
    background-color: var(--primary-color);
    color: var(--contrast-color);
    border: none;
}

.go-to-orders-button {
    background-color: var(--contrast-color);
    color: var(--primary-color);
    border: 1px solid var(--primary-color);
}
/* #endregion PaymentResult */

/*#region others*/
.opacity-05 {
    opacity: 0.5;
}

.product-card-red-strikethrough {
    width: 100%;
    height: 1px;
    border-bottom: 1px solid var(--red-color);
    position: absolute;
    top: 8px;
    right: 0px;
}

.product-page-red-strikethrough {
    width: 100%;
    height: 1px;
    border-bottom: 1px solid var(--red-color);
    position: absolute;
    top: 10px;
    right: 0px;
}

.cart-card-red-strikethrough {
    width: 100%;
    height: 1px;
    border-bottom: 1px solid var(--red-color);
    position: absolute;
    top: 7px;
    right: 0px;
}

.order-details-card-red-strikethrough {
    width: 100%;
    height: 1px;
    border-bottom: 1px solid var(--red-color);
    position: absolute;
    top: 7px;
    right: 0px;
}

.custom-color-primary {
    color: var(--primary-color);
}

.custom-color-white {
    color: var(--contrast-color);
}

.multiline-display {
    /*white-space: pre-wrap;*/
    white-space: pre-line;
    /*word-wrap: break-word;*/
}
/*#endregion others*/

/* #region CustomerRegisteration */
.customer-registeration-form {
    /*padding: 16px 32px 48px;*/
    padding: 16px 32px 80px;
}

.customer-registeration-form-label {
    font-family: Persian-Medium;
    font-size: 14px;
    color: var(--base-color);
    margin-bottom: 4px;
}

.customer-registeration-form-label-required {
    margin-right: 4px;
}

.customer-registeration-form-label-optional {
    margin-right: 8px;
}

.required-star {
    font-family: Persian-Medium;
    font-size: 16px;
    color: var(--red-color);
}

.customer-registeration-form-control {
    height: 40px;
    border-radius: 10px;
    border: 0.75px solid var(--base-color);
    background-color: var(--contrast-color);
    outline: none;
    padding: 0px 16px;
    font-family: Persian-Regular;
    font-size: 14px;
    color: var(--base-color);
    box-shadow: 0px 2px 4px 0px var(--base-color-25);
}

    .customer-registeration-form-control::placeholder {
        font-family: Persian-Regular;
        font-size: 14px;
        color: var(--base-color);
        opacity: 0.5;
    }

.customer-registeration-form-control-readonly {
    background-color: var(--light-grey-color) !important;
}

.customer-registeration-form-control-textArea {
    height: 72px !important;
    padding: 8px 16px;
    resize: none;
}

/* START Hide Arrows From Input Number */
/* Chrome, Safari, Edge, Opera */
/*.customer-registeration-form-control::-webkit-outer-spin-button,
.customer-registeration-form-control::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}*/

/* Firefox */
/*.customer-registeration-form-control input[type=number] {
    -moz-appearance: textfield;
}*/
/* END Hide Arrows From Input Number */

.customer-registeration-button {
    padding: 12px 24px;
    outline: none;
    border-radius: 51px;
    box-shadow: -3px 3px 4px 0px var(--primary-color-25);
    font-family: Persian-Medium;
    font-size: 14px;
    line-height: 25px;
}

.customer-registeration-submit-button {
    background-color: var(--primary-color);
    color: var(--contrast-color);
    border: none;
}

.customer-registeration-cancel-button {
    background-color: var(--contrast-color);
    color: var(--primary-color);
    border: 1px solid var(--primary-color);
}

/* #endregion CustomerRegisteration */

/* #region CustomerInformation */
.customer-information-page-container {
    padding: 24px 24px 64px;
}

.customer-information-title {
    font-family: Persian-Medium;
    font-size: 14px;
    color: var(--base-color);
}

.customer-information-text {
    font-family: Persian-Regular;
    font-size: 12px;
    color: var(--base-color);
}

.customer-information-birthDate-label {
    position: relative;
    right: 4px;
}

.customer-information-birthDate-input {
    width: 0px;
    height: 0px;
    opacity: 0;
}

.customer-information-radio-button {
    position: relative;
    top: 2px;
}

.customer-information-address-name {
    font-family: Persian-Medium;
    font-size: 12px;
    color: var(--base-color);
}

.customer-information-address-text {
    font-family: Persian-Regular;
    font-size: 12px;
    color: var(--base-color);
}

.customer-information-new-address-text {
    font-family: Persian-Medium;
    font-size: 12px;
    color: var(--primary-color);
    position: relative;
    top: 2px;
}

.customer-information-button {
    /*padding: 12px 24px;*/
    outline: none;
    border-radius: 51px;
    box-shadow: -3px 3px 4px 0px var(--primary-color-25);
    font-family: Persian-Medium;
    font-size: 16px;
    border: none;
}

.customer-information-submit-button {
    width: 136px;
    height: 51px;
    background-color: var(--primary-color);
    color: var(--contrast-color);
}

.customer-information-cancel-button {
    width: 107px;
    height: 51px;
    background-color: var(--contrast-color);
    color: var(--primary-color);
}

.customer-information-logout-text {
    font-family: Persian-SemiBold;
    font-size: 12px;
    line-height: 25px;
    color: var(--primary-color);
}
/* #endregion CustomerInformation */

/* #region OrderCompletion */
.order-completion-form {
    /*padding: 16px 16px 64px;*/
    padding: 16px 16px 0px;
}

.order-completion-form-divider {
    width: 100%;
    border-bottom: 1px dashed var(--primary-color);
}

.order-completion-form-title {
    font-family: Persian-SemiBold;
    font-size: 16px;
    color: var(--base-color);
}

.order-completion-radio-box {
    width: 100%;
    height: 64px;
    padding: 0px 8px 0px 16px;
    border-radius: 20px;
    border: 0.5px solid var(--primary-color);
    box-shadow: -3px 3px 4px 0px var(--primary-color-25);
}

.order-completion-radio-button {
    width: 0px;
    height: 0px;
    opacity: 0;
}

.order-completion-radio-box-title {
    font-family: Persian-Medium;
    font-size: 14px;
    color: var(--base-color);
}

.order-completion-radio-box-text {
    font-family: Persian-Medium;
    font-size: 12px;
    color: var(--base-color);
}

.order-completion-radio-box-value {
    font-family: Persian-Medium;
    font-size: 14px;
    color: var(--base-color);
}

.order-completion-radio-box-tooman {
    font-family: Persian-Regular;
    font-size: 12px;
    color: var(--base-color);
}

.order-completion-cart {
    width: 100%;
    padding: 24px 32px;
    background-color: var(--contrast-color);
    border-radius: 20px;
    box-shadow: -3px 3px 4px 0px var(--base-color-25);
}

.order-completion-cards {
    padding: 0px 4px;
}

.order-completion-card {
    padding: 8px 8px 8px 24px;
    background-color: var(--contrast-color);
    border-radius: 10px;
    border: 0.5px solid var(--primary-color);
    box-shadow: -1px 1px 4px 0px var(--primary-color-25);
}

.order-completion-card-image {
    /*width: 50px;*/
    width: 48px;
    aspect-ratio: 4 / 5;
    object-fit: cover;
    object-position: center;
    border-radius: 10px;
}

.order-completion-card-quantity {
    font-family: Persian-Bold;
    font-size: 14px;
    color: var(--primary-color);
}

.order-completion-card-quantity-text {
    font-family: Persian-Bold;
    font-size: 14px;
    color: var(--primary-color);
}

.order-completion-card-name {
    font-family: Persian-SemiBold;
    font-size: 12px;
    color: var(--base-color);
}



.order-completion-card-price {
    font-family: Persian-Bold;
    font-size: 14px;
    color: var(--base-color);
}

.order-completion-card-tooman {
    font-family: Persian-Regular;
    font-size: 10px;
    color: var(--base-color);
}


.order-completion-card-old-price {
    font-family: Persian-Medium;
    font-size: 12px;
    color: var(--grey-color);
}

.order-completion-card-old-price-line {
    width: 100%;
    height: 1px;
    background-color: var(--red-color);
    position: absolute;
    top: 7px;
    left: 0px;
    right: 0px;
}



.order-completion-card-color-sample {
    width: 16px;
    height: 16px;
    border-radius: 50%;
    border: 0.25px solid var(--grey-color);
}

.order-completion-card-color-name {
    font-family: Persian-Regular;
    font-size: 12px;
    color: var(--base-color);
}

.order-completion-card-size-text {
    font-family: Persian-Medium;
    font-size: 12px;
    color: var(--base-color);
}

.order-completion-card-size-value {
    font-family: Persian-Medium;
    font-size: 12px;
    color: var(--base-color);
}




.order-completion-cart-item {
    padding-bottom: 8px;
    border-bottom: 0.5px dashed var(--primary-color);
}


.order-completion-cart-item-title {
    font-family: Persian-SemiBold;
    font-size: 12px;
    color: var(--base-color);
}

.order-completion-cart-item-value {
    font-family: Persian-SemiBold;
    font-size: 12px;
    color: var(--base-color);
}

.order-completion-cart-item-tooman {
    font-family: Persian-Regular;
    font-size: 10px;
    color: var(--base-color);
}








.order-completion-cart-payable-title {
    font-family: Persian-Bold;
    font-size: 14px;
    color: var(--base-color);
}

.order-completion-cart-payable-value {
    font-family: Persian-Bold;
    font-size: 14px;
    color: var(--base-color);
}

.order-completion-cart-payable-tooman {
    font-family: Persian-Medium;
    font-size: 12px;
    color: var(--base-color);
}






.order-completion-discount-code-input {
    width: 100%;
    /*width: calc(100vw - 223px);*/
    min-width: 110px;
    height: 40px;
    padding: 0px 16px;
    border: 0.75px solid var(--primary-color);
    border-radius: 10px;
    background-color: var(--contrast-color);
    box-shadow: 0px 2px 4px 0px var(--base-color-25);
    outline: none;
    font-family: Persian-Regular;
    font-size: 14px;
    color: var(--base-color);
    text-align: center;
}

.order-completion-discount-code-button {
    height: 40px;
    padding: 0px 18px;
    outline: none;
    border-radius: 51px;
    background-color: var(--primary-color);
    box-shadow: -3px 3px 4px 0px var(--primary-color-25);
    font-family: Persian-Medium;
    font-size: 14px;
    line-height: 25px;
    color: var(--contrast-color);
    text-wrap: nowrap;
}

.order-completion-description-input {
    height: 85px;
    padding: 8px 16px;
    border: 0.75px solid var(--primary-color);
    border-radius: 10px;
    background-color: var(--contrast-color);
    box-shadow: 0px 2px 4px 0px var(--base-color-25);
    outline: none;
    font-family: Persian-Regular;
    font-size: 14px;
    color: var(--base-color);
    resize: none;
    margin: 0px 24px;
}

.order-completion-button {
    height: 52px;
    outline: none;
    border: none;
    border-radius: 51px;
    box-shadow: -3px 3px 4px 0px var(--primary-color-25);
}

.order-completion-submit-button {
    width: 235px;
    background-color: var(--primary-color);
    font-family: Persian-SemiBold;
    font-size: 16px;
    color: var(--contrast-color);
}

.order-completion-cancel-button {
    width: 107px;
    background-color: var(--contrast-color);
    font-family: Persian-Medium;
    font-size: 16px;
    color: var(--primary-color);
}



/* #endregion OrderCompletion */

/* #region CustomerOrders */
.customer-orders-container {
    padding: 16px 16px 80px;
    width: 100%;
}

.customer-orders-tabs {
    width: calc(100% - 16px);
    border: 0.5px solid var(--primary-color);
    border-radius: 30px;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    grid-template-rows: 1fr;
    gap: 0px 0px;
    grid-template-areas: ". . .";
}

.customer-orders-tab {
    height: 48px;
    font-family: Persian-SemiBold;
    font-size: 12px;
    color: var(--grey-color);
    outline: none;
}

.customer-orders-tab-number {
    font-family: Persian-Regular;
    font-size: 12px;
}

.customer-orders-tab-active {
    background-color: var(--secondary-color);
    color: var(--base-color);
}

.customer-orders-tab-right {
    border-radius: 0px 30px 30px 0px;
}

.customer-orders-tab-left {
    border-radius: 30px 0px 0px 30px;
}

.customer-orders-tab-center {
    border-right: 0.5px solid var(--primary-color);
    border-left: 0.5px solid var(--primary-color);
}

.customer-orders-tab-active.customer-orders-tab-right {
    box-shadow: -2px 0px 2px 0px var(--base-color-25);
}

.customer-orders-tab-active.customer-orders-tab-left {
    box-shadow: 2px 0px 2px 0px var(--base-color-25);
}

.customer-orders-tab-active.customer-orders-tab-center {
    box-shadow: -2px 0px 2px 0px var(--base-color-25),2px 0px 2px 0px var(--base-color-25);
}

.order-card {
    background-color: var(--contrast-color);
    border-radius: 0px 0px 20px 20px;
    box-shadow: -2px 2px 4px 0px var(--primary-color-25);
    position: relative;
}

.order-card-header {
    /*height: 33px;*/
    padding: 9px 8px 6px;
    background-color: var(--primary-color);
    border-bottom: 1px dashed var(--contrast-color);
}

.order-card-header-order-date {
    font-family: Persian-Medium;
    font-size: 12px;
    color: var(--contrast-color);
}

.order-card-header-order-code-text {
    font-family: Persian-Medium;
    font-size: 12px;
    color: var(--contrast-color);
}

.order-card-header-order-code-value {
    font-family: Persian-Medium;
    font-size: 12px;
    color: var(--contrast-color);
}

.order-card-body {
    /*padding: 11px 16px 22px;*/
    /*padding: 16px 16px 24px;*/
    padding: 12px 16px 40px;
}

.order-card-body-title {
    width: 74px;
    font-family: Persian-Medium;
    font-size: 12px;
    color: var(--base-color);
}

.order-card-body-status {
    font-family: Persian-Bold;
    font-size: 12px;
}

.order-card-body-status-registered {
    color: var(--yellow-color);
}

.order-card-body-status-preparing {
    color: var(--yellow-color);
}

.order-card-body-status-submitted {
    color: var(--green-color);
}

.order-card-body-status-canceled {
    color: var(--red-color);
}

.order-card-body-amount {
    font-family: Persian-Medium;
    font-size: 12px;
    color: var(--base-color);
}

.order-card-body-tooman {
    font-family: Persian-Regular;
    font-size: 10px;
    color: var(--base-color);
}

.order-card-body-line {
    width: calc(375px - 325px);
    height: 0.5px;
    background-color: var(--primary-color);
    margin-left: 12px;
}

.order-card-button {
    padding: 7px 14px;
    border: 1px solid var(--primary-color);
    border-radius: 23px;
    box-shadow: 0px 2px 4px 0px var(--primary-color-25);
    font-family: Persian-Medium;
    font-size: 12px;
    color: var(--primary-color);
    position: absolute;
    bottom: 8px;
    left: 8px;
}

.order-card-button-text {
    position: relative;
    top: 1px;
}
/* #endregion CustomerOrders */

/* #region CustomerOrderDetails */
#customerOrderDetailsModal .modal-content {
    border-radius: 20px;
    background-color: var(--body-color);
}

#customerOrderDetailsModal .modal-header {
    /*padding: 24px 0px 16px;*/
    padding: 24px 0px 20px;
    border-bottom: 0px;
}

.order-details-title {
    width: 100%;
    font-family: Persian-Medium;
    font-size: 16px;
    color: var(--base-color);
    text-align: center;
}

#customerOrderDetailsModal .modal-body {
    padding: 0px 0px 24px;
}



.customer-order-status {
    width: 100%;
    padding: 16px 24px;
    border-top: 1px dashed var(--grey-color);
    border-bottom: 1px dashed var(--grey-color);
}

.customer-order-status-title {
    font-family: Persian-Medium;
    font-size: 12px;
    color: var(--grey-color);
}

.customer-order-status-title-active {
    font-family: Persian-Bold;
    font-size: 12px;
    color: var(--primary-color);
}

.customer-order-status-title-passed {
    font-family: Persian-Medium;
    font-size: 12px;
    color: var(--primary-color);
}

.customer-order-status-icons {
    padding: 0px 16px;
}

.customer-order-status-line {
    width: 100%;
    border-bottom: 1px solid var(--grey-color);
}

.customer-order-status-line-passed {
    width: 100%;
    border-bottom: 1px solid var(--primary-color);
}

.customer-order-status-title-preparing {
    position: relative;
    left: 8px;
}



.order-details-cards {
    width: 100%;
    padding: 0px 16px;
}

.order-details-card {
    width: 100%;
    padding: 16px 8px 16px 16px;
    border-radius: 10px;
    background-color: var(--contrast-color);
    box-shadow: -1px 1px 4px 0 var(--primary-color-25);
}

.order-details-card-image {
    width: 80px;
    height: 100px;
    /*aspect-ratio: 4 / 5;*/
    object-fit: cover;
    object-position: center;
    border-radius: 10px;
}

.order-details-card-title {
    font-family: Persian-Bold;
    font-size: 12px;
    color: var(--base-color);
}

.order-details-card-old-price {
    top: 1px;
}

.order-details-card-old-price-number {
    font-family: Persian-Medium;
    font-size: 12px;
    color: var(--grey-color);
}

.order-details-card-old-price-tooman {
    font-family: Persian-Regular;
    font-size: 10px;
    color: var(--base-color);
}

.order-details-card-price-number {
    font-family: Persian-Bold;
    font-size: 14px;
    color: var(--base-color);
}

.order-details-card-price-tooman {
    font-family: Persian-Regular;
    font-size: 10px;
    color: var(--base-color);
}

.order-details-card-code {
    top: 4px;
}

.order-details-card-code-text {
    font-family: Persian-Medium;
    font-size: 12px;
    color: var(--base-color);
}

.order-details-card-code-value {
    font-family: Persian-Medium;
    font-size: 12px;
    color: var(--base-color);
}

.order-details-card-feature-size {
    height: 22px;
    padding: 0px 16px;
    border-radius: 15px;
    border: 1.5px solid var(--primary-color);
    font-family: Persian-Medium;
    font-size: 12px;
    color: var(--base-color);
}

.order-details-card-feature-size-value {
    position: relative;
    top: 2px;
}

.order-details-card-feature-color {
    width: 22px;
    height: 22px;
    border-radius: 50%;
}

.order-details-card-feature-color-name {
    font-family: Persian-Medium;
    font-size: 12px;
    color: var(--base-color);
    position: relative;
    top: 1px;
}

.order-details-card-quantity {
    /*width: 56px;*/
    /*height: 29px;*/
    padding: 6px 12px;
    border: 1.5px solid var(--primary-color);
    border-radius: 25px;
    font-family: Persian-Medium;
    font-size: 12px;
    color: var(--primary-color);
    position: absolute;
    bottom: 16px;
    left: 16px;
}

.order-details-card-quantity-number {
    position: relative;
    top: 2px;
}

.order-details-card-quantity-text {
    position: relative;
    top: 2px;
}

.order-details-summary {
    width: 100%;
}

.order-details-summary-items {
    width: 100%;
    padding: 8px 24px;
    border-top: 0.5px solid var(--primary-color);
    border-bottom: 0.5px solid var(--primary-color);
}

.order-details-summary-item {
    padding-bottom: 8px;
    border-bottom: 0.5px dashed var(--primary-color);
    margin-bottom: 8px;
}

    .order-details-summary-item:last-of-type {
        padding-bottom: 0px;
        border-bottom: 0px;
        margin-bottom: 0px;
    }

.order-details-summary-item-title {
    font-family: Persian-SemiBold;
    font-size: 12px;
    color: var(--base-color);
    line-height: 20px;
}

.order-details-summary-item-title-date {
    font-family: Persian-SemiBold;
    font-size: 10px;
    color: var(--base-color);
    line-height: 20px;
}

.order-details-summary-item-title-address {
    font-family: Persian-SemiBold;
    font-size: 10px;
    color: var(--base-color);
    line-height: 20px;
}

.order-details-summary-item-value {
    font-family: Persian-SemiBold;
    font-size: 12px;
    color: var(--base-color);
    line-height: 20px;
}

.order-details-summary-item-value-date {
    font-family: Persian-SemiBold;
    font-size: 10px;
    color: var(--base-color);
    line-height: 20px;
}

.order-details-summary-item-value-time {
    font-family: Persian-SemiBold;
    font-size: 10px;
    color: var(--base-color);
    line-height: 20px;
}

.order-details-summary-item-value-address {
    font-family: Persian-SemiBold;
    font-size: 10px;
    color: var(--base-color);
    line-height: 20px;
    width: 166px;
    /*width: calc(100vw - 209px);*/
}

.order-details-summary-tooman {
    font-family: Persian-Medium;
    font-size: 10px;
    color: var(--base-color);
}

.order-details-shipping-description {
    padding: 0px 32px;
    font-family: Persian-Medium;
    font-size: 12px;
    color: var(--base-color);
    line-height: 20px;
    text-align: center;
}

/* #endregion CustomerOrderDetails */

/* #region byShelfino */
.byShelfino {
    width: 100%;
    padding: 8px 40px;
    background-color: var(--base-color);
    position: fixed;
    bottom: 0px;
}

.byShelfino-text {
    font-family: Persian-Light;
    font-size: 14px;
    color: var(--contrast-color);
}

/* #endregion byShelfino */

/* #region account main */
.header-container {
    /* padding: 138px 68px 0px; */
    padding: 94px 0px 0px;
    /*padding: 138px 0px 0px;*/
    margin-bottom: 40px;
}

.authentication-header-back-link {
    position: absolute;
    top: 32px;
    left: 32px;
}

.authentication-header-logo {
    width: 120px;
    height: 120px;
    border-radius: 50%;
    border: 1px solid var(--base-color);
}

.authentication-header-text {
    color: var(--base-color);
    font-family: Persian-Regular;
    font-size: 14px;
    line-height: 20px;
    text-align: center;
}

.form-container {
    padding: 0px 64px;
}

.authentication-input {
    width: 100%;
    height: 50px;
    /* padding: 16px 12px; */
    /*padding: 12px 52px 12px 52px;*/
    padding: 0px 52px 0px 52px;
    border: 0.75px solid var(--base-color);
    border-radius: 15px;
    background-color: var(--contrast-color);
    box-shadow: -2px 2px 4px 0px var(--base-color-25);
    outline: none;
    color: var(--base-color);
    font-family: Persian-Medium;
    font-size: 14px;
    direction: ltr;
}

    .authentication-input::placeholder {
        color: var(--base-color);
        font-family: Persian-Regular;
        font-size: 14px;
        opacity: 0.5;
    }

.authentication-input-label {
    position: absolute;
    top: 11px;
    left: 12px;
}

.authentication-password-eye-icon {
    position: absolute;
    top: 11px;
    right: 12px;
}

.authentication-text-link {
    color: var(--blue-color);
    font-family: Persian-Regular;
    font-size: 14px;
    margin-top: 8px;
}

.authentication-number-input::-webkit-outer-spin-button,
.authentication-number-input::-webkit-inner-spin-button {
    /* display: none; <- Crashes Chrome on hover */
    -webkit-appearance: none;
    margin: 0;
    /* <-- Apparently some margin are still there even though it's hidden */
}

.authentication-number-input[type=number] {
    -moz-appearance: textfield;
    /* Firefox */
}

.authentication-confirm-code-input {
    /* width: 100%; */
    width: 45px;
    height: 55px;
    /*padding: 12px 16px;*/
    border: 0.75px solid var(--base-color);
    border-radius: 15px;
    background-color: var(--contrast-color);
    box-shadow: -2px 2px 4px 0px var(--base-color-25);
    outline: none;
    color: var(--base-color);
    font-family: Persian-Regular;
    font-size: 20px;
    direction: ltr;
    text-align: center;
}

.change-password-success-container {
    /*padding-top: 235px;*/
    padding-top: 191px;
}

.password-success-form-text-1 {
    font-family: Persian-SemiBold;
    font-size: 18px;
    line-height: 32px;
    color: var(--base-color);
    text-align: center;
}

.password-success-form-text-2 {
    font-family: Persian-Medium;
    font-size: 16px;
    line-height: 28px;
    color: var(--base-color);
    text-align: center;
}

.authentication-btn-accept {
    padding: 16px 40px;
    outline: none;
    border-radius: 51px;
    background-color: var(--primary-color);
    box-shadow: -3px 3px 4px 0px var(--primary-color-25);
    color: var(--contrast-color);
    font-family: Persian-Bold;
    font-size: 16px;
}

.authentication-btn-accept-outline {
    padding: 16px 40px;
    outline: none;
    border-radius: 51px;
    background-color: var(--contrast-color);
    box-shadow: -3px 3px 4px 0px var(--base-color-25);
    color: var(--base-color);
    font-family: Persian-Medium;
    font-size: 16px;
}

.submitButtonSpinner {
    height: 60px;
}

/* #endregion account main */

/* #region Custom Modal */
.custom-modal-close-btn {
    width: 33px;
    height: 33px;
    background-color: var(--contrast-color);
    box-shadow: 0px 2px 4px 0px var(--box-shadow-black-color);
    border-radius: 50%;
    position: absolute;
    top: 8px;
    left: 8px;
}

.custom-modal-content {
    background-color: var(--body-color);
    border-radius: 20px;
    border: none;
}

.custom-modal-header {
    margin: 0px 24px 0px;
    padding: 24px 0px 8px;
    border-bottom: 0.75px solid var(--primary-color);
}

.custom-modal-title {
    font-family: Persian-SemiBold;
    font-size: 16px;
    color: var(--base-color);
}

.custom-modal-body {
    padding: 24px 24px 16px;
}

.custom-modal-form-label {
    font-family: Persian-Medium;
    font-size: 16px;
    color: var(--base-color);
    padding-right: 8px;
}

.custom-modal-form-control {
    height: 50px;
    border-radius: 15px;
    background-color: var(--contrast-color);
    border: 0.75px solid var(--base-color);
    padding: 0px 16px;
    font-family: Persian-Medium;
    font-size: 14px;
    color: var(--base-color);
    outline: none;
}

.custom-modal-form-control-primary {
    border: 0.75px solid var(--primary-color) !important;
}

.custom-modal-submit-btn {
    padding: 8px 20px;
    background-color: var(--primary-color);
    border-radius: 51px;
    border: none;
    box-shadow: -3px 3px 4px 0px var(--box-shadow-primary-color);
    font-family: Persian-SemiBold;
    font-size: 14px;
    color: var(--contrast-color);
}

.custom-modal-submit-btn-disabled {
    background-color: var(--grey-color);
    box-shadow: -3px 3px 4px 0px var(--box-shadow-black-color);
    color: var(--contrast-color);
}

/* #endregion Custom Modal */

/*#region ContactUs*/
.contactUs-page-container {
    /*padding: 16px 24px 0px;*/
    padding: 16px 24px 24px;
}

.contactUs-store-logo {
    width: 109px;
    height: 109px;
    object-fit: cover;
    object-position: center;
    border-radius: 50%;
    border: 0.5px solid var(--grey-color);
}

.contactUs-store-name {
    font-family: Persian-Bold;
    font-size: 18px;
    color: var(--base-color);
}

.contactUs-store-description {
    font-family: Persian-Medium;
    font-size: 14px;
    line-height: 28px;
    color: var(--base-color);
    text-align: justify;
    text-justify: inter-word;
    text-align-last: center;
}

.contactUs-store-description-more {
    font-family: Persian-SemiBold;
    font-size: 16px;
    line-height: 28px;
    color: var(--primary-color);
}

.contactUs-store-title {
    font-family: Persian-Bold;
    font-size: 16px;
    color: var(--base-color);
}

.contactUs-store-text {
    font-family: Persian-Medium;
    font-size: 14px;
    line-height: 28px;
    color: var(--base-color);
    text-align: justify;
    text-justify: inter-word;
    text-align-last: center;
}

.contactUs-store-link {
    font-family: Persian-SemiBold;
    font-size: 16px;
    color: var(--blue-color);
    position: relative;
    top: 4px;
}

.contactUs-store-map {
}

.contactUs-store-map-iframe {
    width: 100%;
    aspect-ratio: 4 / 3;
}
/*#endregion ContactUs*/

/*#region bottom-sheet*/
/*html,
body {
    margin: 0;
    padding: 0;
    overflow: hidden;
}*/

/*#sheet-backdrop {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,.25);
    opacity: 0;
    pointer-events: none;
    transition: .25s;
    z-index: 9998;
}*/

#sheet-header {
    /*height: 46px;*/
    height: 24px;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: grab;
}

.sheet-header-button {
    width: 47px;
    height: 42px;
    border-radius: 50%;
    background-color: var(--body-color);
    box-shadow: 0px -2px 2px 0px var(--primary-color-25);
    position: relative;
    top: -4px;
}

.sheet-header-button-icon {
    position: relative;
    top: -4px;
}

.sheet-bar {
    /*width: 80px;*/
    width: 100%;
    height: 4px;
    background: var(--grey-color);
    border-radius: 20px;
}

#sheet-body {
    height: calc(100% - 24px);
    /*overflow-y: auto;*/
    -webkit-overflow-scrolling: touch;
}

/*#endregion bottom-sheet*/

/*#region LandingPage*/
.landing-page-container-1 {
    width: 100vw;
    /*height: 100vh;*/
    /*height: 100dvh;*/
    position: relative;
}

.landing-page-container-2 {
    width: 100vw;
    /*height: 100vh;*/
    /*height: 100dvh;*/
    position: relative;
}

.landing-page-welcome-1 {
    width: 100%;
    height: 100dvh;
    position: fixed;
    top: 0px;
    right: 0px;
    left: 0px;
    opacity: 0;
    z-index: 0;
}

.landing-page-welcome-2 {
    width: 100%;
    height: 100vh;
    position: sticky;
    top: 0;
    opacity: 0;
    z-index: 0;
}

.landing-page-content-1 {
    width: 100%;
    position: relative;
    top: 100dvh;
    background-color: var(--body-color);
    padding-top: 32px;
    padding-bottom: 71px;
}

.landing-page-content-2 {
    width: 100%;
    background-color: var(--body-color);
    padding-top: 32px;
    padding-bottom: 71px;
    inset: 0;
    opacity: 0;
    position: sticky;
    top: 75px;
}


.landing-page-welcome-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

.landing-page-welcome-dark {
    width: 50%;
    height: 100%;
    background-color: var(--base-color-60);
    position: absolute;
    top: 0px;
    right: 0px;
    padding: 0px 13px 153px 2px;
}

.landing-page-welcome-dark-text {
    font-family: Persian-Bold;
    font-size: 30px;
    line-height: 60px;
    color: var(--contrast-color);
}

.landing-page-welcome-arrows {
    position: absolute;
    bottom: 16px;
    left: 0px;
}

.landing-page-banner-image {
    width: 100%;
    object-fit: contain;
}

.landing-page-title {
    font-family: Persian-Bold;
    font-size: 18px;
    line-height: 26px;
    color: var(--base-color);
}

.landing-page-view-all-button {
    width: 114px;
    height: 36px;
    border: 1px solid var(--primary-color);
    border-radius: 20px;
    box-shadow: -3px 3px 4px 0px var(--primary-color-25);
    outline: none;
    font-family: Persian-SemiBold;
    font-size: 14px;
    color: var(--primary-color);
}



.heroSwiper {
    width: calc(100vw - 32px);
    height: 282px;
}

    .heroSwiper .swiper-slide {
        width: 100%;
        height: 274px;
        border-radius: 20px;
        background-color: var(--contrast-color);
        box-shadow: 0px 3px 4px 0px var(--base-color-25);
        position: relative;
    }

    .heroSwiper .swiper-slide-image {
        display: block;
        width: 100%;
        height: 100%;
        border-radius: 20px;
        object-fit: cover;
        object-position: center;
    }

    .heroSwiper .swiper-slide-text {
        width: 160px;
        min-height: 91px;
        padding: 8px 16px;
        border-radius: 15px;
        position: absolute;
        bottom: 32px;
        right: 16px;
        font-family: Persian-Bold;
        font-size: 14px;
        line-height: 25px;
        color: var(--primary-color);
        text-align: center;
        /* From https://css.glass */
        background: rgba(255, 255, 255, 0.06);
        border-radius: 16px;
        box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
        backdrop-filter: blur(6.4px);
        -webkit-backdrop-filter: blur(6.4px);
        border: 1px solid rgba(255, 255, 255, 0.34);
    }

    .heroSwiper .swiper-pagination {
        bottom: 16px;
    }

    .heroSwiper .swiper-pagination-bullet {
        width: 7px;
        height: 7px;
        background-color: var(--secondary-color);
        border: 0.5px solid var(--primary-color);
        margin: 0px 2px !important;
    }

    .heroSwiper .swiper-pagination-bullet-active {
        background-color: var(--primary-color);
        border: none;
    }



.multipleSwiper {
    width: 100vw;
    padding-right: 16px;
    /*height: 359px;*/
    height: 380px;
}

    .multipleSwiper .swiper-wrapper {
        height: auto;
    }

    .multipleSwiper .swiper-slide {
        width: 256px;
        border-radius: 20px;
        background-color: var(--contrast-color);
        box-shadow: 0px 3px 4px 0px var(--base-color-25);
        position: relative;
    }

    .multipleSwiper .swiper-slide-image {
        display: block;
        width: 256px;
        height: 282px;
        border-radius: 20px 20px 0px 0px;
        object-fit: cover;
        object-position: center;
    }



.singleSwiper {
    width: 100vw;
    /*height: 432px;*/
    padding: 8px 0px;
    /*height: 456px;*/
    height: 477px;
}

    .singleSwiper .swiper-wrapper {
        height: auto;
    }

    .singleSwiper .swiper-slide {
        width: 295px !important;
        border-radius: 20px;
        background-color: var(--contrast-color);
        box-shadow: -3px -3px 4px 0px var(--base-color-25), 3px 3px 4px 0px var(--base-color-25);
        position: relative;
    }

    .singleSwiper .swiper-slide-image {
        display: block;
        width: 295px;
        height: 368px;
        border-radius: 20px 20px 0px 0px;
        object-fit: cover;
        object-position: center;
    }

    .singleSwiper .swiper-button-next,
    .singleSwiper .swiper-button-prev {
        width: 24px;
        height: 24px;
        /*background-color: var(--body-color);*/
        color: var(--primary-color);
        /*border: 1.5px solid var(--primary-color);*/
        /*border-radius: 50%;*/
        /*padding: 6px;*/
    }



.cardsSwiper {
    width: 215px;
    /*height: 341px;*/
    height: 362px;
}

    .cardsSwiper .swiper-slide {
        width: 215px !important;
        border-radius: 10px 10px 20px 20px;
        background-color: var(--contrast-color);
        box-shadow: 0px 3px 4px 0px var(--base-color-25);
        position: relative;
    }

    .cardsSwiper .swiper-slide-image {
        display: block;
        width: 215px;
        height: 269px;
        border-radius: 10px 10px 0px 0px;
        object-fit: cover;
        object-position: center;
    }



.cubeSwiper {
    width: 295px;
    /*width: 311px;*/
    /*height: 448px;*/
    /*padding: 8px 0px;*/
    /*height: 432px;*/
    height: 453px;
}

    .cubeSwiper .swiper-slide {
        border-radius: 20px;
        background-color: var(--contrast-color);
        box-shadow: -3px -3px 4px 0px var(--base-color-25), 3px 3px 4px 0px var(--base-color-25);
        position: relative;
        background-position: center;
        background-size: cover;
    }

    .cubeSwiper .swiper-slide-image {
        display: block;
        width: 295px;
        height: 368px;
        border-radius: 20px 20px 0px 0px;
        object-fit: cover;
        object-position: center;
    }

    .cubeSwiper .swiper-button-next,
    .cubeSwiper .swiper-button-prev {
        width: 24px;
        height: 24px;
        /*background-color: var(--body-color);*/
        color: var(--primary-color);
        /*border: 1.5px solid var(--primary-color);*/
        /*border-radius: 50%;*/
        /*padding: 6px;*/
    }

    .cubeSwiper .swiper-button-next {
        left: -32px !important;
    }

    .cubeSwiper .swiper-button-prev {
        right: -32px !important;
    }



.swiper-slide-discount {
    width: 30px;
    height: 30px;
    border: none;
    border-radius: 50%;
    background-color: var(--primary-color);
    box-shadow: 0px 2px 2px 0px var(--base-color-25);
    position: absolute;
    top: 8px;
    left: 8px;
    font-family: Persian-Medium;
    font-size: 12px;
    line-height: 26px;
    color: var(--contrast-color);
}

.swiper-slide-discount-percent,
.swiper-slide-discount-value {
    position: relative;
    top: 1px;
}

.swiper-slide-cart {
    position: absolute;
    top: 8px;
    right: 8px;
}

.swiper-slide-cart-badge {
    width: 27px;
    height: 29px;
    font-family: Persian-Medium;
    font-size: 14px;
    color: var(--contrast-color);
    position: relative;
    bottom: 25px;
}

.swiper-slide-favorite-icon {
    position: relative;
    bottom: 4px;
}

.swiper-slide-name {
    padding-left: 8px;
    height: 42px;
    overflow: hidden;
    font-family: Persian-SemiBold;
    font-size: 14px;
    color: var(--base-color);
}

.swiper-slide-price {
    font-family: Persian-SemiBold;
    /*font-size: 14px;*/
    font-size: 16px;
    color: var(--base-color);
}

.swiper-slide-tooman {
    font-family: Persian-Regular;
    font-size: 12px;
    color: var(--base-color);
}

.swiper-slide-grey {
    color: var(--grey-color) !important;
}

.swiper-slide-price-red-line {
    width: 100%;
    height: 1px;
    background-color: var(--red-color);
    position: absolute;
    top: 10px;
}

/*#endregion LandingPage*/

/* #region custom-breadcrumb */
.custom-breadcrumb {
    padding: 16px;
}

.custom-breadcrumb-divider {
    font-family: Persian-Medium;
    font-size: 12px;
    color: var(--grey-color);
}

.custom-breadcrumb-item {
    font-family: Persian-Medium;
    font-size: 12px;
    color: var(--grey-color);
}

.custom-breadcrumb-item-active {
    font-family: Persian-Bold;
    font-size: 12px;
    color: var(--base-color);
}

.selected-filter {
    padding: 16px;
}

.selected-filter-title {
    font-family: Persian-Medium;
    font-size: 12px;
    color: var(--grey-color);
}

.selected-filter-value {
    font-family: Persian-Bold;
    font-size: 12px;
    color: var(--base-color);
    text-wrap: nowrap;
}
/* #endregion custom-breadcrumb */