@media /* SHAREit */ {
    .wrapper__blocked,
    .wrapper__blocked_friends,
    .wrapper__blocked_friends_layer_2 {
        width: 100%;
        height: 100%;
        position: fixed;
        background-color: rgba(17, 27, 33, 0.4);
        z-index: 130;
        display: none;
        top: 0;
    }

    .wrapper__header_minimal {
        width: 100%;
        height: 60px;
        background-color: var(--white);
        position: fixed;
        top: 0;
        z-index: 130;
        transition: height 0.3s ease;
        box-sizing: border-box;
        border-bottom: 1px solid #d2d2d2;
        overflow: hidden;
    }

    .layout__Title {
        width: 100%;
        height: 40px;
        direction: rtl;
        text-align: right;
        margin-bottom: 20px;
    }

    .layout__Title span {
        font-family: 'XEROSANS-BOLD';
        font-size: 18px;
        line-height: 40px;
        color: #111b21;
    }

    .layout__SHAREit_1 {
        width: calc(100% - 30px);
        height: 40px;
        direction: rtl;
        text-align: right;
        margin: 0 auto 20px;
    }

    .layout__SHAREit_1 span {
        font-family: 'XEROSANS-BOLD';
        font-size: 18px;
        line-height: 40px;
        color: #111b21;
    }

    .layout__SHAREit_0 {
        position: relative;
        max-width: 100%;
        overflow: hidden;
        display: flex;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        -webkit-overflow-scrolling: touch;
        user-select: none;
        scrollbar-width: none;
        direction: rtl;
        align-content: center;
        flex-direction: row;
        flex-wrap: nowrap;
        gap: 10px;
    }

    .layout__SHAREit_20 {
        position: relative;
        overflow: hidden;
        display: flex;
        overflow-x: auto;
        scrollbar-width: none;
        direction: rtl;
    }

    .detail__code_a-097 {
        width: 30px;
        height: 40px;
        position: absolute;
        left: 0;
        top: 50%;
        transform: translate(0, -50%);
        text-align: center;
        box-sizing: border-box;
        border: 2px solid #575757;
        border-radius: 30px;
        cursor: pointer;
    }

    .detail__code_a-097 span {
        font-size: 16px;
        line-height: 36px;
        color: #575757;
    }
}
@media /* `header */ {
    .wrapper__header {
        width: 100%;
        height: 170px;
        background-color: var(--white);
        position: fixed;
        top: 0;
        z-index: 130;
        transition: height 0.3s ease;
        box-sizing: border-box;
        border-bottom: 1px solid #d2d2d2;
        overflow: hidden;
    }

    .layout__header_container {
        width: calc(100% - 30px);
        height: 100%;
        position: relative;
        margin: 0 auto;
    }

    .layout__header_nav {
        width: 100%;
        height: 60px;
        position: absolute;
        top: 0;
        text-align: center;
    }

    .layout__header__nav_logo {
        width: auto;
        height: 100%;
        position: absolute;
        left: 50%;
        transform: translateX(-50%);
    }

    .layout__header__nav_logo span {
        font-size: 34px;
        line-height: 60px;
        color: #104d33;
    }

    .layout__header__nav_menu {
        width: 40px;
        height: 100%;
        position: absolute;
        right: 0;
        cursor: pointer;
        text-align: right;
    }

    .layout__header__nav_menu span {
        font-size: 36px;
        line-height: 60px;
        color: #111b21;
        pointer-events: none;
    }

    .layout__header__nav_alert {
        width: auto;
        height: 100%;
        position: absolute;
        left: 0;
        cursor: pointer;
    }

    .layout__header__nav_alert span {
        font-size: 26px;
        line-height: 60px;
        color: #111b21;
        pointer-events: none;
    }

    .layout__header_search {
        width: 100%;
        height: 60px;
        position: absolute;
        top: 60px
    }

    .layout__header__search_wrapper {
        width: 100%;
        height: 54px;
        border: 2px solid #f4a2c2;
        border-radius: 50px;
        box-sizing: border-box;
        position: absolute;
        top: 3px;
    }

    .layout__header__search__wrapper_ico {
        width: 50px;
        height: 100%;
        float: right;
        text-align: center;
        position: relative;
    }

    .layout__header__search__wrapper__ico_item {
        width: 40px;
        height: 40px;
        border-radius: 100%;
        background-color: #ea4c89;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%,-50%);
    }

    .layout__header__search__wrapper__ico_item span {
        color: #fff;
        font-size: 22px;
        line-height: 40px;
    }

    .layout__header__search__wrapper_input {
        width: calc(100% - 52px);
        height: 100%;
        float: right;
        position: relative;
    }

    .layout__header__search__wrapper_input input {
        width: 100%;
        height: 100%;
        outline: none;
        border: none;
        background-color: transparent;
        box-sizing: border-box;
        padding: 0 10px 0 20px;
        font-family: 'XEROSANS-NORMAL','BYekan';
        font-size: 16px;
        color: #111b21;
        direction: rtl;
    }

    .item {
        display: none;
    }

    .layout__header__search__wrapper_placeholder {
        width: auto;
        height: 100%;
        position: absolute;
        top: 0;
        right: 10px;
        direction: rtl;
        pointer-events: none;
    }

    .layout__header__search__wrapper_placeholder span {
        font-family: XEROSANS-NORMAL;
        font-size: 14px;
        line-height: 46px;
        color: #8a8a8a;
    }

    #layout__header__search__wrapper_placeholder_nanex
    {
        font-family: XEROSANS-BOLD;
        font-size: 18px;
        color: #104d33;
    }

    .layout__header_location {
        width: 100%;
        height: 50px;
        position: absolute;
        top: 120px;
        cursor: pointer;
    }

    .layout__header__location_ico
    {
        width: 50px;
        height: 100%;
        float: right;
        text-align: right;
        pointer-events: none;
    }

    .layout__header__location_ico span
    {
        font-size: 28px;
        line-height: 50px;
        color: #575757;
    }

    .layout__header__location_name
    {
        width: auto;
        height: 100%;
        float: right;
        direction: rtl;
    }

    .layout__header__location_name span
    {
        font-family: XEROSANS-BOLD;
        font-size: 13px;
        line-height: 44px;
    }

    .layout__header__location_name_tit
    {
        color: #8a8a8a;
    }

    .layout__header__location_appearance
    {
        width: 40px;
        height: 100%;
        float: left;
        text-align: left;
    }

    .layout__header__location_appearance span
    {
        font-size: 24px;
        line-height: 50px;
        color: #575757;
    }

    .layout__header__nav_search {
        width: 40px;
        height: 100%;
        position: absolute;
        top: 0;
        right: 50px;
        text-align: center;
        cursor: pointer;
        display: none;
    }

    .layout__header__nav_search span {
        font-size: 28px;
        line-height: 60px;
        color: #104d33;
        pointer-events: none;
    }
}
@media /* `footer */ {
    .wrapper__footer {
        width: 100%;
        height: 80px;
        position: fixed;
        bottom: 0;
        z-index: 100;
        background-color: rgba(255, 255, 255, 0.2);
    }

    .layout__footer_container {
        width: calc(100% - 30px);
        height: 60px;
        background-color: var(--black);
        position: absolute;
        bottom: 10px;
        left: 50%;
        transform: translate(-50%);
        border-radius: 70px;
        overflow: hidden;
        box-sizing: border-box;
        padding: 0 10px;
    }

    .layout__footer_item {
        width: 20%;/* اگز آیتم 5 تا بود 20% */
        height: 100%;
        float: right;
    }

    .layout__footer__item_section {
        width: 90%;
        height: 100%;
        margin: 0 auto;
        cursor: pointer;
    }

    .layout__footer__item_section span {
        pointer-events: none;
    }

    .layout__footer__item__section_ico {
        width: 60px;
        height: 40px;
        text-align: center;
        position: relative;
        margin: 0 auto;
    }

    .layout__footer__item__section_ico span {
        font-size: 26px;
        line-height: 45px;
        color: #b9b9b9;
    }

    .detail__code_a_10011-1 {
        width: 10px;
        height: 10px;
        position: absolute;
        top: 10px;
        right: 10px;
        background-color: #ef4056;
        border-radius: 100%;
    }

    .layout__footer__item__section_title {
        width: 100%;
        height: 20px;
        text-align: center;
    }

    .layout__footer__item__section_title span {
        font-family: XEROSANS-NORMAL;
        font-size: 11px;
        color: #b9b9b9;
        position: relative;
        top: -7px;
    }
}
@media /* main */ {
    .wrapper__main {
        width: 100%;
        height: calc(100% - 170px);
        overflow-y: scroll;
        position: absolute;
        top: 170px;
    }

    .wrapper__main::-webkit-scrollbar {
        width: 0;
    }

    .wrapper__section {
        width: 100%;
        min-height: 40px;
    }

    .wrapper__section_container {
        width: calc(100% - 30px);
        height: auto;
        margin: 0 auto;
    }
}
@media /* ---------- `slider */
{
    .wrapper__slider {
        width: 100%;
        height: auto;
        position: relative;
        margin: 20px auto;
        overflow: hidden;
    }

    .wrapper__slider_frame {
        display: flex;
        width: 100%;
        transition: transform 0.5s ease-in-out;
    }

    .wrapper__slider__frame_slide {
        min-width: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .wrapper__slider__frame__slide_content {
        width: 98%;
        overflow: hidden;
        border-radius: 20px;
        margin: 0 auto;
    }

    .wrapper__slider__frame__slide_content img {
        width: 100%;
        border-radius: 20px;
        margin-bottom: -4px;
    }

    .wrapper__slider_keys {
        width: 90px;
        height: 40px;
        position: absolute;
        right: 15px;
        bottom: 15px;
    }

    .wrapper__slider__keys_next,
    .wrapper__slider__keys_prev {
        width: 40px;
        height: 100%;
        float: right;
        text-align: center;
        background-color: var(--white);
        border-radius: 100%;
        cursor: pointer;
        opacity: .5;
    }

    .wrapper__slider__keys_prev {
        margin-right: 10px;
    }

    .wrapper__slider__keys_next span,
    .wrapper__slider__keys_prev span {
        font-size: 28px;
        line-height: 40px;
        color: var(--grey);
        pointer-events: none;
    }

    .wrapper__slider__keys_next:hover,
    .wrapper__slider__keys_prev:hover {
        opacity: .6;
        background-color: var(--gold);
    }

    .wrapper__slider_pagination {
        width: 50px;
        height: 5px;
        position: absolute;
        bottom: 10px;
        left: 50%;
        transform: translateX(-50%);
        display: flex;
        justify-content: center;
        gap: 5px;
        padding: 5px;
        background-color: rgba(255, 255, 255, 0.6);
        border-radius: 15px;
    }

    .wrapper__slider_pagination div {
        width: 5px;
        height: 100%;
        background-color: #666; /* Inactive */
        border-radius: 5px;
        cursor: pointer;
        transition: all 0.3s ease;
    }

    .wrapper__slider_pagination div.active {
        width: 20px;
        background-color: var(--grey); /* Active */
    }
}
@media /* `categories */
{
    .wrapper__category {
        width: 100%;
        height: 190px;
        margin-top: 40px;
    }

    .layout__class_Category {
        height: 130px;
    }

    .layout__Category__frame_items {
        width: 80px;
        height: 100%;
        float: right;
        text-align: center;
        position: relative;
        background-color: #111b21;
        border-radius: 80px;
    }

    .layout__Category__frame_items:not(:last-child) {
        margin-left: 10px;
    }

    .layout__Category__frame__items_content {
        width: 100%;
        height: 100%;
        margin: 0 auto;
        text-align: center;
    }

    .layout__Category__frame__items__content_icon {
        width: 70px;
        height: 70px;
        background-color: var(--gold);
        border-radius: 100%;
        position: absolute;
        top: 5px;
        left: 50%;
        transform: translateX(-50%);
    }

    .layout__Category__frame__items__content_icon span {
        font-size: 40px;
        line-height: 70px;
        color: var(--black);
    }

    .layout__Category__frame__items__content_title {
        width: 100%;
        height: 30px;
        position: absolute;
        top: 80px;
    }

    .layout__Category__frame__items__content_title span {
        font-family: XEROSANS-NORMAL;
        font-size: 13px;
        line-height: 24px;
        color: var(--white);
    }
}
@media /* ---------- `cash back */
{
    .wrapper__cashBack
    {
        width: 100%;
        height: 74px;
        background-color: #fffcf0;
        border-radius: 10px;
        margin-top: 40px;
        position: relative;
        border: 2px solid var(--gold);
        box-sizing: border-box;
    }

    .wrapper__cashBack_ico
    {
        width: 60px;
        height: 100%;
        float: right;
        text-align: center;
    }

    .wrapper__cashBack_ico span
    {
        font-size: 34px;
        line-height: 70px;
        color: var(--grey);
    }

    .wrapper__cashBack_ico_left
    {
        width: 60px;
        height: 100%;
        float: left;
        text-align: center;
    }

    .wrapper__cashBack_ico_left span
    {
        font-size: 26px;
        line-height: 70px;
        color: var(--grey);
    }

    .wrapper__cashBack_title
    {
        width: auto;
        height: 40px;
        position: absolute;
        top: 5px;
        right: 60px;
    }

    .wrapper__cashBack_title span
    {
        font-family: XEROSANS-BOLD;
        font-size: 15px;
        line-height: 35px;
        color: var(--grey);
    }

    .wrapper__cashBack_des
    {
        width: auto;
        height: 30px;
        position: absolute;
        top: 40px;
        right: 60px;
    }

    .wrapper__cashBack_des span
    {
        font-family: 'XEROSANS-NORMAL';
        font-size: 14px;
        line-height: 15px;
        color: var(--grey);
    }
}
@media /* `discount */ {
    .wrapper__discount
    {
        width: 100%;
        height: 410px;
        position: relative;
        margin-top: 40px;
    }

    .layoutSliderTitle
    {
        width: 100%;
        height: 40px;
        direction: rtl;
        text-align: right;
        margin-bottom: 20px;
    }

    .layoutSliderTitle span
    {
        font-family: XEROSANS-BOLD;
        font-size: 18px;
        line-height: 40px;
        color: #111b21;
    }

    .wrapper__discount_0
    {
        width: 100%;
        height: 350px;
        background-color: #FFA500;
        position: relative;
    }

    .wrapper__discount_1
    {
        width: calc(100% - 30px);
        height: 310px;
        top: 20px;
        left: 50%;
        transform: translateX(-50%);
    }

    .horizontal-products
    {
        width: 180px;
        height: 100%;
        overflow: hidden;
        float: right;
        position: relative;
        background-color: #eee;
        border-radius: 20px;
    }

    #discount_background {
        background-color: transparent;
    }

    .discount_banner img
    {
        width: 100%;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%,-50%);
    }

    .horizontal-products:not(:last-child)
    {
        margin-left: 10px;
    }

    .horizontal-picture
    {
        width: 140px;
        height: 140px;
        position: absolute;
        top: 20px;
        left: 50%;
        transform: translateX(-50%);
        background-color: #fff;
        border-radius: 20px;
        box-sizing: border-box;
        overflow: hidden;
        border: 2px solid #ccc;
    }

    .horizontal-picture img
    {
        height: 100%;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%,-50%);
    }

    .horizontal-name
    {
        width: calc(100% - 20px);
        height: auto;
        text-align: center;
        direction: rtl;
        position: absolute;
        left: 50%;
        transform: translateX(-50%);
        top: 0;
    }

    .horizontal-name span
    {
        font-family: XEROSANS-BOLD;
        font-size: 17px;
        line-height: 25px;
        color: var(--black);
    }

    .horizontal-price
    {
        width: 100%;
        height: 60px;
        text-align: left;
        direction: ltr;
        position: absolute;
        bottom: 0;
        left: 50%;
        transform: translateX(-50%);
    }

    #POPULAR_container {
        width: calc(100% - 30px);
        bottom: 10px;
    }

    #POPULAR_fa {
        color: #DC143C;
    }

    #POPULAR_price {
        color: var(--black);
    }

    .horizontal__price_1,
    .horizontal__price_2 {
        width: 100%;
        height: 30px;
    }

    .horizontal__price__1_1 {
        width: 50px;
        height: 100%;
        float: left;
        background-color: #ef4056;
        border-radius: 30px;
        text-align: center;
    }

    .horizontal__price__1_1 span
    {
        font-family: BYekan;
        font-weight: bold;
        font-size: 18px;
        color: var(--white);
        line-height: 30px;
        position: relative;
        top: 2px;
    }

    .horizontal__price__1_2 {
        width: calc(100% - 50px);
        height: 100%;
        float: left;
        text-align: left;
    }

    .horizontal__price__1_2 span
    {
        font-family: BYekan;
        font-weight: bold;
        font-size: 20px;
        color: #888;
        margin-left: 5px;
        line-height: 35px;
    }

    .horizontal__price_2 .original-price
    {
        font-family: BYekan;
        font-weight: bold;
        font-size: 22px;
        color: var(--grey);
        position: relative;
        top: -13px;
    }

    .horizontal__price_2 .fa-toman
    {
        font-size: 34px;
        color: var(--grey);
        line-height: 30px;
    }

    .horizontal-products_wrapper
    {
        width: 100%;
        height: 90px;
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        text-align: center;
        direction: rtl;
    }
}
@media /* `banner 4 */ {
    .wrapper__banner
    {
        width: 100%;
        height: auto;
        margin-top: 40px;
        position: relative;
        display: flow-root;
    }

    .wrapper__banner_flex
    {
        width: 50%;
        float: right;
        box-sizing: border-box;
        padding: 2px;
    }

    .wrapper__banner_flex img
    {
        width: 100%;
        border-radius: 10px;
        margin-bottom: -4px;
    }
}
@media /* `drink */ {
    .wrapper__drink {
        width: 100%;
        height: 360px;
        position: relative;
        margin-top: 40px;
    }

    .wrapper__drink_0
    {
        width: 100%;
        height: 300px;
    }

    .wrapper__slide_drink_products
    {
        width: 180px;
        height: 100%;
        overflow: hidden;
        float: right;
        position: relative;
        border-radius: 20px;
    }

    .wrapper__slide_drink_products:not(:last-child)
    {
        margin-left: 10px;
    }

    .wrapper__slide_new_products_body
    {
        width: 100%;
        height: 200px;
        position: absolute;
        bottom: 0;
    }

    .wrapper__slide_drink
    {
        width: calc(100% - 20px);
        height: auto;
        direction: rtl;
        position: absolute;
        top: 0;
        left: 50%;
        transform: translate(-50%);
    }

    .wrapper__slide_drink span
    {
        font-family: XEROSANS-BOLD;
        font-size: 17px;
        line-height: 25px;
        color: var(--black);
    }

    .wrapper__slide_new_products_price
    {
        width: calc(100% - 30px);
        height: 30px;
        position: absolute;
        bottom: 20px;
        left: 50%;
        transform: translate(-50%);
        direction: ltr;
    }

    .wrapper__slide_drink_products_price {
        width: 100%;
        height: 30px;
        position: absolute;
        bottom: 0;
        left: 50%;
        transform: translate(-50%);
        direction: ltr;
    }

    .wrapper__slide_drink_products_price .fa-toman {
        font-size: 34px;
        color: var(--grey);
        line-height: 20px;
    }

    .wrapper__slide_drink_products_price .original-price {
        font-family: BYekan;
        font-weight: bold;
        font-size: 22px;
        color: var(--grey);
        position: relative;
        top: -13px;
    }

    .wrapper__slide_drink_products_pic
    {
        width: 160px;
        height: 160px;
        position: absolute;
        top: 10px;
        overflow: hidden;
        left: 50%;
        transform: translateX(-50%);
    }

    .wrapper__slide_drink_products_pic img
    {
        height: 100%;
        position: relative;
        top: 50%;
        left: 50%;
        transform: translate(-50%,-50%);
    }

    .pepsi
    {
        background-color: #1632571a;
    }

    .coca-zero
    {
        background-color: #FF000019;
    }

    .fanta-limon
    {
        background-color: #FFD70019;
    }

    .fanta-strawberry-kiwi
    {
        background-color: #ac244b1a;
    }
}
@media /* `popular */ {
    .wrapper__popular {
        width: 100%;
        height: 305px;
        position: relative;
        margin-top: 40px;
    }

    .wrapper__popular_0 {
        width: 100%;
        height: 245px;
    }

    .horizontal_popular_wrapper {
        width: 320px;
        height: 100%;
        flex-shrink: 0;
    }

    .horizontal_popular_wrapper:not(:last-child) {
        margin-left: 10px;
    }

    .horizontal-products-for-you {
        width: 100%;
        height: 120px;
        overflow: hidden;
        position: relative;
        border-radius: 20px;
        background-color: #eee;
    }

    .horizontal-products-for-you:first-child {
        margin-bottom: 5px;
    }

    .horizontal-picture-for-you {
        width: 112px;
        height: 112px;
        position: absolute;
        top: 4px;
        right: 4px;
        overflow: hidden;
        background-color: var(--white);
        border-radius: 16px;
    }

    .horizontal-picture-for-you img {
        height: 100%;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%,-50%);
    }

    .horizontal-name-for-you {
        width: auto;
        height: 30px;
        position: absolute;
        right: 130px;
        top: 10px;
    }

    .horizontal-name-for-you span {
        font-family: XEROSANS-BOLD;
        font-size: 17px;
        line-height: 25px;
        color: var(--black);
    }

    .horizontal-price-for-you {
        width: auto;
        height: 30px;
        text-align: left;
        direction: ltr;
        position: absolute;
        bottom: 10px;
        left: 0;
        box-sizing: border-box;
        padding-left: 20px;
    }

    .horizontal-price-for-you .original-price {
        font-family: BYekan;
        font-weight: bold;
        font-size: 22px;
        color: var(--grey);
        position: relative;
        top: -13px;
    }

    .horizontal-price-for-you .fa-toman {
        font-size: 34px;
        color: var(--grey);
        line-height: 30px;
    }
}
@media /* `new */ {
    .wrapper__topSold {
        width: 100%;
        height: 370px;
        margin-top: 40px;
        position: relative;
    }

    .wrapper__topSold_0 {
        width: 100%;
        height: 310px;
    }

    .wrapper__slide_proposal_products {
        width: 180px;
        height: 100%;
        overflow: hidden;
        float: right;
        position: relative;
        border-radius: 20px;
    }

    .wrapper__slide_proposal_products:not(:first-child) {
        border-radius: 20px;
    }

    .wrapper__slide_proposal_products:not(:last-child) {
        margin-left: 10px;
    }

    .wrapper__slide_proposal_products {
        width: 180px;
        height: 100%;
        overflow: hidden;
        float: right;
        position: relative;
        border-radius: 20px;
    }

    .wrapper__slide_proposal_products:not(:first-child) {
        border-radius: 20px;
    }

    .wrapper__slide_proposal_products:not(:last-child) {
        margin-left: 10px;
    }

    .wrapper__slide_proposal_products_body {
        width: 100%;
        height: 100%;
        position: absolute;
        bottom: 0;
        background-color: var(--grey);
        border-radius: 20px;
    }

    .wrapper__slide_proposal_products_name {
        width: 100%;
        height: auto;
        direction: rtl;
        position: absolute;
        top: 0;
    }

    .wrapper__slide_proposal_products_name span {
        font-family: XEROSANS-BOLD;
        font-size: 17px;
        line-height: 25px;
        color: var(--white);
    }

    .wrapper__slide_proposal_products_price {
        width: 100%;
        height: 30px;
        position: absolute;
        bottom: 0;
        direction: ltr;
    }

    .wrapper__slide_proposal_products_price .fa-toman,
    .horizontal__price_2 #rating_fa {
        font-size: 34px;
        color: #00ff00;
        line-height: 30px;
    }

    .wrapper__slide_proposal_products_price .original-price,
    .horizontal__price_2 #rating_price {
        font-family: BYekan;
        font-weight: bold;
        font-size: 22px;
        color: #fff;
        position: relative;
        top: -13px;
    }

    .wrapper__slide_proposal_products_pic {
        width: 140px;
        height: 140px;
        position: absolute;
        top: 20px;
        left: 50%;
        transform: translateX(-50%);
        overflow: hidden;
        border-radius: 20px;
        box-sizing: border-box;
        border: 2px solid #f70;
        background-color: var(--white);
    }

    .wrapper__slide_proposal_products_pic img {
        height: 100%;
        position: relative;
        top: 50%;
        left: 50%;
        transform: translate(-50%,-50%);
    }
}
@media /* `banner One */ {
    .wrapper__bannerOne
    {
        width: 100%;
        height: auto;
        margin-top: 40px;
    }

    .wrapper__bannerOne_pic
    {
        width: 100%;
    }

    .wrapper__bannerOne_pic img
    {
        width: 100%;
        border-radius: 10px;
        margin-bottom: -4px;
    }
}
@media /* `banner Tow */ {
    .wrapper__bannerTow
    {
        width: 100%;
        margin-top: 40px;
    }

    .wrapper__bannerTow_pic
    {
        width: 100%;
        box-sizing: border-box;
    }

    .wrapper__bannerTow_pic:not(:last-child) {
        padding: 5px 0;
    }

    .wrapper__bannerTow_pic img
    {
        width: 100%;
        border-radius: 10px;
        margin-bottom: -4px;
    }
}
@media /* `new */ {
    .wrapper__new {
        width: 100%;
        height: 370px;
        margin-top: 40px;
        position: relative;
    }

    .wrapper__new_0 {
        width: 100%;
        height: 310px;
    }

    .wrapper__slide_new_products {
        width: 180px;
        height: 100%;
        overflow: hidden;
        float: right;
        position: relative;
        border-radius: 20px;
        background-color: #efefef;
    }

    .wrapper__slide_new_products_body {
        width: calc(100% - 30px);
        height: 110px;
        position: absolute;
        bottom: 20PX;
        left: 50%;
        transform: translateX(-50%);
    }

    .wrapper__slide_new_products_body_drink {
        width: calc(100% - 30px);
        height: 100px;
        position: absolute;
        bottom: 20PX;
        left: 50%;
        transform: translateX(-50%);
    }

    .wrapper__slide_new_products_name {
        width: 100%;
        height: auto;
        direction: rtl;
        position: absolute;
        top: 0;
        left: 50%;
        transform: translate(-50%);
    }

    .wrapper__slide_new_products_name span {
        font-family: 'XEROSANS-BOLD';
        font-size: 18px;
        line-height: 20px;
        color: var(--black);
    }

    .wrapper__slide_new_products_price {
        width: 100%;
        height: 30px;
        position: absolute;
        bottom: 0;
        left: 50%;
        transform: translate(-50%);
        direction: ltr;
    }

    .wrapper__slide_new_products_price .fa-toman {
        font-size: 34px;
        color: var(--grey);
        line-height: 30px;
    }

    .wrapper__slide_new_products_price .original-price {
        font-family: BYekan;
        font-weight: bold;
        font-size: 22px;
        color: var(--grey);
        position: relative;
        top: -13px;
    }

    .wrapper__slide_new_products_pic {
        width: 140px;
        height: 140px;
        position: absolute;
        top: 20px;
        left: 50%;
        transform: translateX(-50%);
        overflow: hidden;
        border-radius: 20px;
        border: 2px solid #fff;
        box-sizing: border-box;
        background-color: #eee;
    }

    .wrapper__slide_new_products_pic img {
        height: 100%;
        position: relative;
        top: 50%;
        left: 50%;
        transform: translate(-50%,-50%);
    }

    /*
    .wrapper__key_add_new
    {
        width: 40px;
        height: 40px;
        border-radius: 15px;
        background-color: var(--grey);
        text-align: center;
        cursor: pointer;
        position: absolute;
        bottom: 12px;
        right: 12px;
    }

    .wrapper__key_add_new span
    {
        font-size: 24px;
        line-height: 40px;
        color: var(--white);
        pointer-events: none;
    }
    */
}
@media /* `bran */ {
    .wrapper__brand
    {
        width: 100%;
        height: 240px;
        margin-top: 40px;
        position: relative;
    }

    .wrapper__brand_0
    {
        width: 100%;
        height: 180px;
        border: 2px solid #dcdcdc;
        border-radius: 20px;
        box-sizing: border-box;
    }

    .wrapper__brand_1
    {
        width: calc(100% - 10px);
        height: 140px;
        top: 20px;
        left: 50%;
        transform: translateX(-50%);
    }

    .wrapper__slide_brands_1121
    {
        width: 120px;
        height: 100%;
        overflow: hidden;
        float: right;
        position: relative;
    }

    .wrapper__slide_brands_1121:not(:last-child)
    {
        margin-left: 10px;
    }

    .wrapper__slide_brands_11211
    {
        width: 100px;
        height: 100px;
        overflow: hidden;
        position: relative;
        pointer-events: none;
        margin: 0 auto;
        border-radius: 20px;
        border: 2px solid #eee;
        box-sizing: border-box;
    }

    .wrapper__slide_brands_11211 img
    {
        height: 100%;
        position: relative;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
    }

    .wrapper__slide_brands_11212
    {
        width: 100%;
        height: 40px;
        text-align: center;
    }

    .wrapper__slide_brands_11212 span
    {
        font-family: 'XEROSANS-NORMAL','BYekan';
        font-size: 16px;
        line-height: 40px;
        color: #8a8a8a;
    }


}
@media /* `footer */ {
    .styleLayoutFooter
    {
        width: 100%;
        height: auto;
        /*background-color: #e6ffda;*/
        background-color: #111b21;
        padding-bottom: 100px;
        margin-top: 60px;
    }

    .wrapper__footer_container {
        width: calc(100% - 30px);
        margin: 0 auto;
    }

    .wrapper-footer-upper
    {
        display: flex;
        -ms-flex-direction: column;
        flex-direction: column;
        -ms-flex-align: center;
        align-items: center;
        -ms-flex-pack: justify;
        justify-content: space-between;
        padding: 40px 0;
        row-gap: 20px;
    }

    .upper-logo
    {
        margin-bottom: 20px;
    }

    .upper-logo img
    {
        height: 70px;
    }

    .upper-links
    {
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-column-gap: 20px;
        -moz-column-gap: 20px;
        column-gap: 20px;
        line-height: 20px;
        list-style: none;
        row-gap: 10px;
        direction: rtl;
    }

    .upper-links a
    {
        font-family: XEROSANS-BOLD;
        font-size: 16px;
        color: var(--white);
    }

    .upper-social
    {
        display: grid;
        grid-auto-flow: column;
        gap: 15px;
        direction: rtl;
        margin-top: 20px;
    }

    .upper-social a
    {
        font-size: 28px;
        color: #00b862;
    }

    .wrapper-footer-lower
    {
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        -ms-flex-pack: center;
        justify-content: center;
        margin: 0;
        padding: 0;
        -webkit-column-gap: 20px;
        -moz-column-gap: 20px;
        column-gap: 20px;
        list-style: none;
        row-gap: 5px;
    }

    .wrapper-footer-lower a
    {
        font-family: XEROSANS-NORMAL;
        font-size: 14px;
        color: #c7c7c7;
    }

    .wrapper-footer-license
    {
        width: 190px;
        height: 110px;
        margin: 40px auto 80px;
    }

    .content-license
    {
        width: 90px;
        height: 100%;
        overflow: hidden;
        position: relative;
        float: right;
        background-color: #fff;
        border-radius: 15px;
    }

    .content-license:not(:last-child)
    {
        margin-left: 10px;
    }

    .content-license img
    {
        height: 80px;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%,-50%);
    }

    .wrapper-footer-copyright
    {
        width: 100%;
        height: 25px;
        text-align: center;
    }

    .wrapper-footer-copyright .copyright-txt
    {
        font-family: Sans-Serif;
        font-size: 13px;
        color: #c1dff0;
    }

    .wrapper-footer-copyright .fa-copy_right
    {
        font-size: 15px;
        color: #575757;
        position: relative;
        top: -3px;
    }
}
@media /* ---------- `profile */ {
    .profile__wrapper_pic_1 {
        width: 100%;
        height: 200px;
        margin-top: 40px;
    }

    .profile__wrapper_pic_1 img {
        height: 100%;
        position: relative;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
    }

    .main-profile {
        width: calc(100% - 30px);
        height: calc(100% - 140px);
        overflow-y: scroll;
        position: absolute;
        top: 60px;
        left: 50%;
        transform: translate(-50%);
    }

    .main-profile::-webkit-scrollbar {
        width: 0;
    }

    .profile__account_1 {
        width: 100%;
        height: 260px;/* 360px در صورت فعالیت های کاربر */
        border-radius: 20px;
        position: relative;
        overflow: hidden;
        margin-top: 20px;
        background-color: #eee;
    }

    .profile__account_11 {
        width: 160px;
        height: 160px;
        position: absolute;
        top: 10px;
        left: 50%;
        transform: translate(-50%);
    }

    .profile__account_11 img {
        height: 100%;
        position: relative;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
    }

    .profile__account_12 {
        width: 30px;
        height: 30px;
        position: absolute;
        top: 20px;
        right: 20px;
        text-align: center;
        cursor: pointer;
    }

    .profile__account_12 span {
        font-size: 20px;
        line-height: 30px;
        color: #111b21;
        pointer-events: none;
    }

    .profile__account_13 {
        width: auto;
        height: 60px;
        position: absolute;
        top: 180px;
        left: 50%;
        transform: translate(-50%);
        text-align: center;
    }

    .profile__account_131 {
        width: 100%;
        height: 30px;
        direction: rtl;
    }

    .profile__account_131 span {
        font-family: BYekan;
        font-weight: bold;
        font-size: 20px;
        line-height: 30px;
        color: #111b21;
    }

    .profile__account_132 {
        width: 100%;
        height: 30px;
    }

    .profile__account_132 span {
        font-family: BYekan;
        font-weight: bold;
        font-size: 22px;
        line-height: 30px;
        color: #8a8a8a;
    }

    .profile__account_14 {
        width: 300px;
        height: 70px;
        position: absolute;
        bottom: 30px;
        left: 50%;
        transform: translate(-50%);
    }

    .profile__account_share_141 {
        width: 100px;
        height: 100%;
        float: left;
        text-align: center;
    }

    .profile__account_share_1411 {
        width: 100%;
        height: 25px;
    }

    .profile__account_share_1411 span {
        font-size: 20px;
        line-height: 25px;
        color: #ccc;
    }

    .profile__account_share_1412 {
        width: 100%;
        height: 25px;
        box-sizing: border-box;
    }

    .profile__account_share_1412 span {
        font-family: XEROSANS-NORMAL;
        font-size: 12px;
        line-height: 19px;
        color: #8a8a8a;
    }

    .account__left_border {
        border-right: 1px solid #ccc;
    }

    .profile__account_share_1413 {
        width: 100%;
        height: 20px;
    }

    .profile__account_share_1413 span {
        font-family: Monda;
        font-size: 14px;
        line-height: 20px;
        color: #3e3e3e;
    }

    #account__en {
        position: relative;
        top: 2px;
        font-size: 16px;
    }

    .profile__field_1 {
        width: 100%;
        height: auto;
        border-radius: 20px;
        background-color: #eee;
    }

    .profile__field_1:last-child {
        margin-bottom: 100px;
    }

    .profile__field_1:not(:last-child) {
        border-bottom: 1px solid #fff;
    }

    .field_1_first {
        margin-top: 20px;
    }

    .field_1_last {
        margin-top: 5px;
    }

    .profile__field_1_marge {
        width: 100%;
        height: 50px;
    }

    .profile {
        cursor: pointer;
    }

    .profile__field_11,
    .profile__field_13 {
        width: 50px;
        height: 100%;
        float: right;
    }

    .profile__field_12 {
        width: calc(100% - 100px);
        height: 100%;
        float: right;
        direction: rtl;
        box-sizing: border-box;
    }

    .field_121_category {
        border-bottom: 1px solid #fff;
    }

    .profile__field_12 span {
        font-family: XEROSANS-NORMAL;
        font-size: 15px;
        color: #3e3e3e;
        line-height: 43px;
        margin-right: 10px;
    }

    .profile__field_111 {
        width: 42px;
        height: 42px;
        position: relative;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        background-color: #fff;
        border-radius: 16px;
        text-align: center;
    }

    .profile__field_111 span {
        font-size: 24px;
        line-height: 42px;
        color: #8a8a8a;
    }

    .profile__field_131 {
        width: 28px;
        height: 28px;
        position: relative;
        top: 11px;
        left: 11px;
        background-color: #111b21;
        border-radius: 100%;
        text-align: center;
        overflow: hidden;
        transform: rotate(45deg);
    }

    .profile__field_131 span {
        font-size: 14px;
        line-height: 28px;
        color: var(--white);
    }

    .profile__field_2 {
        width: 100%;
        height: 50px;
        border-radius: 20px;
        background-color: #eee;
        margin-top: 5px;
    }

    #profile_12_exit span {
        font-family: XEROSANS-BOLD;
        line-height: 49px;
        color: #ef4056;
    }

    #exit {
        cursor: pointer;
    }

    span {
        pointer-events: none;
    }

    .main-profile {
        width: 100%;
        height: calc(100% - 60px);
        overflow-y: scroll;
        position: absolute;
        top: 60px;
    }

    .main-profile::-webkit-scrollbar {
        width: 0;
    }

    .kldsfnhdlfhkjjh {
        width: 100%;
        height: 30px;
        direction: rtl;
        text-align: right;
        margin-top: 20px;
    }

    .kldsfnhdlfhkjjh span {
        font-family: XEROSANS-BOLD;
        font-size: 18px;
        line-height: 30px;
    }
}
@media /* ---------- `cart */ {
    .cart_a_100-1
    {
        width: 100%;
        height: auto;
        margin: 20px 0;
        background-color: #f7f7f7;
        border-radius: 20px;
    }

    .cart_a_1001_1_comtainer
    {
        width: calc(100% - 30px);
        height: 100%;
        margin: 0 auto;
        position: relative;
    }

    .cart_a_100-0
    {
        width: 100%;
        height: auto;
    }











    .wrapper__container_tab_bar {
        width: calc(100% - 30px);
        height: 100%;
        position: relative;
        margin:  0 auto;
    }



    .cart_added_1 {
        width: 100%;
        height: 170px;
        position: relative;
    }

    .cart_added_1:not(:last-child) {
        border-bottom: 1px dashed var(--grey);
    }

    .cart_a_100111-1 {
        width: 90px;
        height: 90px;
        position: absolute;
        top: 15px;
        right: 0;
        background-color: #fff;
        border-radius: 15px;
        overflow: hidden;
        box-sizing: border-box;
        border: 2px solid #fff;
    }

    .cart_a_100111-1 img {
        height: 100%;
        position: relative;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
    }


    .wrapper__cart_img
    {
        width: 100%;
        height: 220px;
        margin-top: 40px;
        overflow: hidden;
    }

    .wrapper__cart_img img
    {
        height: 100%;
        position: relative;
        top: 50%;
        left: 50%;
        transform: translate(-50%,-50%);
    }

    .cart_a_100111-2 {
        width: auto;
        height: auto;
        position: absolute;
        top: 25px;
        right: 110px;
        direction: rtl;
    }

    .cart_a_100111-2 span {
        font-family: 'XEROSANS-BOLD';
        font-size: 18px;
        line-height: 25px;
        color: #666;
    }

    .cart_a_100111-2-1 {
        width: auto;
        height: auto;
        position: absolute;
        top: 50px;
        right: 110px;
        direction: rtl;
        text-align: justify;
    }

    .cart_a_100111-2-1 span {
        font-family: 'XEROSANS-NORMAL', 'BYekan';
        font-size: 13px;
        line-height: 15px;
        color: #666;
    }

    .cart_a_100111-3 {
        width: 96px;
        height: 40px;
        position: absolute;
        bottom: 15px;
        right: 0;
        border-radius: 40px;
        box-sizing: border-box;
        background-color: #fff;
    }

    .cart_a_1001113-1,
    .cart_a_1001113-3 {
        width: 40px;
        height: 100%;
        outline: none;
        border: none;
        text-align: center;
        cursor: pointer;
        position: absolute;
        top: 0;
        background-color: transparent;
    }

    .cart_a_1001113-1 {
        left: 0;
    }

    .cart_a_1001113-3 {
        right: 0;
    }

    .cart_a_1001113-1 span,
    .cart_a_1001113-3 span {
        line-height: 36px;
        color: #111b21;
    }

    .cart_a_1001113-1 span {
        font-size: 18px;
    }

    .cart_a_1001113-3 span {
        font-size: 22px;
    }

    .cart_a_1001113-2 {
        width: 30px;
        height: 100%;
        position: absolute;
        left: 50%;
        transform: translateX(-50%);
    }

    .cart_a_1001113-2 input {
        width: 100%;
        height: 100%;
        font-family: BYekan;
        font-weight: bold;
        font-size: 22px;
        color: var(--black);
        border: none;
        background-color: transparent;
        outline: none;
        display: flex;
        text-align: center;
    }

    .cart_a_100111-4 {
        width: calc(100% - 110px);
        height: 60px;
        position: absolute;
        bottom: 15px;
        left: 0;
    }

    .cart_a_100111-4_2 {
        width: 100%;
        height: 30px;
        position: absolute;
        top: 0;
    }

    .cart_a_100111-4_1 {
        width: 100%;
        height: 30px;
        position: absolute;
        bottom: 0;
    }

    .cart_a_100111-4_1 span {
        line-height: 30px;
        color: #111b21;
        position: relative;
    }

    .cart_a_100111-4_1 .fa-toman {
        font-size: 34px;
        line-height: 30px;
    }

    .cart_a_100111-4_1 .txt-toman {
        font-family: BYekan;
        font-weight: bold;
        font-size: 22px;
        top: -13px;
    }

    .cart_a_100111_42_1 {
        width: 54px;
        height: 100%;
        float: left;
        background-color: #ef4056;
        border-radius: 30px;
        text-align: center;
    }

    .cart_a_100111_42_1 span {
        font-family: BYekan;
        font-weight: bold;
        font-size: 18px;
        color: var(--white);
    }

    .cart_a_100111_42_2 {
        width: calc(100% - 54px);
        height: 100%;
        float: left;
        text-align: left;
    }

    .cart_a_100111_42_2 span {
        font-family: BYekan;
        font-weight: bold;
        font-size: 20px;
        color: #888;
        margin-left: 5px;
        line-height: 35px;
    }

    .cart_a_100-3 {
        width: 100%;
        height: 80px;
        position: fixed;
        bottom: 0;
        background-color: #fff;
        border-top: 1px solid #eee;
    }

    .cart_a_1003-2 {
        width: calc(100% - 150px);
        height: 50px;
        position: absolute;
        top: 50%;
        transform: translate(0, -50%);
        right: 0;
        text-align: center;
    }

    .cart_a_10032-1,
    .cart_a_10032-2 {
        width: 100%;
        height: 25px;
        position: relative;
    }

    .cart_a_10032-2 {
        top: -10px;
    }

    .cart_a_10032-1 {
        direction: rtl;
    }

    .cart_a_10032-2 {
        direction: ltr;
    }

    .cart_a_10032-1 span {
        font-family: XEROSANS-NORMAL;
        font-size: 15px;
        line-height: 16px;
        color: #666;
    }

    .cart_a_10032-2 .fa-toman {
        font-size: 34px;
        position: relative;
        top: 8px;
    }

    .cart_a_10032-2 .txt-toman {
        font-family: BYekan;
        font-weight: bold;
        font-size: 24px;
        position: relative;
        top: -5px;
    }

    .cart_a_1003-1 {
        width: 150px;
        height: 50px;
        position: absolute;
        top: 50%;
        transform: translate(0, -50%);
        left: 0;
        background-color: #ff001a;
        border-radius: 10px;
        text-align: center;
        cursor: pointer;
        font-family: XEROSANS-BOLD;
        font-size: 18px;
        line-height: 50px;
        color: #fff;
        outline: none;
        border: none;
    }

    .cart_a_1000-2
    {
        width: 300px;
        height: auto;
        direction: rtl;
        text-align: right;
        margin: 40px auto 0;
        position: relative;
    }

    .cart_a_10002-1
    {
        width: 80px;
        height: 80px;
        margin: 60px auto 0;
        text-align: center;
        display: flex;
    }

    .cart_a_10002-1 span
    {
        font-size: 56px;
        line-height: 80px;
        color: #111b21;
    }

    .cart_a_10002-2
    {
        width: 100%;
        height: auto;
    }

    .cart_a_10002-2 span
    {
        font-family: XEROSANS-NORMAL;
        font-size: 14px;
        color: #3e3e3e;
        line-height: 20px;
    }
}
@media /* ---------- `category */ {
    .category_a_1001211-4 {
        width: auto;
        height: 30px;
        position: absolute;
        top: 70px;
        left: 20px;
        direction: ltr;
    }

    .category_a_1001211-4 span {
        font-family: BYekan;
        font-weight: bold;
        font-size: 20px;
        line-height: 30px;
        color: #FFA500;
    }

    .category_a_1001-1
    {
        width: 100%;
        height: auto;
        position: relative;
        margin-top: 20px;
    }

    .category_a_1001-1 img
    {
        width: 100%;
        margin-bottom: -4px;
    }

    .category_a_a_100_2
    {
        width: 100%;
        height: auto;
        margin-top: 40px;
        position: relative;
    }

    .category_a_a_1001-1
    {
        width: 100%;
        height: 190px;
        position: absolute;
        top: 0;
    }

    .category_a_a_10011-1
    {
        width: 50%;
        height: 100%;
        float: right;
    }

    .category_a_a_100111-1
    {
        width: calc(100% - 10px);
        height: calc(100% - 10px);
        position: relative;
        top: 50%;
        left: 50%;
        transform: translate(-50%,-50%);
        background-color: #111b21;
        border-radius: 25px;
        overflow: hidden;
        z-index: 100;
    }

    .category_a_1001-2
    {
        width: 100%;
        height: 230px;
        position: relative;
    }

    .category_a_10012-1
    {
        width: 50%;
        height: 100%;
        float: left;
    }

    .category_a_10012-2
    {
        width: 50%;
        height: 100%;
        float: left;
        position: relative;
        top: 190px;
    }

    .category_a_100121-1
    {
        width: calc(100% - 10px);
        height: calc(100% - 10px);
        position: relative;
        top: 50%;
        left: 50%;
        transform: translate(-50%,-50%);
        background-color: #111b21;
        border-radius: 25px;
        overflow: hidden;
        z-index: 100;
    }

    .category__a {
        width: 100%;
        height: 100%;
        border-radius: 25px;
        overflow: scroll;
    }

    .category_a_1001211-1
    {
        position: absolute;
        bottom: -30px;
        right: -30px;
        width: 160px;
        height: 160px;
    }

    .category_a_1001211-1 img
    {
        width: 100%;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%,-50%);
    }

    .category_a_1001211-1
    {
        width: 150px;
        height: 150px;
    }

    .category_a_1001211-2
    {
        width: auto;
        height: 25px;
        position: absolute;
        top: 40px;
        right: 20px;
        direction: rtl;
    }

    .category_a_1001211-2 span
    {
        font-family: XEROSANS-NORMAL;
        font-size: 15px;
        color: #eee;
        line-height: 25px;
    }

    .category_a_1001211-2
    {
        right: 15px;
    }

    .category_a_1001211-3
    {
        width: 44px;
        height: 25px;
        border: 2px solid #eee;
        border-radius: 25px;
        text-align: center;
        position: absolute;
        top: 40px;
        left: 20px;
    }

    .category_a_1001211-3
    {
        left: 15px;
    }

    .category_a_1001211-3 span
    {
        font-size: 17px;
        line-height: 25px;
        color: #eee;
    }
}
@media /* `tv */ {
    .wrapper__tv {
        width: 100%;
        height: auto;
        background-color: #e0ffe0;
        border-radius: 20px;
        position: relative;
        padding-top: 10px;
        display: flex;
        flex-direction: column;
    }

    .wrapper__tv:first-child {
        margin-top: 20px;
    }

    .wrapper__tv:not(:last-child) {
        margin-bottom: 5px;
    }

    .wrapper__tv_1 {
        overflow: hidden;
        width: calc(100% - 20px);
        height: auto;
        margin: 0 auto 10px;
        border-radius: 15px;
    }

    .wrapper__tv_1 iframe {
        border: none;
    }

    .wrapper__tv_2 {
        width: calc(100% - 20px);
        height: 60px;
        margin: 0 auto 10px;
        position: relative;
    }

    .wrapper__tv_2_1 {
        width: auto;
        height: 20px;
        position: absolute;
        top: 30px;
        right: 0;
        direction: rtl;
    }

    .wrapper__tv_2_1 span {
        font-family: XEROSANS-BOLD;
        font-size: 16px;
        color: #111b21;
        line-height: 20px;
    }

    .wrapper__tv_2_2 {
        width: auto;
        height: 20px;
        position: absolute;
        top: 0;
        right: 0;
    }

    .wrapper__tv_2_2_1 {
        width: 30px;
        height: 100%;
        float: right;
        text-align: right;
    }

    .wrapper__tv_2_2_1 span {
        font-size: 22px;
        line-height: 20px;
        color: #9d9d9d;
    }

    .wrapper__tv_2_2_2 {
        width: auto;
        height: 100%;
        float: right;
        text-align: right;
        direction: rtl;
    }

    .wrapper__tv_2_2_2 span {
        font-family: 'XEROSANS-NORMAL','BYekan';
        font-size: 14px;
        line-height: 14px;
        color: #9d9d9d;
    }

    .wrapper__tv_2_3 {
        width: auto;
        height: 20px;
        direction: ltr;
        position: absolute;
        top: 0;
        left: 0;
    }

    .wrapper__tv_2_3 span {
        font-family: 'BYekan';
        font-weight: bold;
        font-size: 16px;
        line-height: 20px;
        color: #111b21;
    }

    .wrapper__tv_2_4 {
        width: auto;
        height: 20px;
        position: absolute;
        top: 30px;
        left: 0;
        direction: rtl;
        text-align: right;
    }

    .wrapper__tv_2_4 span {
        font-family: XEROSANS-BOLD;
        font-size: 14px;
        line-height: 20px;
        color: #0033ff;
    }
}
@media /* ---------- `wallet */
{
    .wrapper__cash_1
    {
        width: 100%;
        height: calc(100% - 60px);
        position: absolute;
        top: 60px;
        left: 50%;
        transform: translateX(-50%);
        overflow: hidden;
    }

    .wrapper__cash_11
    {
        width: 100%;
        height: 200px;
        position: absolute;
        top: 0;
    }

    .wrapper__cash_111
    {
        width: 100%;
        height: 30px;
        text-align: center;
    }

    .wrapper__cash_111 span
    {
        font-family: XEROSANS-NORMAL;
        font-size: 13px;
        line-height: 30px;
        color: #3e3e3e;
    }

    .wrapper__cash_112
    {
        width: 100%;
        height: 50px;
        text-align: center;
    }

    .wrapper__cash_112 .fa-toman
    {
        font-size: 28px;
        line-height: 50px;
        color: var(--black);
    }

    .wrapper__cash_112 .fa_price
    {
        font-family: BYekan;
        font-weight: bold;
        font-size: 24px;
        line-height: 60px;
        color: var(--black);
        position: relative;
        top: -10px;
    }

    .wrapper__cash_113
    {
        width: calc(100% - 30px);
        height: 54px;
        border: 2px solid #eee;
        border-radius: 15px;
        box-sizing: border-box;
        margin: 0 auto;
        cursor: pointer;
    }

    .wrapper__cash_1131,
    .wrapper__cash_1132,
    .wrapper__cash_1133
    {
        pointer-events: none;
    }

    .wrapper__cash_1131
    {
        float: right;
        width: 60px;
        height: 100%;
        text-align: center;
    }

    .wrapper__cash_1131 span
    {
        font-size: 34px;
        line-height: 50px;
        color: var(--blue);
    }

    .wrapper__cash_1132
    {
        width: auto;
        height: 100%;
        float: right;
        direction: ltr;
    }

    .wrapper__cash_11321,
    .wrapper__cash_11322
    {
        width: auto;
        height: 25px;
        text-align: right;
    }

    .wrapper__cash_11321 span
    {
        font-family: XEROSANS-BOLD;
        font-size: 14px;
        line-height: 25px;
        color: var(--black);
    }

    .wrapper__cash_11322 span
    {
        font-family: XEROSANS-NORMAL;
        font-size: 12px;
        line-height: 25px;
        color: #8a8a8a;
        position: relative;
        top: -5px;
    }

    .wrapper__cash_1133
    {
        float: left;
        width: 50px;
        height: 100%;
        text-align: center;
        position: relative;
    }

    .wrapper__cash_11331
    {
        width: 30px;
        height: 30px;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%,-50%);
        background-color: #4a5764;
        border-radius: 100%;
        overflow: hidden;
    }

    .wrapper__cash_11331 span
    {
        font-size: 16px;
        line-height: 30px;
        color: var(--white);
        display: inline-block; /* برای اینکه transform اعمال بشه */
        transform: rotate(45deg);
    }

    .wrapper__cash_12
    {
        width: 100%;
        height: calc(100% + 270px);
        position: fixed;
        top: 170px;
        background-color: #eee;
        border-top-left-radius: 20px;
        border-top-right-radius: 20px;
        transition: top 0.3s ease;
        cursor: grab;
    }

    .wrapper__swipe
    {
        width: 50px;
        height: 3px;
        border-radius: 3px;
        background-color: #4a5764;
        position: absolute;
        top: 7px;
        left: 50%;
        transform: translateX(-50%);
    }

    .wrapper__cash_122
    {
        width: 100px;
        height: 100px;
        position: absolute;
        top: 40px;
        left: 50%;
        transform: translateX(-50%);
    }

    .wrapper__cash_122 span
    {
        font-size: 80px;
        line-height: 100px;
        color: var(--black);
    }

    .wrapper__cash_123
    {
        width: 100%;
        height: 40px;
        position: absolute;
        top: 140px;
        direction: rtl;
        text-align: center;
    }

    .wrapper__cash_123 span
    {
        font-family: XEROSANS-BOLD;
        font-size: 14px;
        line-height: 40px;
        color: var(--black);
    }

    .wrapper__cash_popUp_1
    {
        width: 100%;
        height: 340px;
        background-color: #fff;
        border-top-left-radius: 20px;
        border-top-right-radius: 20px;
        position: fixed;
        bottom: -340px;
        z-index: 210;
        cursor: grab;
    }

    .blockedPopUpView {
        width: 100%;
        height: 100%;
        position: fixed;
        background-color: rgba(17, 27, 33, 0.4);
        z-index: 190;
        display: none;
    }

    .wrapper__cash_popUp_container {
        width: calc(100% - 40px);
        height: 100%;
        margin: 0 auto;
        position: relative;
    }

    .wrapper__cash_popUp_12 {
        width: 100%;
        height: auto;
        position: absolute;
        top: 30px;
    }

    .wrapper__cash_popUp_11 {
        width: 100%;
        height: 40px;
        text-align: center;
        margin-bottom: 10px;
    }

    .wrapper__cash_popUp_11 span {
        font-family: XEROSANS-BOLD;
        font-size: 16px;
        line-height: 40px;
        color: #111b21;
    }

    .wrapper__cash_popUp_container {
        width: calc(100% - 40px);
        height: 100%;
        margin: 0 auto;
        position: relative;
    }

    .wrapper__cash_popUp_12 {
        width: 100%;
        height: auto;
        position: absolute;
        top: 30px;
    }

    .wrapper__cash_popUp_11 {
        width: 100%;
        height: 40px;
        text-align: center;
        margin-bottom: 10px;
    }

    .wrapper__cash_popUp_11 span {
        font-family: XEROSANS-BOLD;
        font-size: 16px;
        line-height: 40px;
        color: #111b21;
    }

    .wrapper__cash_popUp_121 {
        width: 100%;
        height: 50px;
        position: relative;
    }

    .wrapper__cash_popUp_1211 {
        width: 50px;
        height: 100%;
        position: absolute;
        top: 0;
        left: 0;
        text-align: center;
    }

    .wrapper__cash_popUp_1211 span {
        font-size: 28px;
        line-height: 50px;
        color: #0000cc;
    }

    .wrapper__cash_popUp_1212 {
        width: 30px;
        height: 100%;
        position: absolute;
        top: 0;
        left: 50px;
        text-align: left;
    }

    .wrapper__cash_popUp_1212 span {
        font-size: 28px;
        line-height: 60px;
        color: #111b21;
    }

    .wrapper__cash_popUp_121 input {
        width: 100%;
        height: 100%;
        border: 2px solid #eee;
        border-radius: 15px;
        outline: none;
        background-color: transparent;
        box-sizing: border-box;
        padding: 0 78px;
        direction: ltr;
        font-family: BYekan;
        font-weight: bold;
        font-size: 18px;
        color: #111b21;
        position: absolute;
    }

    .wrapper__cash_popUp_122 {
        width: 100%;
        height: 40px;
        margin-top: 10px;
    }

    .wrapper__cash_popUp_1221 {
        width: 33.3%;
        height: 100%;
        float: right;
        box-sizing: border-box;
        padding: 0 2px;
        direction: rtl;
    }

    .wrapper__cash_popUp_1221_marg {
        width: 100%;
        height: 100%;
        background-color: #eee;
        border-radius: 10px;
        position: relative;
    }

    .wrapper__cash_popUp_1221_label {
        width: 100%;
        height: 100%;
        text-align: center;
        position: absolute;
        cursor: pointer;
    }

    .wrapper__cash_popUp_1221_marg input {
        appearance: none;
    }

    .wrapper__cash_popUp_1221_label .fa_price {
        font-family: BYekan;
        font-weight: bold;
        font-size: 16px;
        color: #111b21;
        position: relative;
        top: -10px;
    }

    .wrapper__cash_popUp_1221_label .fa-toman {
        font-size: 24px;
        color: #4a5764;
        line-height: 45px;
    }

    .wrapper__cash_popUp_123 {
        width: 100%;
        height: 50px;
        margin-top: 40px;
    }

    .wrapper__cash_popUp_123 button {
        width: 100%;
        height: 100%;
        border: none;
        border-radius: 15px;
        outline: none;
        background-color: var(--gold);
        font-family: XEROSANS-BOLD;
        font-size: 16px;
        color: var(--black);
        cursor: pointer;
    }

    .wrapper__cash_popUp_124 {
        width: 100%;
        height: 40px;
        direction: rtl;
    }

    .wrapper__cash_popUp_1241 {
        width: auto;
        height: 100%;
        float: right;
    }

    .wrapper__cash_popUp_1242 {
        width: 130px;
        height: 100%;
        float: left;
    }

    .wrapper__cash_popUp_12421 {
        width: 30px;
        height: 100%;
        float: left;
        text-align: left;
    }

    .wrapper__cash_popUp_12421 span {
        font-size: 26px;
        line-height: 50px;
        color: #00b862;
    }

    .wrapper__cash_popUp_124 label {
        font-family: 'XEROSANS-NORMAL', 'BYekan';
        font-weight: bold;
        font-size: 13px;
        line-height: 34px;
        color: #4a5764;
    }

    .wrapper__cash_popUp_124 input {
        width: 100px;
        height: 100%;
        border: none;
        outline: none;
        background-color: transparent;
        font-family: BYekan;
        font-weight: bold;
        font-size: 16px;
        text-align: left;
        float: left;
        color: #00b862;
        line-height: 40px;
    }

}
@media /* `users */ {
    .wrapper__users_1 {
        width: 300px;
        height: 180px;
        margin: 20px auto 0;
    }

    .wrapper__users_1 img {
        height: 100%;
        position: relative;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
    }

    .form-users {
        width: calc(100% - 30px);
        height: auto;
        margin: 40px auto 0;
    }

    .form-users-fields-p {
        width: 100%;
        height: 40px;
        direction: rtl;
        text-align: right;
    }

    .form-users-fields-p p {
        font-family: XEROSANS-BOLD;
        font-size: 18px;
        line-height: 40px;
        color: #111b21;
    }

    .form-users-fields-item {
        width: 100%;
        height: 80px;
        position: relative;
    }

    .form-users-fields-item:not(:first-child) {
        margin-top: 10px;
    }

    .form-users-fields-title {
        width: 100%;
        height: 30px;
        direction: rtl;
        text-align: right;
    }

    .form-users-fields-title span {
        font-family: XEROSANS-NORMAL;
        font-size: 15px;
        line-height: 21px;
        color: #4a5764;
    }

    .form-users-fields-input,
    .form-users-fields-select,
    .form-users-fields-select,
    .form-users-fields-item-submit {
        width: 100%;
        height: 50px;
        position: relative;
    }

    .form-users-fields-input input {
        width: 100%;
        height: 100%;
        border: 2px solid #d7d7d7;
        outline: none;
        background-color: transparent;
        border-radius: 15px;
        box-sizing: border-box;
        padding: 0 20px 0 20px;
        color: #104d33;
    }

    .type-tel input {
        font-family: BYekan;
        font-weight: bold;
        font-size: 20px;
    }

    .type-txt input {
        direction: rtl;
        font-family: "BYekan", "Monda";
        font-weight: bold;
        font-size: 18px;
    }

    .form-users-fields-section {
        width: 50%;
        height: 80px;
    }

    .section {
        display: flex;
        gap: 10px;
        flex-direction: row-reverse;
    }

    .form-users-fields-section select {
        width: 100%;
        height: 100%;
        border: 2px solid #d7d7d7;
        outline: none;
        background-color: transparent;
        border-radius: 15px;
        box-sizing: border-box;
        padding: 0 15px;
        color: #104d33;
        font-family: XEROSANS-BOLD;
        font-size: 15px;
        appearance: none;
        direction: rtl;
    }

    .form-users-fields-section select option {
        font-family: XEROSANS-NORMAL;
        font-size: 14px;
        color: #667079;
    }

    .form-users-fields-item-submit {
        margin-top: 40px;
    }

    .form-users-fields-item-submit button {
        width: 100%;
        height: 100%;
        border: none;
        background-color: var(--gold);
        outline: none;
        font-family: XEROSANS-BOLD;
        font-size: 18px;
        cursor: pointer;
        color: #111b21;
        border-radius: 15px;
    }
}
@media /* `token */ {
    .section-profile-credit-invite-pop-img
    {
        width: 100%;
        height: 230px;
        margin-top: 20px;
    }

    .section-profile-credit-invite-pop-img img
    {
        height: 100%;
        position: relative;
        top: 50%;
        left: 50%;
        transform: translate(-50%,-50%);
    }

    .section-profile-credit-invite-pop-qr-text
    {
        width: calc(100% - 40px);
        height: auto;
        margin: 20px auto 0;
    }

    .section-profile-credit-invite-pop-qr
    {
        width: 130px;
        height: 130px;
        overflow: hidden;
        margin: 20px auto 0;
        position: relative;
    }

    .section-profile-credit-invite-pop-qr img
    {
        height: 150px;
        position: relative;
        top: 50%;
        left: 50%;
        transform: translate(-50%,-50%);
    }

    .section-profile-credit-invite-pop-qr span
    {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%,-50%);
        font-size: 30px;
        color: #111b21;
    }

    .section-profile-credit-invite-pop-next-1
    {
        width: 130px;
        height: 50px;
        background-color: #00023b;
        border-radius: 50px;
        position: absolute;
        bottom: 15px;
        left: 15px;
        cursor: pointer;
    }

    .section-profile-credit-invite-pop-level-1-fa
    {
        width: 46px;
        height: 46px;
        background-color: #ffcc00;
        border-radius: 100%;
        text-align: center;
        float: left;
        margin: 2px 2px 0 2px;
    }

    .section-profile-credit-invite-pop-level-1-fa span
    {
        font-size: 28px;
        line-height: 46px;
        color: #111b21;
    }

    .section-profile-credit-invite-pop-level-1-lab
    {
        width: calc(100% - 50px);
        height: 100%;
        float: right;
        text-align: center;
    }

    .section-profile-credit-invite-pop-level-1-lab span
    {
        font-family: XEROSANS-BOLD;
        font-size: 15px;
        line-height: 50px;
        color: #ffcc00;
    }

    .section-profile-credit-invite-pop-pre-1,
    .section-profile-credit-invite-pop-pre-2
    {
        width: 50px;
        height: 50px;
        background-color: #00023b;
        border-radius: 100%;
        position: absolute;
        bottom: 15px;
        right: 15px;
        text-align: center;
        display: none;
        cursor: pointer;
    }

    .section-profile-credit-invite-pop-pre-1 span,
    .section-profile-credit-invite-pop-pre-2 span
    {
        font-size: 28px;
        line-height: 50px;
        color: #ffcc00;
    }

    .section-profile-credit-invite-pop-link
    {
        width: calc(100% - 40px);
        height: auto;
        margin: 20px auto 0;
        display: none;
    }

    .section-profile-credit-invite-pop-link-text-fa
    {
        width: 50px;
        height: 100%;
        float: right;
        text-align: center;
    }

    .section-profile-credit-invite-pop-link-text-fa span
    {
        font-size: 20px;
        line-height: 50px;
        color: #111b21;
    }

    .section-profile-credit-invite-pop-link-text-des
    {
        width: calc(100% - 50px);
        height: 100%;
        direction: rtl;
        float: right;
        text-align: justify;
        margin-top: 7px;
    }

    .section-profile-credit-invite-pop-link-text-des span
    {
        font-family: XEROSANS-NORMAL;
        font-size: 13px;
        line-height: 15px;
        color: #555555;
    }

    .section-profile-credit-invite-pop-link-inp
    {
        width: 100%;
        height: 40px;
        background-color: #eee;
        border-radius: 15px;
        text-align: center;
        margin: 10px auto 0;
    }

    .section-profile-credit-invite-pop-link-inp span
    {
        font-family: Monda;
        font-size: 11px;
        line-height: 40px;
    }

    .section-profile-credit-invite-pop-link-send
    {
        width: 140px;
        height: 74px;
        margin: 10px auto;
    }

    .section-profile-credit-invite-pop-link-send-copy,
    .section-profile-credit-invite-pop-link-send-share
    {
        width: 70px;
        height: 100%;
        float: left;
    }

    .section-profile-credit-invite-pop-link-send-copy-text,
    .section-profile-credit-invite-pop-link-send-share-text
    {
        width: 100%;
        height: 30px;
        text-align: center;
    }

    .section-profile-credit-invite-pop-link-send-copy-text span,
    .section-profile-credit-invite-pop-link-send-share-text span
    {
        font-family: XEROSANS-NORMAL;
        font-size: 12px;
        line-height: 25px;
    }

    .section-profile-credit-invite-pop-link-send-copy-fa
    {
        width: 40px;
        height: 40px;
        text-align: center;
        transform: rotate(140deg);
        border-radius: 100%;
        border: 2px solid #111b21;
        margin: 0 auto;
        cursor: pointer;
    }

    .section-profile-credit-invite-pop-link-send-copy-fa span
    {
        font-size: 30px;
        line-height: 40px;
        color: #111b21;
    }

    .section-profile-credit-invite-pop-link-send-share-fa
    {
        width: 40px;
        height: 40px;
        text-align: center;
        border-radius: 100%;
        border: 2px solid #111b21;
        margin: 0 auto;
        cursor: pointer;
    }

    .section-profile-credit-invite-pop-link-send-share-fa span
    {
        font-size: 29px;
        line-height: 40px;
        color: #111b21;
    }

    .section-profile-credit-invite-pop-next-2
    {
        width: 130px;
        height: 50px;
        background-color: #00023b;
        border-radius: 50px;
        position: absolute;
        bottom: 15px;
        left: 15px;
        display: none;
        cursor: pointer;
    }

    .section-profile-credit-invite-pop-level-2-fa
    {
        width: 46px;
        height: 46px;
        background-color: #ffcc00;
        border-radius: 100%;
        text-align: center;
        float: left;
        margin: 2px 2px 0 2px;
    }

    .section-profile-credit-invite-pop-level-2-fa span
    {
        font-size: 28px;
        line-height: 46px;
        color: #111b21;
    }

    .section-profile-credit-invite-pop-level-2-lab
    {
        width: calc(100% - 50px);
        height: 100%;
        float: right;
        text-align: center;
    }

    .section-profile-credit-invite-pop-level-2-lab span
    {
        font-family: XEROSANS-BOLD;
        font-size: 15px;
        line-height: 50px;
        color: #ffcc00;
    }

    .section-profile-credit-invite-pop-phone
    {
        width: calc(100% - 40px);
        height: auto;
        display: none;
        margin: 20px auto 0;
    }

    .section-notification-invite-pop-item
    {
        width: 100%;
        height: auto;
        background-color: rgb(178, 213, 255);
        border-radius: 10px;
        box-sizing: border-box;
        padding-left: 20px;
        display: inline-block;
    }

    .section-notification-invite-pop-item-fa
    {
        width: 50px;
        height: 100%;
        float: right;
        text-align: center;
    }

    .section-notification-invite-pop-item-fa span
    {
        font-size: 20px;
        line-height: 50px;
        color: #111b21;
    }

    .section-notification-invite-pop-item-des
    {
        width: calc(100% - 50px);
        height: 100%;
        direction: rtl;
        float: right;
        text-align: justify;
        padding: 15px 0;
    }

    .section-notification-invite-pop-item-des span
    {
        font-family: XEROSANS-NORMAL;
        font-size: 14px;
        line-height: 15px;
        color: #555555;
    }

    .section-profile-credit-invite-pop-phone-number
    {
        width: 100%;
        height: auto;
        text-align: center;
        margin: 20px auto 0;
        border-radius: 200px;
        box-sizing: border-box;
        background-color: #eee;
        border-radius: 15px;
    }

    .section-profile-credit-invite-pop-phone-number-text
    {
        width: 100%;
        height: 40px;
        direction: rtl;
    }

    .section-profile-credit-invite-pop-phone-number-text span
    {
        font-family: XEROSANS-BOLD;
        font-size: 15px;
        line-height: 50px;
    }

    .section-profile-credit-invite-pop-phone-number-code
    {
        width: 100%;
        height: 40px;
    }

    .section-profile-credit-invite-pop-phone-number-code span
    {
        font-family: BYekan;
        font-weight: bold;
        font-size: 22px;
        line-height: 30px;
        color: #0020ff;
    }

    .blocked-pop
    {
        width: 100%;
        height: 100%;
        position: absolute;
        top: 0;
        background-color: rgba(17, 27, 33, 0.6);
        display: none;
    }

    /* اعلان اشتراک گذاری کد دعوت */
    .section-profile-credit-invite-pop-shared
    {
        width: 100%;
        height: 320px;
        position: fixed;
        bottom: -320px;
        overflow: hidden;
        background-color: var(--white);
        z-index: 110;
    }

    .section-profile-credit-invite-pop-success
    {
        width: 300px;
        height: 150px;
        background-color: #031b3d;
        border-radius: 20px;
        position: absolute;
        top: 140px;
        left: 50%;
        transform: translate(-50%);
        display: none;
        transition: .5s;
    }

    .section-profile-credit-invite-pop-success-fa
    {
        width: 60px;
        height: 50px;
        text-align: center;
        position: absolute;
        top: 15px;
        left: 50%;
        transform: translate(-50%);
    }

    .section-profile-credit-invite-pop-success-fa span
    {
        font-size: 40px;
        line-height: 60px;
        color: #FFCC00;
    }

    .section-profile-credit-invite-pop-success-tit
    {
        width: 100%;
        height: auto;
        text-align: center;
        direction: rtl;
        position: absolute;
        top: 70px;
    }

    .section-profile-credit-invite-pop-success-tit span
    {
        font-family: 'XEROSANS-BOLD','BYekan';
        font-size: 16px;
        color: #fff;
    }

    .section-profile-credit-invite-pop-success-des
    {
        width: 100%;
        height: 30px;
        text-align: center;
        direction: rtl;
        position: absolute;
        bottom: 15px;
    }

    .section-profile-credit-invite-pop-success-des span
    {
        font-family: XEROSANS-BOLD;
        font-size: 14px;
        color: #c2f8cb;
    }

    .row-social
    {
        width: calc(100% - 40px);
        height: 250px;
        overflow: hidden;
        border-radius: 25px;
        background-color: #e1e1ff;
        margin: 0 auto;
        position: absolute;
        top: 30px;
        left: 50%;
        transform: translateX(-50%);
    }

    .row-social-img
    {
        width: 100%;
        height: 100%;
        position: absolute;
        top: 0;
        left: 0;
    }

    .row-social-img img
    {
        height: 250px;
        position: relative;
        left: 50%;
        transform: translate(-50%);
        top: -20px;
    }

    .section-profile-nav-handel
    {
        width: 50px;
        height: 3px;
        border-bottom-left-radius: 3px;
        background-color: #111b21;
        position: absolute;
        top: 3px;
        left: 50%;
        transform: translate(-50%);
    }

    .row-social-link
    {
        width: 100%;
        height: 70px;
        position: absolute;
        top: 160px;
    }

    .row-social-link-socials
    {
        width: auto;
        height: 40px;
        position: absolute;
        bottom: 15px;
        left: 50%;
        transform: translateX(-50%);
        display: inline-flex;
        gap: 5px;
    }

    .row-social-link-socials a
    {
        color: #111b21;
    }

    .row-social-link-socials-instagram
    {
        width: 40px;
        height: 100%;
        text-align: center;
        float: right;
        cursor: pointer;
    }

    .row-social-link-socials-twitter
    {
        width: 40px;
        height: 100%;
        text-align: center;
        float: right;
        cursor: pointer;
    }

    .row-social-link-socials-aparat
    {
        width: 40px;
        height: 100%;
        text-align: center;
        float: right;
        cursor: pointer;
    }

    .row-social-link-socials-eitaa
    {
        width: 40px;
        height: 100%;
        text-align: center;
        float: right;
        cursor: pointer;
    }

    .row-social-link-socials-whatsapp
    {
        width: 40px;
        height: 100%;
        text-align: center;
        float: right;
        cursor: pointer;
    }

    .row-social-link-socials-telegram
    {
        width: 40px;
        height: 100%;
        text-align: center;
        float: right;
        cursor: pointer;
    }

    .row-social-link-socials-instagram span
    {
        font-size: 36px;
        line-height: 40px;
    }

    .row-social-link-socials-twitter span
    {
        font-size: 36px;
        line-height: 40px;
    }

    .row-social-link-socials-aparat span
    {
        font-size: 36px;
        line-height: 40px;
    }

    .row-social-link-socials-eitaa span
    {
        font-size: 36px;
        line-height: 40px;
    }

    .row-social-link-socials-whatsapp span
    {
        font-size: 36px;
        line-height: 40px;
    }

    .row-social-link-socials-telegram span
    {
        font-size: 36px;
        line-height: 40px;
    }
}
@media /* ---------- `friends */
{
    .friends__title
    {
        width: 100%;
        height: 50px;
        direction: rtl;
        margin-bottom: 30px;
        border-bottom: 1px solid #eee;
    }

    .friends__title span
    {
        font-family: BYekan;
        font-weight: bold;
        font-size: 20px;
        line-height: 50px;
        color: var(--grey);
    }

    .friends__wrapper-active
    {
        width: 100%;
        height: 70px;
        position: relative;
    }

    .friends__wrapper_100-2
    {
        width: 100%;
        height: auto;
        margin-bottom: 120px;
    }

    .friends__wrapper--pic
    {
        width: 70px;
        height: 100%;
        border-radius: 100%;
        background-color: #eee;
        float: right;
        overflow: hidden;
    }

    .friends__wrapper-active:not(:last-child)
    {
        margin-bottom: 5px;
    }

    .friends__wrapper--pic img
    {
        width: 55px;
        position: relative;
        top: 50%;
        left: 50%;
        transform: translate(-50%,-50%);
    }

    .friends__wrapper--con
    {
        width: calc(100% - 75px);
        height: 100%;
        border-radius: 70px;
        background-color: var(--gold);
        float: right;
        position: relative;
        right: 5px;
    }

    .friends__wrapper_con-ico
    {
        width: 40px;
        height: 40px;
        position: absolute;
        top: 15px;
        left: 15px;
        text-align: center;
        border-radius: 100%;
        transform: rotate(45deg);
        background-color: var(--black);
    }

    .friends__wrapper_con-ico span
    {
        font-size: 22px;
        line-height: 40px;
        color: var(--gold);
    }

    .friends__wrapper_con-name
    {
        width: auto;
        height: 29px;
        direction: rtl;
        position: absolute;
        top: 8px;
        right: 30px;
    }

    .friends__wrapper_con-name span
    {
        font-family: BYekan;
        font-weight: bold;
        font-size: 18px;
        line-height: 29px;
        color: #111b21;
    }

    .friends__wrapper_con-loc
    {
        width: auto;
        height: 25px;
        direction: ltr;
        position: absolute;
        top: 36px;
        right: 30px;
    }

    .friends__wrapper_con-loc span
    {
        font-family: BYekan;
        font-weight: bold;
        font-size: 18px;
        line-height: 25px;
        color: #111b21;
    }

    .friends__wrapper_100-1
    {
        width: 100%;
        height: auto;
        margin-bottom: 20px;
    }

    .friends__wrapper-join
    {
        width: 100%;
        height: 60px;
        position: relative;
        background-color: #eee;
        border-radius: 60px;
    }

    .friends__wrapper-join:not(:last-child)
    {
        margin-bottom: 5px;
    }

    .friends__wrapper_pic-join
    {
        width: 50px;
        height: 50px;
        text-align: center;
        float: right;
        background-color: #111b21;
        border-radius: 100%;
        margin: 5px 5px;
    }

    .friends__wrapper_pic-join span
    {
        font-size: 28px;
        line-height: 50px;
        color: var(--gold);
    }

    .friends__wrapper_con-join
    {
        width: calc(100% - 60px);
        height: 100%;
        float: right;
        position: relative;
    }

    .friends__wrapper_con_name-join
    {
        width: auto;
        height: 25px;
        position: absolute;
        top: 5px;
        right: 20px;
    }

    .friends__wrapper_con_name-join span
    {
        font-family: BYekan;
        font-weight: bold;
        font-size: 16px;
        color: #111b21;
    }

    .friends__wrapper_con_total-join
    {
        width: auto;
        height: 25px;
        position: absolute;
        top: 30px;
        right: 20px;
        direction: rtl;
    }

    .friends__wrapper_con_total-join span
    {
        font-family: BYekan;
        font-weight: bold;
        font-size: 14px;
        color: var(--blue);
    }
}
@media /* `pop friends */ {
    .wrapper__pop_friends {
        width: 100%;
        height: 490px;
        position: fixed;
        bottom: -490px;
        background-color: var(--white);
        z-index: 110;
    }

    .wrapper__pop_friends_receipt {
        width: 100%;
        height: 470px;
        position: fixed;
        bottom: -470px;
        background-color: var(--white);
        z-index: 120;
    }

    .wrapper__pop_friends_img
    {
        width: 100%;
        height: 200px;
        margin-top: 20px;
    }

    .wrapper__pop_friends_img img
    {
        height: 100%;
        position: relative;
        top: 50%;
        left: 50%;
        transform: translate(-50%,-50%);
    }

    .wrapper__pop_friends_content {
        width: calc(100% - 60px);
        height: auto;
        margin: 0 auto;
    }

    .wrapper__pop_friends_content_fields {
        width: 100%;
        height: auto;
        margin-bottom: 30px;
    }

    .wrapper__pop_friends_content_fields_item {
        width: 100%;
        height: 40px;
    }

    .wrapper__pop_friends_content_fields_item:not(:last-child) {
        border-bottom: 1px dashed #cfcfcf;
    }

    .wrapper__pop_friends_content_fields_item_title {
        width: auto;
        height: 100%;
        float: right;
        direction: rtl;
        display: inline-block;
    }

    .wrapper__pop_friends_content_fields_item_title span {
        font-family: XEROSANS-NORMAL;
        font-size: 15px;
        line-height: 34px;
        color: #2e383c;
    }

    .wrapper__pop_friends_content_fields_item_des {
        width: auto;
        height: 100%;
        float: left;
        display: inline-block;
    }

    .wrapper__pop_friends_content_fields_item_des span {
        line-height: 40px;
        color: #2e383c;
    }

    .friends_content_fields_text {
        font-family: XEROSANS-BOLD;
        font-size: 16px;
    }

    .friends_content_fields_num {
        font-family: BYekan;
        font-weight: bold;
        font-size: 19px;
    }

    .wrapper__pop_friends_content_detail {
        width: 100%;
        height: 50px;
        background-color: #eee;
        border-radius: 10px;
        text-align: center;
    }

    .wrapper__pop_friends_content_detail span {
        font-family: XEROSANS-BOLD;
        font-size: 18px;
        line-height: 50px;
        color: #111b21;
    }

    .wrapper__cash_12_view {
        width: calc(100% - 30px);
        height: calc(100% - 40px);
        position: absolute;
        top: 40px;
        left: 50%;
        transform: translateX(-50%);
        overflow-y: scroll;
    }

    .wrapper__cash_12_view_content {
        width: calc(100% - 20px);
        margin: 0 auto;
        min-height: 40px;
    }

    .wrapper__cash_12_view_rows {
        width: 100%;
        height: 50px;
        background-color: var(--white);
        position: relative;
        pointer-events: none;
    }

    .wrapper__cash_12_view_rows:not(:first-child) {
        margin-top: 5px;
    }

    .wrapper__cash_12_view_content_ico {
        width: 50px;
        height: 50px;
        float: right;
        text-align: center;
    }

    .wrapper__cash_12_view_content_ico span {
        font-size: 26px;
        line-height: 50px;
        color: #616161;
    }

    .wrapper__cash_12_view_content_detail {
        width: auto;
        height: 100%;
        float: right;
        text-align: right;
        direction: ltr;
    }

    .wrapper__cash_12_view_content_cost {
        width: auto;
        height: 100%;
        float: left;
        text-align: left;
    }

    .wrapper__cash_12_view_content_cost .fa_cost {
        font-family: 'BYekan';
        font-weight: bold;
        font-size: 17px;
        line-height: 50px;
        color: #2e383c;
    }

    .wrapper__cash_12_view_content_cost .fa-toman {
        font-size: 27px;
        color: #2e383c;
        position: relative;
        top: 10px;
        margin-left: 10px;
    }

    .wrapper__cash_12_view_content_detail_des {
        height: 20px;
    }

    .wrapper__cash_12_view_content_detail_des span {
        font-family: XEROSANS-BOLD;
        font-size: 13px;
        line-height: 30px;
        color: #616161;
    }

    .wrapper__cash_12_view_content_detail_date {
        height: 30px;
    }

    .wrapper__cash_12_view_content_detail_date span {
        font-family: 'XEROSANS-NORMAL', 'BYekan';
        font-size: 13px;
        line-height: 30px;
        color: #8a8a8a;
    }
}
@media /* ---------- `auth */
{
    .logo-form-auth
    {
        width: 100%;
        height: 80px;
        text-align: center;
    }

    .logo-form-auth span
    {
        font-size: 42px;
        line-height: 80px;
        color: #104d33;
    }

    .form-auth
    {
        width: 100%;
        height: auto;
        margin-top: 20px;
    }

    .form-auth-fields
    {
        width: 300px;
        height: auto;
        margin: 0 auto;
    }

    .form-auth-fields-title
    {
        width: 100%;
        height: 60px;
        direction: rtl;
        margin-bottom: 20px;
    }

    .form-auth-fields-title h1
    {
        font-family: XEROSANS-BOLD;
        font-size: 18px;
        line-height: 30px;
        color: #111b21;
    }

    .form-auth-fields-title h2,
    .form-auth-fields-title span
    {
        font-family: XEROSANS-NORMAL;
        font-size: 14px;
        line-height: 30px;
        color: #4a5764;
    }

    .jhdkjhfdjk
    {
        width: calc(50% - 3px);
        height: 100%;
        float: right;
    }

    .jhdkjhfdjk:last-child
    {
        margin-right: 6px;
    }

    .field-input
    {
        width: 100%;
        height: 50px;
        position: relative;
    }

    .field-input input
    {
        width: 100%;
        height: 100%;
        border: 2px solid #8a8a8a;
        outline: none;
        background-color: transparent;
        border-radius: 15px;
        box-sizing: border-box;
        padding: 0 20px 0 20px;
        color: #104d33;
    }

    .input-num input
    {
        font-family: BYekan;
        font-weight: bold;
        font-size: 18px;
    }

    .input-txt input
    {
        direction: rtl;
        font-family: "BYekan","Monda";
        font-weight: bold;
        font-size: 18px;
    }

    #fa-en input
    {
        direction: ltr;
    }

    .fieldInputLabel,
    .verifyInputLable
    {
        width: 100%;
        height: 20px;
        direction: rtl;
    }

    .fieldInputLabel label,
    .verifyInputLable label
    {
        font-family: XEROSANS-NORMAL;
        font-size: 13px;
        position: relative;
        top: 0px;
    }

    .submit
    {
        width: 100%;
        height: 50px;
        border-radius: 15px;
        margin-top: 40px;
    }

    .submit button
    {
        width: 100%;
        height: 100%;
        border: none;
        background-color: transparent;
        outline: none;
        font-family: XEROSANS-BOLD;
        font-size: 16px;
        cursor: pointer;
        color: #111b21;
    }

    .auth-sub
    {
        background-color: var(--gold);
    }

    .attributes-paragraph-policy
    {
        width: 100%;
        height: auto;
        direction: rtl;
        margin-top: 10px;
    }

    .attributes-paragraph-policy p
    {
        font-family: XEROSANS-NORMAL;
        font-size: 13px;
        line-height: 20px;
        color: #8a8a8a;
    }

    .attributes-paragraph-policy a
    {
        color: #008eb2;
    }
}
@media /* `orders */ {
    .wrapper__orders-tit {
        width: 100%;
        height: 40px;
        direction: rtl;
        margin-top: 20px;
    }

    .wrapper__orders-tit span {
        font-family: XEROSANS-BOLD;
        font-size: 16px;
        line-height: 0;
        color: #111b21;
    }

    .wrapper__orders-table {
        width: 100%;
        height: 290px;
        background-color: #f4f4f4;
        border-radius: 20px;
        overflow: hidden;
        position: relative;
    }

    .wrapper__orders-table:not(:first-child) {
        margin-top: 8px;
    }

    .wrapper__orders_table-100 {
        width: 100%;
        height: 80px;
        position: absolute;
        top: 0;
        background-color: var(--gold);
    }

    .wrapper__orders_table-container {
        width: calc(100% - 40px);
        height: 100%;
        margin: 0 auto;
        position: relative;
    }

    .wrapper__orders_table_100-1,
    .wrapper__orders_table_100-2 {
        width: 100%;
        height: 40px;
        position: relative;
    }

    .wrapper__orders_table_1001-2 {
        width: auto;
        height: 100%;
        position: absolute;
        right: 0;
        direction: rtl;
    }

    .wrapper__orders_table_1001-2 span {
        font-family: XEROSANS-BOLD;
        font-size: 15px;
        line-height: 40px;
        color: #4a5764;
    }

    .wrapper__orders_table_1002-1 {
        position: absolute;
        top: 0;
        right: 0;
    }

    .wrapper__orders_table_1002-1 span {
        font-size: 20px;
        color: var(--black);
    }

    .wrapper__orders_table_1002-2 {
        position: absolute;
        top: 0;
        right: 30px;
        direction: rtl;
    }

    .wrapper__orders_table_1002-2 span,
    .wrapper__orders_table_1002-3 span {
        font-family: BYekan;
        font-weight: bold;
        font-size: 17px;
        line-height: 22px;
        color: var(--black);
    }

    .wrapper__orders_table_1002-3 {
        position: absolute;
        top: 0;
        left: 0;
    }

    .wrapper__orders_table_100-3 {
        width: fit-content;
        height: 25px;
        padding: 0 10px;
        border-radius: 5px;
        position: absolute;
        top: 90px;
        left: 0;
        direction: rtl;
    }

    .wrapper__orders_table_100-3 span {
        font-family: BYekan;
        font-weight: bold;
        font-size: 13px;
        line-height: 19px;
    }

    .jkdjkfuhk {
        position: absolute;
        width: 100%;
        height: 40px;
        bottom: 20px;
    }

    .wrapper__orders_table_100-4 {
        width: 100%;
        height: 100%;
        border-radius: 15px;
        position: absolute;
        left: 0;
        text-align: center;
        border: 2px solid #666;
        cursor: pointer;
        outline: none;
        box-sizing: border-box;
        background-color: transparent;

    }

    .wrapper__orders_table_100-4 span {
        font-family: XEROSANS-BOLD;
        font-size: 14px;
        color: #666;
        line-height: 34px;
    }

    .wrapper__orders_table_100-5 {
        width: 40%;
        height: 100%;
        border-radius: 40px;
        position: absolute;
        right: 0;
        text-align: center;
        box-sizing: border-box;
        background-color: #ef4056;
    }

    .wrapper__orders_table_100-5 span {
        font-family: XEROSANS-BOLD;
        font-size: 14px;
        line-height: 40px;
        color: #fff;
    }

    .wrapper__orders_table_100-6 {
        width: 100%;
        height: 80px;
        position: absolute;
        top: 130px;
        overflow-x: auto;
        direction: rtl;
    }

    .wrapper__orders_table_100-6::-webkit-scrollbar {
        height: 0;
    }

    .wrapper__orders-scroll {
        min-width: max-content;
        height: 70px;
    }

    .wrapper__orders_table_1006-1 {
        width: 70px;
        height: 100%;
        background-color: #fff;
        border-radius: 20px;
        float: right;
        position: relative;
        margin-top: 10px;
    }

    .wrapper__orders_table_1006-1:not(:first-child) {
        margin-right: 5px;
    }

    .wrapper__orders_table_1006-1 img {
        width: 100%;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        border-radius: 20px;
    }

    .wrapper__orders_table_100-7 {
        width: auto;
        height: 25px;
        position: absolute;
        right: 0;
        top: 90px;
        direction: rtl;
    }

    .wrapper__orders_table_100-7 .span__1007-1 {
        font-family: BYekan;
        font-weight: bold;
        font-size: 15px;
        line-height: 25px;
        color: #4a5764;
    }

    .wrapper__orders_table_100-7 .span__1007-2 {
        font-family: BYekan;
        font-weight: bold;
        font-size: 18px;
        line-height: 25px;
        color: #111b21;
    }

    .sddfsfdf {
        width: 25px;
        height: 25px;
        position: absolute;
        background-color: #DC143C;
        border-radius: 5px;
        text-align: center;
        top: -10px;
        right: 0;
    }

    .sddfsfdf span {
        font-family: BYekan;
        font-weight: bold;
        line-height: 25px;
        color: #fff;
        font-size: 16px;
    }

    .cart_a_1000-1 {
        width: 100%;
        height: 240px;
        overflow: hidden;
        margin: 40px auto 0;
    }

    .cart_a_1000-1 img {
        height: 100%;
        position: relative;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
    }
}
@media /* ---------- `verify */
{
    .verifyInput
    {
        width: 220px;
        height: 50px;
        margin: 40px auto 0;
    }

    .verifyInput input
    {
        width: 50px;
        height: 50px;
        float: left;
        margin-right: 5px;
        background-color: #eeeeee;
        border-radius: 7px;
        outline: none;
        border: none;
        font-family: BYekan;
        font-weight: bold;
        font-size: 22px;
        color: #111b21;
        box-sizing: border-box;
        text-align: center;
        color: #2e383c;
    }

    .verifyInput input:focus
    {
        border: 2px solid #19bfd3;
    }

    .warpperLoginFormTitle
    {
        width: 100%;
        height: auto;
        direction: rtl;
        margin-top: 20px;
        margin-bottom: 10px;
    }

    .warpperLoginFormTitle h1
    {
        font-family: XEROSANS-BOLD;
        font-size: 18px;
        color: #111b21;
    }

    .warpperLoginFormTitle p
    {
        font-family: XEROSANS-NORMAL;
        font-size: 14px;
        color: #2e383c;
        direction: rtl;
        line-height: 20px;
    }

    .timerResend
    {
        width: 120px;
        height: 40px;
        margin: 20px auto 0;
        text-align: center;
    }

    .timerResendBar
    {
        width: 80px;
        height: 100%;
        direction: rtl;
        float: right;
    }

    .resendInput
    {
        width: 120px;
        height: 40px;
        margin: 20px auto 0;
        direction: rtl;
    }

    .resendInput input
    {
        width: 100%;
        height: 100%;
        background-color: transparent;
        outline: none;
        box-sizing: border-box;
        color: #19bfd3;
        border: none;
        font-family: 'XEROSANS-BOLD','BYekan';
        font-weight: bold;
        font-size: 15px;
        cursor: pointer;
        margin: 0 auto;
    }

    .timerResendBar span
    {
        font-family: XEROSANS-NORMAL;
        font-size: 14px;
        color: #666;
        line-height: 40px;
    }

    #resend-otp
    {
        font-family: XEROSANS-NORMAL;
        font-size: 14px;
    }

    #min,
    #sec,
    #hou,
    #day
    {
        font-family: BYekan;
        font-weight: bold;
        font-size: 16px;
    }

    .timerResendIco
    {
        width: 40px;
        height: 100%;
        float: right;
    }

    .timerResendIco span
    {
        font-size: 28px;
        line-height: 40px;
        color: #666;
    }

    .verifySubmit
    {
        width: 100%;
        height: 50px;
        margin-top: 20px;
    }

    .verifySubmit button
    {
        width: 100%;
        height: 100%;
        background-color: transparent;
        outline: none;
        border: none;
        font-family: XEROSANS-BOLD;
        font-size: 18px;
        cursor: pointer;
        direction: rtl;
        border-radius: 15px;
    }

    .loginSubmitStyle button
    {
        color: #ffffff;
        background-color: #0000cc;
    }

    #sessionMobile {
        font-family: BYekan;
        font-weight: bold;
        font-size: 18px;
        color: #111b21;
    }
}
@media /* `invite */ {
    .wrapper__alert_invite {
        width: 100%;
        height: 80px;
        background-color: #B2D5FF;
        text-align: justify;
        direction: rtl;
        box-sizing: border-box;
        padding: 20px;
        margin-top: 40px;
        display: table;
        border-radius: 15px;
    }

    .wrapper__alert_invite span {
        font-family: 'XEROSANS-BOLD';
        font-weight: bold;
        font-size: 15px;
        line-height: 20px;
        color: #111b21;
    }

    .wrapper__submit_invite {
        width: 100%;
        height: 50px;
        margin-top: 20px;
        display: flex;
        gap: 10px;
    }

    .wrapper__submit__invite_register {
        width: 50%;
        height: 100%;
        background-color: #00b862;
        overflow: hidden;
        border-radius: 50px;
    }

    .wrapper__submit__invite_cancel {
        width: 50%;
        height: 100%;
        border:2px solid #00b862;
        overflow: hidden;
        box-sizing: border-box;
        border-radius: 50px;
    }

    .wrapper__submit__invite_register button,
    .wrapper__submit__invite_cancel button {
        width: 100%;
        height: 100%;
        border: none;
        background-color: transparent;
        outline: none;
        font-family: XEROSANS-BOLD;
        font-size: 16px;
        cursor: pointer;
    }

    .wrapper__submit__invite_register button {
        color: #fff;
    }

    .wrapper__submit__invite_cancel button {
        color: #00b862;
    }
}
@media /* `alert invaild */ {
    .alert__invalid {
        width: 260px;
        height: auto;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%,-50%);
        background-color: var(--white);
        z-index: 110;
    }

    .alert__invalid_container {
        width: calc(100% - 40px);
        height: 100%;
        margin: 0 auto;
    }

    .alert__invalid_img {
        width: 100%;
        height: 220px;
        overflow: hidden;
        margin-top: 20px;
    }

    .alert__invalid_img img {
        height: 100%;
        position: relative;
        top: 50%;
        left: 50%;
        transform: translate(-50%,-50%);
    }

    .success-title
    {
        width: 100%;
        height: 40px;
        text-align: center;
        direction: rtl;
    }

    .success-title span
    {
        font-family: XEROSANS-BOLD;
        font-size: 18px;
        line-height: 40px;
        color: #212832;
        font-weight: bold;
    }

    .success-description
    {
        width: 100%;
        height: auto;
        text-align: center;
        direction: rtl;
        margin-top: 10px;
    }

    .success-description span
    {
        font-family: XEROSANS-NORMAL;
        font-size: 15px;
        color: #666666;
        line-height: 20px;
    }

    .success-button
    {
        width: 100%;
        height: 50px;
        text-align: center;
        background-color: gold;
        border-radius: 40px;
        cursor: pointer;
        margin-top: 40px;
        margin-bottom: 20px;
    }

    .success-button span
    {
        font-family: XEROSANS-BOLD;
        font-size: 16px;
        line-height: 50px;
        font-weight: bold;
        color: #212832;
        pointer-events: none;
    }

}
@media /* `menu */ {
    .wrapper__blocked_menu {
        width: 100%;
        height: 100%;
        position: fixed;
        background-color: rgba(17, 27, 33, 0.4);
        z-index: 120;
        display: none;
    }

    .wrapper__blocked_menu.active {
        display: block;
    }

    .wrapper__menu {
        position:fixed;
        top:60px;
        left:0;
        width:100%;
        background:#fff;
        padding:15px;
        display:none;
        z-index: 130;
        box-sizing: border-box;
        font-family: XEROSANS-NORMAL;
        font-size: 13px;
    }

    .wrapper__menu.active {
        display:block;
    }

    .wrapper__menu ul {
        list-style:none;
    }

    .wrapper__menu li {
        opacity:0;
        transform:translateY(-20px);
        animation:drop .4s forwards;
    }

    .wrapper__menu li:not(:last-child) {
        border-bottom:1px solid #eee;
    }

    .wrapper__menu li:nth-child(1){animation-delay:.05s;}
    .wrapper__menu li:nth-child(2){animation-delay:.10s;}
    .wrapper__menu li:nth-child(3){animation-delay:.15s;}
    .wrapper__menu li:nth-child(4){animation-delay:.20s;}
    .wrapper__menu li:nth-child(5){animation-delay:.25s;}

    .wrapper__menu a {
        display:flex;
        justify-content:space-between;
        align-items:center;
        text-decoration:none;
        color:#111;
        padding:15px 5px;
        font-size:17px;
    }

    .submenu {
        max-height:0;
        overflow:hidden;
        transition:max-height .45s ease;
        background:#fafafa;
    }

    .submenu a {
        opacity:0;
        transform:translateY(-15px);
        padding:12px 18px;
        font-size:15px;
        color:#666;
        display:block;
        transition:.3s;
    }

    .submenu.open {
        max-height:300px;
    }

    .submenu.open a{
        animation:subdrop .4s forwards;
    }

    .submenu.open a:nth-child(1){animation-delay:.05s;}
    .submenu.open a:nth-child(2){animation-delay:.10s;}
    .submenu.open a:nth-child(3){animation-delay:.15s;}
    .submenu.open a:nth-child(4){animation-delay:.20s;}

    @keyframes drop {
        to{
            opacity:1;
            transform:translateY(0);
        }
    }

    @keyframes subdrop {
        to{
            opacity:1;
            transform:translateY(0);
        }
    }

    .wrapper__menu li {
        direction: rtl;
    }
}
@media /* `inbox */ {
    .smsiuepe05y016
    {
        width: 280px;
        height: auto;
        margin: 40px auto;
    }

    .smsiuepe05y0161
    {
        width: 100%;
        height: 50px;
        text-align: center;
    }

    .smsiuepe05y0161 span
    {
        font-family: XEROSANS-BOLD;
        font-size: 16px;
        line-height: 50px;
        color: #111b21;
    }

    .smsiuepe05y0162
    {
        width: 100%;
        height: auto;
        text-align: center;
        direction: rtl;
    }

    .smsiuepe05y0162 span
    {
        font-family: XEROSANS-NORMAL;
        font-size: 14px;
        line-height: 20px;
        color: #444;
    }
}
@media /* `history */ {
    .cart_empty {
        width: 100%;
        height: 330px;
        margin: 60px auto 0;
        position: relative;
    }

    .cart_empty_picture {
        width: 100%;
        height: 250px;
        overflow: hidden;
        position: relative;
    }

    .cart_empty img {
        height: 100%;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
    }

    .cart_empty_picture_des {
        width: 100%;
        height: 50px;
        text-align: center;
        direction: rtl;
        margin-top: 40px;
    }

    .cart_empty_picture_des span {
        font-family: XEROSANS-NORMAL;
        font-size: 16px;
        line-height: 46px;
        color: #111b21;
    }
}
@media /* `exit */ {
    .wrapper__alert_exit {
        width: 260px;
        height: 460px;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        background-color: var(--white);
        border-radius: 20px;
        z-index: 210;
        display: none;
    }

    .wrapper__alert_exit_3 {
        width: 200px;
        height: auto;
        position: absolute;
        bottom: 30px;
        left: 50%;
        transform: translate(-50%);
    }

    .wrapper__alert_exit_31,
    .wrapper__alert_exit_32 {
        width: 100%;
        height: 50px;
        text-align: center;
        box-sizing: border-box;
        border-radius: 25px;
        cursor: pointer;
    }

    .wrapper__alert_exit_31 {
        background-color: #0000cc;
    }

    .wrapper__alert_exit_32 {
        border: 2px solid #0000cc;
        margin-top: 5px;
    }

    .wrapper__alert_exit_31 span,
    .wrapper__alert_exit_32 span {
        font-family: 'XEROSANS-BOLD','BYekan';
        font-weight: bold;
        font-size: 16px;
    }

    .wrapper__alert_exit_31 span {
        color: #fff;
        line-height: 50px;
    }

    .wrapper__alert_exit_32 span {
        color: #111b21;
        line-height: 46px;
    }

    .wrapper__alert_exit_2 {
        width: 180px;
        height: auto;
        text-align: center;
        position: absolute;
        bottom: 150px;
        left: 50%;
        transform: translate(-50%);
        direction: rtl;
    }

    .wrapper__alert_exit_2 span {
        font-family: 'XEROSANS-NORMAL','BYekan';
        font-size: 16px;
        line-height: 25px;
        color: #111b21;
    }

    .wrapper__alert_exit_1 {
        width: 100%;
        height: 220px;
        position: absolute;
        top: 20px;
    }

    .wrapper__alert_exit_1 img {
        height: 180px;
        position: relative;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
    }

}
@media /* `alert cart */ {
    .blockedPopUp
    {
        width: 100%;
        height: 100%;
        position: absolute;
        top: 0;
        z-index: 110;
        display: none;
    }

    .main-auth
    {
        width: calc(100% - 40px);
        height: calc(100% - 390px);
        overflow-y: scroll;
        position: absolute;
        top: 310px;
        left: 50%;
        transform: translateX(-50%);
    }

    .main-auth::-webkit-scrollbar
    {
        width: 0;
    }

    .section-auth-row-one
    {
        width: 100%;
        min-height: 40px;
        margin: 0 auto;
    }

    .cart_a_100 {
        width: 100%;
        height: auto;
    }


}
@media /* alert detail */ {
    .wrapper_detail_alert {
        width: 100%;
        height: 560px;
        position: fixed;
        bottom: -460px;
        background-color: var(--white);
        z-index: 200;
        cursor: grab;
    }

    .wrapper_detail_alert_pic {
        width: 200px;
        height: 200px;
        position: absolute;
        top: 40px;
        left: 50%;
        transform: translateX(-50%);
    }

    .wrapper_detail_alert_pic img {
        height: 100%;
        position: relative;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        border: 2px solid var(--silver);
        border-radius: 20px;
        pointer-events: none;
    }

    .wrapper_detail_alert_configuration {
        width: calc(100% - 60px);
        height: 50px;
        position: absolute;
        left: 50%;
        top: 260px;
        transform: translateX(-50%);
    }

    .wrapper_detail_alert_configuration_score,
    .wrapper_detail_alert_configuration_orders,
    .wrapper_detail_alert_configuration_supplier {
        width: 33.3%;
        height: 30px;
        float: left;
        box-sizing: border-box;
        margin-top: 10px;
    }

    .wrapper_detail_alert_configuration_orders,
    .wrapper_detail_alert_configuration_supplier {
        border-left: 1px solid #b5b5b5;
    }

    .wrapper_detail_alert_configuration_score_ico {
        width: 100%;
        height: 30px;
        position: relative;
        top: -10px;
        text-align: center;
    }

    .wrapper_detail_alert_configuration_score_tit {
        width: 100%;
        height: 20px;
        position: relative;
        top: -10px;
        text-align: center;
    }

    .wrapper_detail_alert_configuration_orders_ico {
        width: 100%;
        height: 30px;
        position: relative;
        top: -10px;
        text-align: center;
    }

    .wrapper_detail_alert_configuration_orders_tit {
        width: 100%;
        height: 20px;
        position: relative;
        top: -10px;
        text-align: center;
    }

    .wrapper_detail_alert_configuration_supplier_ico {
        width: 100%;
        height: 30px;
        position: relative;
        top: -10px;
        text-align: center;
    }

    .wrapper_detail_alert_configuration_supplier_tit {
        width: 100%;
        height: 20px;
        position: relative;
        top: -10px;
        text-align: center;
    }

    .wrapper_detail_alert_configuration_supplier_tit span {
        font-family: 'XEROSANS-BOLD';
        font-size: 13px;
        line-height: 20px;
    }

    .wrapper_detail_alert_configuration_score_tit span,
    .wrapper_detail_alert_configuration_orders_tit span {
        color: #aba9a9;
    }

    .wrapper_detail_alert_configuration_supplier_tit span {
        color: var(--black);
    }

    .wrapper_detail_alert_configuration_score_tit span,
    .wrapper_detail_alert_configuration_orders_tit span {
        font-family: 'BYekan', 'Monda';
        font-size: 16px;
        line-height: 20px;
    }

    .wrapper_detail_alert_configuration_score_ico span,
    .wrapper_detail_alert_configuration_orders_ico span,
    .wrapper_detail_alert_configuration_supplier_ico span {
        font-size: 23px;
        line-height: 30px;
    }

    .wrapper_detail_alert_configuration_score_ico span,
    .wrapper_detail_alert_configuration_orders_ico span {
        color: #b5b5b5;
    }

    .wrapper_detail_alert_configuration_supplier_ico span {
        color: crimson;
    }

    .wrapper_detail_alert_specification {
        width: calc(100% - 60px);
        height: auto;
        position: absolute;
        top: 340px;
        left: 50%;
        transform: translateX(-50%);
        direction: rtl;
    }

    .wrapper_detail_alert_specification_name {
        width: 100%;
        height: 40px;
    }

    .wrapper_detail_alert_specification_name span {
        font-family: 'XEROSANS-BOLD','BYekan';
        font-weight: bold;
        font-size: 16px;
        line-height: 40px;
        color: #01875f;
    }

    .wrapper_detail_alert_specification_compositions {
        width: 100%;
        height: auto;
        text-align: justify;
        margin-top: 10px;
    }

    .wrapper_detail_alert_specification_compositions span {
        font-family: 'XEROSANS-NORMAL', 'BYekan';
        font-size: 13px;
        line-height: 20px;
        color: #5f6368;
    }

    .wrapper_detail_alert_price {
        width: calc(100% - 60px);
        height: 60px;
        position: absolute;
        bottom: 30px;
        left: 50%;
        transform: translateX(-50%);
    }

    .wrapper_detail_alert_price_counter {
        width: 130px;
        height: 50px;
        position: absolute;
        bottom: 0;
        left: 0;
        border-radius: 15px;
        box-sizing: border-box;
        background-color: rgba(0, 215, 87, 0.4);
    }

    .wrapper_detail_alert_price_counter_less,
    .wrapper_detail_alert_price_counter_more {
        outline: none;
        border: none;
        width: 40px;
        height: 46px;
        text-align: center;
        cursor: pointer;
        background-color: var(--white);
        border-radius: 13px;
        top: 2px;
        position: absolute;
    }

    .wrapper_detail_alert_price_counter_less span,
    .wrapper_detail_alert_price_counter_more span {
        font-size: 19px;
        line-height: 46px;
    }

    .wrapper_detail_alert_price_counter_less span {
        font-size: 19px;
    }

    .wrapper_detail_alert_price_counter_more span {
        font-size: 22px;
    }

    .wrapper_detail_alert_price_counter_less {
        left: 2px;
    }

    .wrapper_detail_alert_price_counter_more {
        right: 2px;
    }

    .wrapper_detail_alert_price_counter_num {
        width: 46px;
        height: 100%;
        text-align: center;
        position: absolute;
        top: 2px;
        left: 50%;
        transform: translateX(-50%);
    }

    .wrapper_detail_alert_price_counter_num input {
        outline: none;
        background-color: transparent;
        font-family: 'BYekan';
        font-weight: bold;
        font-size: 22px;
        color: #111b21;
        width: 100%;
        height: 44px;
        border: none;
        text-align: center;
    }

    .wrapper_detail_alert_price_counter_price {
        width: auto;
        height: 100%;
        position: absolute;
        right: 0;
    }

    .wrapper_detail_alert_price_counter_price .txt-toman {
        font-family: BYekan;
        font-weight: bold;
        font-size: 24px;
        line-height: 50px;
        color: #111b21;
    }

    .wrapper_detail_alert_price_counter_price .fa-toman {
        font-size: 30px;
        line-height: 50px;
        color: #111b21;
        position: relative;
        top: 10px;
    }

    .wrapper_detail_alert_price_counter_logout,
    .wrapper_detail_alert_price_counter_add {
        width: 130px;
        height: 50px;
        position: absolute;
        bottom: 0;
        left: 0;
        border-radius: 15px;
        box-sizing: border-box;
        background-color: #01875f;
        text-align: center;
    }

    .wrapper_detail_alert_price_counter_logout span,
    .wrapper_detail_alert_price_counter_add span {
        font-family: 'XEROSANS-BOLD';
        font-size: 16px;
        line-height: 50px;
        color: var(--white);
    }

    .wrapper__blocked_detail {
        width: 100%;
        height: 100%;
        position: fixed;
        background-color: rgba(17, 27, 33, 0.4);
        z-index: 200;
        top: 0;
    }
}
@media /* `checkout */ {
    .cart_DEFRASWQXC1 {
        width: 100%;
        height: 50px;
        direction: rtl;
        text-align: right;
        border-bottom: 1px solid var(--silver);
    }

    .cart_DEFRASWQXC1 span {
        font-family: XEROSANS-BOLD;
        font-size: 18px;
        line-height: 50px;
        margin-right: 20px;
        color: var(--grey);
    }

    .cart_a_1001-1 {
        width: calc(100% - 30px);
        height: 100%;
        margin: 0 auto;
        position: relative;
        box-sizing: border-box;
    }

    #textarea {
        padding: 30px 20px;
    }

    .cart_a_1001-1 textarea {
        max-width: 100%;
        min-width: 100%;
        max-height: 120px;
        min-height: 120px;
        border: none;
        border-radius: 15px;
        background-color: #fff;
        outline: none;
        resize: none;
        direction: rtl;
        box-sizing: border-box;
        padding: 10px 20px 15px;
        font-family: XEROSANS-NORMAL;
        font-size: 16px;
        line-height: 20px;
        text-align: justify;
    }

    .cart_a_10011-1_cart {
        width: 100%;
        position: relative;
    }

    .cart_a_10011-1_cart:not(:last-child) {
        border-bottom: 1px dashed #666;
    }

    .cart_a_10011-abc {
        width: 100%;
        height: 40px;
        direction: rtl;
    }

    .cart_a_10011-bcd {
        width: 100%;
        height: auto;
        direction: rtl;
        display: flex;
    }

    .cart_a_10011-abc span {
        font-family: XEROSANS-BOLD;
        font-size: 16px;
        color: #111b21;
        line-height: 55px;
    }

    .cart_a_10011-bcd1 {
        width: auto;
        height: 100%;
        float: right;
        margin: 20px 10px 20px 0;
        direction: rtl;
        text-align: justify;
    }

    .cart_a_10011-bcd1 label {
        font-family: 'XEROSANS-NORMAL','BYekan';
        font-size: 15px;
        color: #555;
        line-height: 25px;
    }

    .cart_a_10011-bcd1 #unit-home {
        font-family: 'BYekan';
        font-size: 19px;
        color: #555;
        position: relative;
        top: -2px;
    }

    .cart_a_100-2 {
        width: 100%;
        height: auto;
        margin: 40px auto;
    }

    .cart_a_10022-2 {
        width: 100%;
        height: 300px;
        border-radius: 25px;
        overflow: hidden;
        margin-bottom: 40px;
    }

    .cart_a_10022-2 img {
        height: 300px;
        position: relative;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
    }

    .cart_a_1002-1 {
        width: 100%;
        height: 35px;
    }

    .cart_a_10021-1 {
        width: auto;
        height: 100%;
        float: right;
        direction: rtl;
    }

    .cart_a_10021-1 .cart-title {
        font-family: XEROSANS-NORMAL;
        font-size: 16px;
        line-height: 30px;
    }

    .cart_a_10021-1 .cart-item {
        font-family: BYekan;
        font-weight: bold;
        font-size: 16px;
        line-height: 30px;
    }

    .cart_a_10021-2 {
        width: auto;
        height: 100%;
        float: left;
    }

    .cart_a_10021-2 span {
        line-height: 35px;
    }

    .cart_a_10021-2 .fa-toman {
        font-size: 34px;
    }

    .cart_a_10021-2 .txt-toman {
        font-family: BYekan;
        font-weight: bold;
        font-size: 22px;
        position: relative;
        top: -13px;
    }

    .cart_a_10021-2 .cart-free {
        font-family: XEROSANS-BOLD;
        font-size: 18px;
        line-height: 35px;
    }

    .cart_a_10021-2 .txt-zero {
        font-family: BYekan;
        font-weight: bold;
        font-size: 22px;
        line-height: 35px;
    }

    .color-10024 span {
        color: var(--black);
    }

    .color-10022 span {
        color: var(--green);
    }

    .cart_a_10011-bcd2
    {
        width: 20px;
        height: 100%;
        float: right;
        margin-top: 19px;
    }

    .cart_a_10011-bcd2 input
    {
        width: 16px;
        height: 16px;
        margin-top: 7px;
    }
}
@media /* ` برای صفحات دسته بندی */ {
    .wrapper__categories_bar {
        width: 100%;
        height: auto;
        display: inline-block;
        margin: 20px auto 0;
    }

    .marg-link:not(:first-child) {
        margin-top: 7px;
    }

    .wrapper__categories_title {
        width: 100%;
        height: 50px;
        text-align: right;
        direction: rtl;
        border-bottom: 1px solid #e2e2e2;
        margin-top: 20px;
    }

    .wrapper__categories_title span {
        font-family: XEROSANS-BOLD;
        font-size: 20px;
        line-height: 50px;
        color: #111b21;
    }

    .wrapper__categories__bar_1 {
        width: 100%;
        height: 140px;
        background-color: #f2f2f2;
        border-radius: 20px;
        position: relative;
    }

    .wrapper__categories__bar__1_container {
        width: calc(100% - 20px);
        height: 100%;
        margin: 0 auto;
        position: relative;
    }

    .wrapper__categories__bar__1_1 {
        width: 120px;
        height: 120px;
        position: absolute;
        top: 10px;
        right: 0;
        background-color: #fff;
        border-radius: 15px;
        overflow: hidden;
    }

    .wrapper__categories__bar__1_1 img {
        height: 100%;
        position: relative;
        top: 50%;
        left: 50%;
        transform: translate(-50%,-50%);
    }

    .wrapper__categories__bar__1_2 {
        width: auto;
        height: auto;
        position: absolute;
        top: 10px;
        right: 130px;
        direction: rtl;
        text-align: right;
    }

    .wrapper__categories__bar__1_2 span {
        font-family: 'XEROSANS-BOLD','BYekan';
        font-weight: bold;
        font-size: 17px;
        line-height: 25px;
        color: var(--black);
    }

    .wrapper__categories__bar__1_3 {
        width: auto;
        height: 60px;
        position: absolute;
        bottom: 10px;
        left: 0;
    }
}
@media /* `view orders */ {
    .view_orders {
        width: 100%;
        height: 520px;
        position: fixed;
        bottom: -520px;
        background-color: #fff;
        z-index: 200;
        cursor: grab;
    }

    .wrapper__view__orders__container {
        width: calc(100% - 40px);
        height: calc(100% - 60px);
        position: absolute;
        left: 50%;
        transform: translateX(-50%);
        top: 20px;
        overflow-y: scroll;
    }

    .wrapper__view__orders__container::-webkit-scrollbar {
        width: 3px;
        background-color: #e2e2e2;
    }

    .wrapper__view__orders__container::-webkit-scrollbar-thumb {
        background-color: #667079;
    }

    .wrapper__view_orders_main {
        width: calc(100% - 20px);
        min-height: 40px;
        margin: 0 auto;
    }

    .view__orders_pic {
        width: 100%;
        height: 200px;
    }

    .view__orders_pic img {
        height: 100%;
        position: relative;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        pointer-events: none;
    }

    .mainContentViewOrder {
        width: 100%;
        height: auto;
    }

    .mainContentViewOrder::-webkit-scrollbar {
        width: 0;
    }

    .sdfggsdfsd {
        width: 100%;
        height: auto;
        border-bottom: 1px dashed #667079;
    }

    .sdfggsdfsd1 {
        width: 100%;
        height: 30px;
        position: relative;
        margin-bottom: 5px;
    }

    .sdfggsdfsd1 .fa-toman {
        font-size: 28px;
        float: left;
        position: relative;
        top: 4px;
    }

    .totalsdfdfsdfs .fa-toman {
        font-size: 28px;
        float: left;
        position: relative;
        top: 4px;
        color: crimson;
    }

    .sdfo,
    .sdf {
        float: left;
        font-family: "BYekan";
        font-weight: bold;
        font-size: 18px;
        line-height: 30px;
    }

    .sdff {
        float: left;
        font-family: "BYekan";
        font-weight: bold;
        font-size: 16px;
        line-height: 30px;
    }

    .ghjo {
        float: right;
        font-family: XEROSANS-NORMAL;
        font-size: 14px;
        line-height: 26px;
    }

    .ghj {
        float: right;
        font-family: XEROSANS-NORMAL;
        font-size: 14px;
        line-height: 26px;
    }

    .sdfo {
        color: green;
    }

    .ghjo,
    #sdfggsdfsd1 .fa-toman {
        color: green;
    }

    .sdfb {
        float: left;
        font-family: "BYekan";
        font-weight: bold;
        font-size: 18px;
        line-height: 30px;
    }

    .ghjb {
        float: right;
        font-family: XEROSANS-BOLD;
        font-size: 14px;
        line-height: 30px;
    }

    .sdfb,
    .ghjb {
        color: crimson;
    }

    .form-orders:not(:last-child) {
        margin-bottom: 10px;
    }
}