@font-face {
    font-family: "Manrope-Regular";
    src: url(../fonts/Manrope-Regular.ttf);
    font-weight: 400;
    font-style: normal;
    font-stretch: normal;
    font-variant: normal;
}

@font-face {
    font-family: "Manrope-Medium";
    src: url(../fonts/Manrope-Medium.ttf);
    font-weight: 500;
}

@font-face {
    font-family: "Manrope-Bold";
    src: url(../fonts/Manrope-Bold.ttf);
    font-weight: 700;
}

:root {
    --font-regular: "Manrope-Regular";
    --font-medium: "Manrope-Medium";
    --font-bold: "Manrope-Bold";
    --color-primary: #EB4C27;
    --color-dark: #1E1E2A;
    --color-gray-dark: #626C7A;
    --color-gray: #90969F;
    --color-gray-light: #E6E6E6;
    --color-bg: #F2F2F2;
    --color-white: #FFFFFF;
    --color-red: #E2342B;
    --color-btn-hover: #CA301C;
    --color-btn-press: #A91913;
    --color-yellow: #FFE102;
    --color-green: #6BC132;
    --color-blue: #0B74E5;
    --color-blue-light: #CDEDFD;
    --color-primary-light: #FEE8D3;
    --box-shadow-primary: 0px 2px 8px 0 rgba(0, 0, 0, .14)
}

body {
    background-color: var(--color-white);
    font-family: var(--font-regular);
    color: var(--color-dark);
    font-size: 16px;
    scroll-behavior: smooth;
}
body.no-scroll {
    overflow: hidden;
}

a {
    text-decoration: none;
    color: var(--color-dark);
}
ol, ul, h1, h2, h3, h4 {
    padding: 0;
    margin: 0;
}
img.contain {
    object-fit: contain;
}

.wrapper {
    width: 100%;
    min-height: 100vh;
}
.regularL {
    font-family: var(--font-regular);
    font-size: 16px;
    line-height: 24px;
    letter-spacing: -2%;
}
.regularM {
    font-family: var(--font-regular);
    font-size: 14px;
    line-height: 20px;
    letter-spacing: -2%;
}
.regularS {
    font-family: var(--font-regular);
    font-size: 12px;
    line-height: 16px;
}
.mediumL {
    font-family: var(--font-medium);
    font-size: 16px;
    line-height: 24px;
    letter-spacing: -2%;
}
.mediumM {
    font-family: var(--font-medium);
    font-size: 14px;
    line-height: 20px;
    letter-spacing: -2%;
}
.mediumS {
    font-family: var(--font-medium);
    font-size: 12px;
    line-height: 16px;
}
.boldL {
    font-family: var(--font-bold);
    font-size: 16px;
    line-height: 24px;
    letter-spacing: -2%;
}
.boldM {
    font-family: var(--font-bold);
    font-size: 14px;
    line-height: 20px;
    letter-spacing: -2%;
}
.notification {
    position: fixed;
    top: 72px;
    right: 10%;
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    border-radius: 8px;
    background-color: var(--color-green);
    z-index: 100;
    max-width: 80vw;
    white-space: nowrap;
    pointer-events: none;
    opacity: 0;
    transition: 260ms ease-in-out;
}

.notification .text {
    color: var(--color-white);
}

.loader {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.7);
    color: var(--color-white);
    z-index: 100;
    display: none;
}
.loader.active {
    display: block;
}
.loader-container {
    width: fit-content;
    gap: 10px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translateX(-50%) translateY(-50%);
}
.loader-animate {
    display: inline-block;
    position: relative;
    width: 80px;
    height: 80px;
}
.loader-animate .line {
    box-sizing: border-box;
    display: block;
    position: absolute;
    width: 64px;
    height: 64px;
    margin: 8px;
    border: 8px solid #fff;
    border-radius: 50%;
    animation: loader-animate 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
    border-color: #fff transparent transparent transparent;
}
.loader-animate .line:nth-child(1) {
    animation-delay: -0.45s;
}
.loader-animate .line:nth-child(2) {
    animation-delay: -0.3s;
}
.loader-animate .line:nth-child(3) {
    animation-delay: -0.15s;
}
@keyframes loader-animate {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}
.loader .text {
    width: fit-content;
    text-align: center;
}
.catalog {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(to right, var(--color-bg), var(--color-bg) 40%, rgba(0, 0, 0, 0.5) 40%, rgba(0, 0, 0, 0.5));
    display: none;
    z-index: 20;
}
.catalog.active {
    display: flex;
}
.catalog-bg {
    background-color: var(--color-bg);
}
.catalog-nav {
    padding: 32px 24px;
    display: flex;
    flex-direction: column;
    gap: 24px;
    background-color: var(--color-bg);
}
.catalog-nav-select {
    display: flex;
    gap: 24px;
}
.catalog-nav-select__item {
    opacity: 0.5;
    border-bottom: 1px solid transparent;
    cursor: pointer;
    transition: 300ms ease-in-out;
}
.catalog-nav-select__item img {
    width: 59px;
}
.catalog-nav-select__item.active {
    border-bottom: 1px solid var(--color-dark);
    opacity: 1;
}
.catalog-nav-list {
    width: 320px;
}
.catalog-nav-list__item {
    padding: 12px 0;
    cursor: pointer;
    letter-spacing: -0.32px;
}
.catalog-nav-list.mobile {
    display: none;
    width: 360px;
    overflow: scroll;
    max-height: 100%;
    margin: 0 auto;
}
.catalog-nav-list.mobile .block {
    width: 100%;
    align-items: center;
    flex-wrap: wrap;
    gap: 16px 16px;
    display: none;
}
.catalog-nav-list.mobile .block.active {
    display: flex;
}
.catalog-nav-list.mobile .catalog-nav-list__item {
    width: 164px;
    min-width: 164px;
    height: 164px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    text-align: center;
    border-radius: 12px;
    padding: 12px 0 0 0;
    overflow: hidden;
    background-color: #E9E9E9;
}
.catalog-grid-wraper {
    background-color: var(--color-white);
    padding: 32px 24px;
    display: none;
}
.catalog-grid-wraper.active {
    display: block;
}
.catalog-close {
    cursor: pointer;
    width: 24px;
}
.catalog-grid {
    display: grid;
    gap: 24px 24px;
    grid-template-columns: repeat(3, 1fr);
    max-height: 85vh;
    overflow-y: auto;
    margin-top: 24px;
    padding: 0 12px 0 0;
    scrollbar-color: var(--color-gray) var(--color-bg);
    scrollbar-width: thin;
}

.catalog-grid::-webkit-scrollbar {
    width: 6px;
}
.catalog-grid::-webkit-scrollbar-track {
    background-color: var(--color-bg);
}
.catalog-grid::-webkit-scrollbar-thumb {
    background-color: var(--color-gray);
    border-radius: 6px;
}

.catalog-grid__item {
    display: flex;
    flex-direction: column;
    max-width: 260px;
}
.catalog-grid__item .link {
    color: var(--color-dark);
    padding: 12px 0;
}
.container {
    padding-left: 0;
    padding-right: 0;
}
.container.margin-top {
    margin-top: 60px;
}
.header-panel {
    background-color: var(--color-dark);
    padding: 6px 0;
}
.lenguage-select__active {
    color: var(--color-white);
    cursor: pointer;
}
.header-panel__block {
    gap: 32px;
}
.header-panel-notice {
    position: relative;
}
.notice-count {
    color: var(--color-white);
    background-color: var(--color-green);
    border-radius: 2px;
    padding: 0 4px;
    min-width: 16px;
    text-align: center;
    position: absolute;
    top: -2px;
    right: -2px;
}

.header-panel-notice.active .header-panel-notice-dropdown {
    display: block;
}
.header-panel-notice-head {
    cursor: pointer;
}
.header-panel-notice-dropdown {
    border-radius: 8px;
    background-color: var(--color-white);
    padding: 12px 16px 0;
    position: absolute;
    display: none;
    width: 393px;
    right: 0;
    top: 32px;
    z-index: 11;
    box-shadow: var(--box-shadow-primary);
}
.notice-dropdown-nav__item {
    color: var(--color-gray);
    padding-bottom: 6px;
    border-bottom: 1px solid transparent;
    transition: 300ms ease-in-out;
    cursor: pointer;
}
.notice-dropdown-list {
    margin-top: 24px;
    overflow-y: auto;
    max-height: 388px;
    scrollbar-width: none;
    -ms-overflow-style: none;
}
.notice-dropdown-list::-webkit-scrollbar {
    display: none;
}
.scroll-hide {
    scrollbar-width: none;
    -ms-overflow-style: none;
}
.scroll-hide::-webkit-scrollbar {
    display: none;
}
.notice-list {

}
.notice-list.read .read, .notice-list.unread .unread {
    display: block;
}
.notice-list.unread .read, .notice-list.read .unread {
    display: none;
}
.notice-dropdown-list::-webkit-scrollbar {
    display: none;
}
.notice-dropdown-list__item {
    margin-bottom: 12px;
    padding: 12px 16px 12px 16px;
    border: 1px solid var(--color-gray-light);
    background-color: var(--color-white);
    border-radius: 8px;
    position: relative;
    display: block;
}
.notice-dropdown-list__item.unread {
    background-color: var(--color-gray-light);
}
.notice-dropdown-list__item .title {
    display: flex;
    justify-content: space-between;
}
.notice-dropdown-list__item .image {
    position: absolute;
    top: 12px;
    right: 16px;
}
.notice-dropdown-list__item .date {
    color: var(--color-gray-dark);
    margin-top: 12px;
}


.notice-dropdown-nav__item.active {
    color: var(--color-dark);
    border-bottom: 1px solid var(--color-dark);
}

.header-panel__contacts {
    position: relative;
}
.header-panel__contacts.active .header-panel__contacts-dropdown{
    display: flex;
}
.header-panel__contacts-dropdown {
    flex-direction: column;
    border-radius: 8px;
    background-color: var(--color-white);
    padding: 0 30px;
    position: absolute;
    width: 460px;
    right: 0;
    top: 26px;
    z-index: 11;
    box-shadow: var(--box-shadow-primary);
}
.contacts-dropdown {
    display: flex;
    flex-direction: column;
    background-color: var(--color-white);
    padding: 0 10px 0 28px;
    margin-top: 32px;
    width: 462px;
}
.contacts-dropdown.dark {
    background-color: transparent;
    width: 100%;
    max-width: 452px;
    margin-top: 12px;
    padding-left: 0px;
}
.contacts-dropdown__item {
    border-top: 1px solid var(--color-gray-light);
    padding: 11px 0 12px;
}
.contacts-dropdown__item img {
    width: 32px;
    float: left;
    margin: 3px 12px 0 -12px;
}
.contacts-dropdown__item .title {
    color: var(--color-gray-dark);
}
.contacts-dropdown__item .text {
    color: var(--color-dark);
    margin-left: 32px;
    display: block;
}

.dark .contacts-dropdown__item img {
    margin-left: 0;
}
.dark .contacts-dropdown__item .title,
.dark .contacts-dropdown__item .text {
    color: var(--color-white);
}
.dark .contacts-dropdown__item .text {
    font-family: var(--font-medium);
    letter-spacing: -0.32px; 
}

.header-panel__contacts-dropdown .contacts-dropdown__item:nth-child(1),
.contacts-dropdown .contacts-dropdown__item:nth-child(1) {
    border-top: none;
}
.header-panel__social-links {
    gap: 16px;
}
.header-panel__contacts-head a {
    color: var(--color-white);
}
.lenguage-select__dropdown, .header-panel__contacts-dropdown {
    display: none;
}

.header-main {
    padding: 12px 0;
}
.header-main .container {
    max-height: 48px;
}
.header-logo, .search-main {
    margin-right: 32px;
}
.catalog-main {
    background-color: var(--color-primary);
    color: var(--color-white);
    padding: 12px;
    gap: 4px;
    border-radius: 8px;
    cursor: pointer;
    margin-right: 16px;
    transition: 260ms ease-in-out;
}

.search-main {
    border: 1px solid var(--color-gray);
    padding: 1px 12px;
    background-color: var(--color-white);
    border-radius: 8px;
    gap: 8px;
    width: 100%;
    position: relative;
}
.search-main.focus {
    border: 1px solid var(--color-primary);
}
.search-main__select {
    position: relative;
}
.search-main-clear {
    display: none;
    cursor: pointer;
}
.search-main-result {
    position: absolute;
    z-index: 13;
    top: 48px;
    right: 0;
    background-color: var(--color-white);
    box-shadow: var(--box-shadow-primary);
    width: 86%;
    border-radius: 8px;
    padding: 0 16px;
    display: none;
    flex-direction: column;
}
.search-main-result.active {
    display: flex;
}
a.search-main-result__item {
    color: var(--color-dark);
    display: inline-flex;
    align-items: center;
    padding: 12px 0;
}
.search-main-result__item b {
    font-family: var(--font-bold);
}
a.search-main-result__item.memory {
    color: var(--color-gray-dark);
}
.search-main-result__item.memory::after {
    display: none;
}
.search-main-result__item.memory::before {
    content: '';
    width: 24px;
    height: 24px;
    background-image: url(../images/search-memory.svg);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: contain;
    display: inline-block;
    margin-right: 8px;    
}
.search-main__select-head {
    background-color: var(--color-bg);
    border-radius: 4px;
    gap: 4px;
    padding: 4px 8px;
    cursor: pointer;
    width: 84px;
    height: 32px;
}
.search-main__select.active .search-main__select-dropdown {
    display: flex;
}

.search-main__select-dropdown {
    display: none;
    flex-direction: column;
    position: absolute;
    right: 0;
    top: 30px;
    width: 212px;
    padding: 0 16px;
    background-color: var(--color-white);
    border-radius: 8px;
    box-shadow: var(--box-shadow-primary);
    transition: 260ms ease-in-out;
    z-index: 11;
}
.select-dropdown__item {
    padding: 12px 0;
    display: flex;
    justify-content: space-between;
    cursor: pointer;
}
.select-dropdown__item img {
    max-width: 44px;
}
.select-dropdown__item::after {
    content: '';
    width: 24px;
    height: 24px;
    background-position: center center;
    background-size: cover;
}
.select-dropdown__item.active::after {
    background-image: url(../images/1688-accept.svg);
}
.search-input {
    flex-basis: 70%;
    outline: none;
    border: none;
    padding: 12px 0;
}
.search-input:focus::placeholder {
    opacity: 0;
}
.search-input::placeholder {
    color: var(--color-gray);
}
.search-photo {
    white-space: nowrap;
    gap: 4px;
    padding: 4px 8px;
    cursor: pointer;
    background-color: var(--color-bg);
    border-radius: 6px;
}
.header-buttons {
    gap: 24px;
}
.header-buttons__item.mobile,
.footer-list.mobile,
.title.mobile {
    display: none;
}
.header-buttons__item, a.header-buttons__item {
    cursor: pointer;
    position: relative;
    color: var(--color-dark);
}
/*
.header-buttons__item.js-dropdown-element .title::after {
    content: 'Вход';
}
.header-buttons__item.js-dropdown-element.js-authentication .title::after {
    content: 'Профиль';
}
 */
.header-buttons__item-dropdown {
    background-color: var(--color-white);
    border-radius: 8px;
    top: 44px;
    right: 20px;
    width: 220px;
    flex-direction: column;
    display: none;
    padding: 0 6px 0 12px;
    box-shadow: var(--box-shadow-primary);
    z-index: 11;
    position: absolute;
}
.header-buttons__item-dropdown a {
    color: var(--color-gray-dark);
}

.header-buttons__item.active .header-buttons__item-dropdown {
    display: flex;
}

.header-buttons__item-dropdown__item {
    display: flex;
    align-items: center;
    padding: 12px 0;
}
.header-buttons__item-dropdown__item .notice-count,
.profile-menu__item .notice-count {
    position: static;
    margin-left: 8px;
}
.header-buttons__item-dropdown img {
    margin-right: 8px;
}
.main {
    flex: 1;
}
.breadcrumbs {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    margin-top: 30px;
    margin-bottom: 16px;
}
.breadcrumbs .breadcrumbs__item:first-child::before {
    display: none;
}
a.breadcrumbs__item {
    color: var(--color-gray-dark);
    font-size: 12px;
    line-height: 16px;
}
h1.title {
    font-family: var(--font-bold);
    font-size: 48px;
    line-height: 52px;
    letter-spacing: -0.96px; 
}
.breadcrumbs__item::before {
    content: '';
    width: 12px;
    height: 12px;
    background-image: url(../images/breadcrumb-arrow.svg);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
    pointer-events: none;
    display: inline-block;
    position: relative;
    top: 2px;
}
.swiper-container {
    position: relative;
    padding-bottom: 30px;
    margin-top: 16px;
    margin-bottom: 10px;
}
.main-swiper {
    border-radius: 12px;
}
.main-swiper .swiper-slide {
    display: flex;
    justify-content: center;
    overflow: hidden;
}
.main-swiper .swiper-button-next::after, .main-swiper .swiper-button-prev::after {
    color: var(--color-primary);
    font-size: 16px;
    font-weight: 700;
}
.swiper-button-next::after {
    margin-left: 4px;
}
.swiper-button-prev::after {
    margin-right: 4px;
}
.main-swiper .swiper-button-next, .main-swiper .swiper-button-prev {
    width: 40px;
    height: 40px;
    background-color: var(--color-white);
    border-radius: 100%;
}
.main-swiper .swiper-button-prev {
    left: 20px;
}
.main-swiper .swiper-button-next {
    right: 20px;
}
.swiper-container .swiper-pagination-bullet,
.swiper-pagination-bullet {
    width: 24px;
    height: 2px;
    background-color: var(--color-gray);
    opacity: 1;
    border-radius: 4px;
}
.swiper-pagination-bullet {
    background-color: var(--color-white);
}
.swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet {
    margin: 0 6px;
}
.swiper-container .swiper-pagination-bullet-active,
.swiper-pagination-bullet-active {
    background-color: var(--color-primary);
}

.main-swiper-product {
    margin-left: -16px;
    width: calc(100vw + 32px);
    margin-bottom: 12px;
}
.main-swiper-product .swiper-slide img {
    width: 100vw;
}

h2.title, .titleL {
    font-family: var(--font-bold);
    font-size: 32px;
    line-height: 40px;
    letter-spacing: -0.64px; 
}
h3.title, .titleM {
    font-family: var(--font-bold);
    font-size: 24px;
    line-height: 32px;
    letter-spacing: -0.48px; 
}
.title .title-more {
    font-size: 16px;
    font-family: var(--font-medium);
    line-height: 24px;
    cursor: pointer;
    color: var(--color-primary);
}
.title-more svg {
    margin-left: 6px;
    /*display: none;*/
}
.main-grid {
    display: grid;
    gap: 32px 20px;
    margin-top: 24px;
    grid-template-columns: repeat(7, 1fr);
}
.main-grid:has(.favorite) {
    overflow: visible;
    max-height: none;
}

.main-grid__item {
    max-width: 168px;
    position: relative;
    cursor: pointer;
}
.main-grid.seller {
    grid-template-columns: repeat(5, 1fr);
}

.main-grid__item.seller {
    max-width: 236px;
}
.main-grid__item.seller img {
    width: 100%;
}
.main-grid__item.seller .name,
.main-grid__item.seller .value {
    font-size: 14px;
    font-family: var(--font-medium);
    line-height: 20px;
    padding: 2px 0 8px 0;
}
.main-grid__item.seller .name {
    color: var(--color-gray-dark);
}

.main-grid__item .image {
    border-radius: 8px;
    margin-bottom: 8px;
    width: 100%;
    overflow: hidden;
    position: relative;
}
.main-grid__item img {
    border-radius: 8px;
    width: 100%;
}
.main-grid__item .price {
    color: var(--color-dark);
}
.main-grid__item .fast-view {
    text-align: center;
    width: 100%;
    background-color: rgba(205, 237, 253, 0.8);
    padding: 8px 0;
    cursor: pointer;
    position: absolute;
    white-space: nowrap;
    bottom: -50px;
    transition: 260ms ease-in-out;
}

.main-grid .discount,
.product-view-img-main .discount,
.discount {
    font-size: 14px;
    font-family: var(--font-medium);
    line-height: 20px;
    background-color: var(--color-yellow);
    border-radius: 4px;
    padding: 0 3px;
    position: absolute;
    display: none;
    top: 8px;
    left: 8px;
}
.main-grid .discount.active,
.product-view-img-main .discount.active,
.discount.active {
    display: block;
}
/*
.main-grid__item.favorite::after {
    content: '';
    position: absolute;
    top: 8px;
    right: 8px;
    width: 24px;
    height: 24px;
    background-image: url(../images/favorite.svg);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
}
 */
.main-grid__item .text {
    color: var(--color-dark);
    text-overflow: ellipsis;
    overflow: hidden;
    display: -moz-box;
    -moz-box-orient: vertical;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    line-clamp: 2;
    box-orient: vertical;
    margin-bottom: 8px;
}

.main-grid__item .prev-price {
    color: var(--color-gray-dark);
    text-decoration: line-through;
    margin-left: 4px;
}
.main-brand-swiper {
    position: relative;
    margin-top: 24px;
}
.main-brand-swiper .swiper-slide {
    width: fit-content;
}
.main-brand-swiper .swiper-button-next::after, .main-brand-swiper .swiper-button-prev::after {
    color: var(--color-gray-dark);
    font-size: 16px;
    font-weight: 700;
}

.main-brand-swiper .swiper-button-next, .main-brand-swiper .swiper-button-prev {
    width: 40px;
    height: 40px;
    background-color: var(--color-white);
    border-radius: 100%;
    box-shadow: var(--box-shadow-primary);
}
.main-brand-swiper .swiper-button-next {
    right: -20px;
}
.main-brand-swiper .swiper-button-prev {
    left: -20px;
}

.blog-container {
    display: flex;
    gap: 24px;
    margin-top: 24px;
    overflow: hidden;
}
.blog-container.active {
    overflow: visible;
    flex-wrap: wrap;
}
.blog-banner-img {
    width: 100%;
    border-radius: 8px;
    margin-top: 16px;
    margin-bottom: 32px;
}
.blog-date {
    color: var(--color-gray-dark);
    margin: 12px 0 32px;
}
.blog-text {
    color: var(--color-gray-dark);
    margin-top: 12px;
    max-width: 880px;
}
h4.title, .titleS {
    font-family: var(--font-bold);
    font-size: 20px;
    line-height: 28px;
    letter-spacing: -0.4px;
}
.blog-title {
    color: #000000;
    margin-top: 32px;
    max-width: 880px;
}
.blog-container__item {
    max-width: 312px;
    width: 100%;
}
.blog-container__item img {
    border-radius: 8px;
}
.blog-container__item .header {
    margin-top: 12px;
    color: var(--color-dark);
}
.blog-container__item .date {
    color: var(--color-gray-dark);
    margin-top: 4px;
}

.about-container {
    margin: 24px 0 0;
    gap: 84px;
}
.about-container__text {
    color: var(--color-gray-dark);
}
.about-container__text p:last-child {
    margin-bottom: 0;
}
.about-container__img {
    object-fit: contain;
}
.footer {
    background-color: var(--color-dark);
    padding: 44px 0;
    margin-top: 32px;
}

.footer-list {
    list-style: none;
}

.footer-list__item {
    margin-bottom: 12px;
}
.footer-list__item a {
    color: var(--color-white);    
}
.footer-list__item.header {
    color: var(--color-gray);
}
.app-buttons {
    gap: 16px;
}
.footer-social-links {
    gap: 40px;
}
.copyright {
    margin-top: 21px;
}
.copyright .text,
.copyright .text a {
    color: var(--color-gray);
}

.modal-wrapper {
    position: fixed;
    /*z-index: 50;*/
    z-index: 9999;
    width: 100%;
    height: 100%;
    display: none;
    justify-content: center;
    padding-top: 10vh;
    background-color: rgba(0, 0, 0, 0.5);
}
.modal-wrapper {
    max-height: 100%;
    overflow-y: scroll;
}
.modal-wrapper.active {
    display: flex;
}
.modal {
    display: flex;
    position: static;
    width: fit-content;
    height: fit-content;
    padding: 32px;
    flex-direction: column;
    gap: 24px;
    border-radius: 12px;
    margin: 0 auto;
    background-color: var(--color-white);
}
.modal.auto {
    max-width: 916px;
}
.modal .product-wrapper, .modal .product-buttons {
    /*margin-top: 0px;*/
}
.modal .product-basket-properties {
    flex-basis: 100%;
}
.modal .product-basket .product-basket-button {
    flex-basis: 48%;
}
.modal .product-basket-block {
    margin-top: 20px;
}
.modal form {
    display: flex;
    flex-direction: column; 
    gap: 16px;
}
.close-modal {
    width: 24px;
    min-width: 24px;
    height: 24px;
    background-image: url(../images/search-clear.svg);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: contain;
    cursor: pointer;
}
.modal-input {
    width: 422px;
}
.input {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
}
.input .required {
    color: var(--color-gray-dark);
}
.input .field {
    padding: 4px 12px;
    border: 1px solid var(--color-gray);
    border-radius: 8px;
    width: 100%;
    position: relative;
    height: 48px;
    cursor: text;
}
.input.focus .field {
    border: 1px solid var(--color-primary);
}
.input .field .title {
    font-family: var(--font-medium);
    font-size: 16px;
    line-height: 24px;
    color: var(--color-gray-dark);
    letter-spacing: -0.32px; 
    margin-top: 6px;
    transition: font-size 160ms;
}
.input.focus .field .title,
.input.filled .field .title {
    font-size: 12px;
    line-height: 16px;
    letter-spacing: 0; 
    margin-top: 0;
    height: 16px;
}
.input .field input {
    font-family: var(--font-medium);
    font-size: 16px;
    line-height: 24px;
    color: var(--color-dark);
    letter-spacing: -0.32px;
    display: none;
    width: 100%;
    border: none;
    outline: none;
    margin-top: -2px;
}
.input .field input[type="password"] {
    padding-right: 40px;
}
.input.focus .field input,
.input.filled .field input {
    background-color: var(--color-whites);
    color: var(--color-dark);
    display: block;
}
.input .field input:-webkit-autofill {
    background-color: var(--color-whites);
    color: var(--color-dark);
}
.show-password {
    position: absolute;
    top: 12px;
    right: 12px;
    cursor: pointer;
}
.modal-auth-method {
    gap: 16px;
}
.modal-auth-method__item {
    color: var(--color-gray);
    padding-bottom: 6px;
    border-bottom: 1px solid transparent;
    transition: 300ms ease-in-out;
    cursor: pointer;
}
.modal-auth-method__item.active {
    color: var(--color-dark);
    border-bottom: 1px solid var(--color-dark);
}
.input.phone {
    display: none;
}
.phone .input.phone {
    display: flex;
}
.phone .input.email {
    /*display: none;*/
}
.pass-reset {
    margin-top: -10px;
    cursor: pointer;
}
.checkbox-primary.caption {
    font-family: var(--font-regular);
    font-size: 12px;
    line-height: 16px;
    letter-spacing: 0px;
}
.checkbox-primary.caption .checkmark {
    top: -3px;
}
.checkbox-primary.caption .agreement {
    display: inline;
    color: var(--color-primary);
    text-decoration: underline;
}
.change-modal {
    color: var(--color-dark);
    letter-spacing: -0.32px;
    background-color: transparent;
    border: none;
    outline: none;
    width: fit-content;
    margin: 0 auto;
}
.modal-phone-number {
    text-align: center;
    color: var(--color-gray-dark);
    letter-spacing: -0.32px;
}
.modal-phone-number .change-number{
    color: var(--color-primary);
    letter-spacing: 0px;
    cursor: pointer;
    margin-left: 4px;
}
.modal-code {
    display: flex;
    justify-content: space-between;
    max-width: 304px;
    width: 100%;
    margin: 0 auto;
}
.error .modal-code__item {
    border: 1px solid var(--color-red);
}
.modal-code__item {
    width: 40px;
    height: 40px;
    border-radius: 8px;
    border: 1px solid var(--color-gray);
    outline: 0;
    text-align: center;
}
.modal-error {
    color: var(--color-red);
    opacity: 0;
}
.error .modal-error {
    opacity: 1;
}
.modal .code-timer {
    font-family: var(--font-regular);
    color: var(--color-gray-dark);
    font-size: 14px;
    line-height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.modal .code-timer::before {
    content: 'Получить новый пароль можно через ';
    margin-right: 5px;
}
.modal .code-timer.reset {
    pointer-events: auto;
    font-family: var(--font-medium);
    color: var(--color-dark);
    font-size: 16px;
    line-height: 24px;
    letter-spacing: -0.32px;
    cursor: pointer;
}
.modal .code-timer.reset::before {
    content: 'Отправить код еще раз ';
}
.modal .code-timer.reset::after {
    content: '';
    width: 20px;
    height: 20px;
    background-image: url(../images/reset-code.svg);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
}
input[type="checkbox"].switch {
    display: none; 
}
input[type="checkbox"].switch + label {
    position: relative;
    padding: 24px 0 0 40px;
    cursor: pointer;
}
input[type="checkbox"].switch + label:before {
    content: "";
    position: absolute;
    display: block;
    left: 0;
    top: 0;
    width: 40px; 
    height: 24px; 
    border-radius: 16px; 
    background-color: var(--color-gray);
    border: 4px solid var(--color-gray);
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
}
input[type="checkbox"].switch + label:after {
    content: "";
    position: absolute;
    display: block;
    left: 2px;
    top: 2px;
    width: 20px;
    height: 20px;
    border-radius: 10px;
    box-shadow: var(--box-shadow-primary);
    background: var(--color-white);
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
}
input[type="checkbox"].switch:checked + label:after {
    margin-left: 16px;
}
input[type="checkbox"].switch:checked + label:before {
    background-color: var(--color-green);
    border: 4px solid var(--color-green);
}
.modal-agreement {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 20px;
    max-height: 70vh;
    max-width: 914px;
    text-align: center;
    overflow-y: scroll;
    line-height: 24px;
    letter-spacing: -0.32px;
    scrollbar-color: var(--color-gray) var(--color-bg);
    scrollbar-width: thin;
}
.modal-text {
    padding-right: 20px;
    margin-bottom: 0px;
    max-width: 936px;
}
.modal-text .link {
    color: #0393BF;
}
.modal-agreement::-webkit-scrollbar {
    width: 6px;
}
.modal-agreement::-webkit-scrollbar-track {
    background-color: transparent;
}
.modal-agreement::-webkit-scrollbar-thumb {
    background-color: var(--color-gray);
    border-radius: 4px;
}
.modal-check-quest {
    max-width: 1000px;
}
.modal-check-quest .date, .modal-check-quest .title:not(h2) {
    color: var(--color-gray-dark);
}
.file-block {
    width: 100%;
    margin-top: 8px;
}
.file-block img {
    width: 40px;
    float: left;
    border-radius: 8px;
    margin-right: 10px;
}
.file-block .file-info {
    color: #ACACAC;
}
.check-quest-answer {
    background-color: var(--color-bg);
    border-radius: 8px;
    padding: 12px;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

/***********subcatalog.html*********/

.product-count {
    color: var(--color-gray);
    margin-left: 12px;
    letter-spacing: 0;
}
.subcatalog-sorting {
    gap: 4px;
    cursor: pointer;
}
.subcatalog-search {
    border: 1px solid var(--color-gray);
    padding: 1px 12px;
    background-color: var(--color-white);
    border-radius: 8px;
    gap: 8px;
    width: 100%;
    max-width: 822px;
    position: relative;
    margin-top: 32px;
}
.subcatalog-header.mobile {
    display: none !important;
    gap: 16px;
}
.subcatalog-category-overflow {
    margin-top: 16px;
}
.subcatalog-category-overflow__item {
    padding: 4px 12px;
    border: 1px solid var(--color-gray);
    border-radius: 20px;
    color: var(--color-gray);
    transition: 260ms ease-in-out;
    white-space: nowrap;
}
.subcatalog-category-overflow__item.active {
    color: var(--color-white);
    border: 1px solid var(--color-primary);
    background-color: var(--color-primary);
}
.subcatalog-container {
    margin-top: 32px;
    padding-bottom: 64px;
}
.subcatalog-products .main-grid {
    grid-template-columns: repeat(5, 1fr);
    margin-top: 0;
    gap: 32px;
}
.subcatalog-products .main-grid__item {
    max-width: 180px;
}
.subcatalog-filter {
    gap: 32px;
    max-width: 244px;
    width: 100%;
}
.subcatalog-category-overflow {
    display: none;
    align-items: center;
    gap: 16px;
    overflow-x: scroll;
    scrollbar-width: none;
    margin-left: -16px;
    padding: 0 16px;
    width: calc(100% + 32px);
}
.subcatalog-category-overflow::-webkit-scrollbar {
    display: none;
}
.mobile-filter {
    border-bottom: 1px solid var(--color-gray-light);
    padding: 16px 24px;
    margin-bottom: 16px;
}
.subcatalog-filter-accordion-head {
    font-family: var(--font-bold);
    color: var(--color-dark);
}
.subcatalog-filter-accordion.active .subcatalog-filter-accordion-head {
    margin-bottom: 16px;
}
.subcatalog-filter-accordion-head img {
    transform: rotate(0);
    margin-top: 0px;
}
.subcatalog-filter-accordion.active .subcatalog-filter-accordion-head img {
    transform: rotate(180deg);
    margin-top: -2px;
}
.subcatalog-filter-accordion-dropdown {
    gap: 16px;
    max-height: 0;
    display: none;
}
.subcatalog-filter-accordion.active .subcatalog-filter-accordion-dropdown {
    max-height: 100%;
    display: flex;
}
.subcatalog-filter-accordion-dropdown .overflow-container {
    gap: 16px;
    overflow-y: hidden;
    max-height: 185px;
    scrollbar-color: var(--color-gray) var(--color-bg);
    scrollbar-width: thin;
    border-bottom: 2px solid transparent;
}

.subcatalog-filter-accordion-dropdown .overflow-container::-webkit-scrollbar {
    width: 8px;
}
.subcatalog-filter-accordion-dropdown .overflow-container::-webkit-scrollbar-track {
    background-color: transparent;
}
.subcatalog-filter-accordion-dropdown .overflow-container::-webkit-scrollbar-thumb {
    background-color: var(--color-gray);
    border-radius: 6px;
}
.subcatalog-filter-accordion-dropdown .overflow-container.active {
    overflow-y: scroll;
    max-height: 300px;
    border-bottom: 2px solid var(--color-gray-light);
}
.overflow-container-show::after {
    content: 'Раскрыть все';
    font-family: var(--font-medium);
    font-size: 12px;
    line-height: 16px;
    color: var(--color-primary);
    padding: 4px;
}
.overflow-container-show.active::after {
    content: 'Скрыть';
}

.checkbox-primary {
    position: relative;
    user-select: none;
    padding-left: 32px;
    cursor: pointer;
}
.checkbox-primary input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
    height: 0;
    width: 0;
}
.checkmark {
    position: absolute;
    top: 2px;
    left: 0;
    height: 20px;
    width: 20px;
    background-color: var(--color-white);
    border: 1px solid var(--color-gray);
    border-radius: 4px;
}
.checkbox-primary input:checked ~ .checkmark {
    background-color: var(--color-primary);
    border: 1px solid var(--color-primary);
    background-image: url(../images/checkbox-active.svg);
    background-size: 12px 12px;
    background-position: center center;
    background-repeat: no-repeat;
}
.subcatalog-filter-input {
    padding: 12px;
    font-family: var(--font-medium);
    font-size: 16px;
    line-height: 24px;
    color: var(--color-dark);
    border: 1px solid var(--color-gray);
    max-width: 110px;
    border-radius: 8px;
    outline: none;
}
.subcatalog-filter-input:focus::placeholder {
    opacity: 0;
}
.subcatalog-filter-input::placeholder {
    color: var(--color-gray-dark);
}
.subcatalog-filter-accordion-dropdown .line {
    width: 16px;
    height: 1px;
    background-color: var(--color-gray-dark);
    border-radius: 2px;
    margin: 0 4px;

}
.noUi-target {
    box-shadow: none;
    border-radius: 4px;
    border: 0;
    margin: 0 6px;
    background: var(--color-gray-light);
    height: 2px;
    position: relative;
}
.noUi-connect {
    background: var(--color-primary);
}
.noUi-horizontal .noUi-handle {
    width: 12px;
    height: 12px;
    right: -6px;
    top: -5px;
    border-radius: 100%;
    background: var(--color-primary);
    border: none;
    box-shadow: none;
}
.noUi-handle::after, .noUi-handle::before {
    display: none;
}

.subcatalog-products-pagination {
    padding: 12px 16px;
    margin-top: 32px;
}
.pagination-arrow {
    cursor: pointer;
    width: 24px;
    height: 24px;
}
.pagination-arrow img {
    width: 100%;
}
.pagination-arrow.left {
    transform: rotate(90deg);
    margin-right: 24px;
}
.pagination-arrow.right {
    transform: rotate(-90deg);
    margin-left: 24px;
}
.pagination-arrow.disabled {
    pointer-events: none;
    opacity: 0.3;
    cursor: not-allowed;
}
.pagination-dots {
    width: 24px;
    height: 24px;
    font-family: var(--font-regular);
    font-size: 14px;
    text-align: center;
    line-height: 20px;
}
.pagination-dots.disabled {
    display: none;
}
.pagination-item {
    width: 24px;
    height: 24px;
    border-radius: 4px;
    font-family: var(--font-regular);
    font-size: 14px;
    line-height: 24px;
    text-align: center;
    color: var(--color-dark);
}
.pagination-item.active {
    background-color: var(--color-primary);
    color: var(--color-white);
}

/***********product.html*********/

.product-buttons {
    gap: 19px;
    margin-top: 16px;
}
.product-buttons__item {
    gap: 6px;
    color: var(--color-gray-dark);
    font-family: var(--font-medium);
    font-size: 16px;
    line-height: 24px;
    letter-spacing: -0.32px;
    cursor: pointer;
    user-select: none;
}
.product-buttons__item.active .favorite path {
    fill: var(--color-gray-dark);
}

.product-wrapper {
    margin-top: 44px;
}

.product-container {
    max-width: 916px;
    width: 100%;
}

.product-view {
    width: 100%;
}
.product-view-img {
    max-width: 360px;

}
.product-view-img-main {
    position: relative;
}
.product-view-img-main img {
    border-radius: 8px;
    width: 100%;
}
.product-main-video-wrapper video {
    width: 100%;
}
.product-view-img-list {
    display: flex;
    flex-wrap: wrap;
    gap: 15px;
    margin-top: 16px;
}
.product-view-img-list__item {
    width: 60px;
    height: 60px;
    border-radius: 4px;
    cursor: pointer;
    overflow: hidden;
}
.product-view-img-list__item img {
    width: 100%;
    border-radius: 4px;
    position: relative;
    /*z-index: -1;*/
}
.product-view-img-list__item.active {
    box-shadow: inset 0px 0px 0px 2px var(--color-primary);
}
.product-view-config {
    width: 100%;
    margin-left: 32px;
    max-width: 492px;
}
.product-view-config-header {
    font-family: var(--font-regular);
    font-size: 16px;
    line-height: 24px;
    letter-spacing: -0.32px;
    color: var(--color-gray-dark);
    gap: 12px;
}
.product-view-config-header.margin-top {
    margin-top: 24px;
}
.product-view-config-header .color {
    color: var(--color-dark);
}
.product-view-config .product-view-img-list {
    gap: 12px;
}
.product-view-block-list {
    margin-top: 12px;
    gap: 10px;
    flex-wrap: wrap;
    margin-bottom: 24px;
}
.product-view-block-list__item {
    font-family: var(--font-regular);
    font-size: 16px;
    line-height: 24px;
    letter-spacing: -0.32px;
    /*white-space: nowrap;*/
    border-radius: 4px;
    padding: 3px 12px;
    border: 1px solid var(--color-gray-dark);
    color: var(--color-gray-dark);
    cursor: pointer;
    background-color: var(--color-white);
    transition: 260ms ease-in-out;
}
.product-view-config-row,
.product-info-config-row,
.product-basket-block-row {
    font-family: var(--font-medium);
    font-size: 16px;
    line-height: 24px;
    letter-spacing: -0.32px;
    color: var(--color-dark);
    margin-top: 12px;
}
.product-basket-block-row {
    margin-top: 9px;
}
.product-view-config-row .title,
.product-info-config-row .title,
.product-basket-block-row .title {
    color: var(--color-gray-dark);
}
.product-view-config-row .title,
.product-view-config-row .value{
    flex-basis: 45%;
}
.product-basket-block-row .title {
    flex-basis: 50%;
}

.product-view-block-list__item.active {
    border: 1px solid var(--color-primary);
    color: var(--color-primary);
}
.product-info {
    margin-top: 44px;
}
.product-info-nav {
    gap: 16px;
}
h4.title.product-info-nav__item {
    color: var(--color-gray);
    border-bottom: 1px solid transparent;
    /*padding-bottom: 7px;*/
    cursor: pointer;
    transition: 260ms ease-in-out;
}
h4.title.product-info-nav__item.active {
    color: var(--color-dark);
    border-bottom: 1px solid var(--color-dark);
}
.product-info-config {
    margin-top: 17px;
}
.product-info-config-row {
    gap: 30px;
}
.product-info-config-row .title{
    flex-basis: 24%;
}
.product-info-config-row .value {
    flex-basis: 70%;
}
.product-basket-container {
    max-width: 404px;
    width: 100%;
    gap: 16px;
}
.product-basket {
    padding: 16px;
    gap: 12px; 
    border-radius: 8px;
    border: 1px solid var(--color-gray-light);
}
h2.title.price {
    color: var(--color-blue);
}
h2.title.price .subprice {
    font-family: var(--font-medium);
    font-size: 16px;
    line-height: 20px;
    color: var(--color-gray);
    letter-spacing: -0.32px;
    margin-left: 4px;
    text-decoration: line-through;
}
.product-basket-notice {
    background-color: var(--color-blue-light);
    padding: 11px 11px 8px;
    border-radius: 8px; 
}
.product-basket-notice img {
    float: left;
}
.product-basket-notice span,
.product-basket-notice a {
    padding-left: 30px;
    display: block;
    color: var(--color-dark);
    font-family: var(--font-regular);
    font-size: 14px;
    line-height: 20px;
}
.product-basket-notice a {
    text-decoration: underline;
    text-decoration-skip-ink: none;
    margin-top: 4px;
}

.product-basket-properties__header {
    font-family: var(--font-regular);
    font-size: 16px;
    line-height: 24px;
    letter-spacing: -0.32px; 
}

.product-basket-properties__item {
    display: flex;
    font-family: var(--font-medium);
    font-size: 14px;
    line-height: 16px;
    margin-top: 8px;
}
.product-basket-properties__item .name {
    flex-basis: 35%;
    color: var(--color-gray-dark);
}
.product-basket-properties__item .name .total {
    font-size: 12px;
    line-height: 26px;
    color: var(--color-gray);
}
.product-basket-properties__item .value {
    flex-basis: 65%;
    font-family: var(--font-medium);
    font-size: 14px;
    line-height: 20px;
}

.product-basket-properties__item .counter {
    display: flex;
    align-items: center;
    gap: 17px;
    margin-top: -6px;
}
.product-basket-properties__item .counter .plus,
.product-basket-properties__item .counter .minus {
    min-width: 28px;
    height: 28px;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 28px;
    cursor: pointer;
}
.product-basket-properties__item .counter .plus {
    background-image: url(../images/counter-plus.svg);
}
.product-basket-properties__item .counter .minus {
    background-image: url(../images/counter-minus.svg);    
}
.product-basket-properties__item .counter .value {
    font-family: var(--font-bold);
    font-size: 14px;
    user-select: none;
    line-height: 20px;
}

.multiinput .product-basket-properties__item .counter .value {
    border: 0;
    flex-basis: 30%;
    text-align: center;
    padding: 0;
}

.multiinput .product-basket-properties__item {
    align-items: center;
}

.multiinput .product-basket-properties__item .counter {
    width: 30%;
    justify-content: space-between;
}

.product-basket-button,
.primary-button {
    width: 100%;
    font-family: var(--font-medium);
    font-size: 16px;
    line-height: 24px;
    padding: 12px 24px;
    border-radius: 8px;
    text-align: center;
    outline: none;
    cursor: pointer;
    transition: 260ms ease-in-out;
}
.primary-button.text {
    background-color: transparent;
    border: 0;
    color: var(--color-primary);
    padding: 2px 0;
}
.primary-button.fit {
    width: fit-content;
}
.fit {
    width: fit-content;
}
.primary-button.auto {
    margin: 0 auto;
}
.product-basket-button.add.disabled,
.primary-button.border.disabled,
.product-basket-button.add.disabled_button,
.product-basket-button.add.disabled_button:hover {
    /*pointer-events: none;*/
    cursor: not-allowed;
    border: 1px solid  var(--color-gray-light) !important;
    color: var(--color-gray);
}
.product-basket-button.order.disabled,
.primary-button.fill.disabled,
.product-basket-button.order.disabled_button,
.product-basket-button.order.disabled_button:hover {
    /*pointer-events: none;*/
    cursor: not-allowed;
    border: 1px solid  var(--color-bg);
    background-color: var(--color-bg);
    color: var(--color-gray);
}
.product-basket-button.add,
.primary-button.border {
    background-color: transparent;
    color: var(--color-primary);
    border: 1px solid var(--color-primary) !important;
}
.product-basket-button.order,
.primary-button.fill {
    background-color: var(--color-primary);
    color: var(--color-white);
    border: 1px solid var(--color-primary);
}


.product-basket-block {
    background-color: var(--color-bg);
    padding: 16px;
    border-radius: 8px;
}
.product-basket-block__header {
    font-family: var(--font-bold);
    font-size: 16px;
    line-height: 24px;
    letter-spacing: -0.32px; 
}
.product-basket-block .left {
    float: left;
    margin-top: 8px;
}
.product-basket-block .text {
    display: block;
    font-family: var(--font-medium);
    font-size: 16px;
    line-height: 24px;
    padding-left: 28px;
    letter-spacing: -0.32px; 
}
.product-basket-block .text.light {
    color: var(--color-gray-dark);
    margin-top: 8px;
}
.product-basket-properties-overflow {
    overflow-y: hidden;
    max-height: 160px;
}
.product-basket-properties-overflow.active {
    overflow-y: auto;
    max-height: 100%;
}
.product-basket-properties-overflow .product-basket-properties__item  {
    justify-content: space-between;
    border-bottom: 1px solid var(--color-gray-light) ;
    padding: 6px 0 12px 0;
}
.product-basket-properties-overflow .product-basket-properties__item:first-child {
    padding-top: 0;
}
.product-basket-properties-overflow .product-basket-properties__item .name {
    flex-basis: auto;
    max-width: 30%;
    min-width: 30%;
}
.product-basket-properties-overflow .product-basket-properties__item .name .total{
    line-height: 18px;
}

.product-basket-properties-overflow .product-basket-properties__item .counter {
    margin-top: 0;
}
.product-basket-properties .primary-button.border.fit {
    border: none !important;
    padding: 0;
    margin-top: 10px;
}
.product-basket-properties .primary-button img {
    margin-left: 8px;
}

.empty-container {
    gap: 32px;
    padding: 100px 0 200px;
}
.empty-container .title {
    color: var(--color-gray-dark);
    text-align: center;
}

.favorites-container {
    margin-top: 16px;
    min-height: 430px;
}
.favorites-nav {
    gap: 24px;
}
.favorites-nav__item {
    font-family: var(--font-bold);
    color: var(--color-gray);
    font-size: 20px;
    line-height: 28px;
    letter-spacing: -0.4px;
    border-bottom: 1px solid transparent;
    padding-bottom: 7px;
    cursor: pointer;
    transition: 260ms ease-in-out;
}
.favorites-nav__item.active {
    color: var(--color-dark);
    border-bottom: 1px solid var(--color-dark);
}
.favorites-block .main-grid {
    display: none;
}
.favorites-block .main-grid.active {
    display: grid;
}

.title .basket-total {
    font-family: var(--font-medium);
    color: var(--color-gray);
    font-size: 16px;
    line-height: 24px;
    letter-spacing: -0.32px;
    margin: 0 0 8px 4px;
}

.basket-wrapper {
    margin-top: 32px;
}
.basket {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 48px;
}
.basket-action {
    width: 100%;
    max-width: 720px;
}
.basket-action .checkbox-primary {
    font-family: var(--font-medium);
    font-size: 14px;
    line-height: 22px;
}
.basket-action .remove, .basket-action .add-fav {
    font-family: var(--font-medium);
    font-size: 16px;
    line-height: 24px;
    letter-spacing: -0.32px;
    color: var(--color-gray-dark);
    display: flex;
    cursor: pointer;
    gap: 6px;
}
.basket-row {
    width: 100%;
    max-width: 720px;
}
.basket__item {
    width: 100%;
    position: relative;
}
.basket__item .image{
    float: left;
    width: 116px;
    border-radius: 12px;
    margin-right: 16px;
}
.basket__item .title {
    font-family: var(--font-medium);
    font-size: 16px;
    line-height: 24px;
    letter-spacing: -0.32px;
    margin-bottom: 6px;
}
.basket__item .title span {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.basket__item .info {
    display: flex;
    font-family: var(--font-medium);
    font-size: 12px;
    line-height: 16px;
}
.basket__item .name {
    color: var(--color-gray-dark);
    flex-basis: 80px;
}
.basket__item .price {
    font-family: var(--font-bold);
    font-size: 16px;
    line-height: 24px;
    letter-spacing: -0.32px;
    padding-top: 6px;
}
.basket__item .change-config {
    font-family: var(--font-medium);
    font-size: 12px;
    line-height: 16px;
    color: var(--color-gray-dark);
    cursor: pointer;
}
.counter {
    display: flex;
    align-items: center;
    gap: 17px;
    margin-top: -6px;
}
.counter .plus,
.counter .minus {
    min-width: 28px;
    height: 28px;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 28px;
    cursor: pointer;
}
.counter .plus {
    background-image: url(../images/counter-plus.svg);
}
.counter .minus {
    background-image: url(../images/counter-minus.svg);    
}
.counter .value {
    font-family: var(--font-bold);
    font-size: 14px;
    user-select: none;
    line-height: 20px;
}
.basket-form {
    max-width: 400px;
    border: 1px solid var(--color-gray);
    border-radius: 8px;
    padding: 24px;
}
.basket-form__row {
    display: flex;
    justify-content: space-between;
    font-family: var(--font-medium);
    font-size: 16px;
    line-height: 24px;
    color: var(--color-gray-dark);
}
.basket-form__notice {
    display: flex;
    align-items: center;
    font-family: var(--font-medium);
    font-size: 12px;
    line-height: 16px;
    color: #0393BF;
}
.basket-form__notice::before {
    content: '';
    display: inline-block;
    min-width: 16px;
    height: 16px;
    background-image: url(../images/basket-form-notice.svg);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
}
.basket-form__row .bold{
    font-family: var(--font-bold);
    color: var(--color-dark);
}
.basket-form-agreement {
    font-family: var(--font-regular);
    font-size: 12px;
    line-height: 16px;
    color: var(--color-gray-dark);
}
.basket-form-agreement a {
    text-decoration: underline;
    color: var(--color-primary);
}
.basket-order-mobile {
    position: fixed;
    padding: 12px 16px;
    background-color: var(--color-white);
    width: 100vw;
    border-top: 1px solid var(--color-gray-light);
    bottom: 0;
}
.modal-warning {
    padding: 12px;
    background-color: #FFFBCC;
    border-radius: 8px;
    display: flex;
    align-items: center;
    gap: 13px;
    font-family: var(--font-regular);
    font-size: 14px;
    line-height: 16px;
}
.modal .select-primary {
    width: 598px;
}
.select-primary {
    cursor: pointer;
    width: 100%;
    height: 48px;
    padding: 4px 38px 4px 12px;
    border: 1px solid var(--color-gray);
    border-radius: 8px;
    background-image: url(../images/1688-arrow.svg);
    background-repeat: no-repeat;
    background-position: right 12px top 11px;
    background-size: 28px;
    position: relative;
}
.select-primary .value {
    white-space: nowrap;
    overflow: hidden;
}
.select-primary.calendar {
    background-image: url(../images/calendar.svg);
}
.select-primary.calendar.fit {
    width: 256px;
}
.select-primary .title {
    font-family: var(--font-medium);
    font-size: 12px;
    line-height: 16px;
    color: var(--color-gray-dark);
}
.select-primary-dropdown {
    top: 50px;
    left: -2px;
    position: absolute;
    display: none;
    width: 101%;
    flex-direction: column;
    background-color: var(--color-white);
    padding-right: 12px;
    overflow-y: auto;
    max-height: 200px;
    border-radius: 12px;
    z-index: 5;
    box-shadow: var(--box-shadow-primary);
    scrollbar-width: thin;
    scrollbar-color: var(--color-gray) transparent;
}
.select-primary-dropdown::-webkit-scrollbar {
    width: 4px;
}
.select-primary-dropdown::-webkit-scrollbar-track {
    background-color: transparent;
    border-radius: 2px;
}
.select-primary-dropdown::-webkit-scrollbar-thumb {
    background-color: var(--color-gray);
    border-radius: 2px;
}
.select-primary.active .select-primary-dropdown {
    display: flex;
}
.select-primary-dropdown__item {
    color: var(--color-dark);
    padding: 14px 16px;
    background-color: var(--color-white);
    transition: 260ms ease-in-out;
    width: 100%;
    cursor: pointer;
}

.order-steps {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 32px;
}
.order-steps__item {    
    display: flex;
    align-items: center;
    gap: 12px;
}
.order-steps .order-steps__item:first-child::before {
    display: none;
}
.order-steps__item::before {
    content: '';
    width: 40px;
    min-width: 40px;
    height: 1px;
    background-color: var(--color-dark);
}
.order-steps__item .point {
    width: 40px;
    height: 40px;
    border-radius: 12px;
    text-align: center;
    font-family: var(--font-medium);
    font-size: 16px;
    line-height: 40px;
    color: var(--color-gray-dark);
    border: 1px solid #E7E7EB;
}
.order-steps__item .name {
    font-family: var(--font-medium);
    font-size: 14px;
    line-height: 20px;
    color: var(--color-gray);
}
.order-steps__item.active .point {    
    border: 1px solid var(--color-primary);
    color: var(--color-primary);
}
.order-steps__item.complete .point {    
    border: 1px solid var(--color-primary);
    color: var(--color-white);
    background-color: var(--color-primary);
}
.order-steps__item.active .name,
.order-steps__item.complete .name {    
    color: var(--color-dark);
}

.order-block {
    display: none;
}
.order-block.active {
    display: flex;
    flex-direction: column;
}
.order-product {
    padding: 12px;
    border: 1px solid var(--color-gray-light);
    border-radius: 8px;
    margin-top: 16px;
    /*width: fit-content;*/
}

.order-product .image{
    min-width: 104px;
    width: 104px;
    border-radius: 12px;
}

.order-product .title {
    font-family: var(--font-bold);
    font-size: 16px;
    line-height: 24px;
    max-width: 492px;
}

.order-product .comment, .modal .comment {
    font-family: var(--font-medium);
    font-size: 16px;
    line-height: 24px;
    padding: 12px;
    width: 100%;
    max-width: 480px;
    height: 88px;
    border-radius: 8px;
    outline: none;
    border: 1px solid var(--color-gray);
}
.modal .comment {
    max-width: none;
}
.order-product .comment::placeholder, .modal .comment::placeholder {
    color: var(--color-gray-dark);
}
.order-product .delete {
    min-width: 24px;
    cursor: pointer;
}



.info-grid {
    border-top: 1px solid var(--color-gray) ;
    display: grid;
    grid-template-columns: 1fr 1.2fr 0.8fr 1fr;
    gap: 16px 16px;
    margin-top: 12px;
    padding-top: 12px;
}

.info-grid__item .title {
    color: var(--color-gray-dark);
    font-family: var(--font-medium);
    font-size: 14px;
    line-height: 20px;
}
.info-grid__item .value {
    color: var(--color-dark);
    font-family: var(--font-medium);
    font-size: 14px;
    line-height: 20px;
}
.info-grid__item .value input {
    padding: 4px 12px;
    border: 1px solid var(--color-gray);
    border-radius: 8px;
    max-width: 112px;
    color: var(--color-dark);
}
.delivery-info, .delivery-row {
    max-width: 720px;
}
.delivery-info .title {
    color: var(--color-gray-dark);
    font-family: var(--font-medium);
    font-size: 14px;
    line-height: 20px;
    margin-top: 12px;
}
.delivery-info .text {
    color: var(--color-dark);
    font-family: var(--font-medium);
    font-size: 14px;
    line-height: 20px;
}
.delivery-row {
    margin-top: 12px;
}
.delivery-row .title {
    color: var(--color-gray-dark);
    font-family: var(--font-medium);
    font-size: 16px;
    line-height: 24px;
    flex-basis: 60%;
}
.delivery-row .text {
    color: var(--color-dark);
    font-family: var(--font-medium);
    font-size: 16px;
    line-height: 24px;
    text-align: right;
}
.delivery-row.bold .title,
.delivery-row.bold .text {
    font-family: var(--font-bold);
    color: var(--color-dark);
}
.payment-block {
    margin-right: 32px;
}
.radio-primary {
    position: relative;
}
.radio-primary.block {
    padding: 16px 16px 16px 42px;
    border-radius: 8px;
    max-width: 720px;
    width: 100%;
    border: 1px solid var(--color-gray-light);
    position: relative;
    user-select: none;
    cursor: pointer;
    color: var(--color-dark);
    font-family: var(--font-bold);
    font-size: 16px;
    line-height: 24px;
}
.radio-primary.block:has(input:checked) {
    border: 1px solid var(--color-primary);
}
.radio-primary .text {
    color: var(--color-gray-dark);
    font-family: var(--font-medium);
    font-size: 14px;
    line-height: 20px;
}
.radio-primary .text .bold{
    color: var(--color-dark);
    font-family: var(--font-bold);
}
.radio-primary input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
    height: 0;
    width: 0;
}
.radiomark {
    display: inline-block;
    width: 20px;
    height: 20px;
    border-radius: 10px;

    border: 2px solid var(--color-gray);
    transition: 200ms ease-in-out;
}
.block .radiomark {
    top: 18px;
    left: 16px;
    position: absolute;
}
.radio-primary input:checked ~ .radiomark {
    box-shadow: inset 0px 0px 0 3px var(--color-primary);
}
.product-list-block {
    padding: 12px 4px 0px 12px;
    border: 1px solid var(--color-gray-light);
    border-radius: 8px;
    width: 100%;
    max-width: 490px;
    height: fit-content;
}
.product-list-block .overflow {
    overflow-y: auto;
    max-height: 300px;
    scrollbar-color: var(--color-gray) var(--color-bg);
    scrollbar-width: thin;
    margin-bottom: 12px;
}

.product-list-block .overflow::-webkit-scrollbar {
    width: 6px;
}
.product-list-block .overflow::-webkit-scrollbar-track {
    background-color: var(--color-bg);
    border-radius: 3px;
}
.product-list-block .overflow::-webkit-scrollbar-thumb {
    background-color: var(--color-gray);
    border-radius: 3px;
}
.product-list-block__item {
    position: relative;
    display: flex;
    align-items: center;
    height: 67px;
    margin-top: 12px;
    flex-wrap: wrap;
    justify-content: space-between;
    padding-left: 73px;
    padding-right: 12px;
}
.product-list-block__item img {
    width: 67px;
    height: 67px;
    border-radius: 12px;
    position: absolute;
    top: 0;
    left: 0;
}
.product-list-block__item .discount {
    font-family: var(--font-regular);
    font-size: 12px;
    top: 4px;
    left: 4px;
    line-height: 16px;
    border-radius: 12px;
}
.product-list-block__item .name {
    color: var(--color-dark);
    font-family: var(--font-medium);
    font-size: 16px;
    line-height: 24px;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}
.product-list-block__item .price {
    color: var(--color-dark);
    font-family: var(--font-bold);
    font-size: 16px;
    line-height: 24px;
}
.product-list-block__item .price .subprice {
    color: var(--color-gray);
    text-decoration: line-through;
    font-family: var(--font-regular);
    font-size: 14px;
    line-height: 20px;
}
.product-list-block__item .count {
    color: var(--color-gray);
    font-family: var(--font-medium);
    font-size: 14px;
    line-height: 20px;
}
.product-list-block__item .count .value {
    color: var(--color-dark);
}


.profile-wrapper {
    margin-top: 32px;
    width: 100%;
}
.profile-container {
    width: 100%;
    max-width: 1000px;
}
.profile-menu {
    min-width: 220px;
}
.profile-menu__item, a.profile-menu__item {
    padding: 8px 12px;
    border-radius: 8px;
    background-color: var(--color-white);
    display: flex;
    align-items: center;
    gap: 4px;
    color: var(--color-gray-dark);
    transition: 200ms ease-in-out;
    cursor: pointer;
}
.profile-menu__item .value {
    color: var(--color-gray-dark);
    width: fit-content;
    margin-left: auto;
}

.profile-menu__item.active {
    background-color: var(--color-bg);
    color: var(--color-dark);
}
.profile-menu__item path,
.profile-menu__item circle {
    transition: 200ms ease-in-out;
}
.profile-menu__item.active path,
.profile-menu__item.active circle {
    stroke: var(--color-primary);
}

.profile-grid {
    display: grid;
    gap: 16px 16px;
    grid-template-columns: repeat(4, 242px);
}

.profile-grid__item {
    padding: 16px;
    border: 1px solid var(--color-gray-light);
    border-radius: 8px;
}
.profile-grid__item .up-wallet {
    font-family: var(--font-medium);
    font-size: 16px;
    line-height: 24px;
    color: var(--color-primary);
    background-color: var(--color-white);
    border: none;
    outline: none;
    margin: 0;
    padding: 0;
}
.profile-grid__item_long {
    grid-row: span 2;
}
.profile-grid__item img {
    margin-bottom: 18px;
}

.profile-grid__item .text {
    font-family: var(--font-medium);
    font-size: 14px;
    line-height: 20px;
    color: var(--color-gray-dark);
    margin-top: 4px;
}
.profile-grid__item .text-bold {
    font-family: var(--font-bold);
    font-size: 16px;
    line-height: 24px;
    color: var(--color-dark);
    margin-top: 10px;
}
.profile-grid__item .text-bold.border-top {
    border-top: 1px solid var(--color-gray-light);
    margin-top: 16px;
    padding-top: 16px;
}
.profile-grid__item .percent {
    font-family: var(--font-bold);
    font-size: 48px;
    line-height: 52px;
}
.profile-grid__item .percent.blue {
    color: var(--color-blue);
}
.profile-grid__item .percent.green {
    color: var(--color-green);
}
.profile-grid__item .progress {
    background-color: var(--color-white);
    width: 140px;
    height: 140px;
    margin: 10px auto 0;
}
.profile-grid__item .progress__text {
    font-family: var(--font-medium);
    font-size: 16px;
    fill: var(--color-gray-dark);
}
.profile-grid__item .progress__count {
    font-family: var(--font-bold);
    font-size: 30px;
    fill: var(--color-green);
}
.profile-grid__item .verification {
    padding: 4px 8px;
    width: fit-content;
    font-family: var(--font-medium);
    font-size: 12px;
    line-height: 16px;
    color: var(--color-white);
    background-color: var(--color-primary);
    border-radius: 100px;
    margin-top: 4px;
}
.profile-grid__item .verification.wait {
    background-color: var(--color-yellow);
    color: var(--color-dark);
}
.profile-grid__item .verification.accept {
    background-color: var(--color-blue)
}

.profile-info-block .grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px 40px;
    align-items: flex-end;
    margin: 16px 0 20px 0;
}

.profile-info-document {
    display: flex;
    flex-direction: column;
}
.profile-info-list {
    overflow-x: scroll;
}
.profile-info-list__item {
    color: var(--color-gray);
    padding: 4px 12px;
    font-size: 16px;
    line-height: 24px;
    font-family: var(--font-regular);
    border: 1px solid var(--color-gray);
    border-radius: 18px;
}
.profile-info-list__item.active {
    color: var(--color-white);
    background-color: var(--color-primary);
    border: 1px solid var(--color-primary);
}
.drop-area {
    padding: 16px;
    border: 2px dashed var(--color-gray);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 10px;
    color: var(--color-gray);
    transition: 260ms ease-in-out;
    border-radius: 8px;
    position: relative;
    margin-top: 16px;
    text-align: center;
    cursor: copy;
}
.drop-area input {
    position: absolute;
    opacity: 0;
    width: 0px;
    top: 0;
    left: 0;
    height: 0px;
}

.drop-files__item {
    display: flex;
    align-items: center;
    padding: 10px;
    gap: 12px;
    border: 1px solid var(--color-gray-light);
    border-radius: 8px;
    margin-top: 4px;
}
.drop-files__item .delete {
    width: fit-content;
    margin-left: auto;
    cursor: pointer;
}
.settings-group-title {
    color: var(--color-gray-dark);
    margin-bottom: 10px;
}
.settings-group .lenguage {
    color: var(--color-gray-dark);
}
.lenguage-select.mobile {
    display: flex;
    padding: 16px 16px 32px;
    border-radius: 0;
    left: 0;
    flex-direction: column;
    width: 100%;
    bottom: -400px;
    pointer-events: none;
    visibility: hidden;
    position: absolute;
    box-shadow: none;
    z-index: 10;
    background-color: var(--color-white);
    transition: 260ms ease-in-out;
}
.lenguage-select.mobile.active {
    display: flex;
    bottom: 0;
    box-shadow: 0 0 0 200vh rgba(0, 0, 0, 0.5);
    pointer-events: auto;
    visibility: visible;
}
.lenguage-select__item.active::after {
    background-image: url(../images/1688-accept.svg);
}
.lenguage-select__item::after {
    content: '';
    width: 24px;
    height: 24px;
    background-position: center center;
    background-size: cover;
}
.lenguage-select__item {
    cursor: pointer;
    padding: 12px 16px;
    /*border: 1px solid var(--color-gray-light);*/
    /*border-radius: 8px;*/
    /*margin-top: 10px;*/
    display: flex;
    justify-content: space-between;
    -webkit-transition: all .4s ease-out;
    -moz-transition: all .4s ease-out;
    -o-transition: all .4s ease-out;
    transition: all .4s ease-out;
}
.lenguage-select__item:hover {
    background: #e9ecef;
}
.flag-ky {
    background: url(data:image/svg+xml,%3Csvg%20width%3D%2220%22%20height%3D%2220%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Ccircle%20cx%3D%2210%22%20cy%3D%2210%22%20r%3D%2210%22%20fill%3D%22%23ED192D%22%2F%3E%3Cpath%20d%3D%22M10.371%205.284c.01-.819.737-1.383.768-2.475.52.655-.34%201.88-.034%202.591.138-.808.943-1.25%201.145-2.324.412.727-.63%201.804-.44%202.554.264-.776%201.128-1.089%201.495-2.117.294.783-.904%201.683-.833%202.454.381-.725%201.284-.898%201.807-1.856.168.818-1.156%201.52-1.207%202.292.49-.656%201.41-.686%202.076-1.55.037.835-1.38%201.32-1.55%202.075.586-.572%201.498-.457%202.292-1.207-.094.83-1.57%201.088-1.856%201.808.669-.473%201.551-.218%202.453-.834-.223.806-1.72.83-2.116%201.495.735-.362%201.566.029%202.553-.44-.346.761-1.83.55-2.324%201.146.783-.243%201.543.273%202.591-.035-.46.698-1.893.258-2.475.768.811-.117%201.482.511%202.565.372-.565.616-1.91-.042-2.565.372.82.009%201.383.735%202.475.766-.654.522-1.88-.34-2.591-.034.808.138%201.25.944%202.324%201.145-.727.413-1.803-.63-2.554-.439.776.263%201.088%201.127%202.117%201.495-.783.293-1.683-.904-2.453-.833.725.38.897%201.284%201.856%201.807-.82.167-1.52-1.156-2.293-1.207.657.49.686%201.409%201.551%202.076-.835.037-1.32-1.38-2.076-1.552.572.588.457%201.5%201.207%202.294-.83-.094-1.089-1.57-1.807-1.856.473.668.217%201.551.833%202.453-.806-.223-.83-1.722-1.495-2.116.363.734-.028%201.566.44%202.552-.761-.345-.55-1.829-1.146-2.323.243.783-.273%201.542.035%202.59-.698-.46-.258-1.892-.768-2.474.117.81-.511%201.481-.371%202.564-.617-.565.042-1.91-.372-2.564-.01.82-.736%201.383-.767%202.474-.521-.653.34-1.88.034-2.591-.138.808-.944%201.25-1.145%202.324-.412-.727.63-1.803.44-2.552-.264.775-1.129%201.087-1.495%202.116-.294-.784.904-1.683.833-2.454-.382.725-1.284.897-1.808%201.857-.167-.82%201.157-1.52%201.207-2.294-.49.657-1.409.686-2.075%201.552-.037-.836%201.38-1.32%201.55-2.076-.587.571-1.498.457-2.292%201.207.094-.832%201.57-1.09%201.856-1.807-.67.472-1.552.216-2.453.833.223-.806%201.72-.83%202.116-1.495-.735.363-1.567-.03-2.553.439.346-.761%201.829-.55%202.324-1.145-.783.243-1.543-.274-2.591.034.46-.697%201.893-.258%202.475-.768-.811.118-1.482-.511-2.565-.37.565-.618%201.91.041%202.565-.372-.82-.01-1.383-.737-2.475-.768.654-.52%201.88.34%202.59.035-.807-.14-1.25-.944-2.323-1.146.727-.412%201.803.63%202.553.44-.776-.264-1.087-1.128-2.116-1.495.783-.294%201.683.905%202.453.834-.725-.383-.897-1.285-1.856-1.808.819-.168%201.52%201.157%202.293%201.207-.657-.49-.686-1.41-1.551-2.075.835-.038%201.32%201.38%202.076%201.55-.572-.587-.457-1.5-1.207-2.292.83.094%201.088%201.568%201.807%201.856-.473-.67-.217-1.552-.833-2.454.806.223.83%201.72%201.495%202.117-.363-.736.028-1.568-.44-2.554.761.346.55%201.83%201.146%202.324-.243-.782.273-1.543-.035-2.591.698.462.258%201.893.768%202.475-.118-.811.511-1.48.37-2.565.618.565-.04%201.911.372%202.565z%22%20fill%3D%22%23FDE012%22%2F%3E%3Cpath%20d%3D%22M10%2013.847a3.846%203.846%200%20100-7.693%203.846%203.846%200%20000%207.693z%22%20fill%3D%22%23ED192D%22%2F%3E%3Cpath%20d%3D%22M9.999%206.646c.981%200%201.864.42%202.477%201.092-.963.097-1.78.323-2.477.67-.697-.347-1.515-.573-2.478-.67a3.343%203.343%200%20012.478-1.092zM9.745%208.544a4.549%204.549%200%2000-.227.135c-.626-.333-1.375-.546-2.264-.61.04-.057.083-.112.127-.167.924.082%201.705.303%202.364.642zM10.255%208.544c.077.043.153.088.227.135.626-.333%201.375-.546%202.264-.61a3.35%203.35%200%2000-.127-.167c-.924.082-1.705.303-2.364.642zM7.14%208.241c-.035.058-.07.117-.101.177.828.02%201.523.21%202.094.525.06-.045.12-.088.182-.131-.596-.325-1.317-.528-2.175-.57zM7.097%2011.687A3.344%203.344%200%20016.643%2010c0-.502.109-.975.305-1.402.801-.005%201.472.17%202.02.474-.811.664-1.41%201.548-1.87%202.615zM8.79%2013.13a3.189%203.189%200%2001-.435-.205c.08-1.26.492-2.462%201.314-3.332.06.059.12.119.176.182-.765.894-1.096%202.122-1.054%203.355zM12.857%208.241c.035.058.07.117.101.177-.828.02-1.523.21-2.094.525a4.955%204.955%200%2000-.182-.131c.596-.325%201.317-.528%202.175-.57zM12.901%2011.687A3.344%203.344%200%200013.355%2010c0-.502-.108-.975-.305-1.402-.8-.005-1.472.17-2.02.474.812.664%201.411%201.548%201.871%202.615z%22%20fill%3D%22%23FDE012%22%2F%3E%3Cpath%20d%3D%22M10%209.961c.689.891.947%202.109.815%203.294a3.336%203.336%200%2001-1.63%200c-.132-1.185.126-2.403.815-3.294z%22%20fill%3D%22%23FDE012%22%2F%3E%3Cpath%20d%3D%22M11.21%2013.13c.151-.058.296-.126.436-.205-.08-1.26-.492-2.462-1.314-3.332-.06.059-.12.119-.176.182.765.894%201.096%202.122%201.054%203.355zM9.47%209.413a4.143%204.143%200%2000-.23-.173c-.85.754-1.41%201.778-1.766%202.967.131.15.276.287.432.412.22-1.25.712-2.38%201.565-3.206z%22%20fill%3D%22%23FDE012%22%2F%3E%3Cpath%20d%3D%22M10.53%209.413c.072-.058.152-.12.23-.173.851.754%201.412%201.778%201.766%202.967-.13.15-.276.287-.431.412-.22-1.25-.712-2.38-1.565-3.206zM9.999%208.685l.224.141a6.308%206.308%200%2000-.224.15%206.251%206.251%200%2000-.224-.15c.037-.024.182-.115.224-.14zM9.575%208.966a3.972%203.972%200%2000-.177.138c.082.054.192.137.228.165.042-.037.127-.113.175-.147a4.55%204.55%200%2000-.226-.156zM10.424%208.966c.056.043.143.109.177.138a3.71%203.71%200%2000-.228.165c-.043-.037-.128-.113-.176-.147.058-.042.182-.13.227-.156zM10%209.28c.036.03.145.127.174.157-.052.044-.132.12-.175.168a2.263%202.263%200%2000-.174-.168c.029-.03.138-.126.174-.157z%22%20fill%3D%22%23FDE012%22%2F%3E%3C%2Fsvg%3E) center no-repeat;
    background-size: contain;
    border-radius: 50%;
    -webkit-box-shadow: 0 0 3px rgb(0 0 0 / 15%);
    box-shadow: 0 0 3px rgb(0 0 0 / 15%);
}

.flag-ru {
    background: url(data:image/svg+xml,%3Csvg%20width%3D%2215%22%20height%3D%2216%22%20viewBox%3D%220%200%2015%2016%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M14.5732%2010.5742C13.5436%2013.4872%2010.7655%2015.5742%207.49999%2015.5742C4.23445%2015.5742%201.45635%2013.4872%200.426758%2010.5742H14.5732Z%22%20fill%3D%22%23D90012%22%2F%3E%0A%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M14.5732%2010.5742C14.8496%209.79227%2015%208.95081%2015%208.07422C15%207.19763%2014.8496%206.35617%2014.5732%205.57422H0.426764C0.150386%206.35617%200%207.19763%200%208.07422C0%208.95081%200.150386%209.79227%200.426764%2010.5742H14.5732Z%22%20fill%3D%22%230033A0%22%2F%3E%0A%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M14.5732%205.57422H0.426758C1.45635%202.66124%204.23445%200.574219%207.49999%200.574219C10.7655%200.574219%2013.5436%202.66124%2014.5732%205.57422Z%22%20fill%3D%22%23F8F8F8%22%2F%3E%0A%3C%2Fsvg%3E%0A) center no-repeat;
    background-size: contain;
    border-radius: 50%;
    -webkit-box-shadow: 0 0 3px rgb(0 0 0 / 15%);
    box-shadow: 0 0 3px rgb(0 0 0 / 15%);
}

.simple-menu__flag {
    width: 18px;
    height: 18px;
    display: inline-block;
    vertical-align: middle;
    margin-top: -4px;
}

.settings-group {
    background-color: var(--color-bg);
    border-radius: 8px;
    padding: 0 16px;
    width: 400px;
}
.settings-group .block {
    padding: 10px 0;
}

.profile-status {
    max-width: 256px;
    cursor: pointer;
}
.profile-order-block__item, a.profile-order-block__item {
    padding: 16px;
    border: 1px solid var(--color-gray-light);
    border-radius: 12px;
    margin-top: 16px;
    display: block;
    color: var(--color-dark);
}
.profile-order-block__item .title {
    margin-right: 12px;
}
.profile-order-block__item .title,
.profile-order-block__item .status {
    display: inline-block;
}
.profile-order-block__item .status, .order-status {
    padding: 4px 8px;
    border-radius: 8px;
    display: inline-block;
}

.status.accept {
    background-color: var(--color-green);
    color: var(--color-white);
    border-radius: 8px;
    padding: 4px 8px;
    width: fit-content;
}
.status.wait {
    background-color: var(--color-yellow);
    border-radius: 8px;
    padding: 4px 8px;
    width: fit-content;
}
.status.add {
    background-color: var(--color-blue);
    color: var(--color-white);
    border-radius: 8px;
    padding: 4px 8px;
    width: fit-content;
}
.status.refuse {
    background-color: var(--color-red);
    color: var(--color-white);
    border-radius: 8px;
    padding: 4px 8px;
    width: fit-content;
}
.profile-order-block__item .date,
.profile-order-block__info .name {
    color: var(--color-gray-dark);
}
.profile-order-block__item .block-img {
    width: fit-content;
    max-height: 88px;
}
.profile-order-block__item .block-img img,
.profile-order-block__item .block-img .more-products {
    width: 88px;
    border-radius: 8px;
}
.profile-order-block__item .block-img .more-products {
    background-color: var(--color-blue-light);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}
a.back {
    color: var(--color-dark);
}
.current-order-info {
    max-width: 700px;
    width: 100%;
}
.current-order-info__item {
    display: flex;
    align-content: center;
    gap: 12px;
}
.current-order-info__item .title {
    color: var(--color-gray-dark);
    flex-basis: 20%;
    min-width: 160px;
}
.current-order-info__item .primary-button {
    font-size: 12px;
    line-height: 16px;
    padding: 4px 8px;
    border-radius: 4px;
    margin-left: 16px;
    display: inline-block;
}
.profile-adress-nav__item {
    color: var(--color-gray);
    padding-bottom: 6px;
    border-bottom: 1px solid transparent;
    transition: 300ms ease-in-out;
    cursor: pointer;
}
.profile-adress-nav__item.active {
    color: var(--color-dark);
    border-bottom: 1px solid var(--color-dark);
}
.profile-adress-storage {
    padding: 12px 16px;
    border-radius: 8px;
    background-color: var(--color-bg);
    position: relative;
}

.profile-adress-storage .copy-adress {
    position: absolute;
    top: 12px;
    right: 16px;
    opacity: 1;
    transition: 160ms ease-in-out;
    color: var(--color-primary);
    cursor: copy;
}
.profile-adress-storage .grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px 10px;
}

.profile-adress-storage .grid .name,
.profile-adress-conditions .grid .name {
    color: var(--color-gray-dark);
}
.profile-adress-conditions .grid {
    display: grid;
    grid-template-columns: 1.5fr 0.7fr;
    gap: 12px 100px;
}

.profile-wallet-block {
    padding: 12px;
    border-radius: 8px;
    background-color: var(--color-blue-light);
    width: fit-content;
}
.profile-wallet-block__item .name{
    color: var(--color-gray-dark);
}
.profile-wallet-block .primary-button::before {
    content: "+";
    font-size: 28px;
    display: inline-block;
    height: 0px;
    font-family: var(--font-regular);
    margin-right: 6px;
    position: relative;
    top: -14px;
    margin-top: 2px;
}
.payment-history {
    width: 100%;
    border-spacing: 0px 8px;
	border-collapse: separate;
}
.payment-history-row {
    cursor: pointer;
}
.payment-history-row .payment-history-cell {
    padding: 16px 12px;
    background-color: var(--color-bg);
}
.payment-history-row .payment-history-cell:first-child {
    border-radius: 8px 0 0 8px;
}
.payment-history-row .payment-history-cell:last-child {
    border-radius: 0 8px 8px 0;
}
.payment-history-row.head .payment-history-head {
    padding: 12px 12px 4px;
    font-weight: 400;
}
.payment-history-row .primary-button.fill.disabled {
    border: 1px solid var(--color-gray);
    color: var(--color-gray);
}
.payment-history-head {
    color: var(--color-gray-dark);
}
.payment-history-cell.up {
    color: var(--color-green);
    white-space: nowrap;
}
.payment-history-cell.down {
    color: var(--color-red);
    white-space: nowrap;
}
.wallet-up-cards .cards-list img {
    cursor: pointer;
    height: 30px;
}
.modal .online-wallets-box-btns {
    display: none;
}

.track-order-search {
    border: 1px solid var(--color-gray);
    padding: 1px 6px;
    background-color: var(--color-white);
    border-radius: 8px;
    gap: 8px;
    width: 100%;
    max-width: 400px;
    position: relative;
}
.track-product-list__item {
    padding: 12px;
    background-color: var(--color-bg);
}
.grid-find-order {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
}
.grid-find-order .name {
    color: var(--color-gray-dark);
}
.profile-help__item {
    padding: 12px 16px;
    border-radius: 8px;
    border: 1px solid var(--color-gray-light);
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.profile-help__item .date, .profile-help__item .help-status {
    color: var(--color-gray);
}
.profile-help__item .help-status .help-wait {
    color: var(--color-dark);
}
.profile-help__item .help-status .help-accept {
    color: var(--color-green);
    cursor: pointer;
}

.modal-current-mail-container {
    padding: 12px;
    background-color: var(--color-bg);
    border-radius: 8px;   
    display: block;
    width: 816px;
}
.modal-current-mail__item {
    display: flex;  
    padding: 6px 0;
}
.modal-current-mail-container .name {
    color: var(--color-gray-dark);
    flex-basis: 30%;
}

.map-container {
    display: none;
    flex-basis: 68%;
    overflow: hidden;
    height: 500px;
    border: 1px solid var(--color-gray-light);
    border-radius: 8px;
}
.map-container.active {
    display: block;
}
.pickup-points-container {
    padding: 16px 8px 16px 16px;
    border: 1px solid var(--color-gray-light);
    border-radius: 8px;
}

.pickup-points-container .scroll-overflow {
    overflow-y: auto;
    max-height: 568px;
    scrollbar-width: thin;
    scrollbar-color: var(--color-gray) transparent;
    padding-right: 8px;
}

.pickup-points-container .scroll-overflow::-webkit-scrollbar {
    width: 8px;
}
.pickup-points-container .scroll-overflow::-webkit-scrollbar-track {
    background-color: transparent;
}
.pickup-points-container .scroll-overflow::-webkit-scrollbar-thumb {
    background-color: var(--color-gray);
    border-radius: 6px;
}
.pickup-points__item {
    cursor: pointer;
    padding: 16px;
    margin-bottom: 8px;
    border-radius: 8px;
}
.pickup-points__item:hover {
    background-color: var(--color-bg);
}
.pickup-points__item.active {
    background-color: var(--color-bg);
}
.information-container .text {
    color: var(--color-gray-dark);
}
.information-container .title {
    margin-bottom: 16px;
}
.information-container .subtitle {
    margin-top: 16px;
}
.information-list__item {
    width: 210px;
    padding: 16px;
}
.information-list__item:has(.information-list__item-head) {
    padding: 0;
}
.information-list__item.active {
    padding-bottom: 0;
}

.information-list__item.active .information-list__item-head {
    background-color: var(--color-bg);
}
.information-list__item-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px;
}
.information-list__item-head::after {
    content: '';
    width: 20px;
    height: 20px;
    margin-top: 2px;
    display: block;
    background-image: url(../images/1688-arrow.svg);
    background-repeat: no-repeat;
    /*background-size: contain;*/
    background-position: center center;
}
.information-list__item-dropdown {
    max-height: 0px;
    opacity: 0;
    pointer-events: none;
}
.information-list__item.active .information-list__item-dropdown {
    max-height: fit-content;
    opacity: 1;
    pointer-events: auto;
}
.information-list-dropdown__item {
    padding: 16px 0 16px 12px;
    color: var(--color-gray);
}
.store-list {
    min-width: 250px;
}
.store-list .title {
    margin-bottom: 12px;
}
.store-list__item {
    cursor: pointer;
    padding: 12px;
    border-radius: 12px;
    color: var(--color-gray-dark);
}
.store-list__item.active {
    font-family: var(--font-bold);
    color: var(--color-dark);
    background-color: var(--color-bg);
}
.store-main__item {
    padding: 16px;
    border: 1px solid var(--color-gray-light);
    border-radius: 8px;
    position: relative;
    width: 100%;
}
.store-preview {
    margin-right: 16px;
    max-width: 132px;
}
.store-main-container {
    max-height: 580px;
    max-width: 720px;
    overflow-y: auto;
    -ms-overflow-style: none;
    scrollbar-width: none;
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.store-main-container::-webkit-scrollbar {
    display: none;
}

.store-main__item-info .text {
    color: var(--color-gray-dark);
    margin: 16px 0 18px;
}
.store-main__item-link {
    position: absolute;
    top: 16px;
    right: 16px;
    display: flex;
    align-items: center;
    gap: 4px;
    color: var(--color-blue);
}
.store-main__item-link::after {
    content: '';
    width: 20px;
    height: 20px;
    background-image: url(../images/link-blue.svg);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center center;
}
.rating-set-button {
    color: var(--color-gray);
    margin-left: 12px;
    cursor: pointer;
    pointer-events: none;
}
.rating-star {
    width: 20px;
    height: 20px;
    display: block;
    background-image: url(../images/rating-star-none.svg);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center center;
}
.rating-row:has(.rating-star.active) .rating-set-button {
    pointer-events: auto;
    color: var(--color-primary);
}
.rating-star.active {
    background-image: url(../images/rating-star.svg);
}
.rating-row.js-rating-select .rating-star {
    cursor: pointer;
}

.stores-search {
    border: 1px solid var(--color-gray);
    padding: 0px 12px;
    background-color: var(--color-white);
    border-radius: 8px;
    gap: 8px;
    width: 100%;
    max-width: 224px;
    position: relative;
}
.store-search .search-input {
    width: 160px;
}

.vacancy {
    margin-top: 32px;
}

.vacancy-list {
    flex-basis: 28%;
}
.vacancy-list__item {
    padding: 12px 16px;
    width: 100%;
    border-radius: 8px;
    cursor: pointer;
}
.vacancy-list__item-dropdown {
    display: none;
}

.vacancy-container {
    flex-basis: 70%;
}
.vacancy-list__item.active {
    background-color: var(--color-bg);
}

.vacancy-list__item .wage {
    color: var(--color-gray-dark);
}

.vacancy-container .wage {
    color: #0393BF;
    margin-top: 8px;
}
.vacancy-info {
    margin-top: 8px;
}
.vacancy-info .name {
    color: var(--color-gray-dark);
}
.vacancy-block {
    padding: 24px;
    display: flex;
    flex-direction: column;
    gap: 16px;
    border: 1px solid var(--color-gray-light);
    border-radius: 8px;
    margin-top: 32px;
}
.vacancy-block-list {
    gap: 16px;
    list-style: inside;
    padding-left: 4px;
}
.vacancy-block .input,
.vacancy-block .drop-area,
.vacancy-block .policy {
    max-width: 520px;
    width: 100%;
}

.about-wrapper .text {
    color: var(--color-gray-dark);
    max-width: 855px;
}
.about-wrapper .image {
    width: 100%;
    object-fit: contain;
}
.about-wrapper .image.mobile {
   display: none;
   margin: 16px 0;
}
.about-wrapper h2.title {
    min-width: 45%;
}
.about-logos {
    margin-top: 16px;
}
.about-card {
    display: flex;
    flex-direction: column;
    gap: 10px;
    width: 100%;
    background-color: var(--color-bg);
    border-radius: 8px;
    padding: 16px 24px;
}
.about-card img {
    width: 32px;
}
.about-block {
    background-color: var(--color-bg);
    border-radius: 8px;
    padding: 16px 24px;
    text-align: right;
}

.order-accordion {
    border: 1px solid var(--color-gray);
    border-radius: 8px;
    padding: 12px 16px;
    margin-bottom: 16px;
}
.order-accordion .order-accordion-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    cursor: pointer;
    user-select: none;
}
.order-accordion .order-accordion-head::after {
    content: '';
    width: 24px;
    height: 24px;
    display: block;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: contain;
    transition: 260ms ease-out;
    background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M17.5999 9.59961L11.9999 14.3996L6.3999 9.59961' stroke='%231E1E2A' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");
}
.order-accordion .order-accordion-dropdown {
    transition: 260ms ease-in-out;
    opacity: 0;
    max-height: 0;
    overflow: hidden;
}
.order-accordion.active .order-accordion-head::after {
    transform: rotate(180deg);
}

.order-accordion.active .order-accordion-dropdown {
    opacity: 1;
    max-height: 10000px;
    padding: 10px 0 0;
}
.order-accordion .order-accordion-dropdown .track {
    color: var(--color-blue);
    text-decoration: underline;
    cursor: pointer;
    font-size: 20px;
}

.order-chat {
    border: 1px solid var(--color-gray-light);
    border-radius: 8px;
    padding: 12px 16px;
    overflow-y: auto;
    max-height: 260px;
    height: 260px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    width: 50%;
    gap: 10px 0;
    scrollbar-color: var(--color-gray) var(--color-bg);
    scrollbar-width: thin;
}
.order-chat .operator .name {
    color: var(--color-green)
}
.order-chat .name, .order-chat .date {
    color: var(--color-gray-dark)
}

.order-chat::-webkit-scrollbar {
    width: 6px;
}
.order-chat::-webkit-scrollbar-track {
    background-color: var(--color-bg);
}
.order-chat::-webkit-scrollbar-thumb {
    background-color: var(--color-gray);
    border-radius: 6px;
}

.order-textarea textarea {
    border-radius: 8px;
    border: 1px solid var(--color-gray);
    padding: 12px;
    max-height: 260px;
    transition: 260ms ease-out;
    outline: none;
}
.order-textarea textarea:focus {
    border: 1px solid var(--color-primary);
}

.info-grid.triple {
    grid-template-columns: 1fr 1.2fr 0.8fr;
}

/********Responsive**********/
/* disable hover on touch screen */
@media (min-width: 991.98px) {
    .main-grid__item:hover .fast-view {
        bottom: 0;
    }
    .catalog-main:hover {
        background-color: var(--color-btn-hover);
    }
    .catalog-main:active {
        background-color: var(--color-btn-press);
    }
    .product-basket-button.add:hover,
    .primary-button.border:hover {
        border: 1px solid var(--color-btn-hover) !important;
        color: var(--color-btn-hover);
    }
    .product-basket-button.order:hover,
    .primary-button.fill:hover {
        background-color: var(--color-btn-hover);
        border: 1px solid var(--color-btn-hover);
    }
    .product-basket-button.add:active,
    .primary-button.border:active {
        border: 1px solid var(--color-btn-press) !important;
        color: var(--color-btn-press);
    }
    .product-basket-button.order:active,
    .primary-button.fill:active {
        background-color: var(--color-btn-press);
        border: 1px solid var(--color-btn-press);
    }
    .select-primary-dropdown__item:hover {
        background-color: var(--color-bg);
    }
    .profile-menu__item:hover, a.profile-menu__item:hover {
        color: var(--color-dark);
    }
    .profile-menu__item:hover path,
    .profile-menu__item:hover circle {
        stroke: var(--color-dark);
    }
    .drop-area:hover {
        border: 2px dashed var(--color-primary);
        color: var(--color-primary);
    }
    .profile-adress-storage:hover .copy-adress {
        opacity: 1;
    }
}
@media (max-width: 1399.98px) {
    .main-grid::-webkit-scrollbar,
    .blog-container::-webkit-scrollbar {
        display: none;
    }
    .blog-container {
        overflow-x: scroll;
        -ms-overflow-style: none;
        scrollbar-width: none;
    }
    .main-grid {
        grid-template-columns: repeat(6, 1fr);
    }
    .main-grid.overflow {
        overflow-y: hidden;
        max-height: 520px;
    }
    .subcatalog-products .main-grid {
        grid-template-columns: repeat(4, 1fr);
    }
    .profile-grid {
        grid-template-columns: repeat(2, 242px);
    }
}

@media (max-width: 1199.98px) {
    .search-input {
        max-width: 184px;
    }
    .subcatalog-products .main-grid {
        grid-template-columns: repeat(3, 1fr);
    }
    .main-grid {
        grid-template-columns: repeat(5, 1fr);
    }
    .main-grid.seller {
        grid-template-columns: repeat(4, 1fr);
    }
    .product-view-img .product-view-img-list {
        display: none;
    }
    .product-view {
        flex-direction: column;
    }
    .product-view-img {
        max-width: 100%;
        width: 100%;
    }
    .product-view-config {
        margin-left: 0;
        margin-top: 24px;
    }
    .payment-history.mobile-table {
        display: none;
    }
    .mail-container {
        display: flex;
        flex-direction: column;
        margin-top: 24px;
    }
    .mail-block {
        padding: 12px;
        border-radius: 8px;
        margin-bottom: 16px;
        border: 1px solid var(--color-gray-light);
    }
    .mail-block .date, .mail-block .name {
        color: var(--color-gray-dark);
    }
    .mail-row {
        margin-top: 16px;
    }
}

@media (max-width: 991.98px) {
    h1.title {
        font-family: var(--font-bold);
        font-size: 32px;
        line-height: 40px;
        letter-spacing: -0.64px; 
    }
    .modal-current-mail-container {
        width: 600px;
    }
    h2.title {
        font-family: var(--font-bold);
        font-size: 24px;
        line-height: 32px;
        letter-spacing: -0.48px; 
    }
    .basket-form {
        max-width: none;
        margin-top: 32px;
    }
    .subcatalog-products .main-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    .title .basket-total {
        font-size: 12px;
        line-height: 16px;
        margin: 0 0 4px 4px;
    }
    .search-photo {
        background-color: transparent;
        font-size: 0px;
        padding: 0;
    }
    .header-logo {
        margin-right: 16px;
    }
    .header-buttons {
        gap: 10px;
    }
    .search-input {
        max-width: 225px;
    }
    .search-main {
        margin-right: 12px;
    }
    .header-buttons__item {
        flex-direction: row !important;
        display: flex;
        align-items: center;
    }
    .header-panel-notice-dropdown {
        right: -200px;
    }
    .header-buttons__item img {
        width: 36px;
    }
    .header-buttons__item .title {
        display: none;
    }
    .catalog-main {
        background-color: var(--color-white);
        border: 2px solid var(--color-gray-light);
        min-width: 48px;
        height: 48px;
        background-image: url(../images/catalog-mobile.svg);
        background-repeat: no-repeat;
        background-size: contain;
        background-position: center center;
        font-size: 0;
        transition: none;
    }
    .catalog-main:hover {
        background-color: var(--color-white);
    }
    .catalog-main:active {
        background-color: var(--color-white);
    }
    .catalog-main img {
        display: none;
    }
    .catalog .container {
        margin: 0;
    }
    .catalog-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    .container.margin-top {
        margin-top: 36px;
    }
    .about-block {
        text-align: left;
    }
    .delete-notice {
        font-size: 0;
    }
    .about-wrapper .image.mobile-none {
        display: none;
    }
    .about-wrapper .image.mobile {
        display: block;
    }
    .main-grid {
        grid-template-columns: repeat(4, 1fr);
    }
    .about-container {
        flex-direction: column;
    }
    .profile-wallet-block {
        width: 100%;
    }
    .select-primary.calendar.fit {
        width: 158px;
    }
    .profile-order-block__item .block-img {
        margin-top: 24px;
    }
    .main-grid.seller {
        grid-template-columns: repeat(3, 1fr);
    }
    .map-container {
        height: 400px;
    }
    .map-container img {
        height: 400px;
        width: 100%;
    }
    .product-list-block.mobile-margin {
        margin-top: 26px;
    }
    .product-wrapper {
        gap: 24px;
    }
    .product-basket-properties__item .name {
        flex-basis: 42%;
    }
    .order-block .product-list-block {
        margin: 20px 0;
    }
}


@media (max-width: 767.98px) {
    h1.title {
        font-family: var(--font-bold);
        font-size: 24px;
        line-height: 32px;
        letter-spacing: -0.48px; 
    }
    .profile-wrapper {
        margin-top: 18px;
    }
    .drop-area {
        border: 2px dashed var(--color-primary);
        color: var(--color-dark);
    }
    .basket-wrapper .basket-form {
        display: none !important;
    }
    .basket__item .basket__item-btn {
        position: absolute;
        top: 0;
        right: 0;
    }
    .basket__item .info, .basket__item .title {
        padding-right: 40px;
    }
    .basket__item .title span {
        white-space: normal;
    }
    .basket__item .info {
        margin-left: 95px;
        flex-wrap: wrap;
        margin-bottom: 4px;
    }
    .basket__item .image {
        width: 80px;
    }
    .basket__item .change-config {
        position: absolute;
        max-width: 90px;
        top: 90px;
        left: 0;
    }
    .basket__item .price {
        margin-left: 95px;
        color: var(--color-blue);
    }
    h1.title {
        display: none !important;
    }
    .notification {
        top: auto;
        right: auto;
        left: 50%;
        transform: translateX(-50%);
        bottom: 36px;
    }
    .about-container img {
        display: none;
    }
    .about-block .border.fit {
        width: 100%;
    }
    .header-panel {
        display: none !important;
    }
    .container {
        max-width: 100%;
        padding: 0 16px;
    }
    header.header {
        border-bottom: 2px solid var(--color-gray-light);
    }
    .header-main .container {
        flex-wrap: wrap;
        max-height: none;
        gap: 12px;
        justify-content: flex-start !important;
    }
    .header-logo {
        margin-right: 0;
    }
    .header-logo img {
        width: 64px;
    }
    .header-buttons {
        position: absolute;
        top: 12px;
        right: 16px;
        gap: 24px;
        height: 32px;
        align-items: center;
    }
    .contacts-dropdown{
        background-color: transparent;
        width: 100%;
        max-width: 452px;
        margin-top: 12px;
        padding-left: 0px;
    }
    .empty-container .title {
        font-size: 16px;
        line-height: 24px;
    }
    .contacts-dropdown__item img {
        margin-left: 0;
    }
    .contacts-dropdown__item .text {
        font-family: var(--font-medium);
        letter-spacing: -0.32px; 
        margin-left: 44px;
    }
    .catalog-main {
        min-width: 32px;
        height: 32px;
        order: -1;
        margin-right: 12px;
    }
    .search-main {
        order: 1;
        margin-right: 0;
        transition: 200ms;
        position: static;
        background-color: var(--color-white);
    }
    .search-main__select.active .search-main__select-dropdown {
        display: flex;
        bottom: 0;
        box-shadow: 0 0 0 200vh rgba(0, 0, 0, 0.5);
        pointer-events: auto;
        visibility: visible;
    }
    .search-main__select-dropdown {
        display: flex;
        right: auto;
        top: auto;
        padding: 16px 16px 32px;
        border-radius: 0;
        left: 0;
        width: 100%;
        bottom: -400px;
        pointer-events: none;
        visibility: hidden;
        box-shadow: none;
    }
    .search-main__select {
        position: static;
    }
    .search-input {
        max-width: 100%;
        flex-basis: auto;
        width: 100%;
    }
    .search-main.focus {
        margin-top: -46px;
        position: relative;
    }
    .search-main.focus .search-photo {
        display: none !important;
    }
    .search-main-result {
        width: calc(100% + 32px);
        height: 100%;
        left: -16px;
        right: auto;
        box-shadow: none;
        top: 62px;
        height: 100vh;
    }
    .search-main-result__item:not(.memory)::after {
        content: '';
        width: 20px;
        height: 20px;
        display: block;
        background-image: url(../images/arrow-mobile.svg);
        background-size: contain;
        background-position: center center;
        background-repeat: no-repeat;
        margin-left: auto;

    }
    .catalog {
        height: calc(100% - 119px);
        top: 119px;
        background: none;
        background-color: var(--color-white);
    }
    .catalog .container {
        padding: 0;
    }
    .catalog-nav-select {
        justify-content: center;
    }
    .catalog-nav {
        width: 100%;
        padding: 16px;
        background-color: var(--color-white);
    }
    .catalog-grid-wraper.active {
        display: none;
    }
    /* .catalog.js-subcatalog .catalog-grid-wraper  */
    .catalog.js-subcatalog .catalog-grid-wraper.active
    {
        display: block;
        width: 100%;
    }
    .catalog.js-subcatalog .catalog-nav {
        display: none;
    }    
    .catalog-nav-list {
        display: none;
    }
    .catalog-nav-list.mobile {
        display: block;
    }
    .header-buttons__item img {
        width: 24px;
    }
    .header-buttons .header-buttons__item:nth-child(3) {
        order: -1;
    }
    .header-buttons__item.mobile,
    .title.mobile {
        display: flex;
    }
    .footer-list.mobile {
        display: block;
    }
    .select-dropdown__item {
        border: 1px solid var(--color-gray-light);
        border-radius: 8px;
        padding: 15px 16px;
        margin-top: 16px;
    }
    .swiper-container {
        margin-bottom: 30px;
    }
    .main-swiper, .main-swiper .swiper-slide img {
        max-height: 190px;
    }
    .main-brand-swiper {
        max-height: 100px;        
    }
    .swiper-pagination {
        bottom: -20px !important;
    }
    .main-swiper-product .swiper-pagination {
        bottom: 0 !important;
    }
    .main-swiper .swiper-button-next, .main-swiper .swiper-button-prev,
    .main-brand-swiper .swiper-button-next, .main-brand-swiper .swiper-button-prev {
        display: none;
    }
    .main-grid {
        margin-left: -16px;
        padding-left: 16px;
        gap: 16px;
        margin-top: 12px;
        display: flex;
        overflow-x: scroll;
        overflow-y: auto;
        -ms-overflow-style: none;
        scrollbar-width: none;
    }
    .subcatalog-products .main-grid {
        display: flex;
        flex-wrap: wrap;
        gap: 16px 16px;
        justify-content: center;
    }
    .subcatalog-header {
        display: none !important;
    }
    .subcatalog-products-pagination {
        justify-content: center !important;
    }
    .subcatalog-header.mobile {
        display: flex !important;
    }
    .subcatalog-search {
        display: none !important;
    }
    .subcatalog-category-overflow {
        display: flex;
    }
    .subcatalog-sorting {
        border-radius: 8px;
        border: 1px solid var(--color-gray-light);
        padding: 4px 12px;
        width: 100%;
        justify-content: center;
    }
    .subcatalog-filter {
        position: fixed;
        left: -100%;
        top: 58px;
        width: 100%;
        height: calc(100vh - 53px - 80px);
        padding: 16px 0;
        max-width: none;
        overflow: scroll;
        background-color: var(--color-white);
        transition: 260ms ease-in-out;
        z-index: 10;
    }
    .subcatalog-filter.active {
        left: 0;
    }
    .hide-filter, .reset-filter {
        cursor: pointer;
    }
    .reset-filter {
        color: var(--color-primary);
    }
    .reset-filter.disabled {
        color: var(--color-gray-dark);
    }
    .filter-button-container {
        border-top: 1px solid var(--color-gray-light);
        padding: 16px;
        position: fixed;
        bottom: 0;
        width: 100vw;
        background-color: var(--color-white);
    }
    .mobile-filter {
        position: fixed;
        top: 0;
        width: 100vw;
        background-color: var(--color-white);
    }
    .subcatalog-filter-accordion {
        padding: 0 16px;
    }
    .main-grid:has(.favorite) {
        grid-template-columns: repeat(3, 1fr);
    }
    .favorites-nav {
        gap: 12px;
    }
    .favorites-nav__item {
        font-size: 16px;
        line-height: 16px;
        font-family: var(--font-regular);
    }
    .main-grid__item {
        min-width: 140px;
    }
    .main-grid__item.favorite {
        min-width: auto;
    }
    .main-grid__item .prev-price {
        display: none;
    }
    .main-grid__item img {
        min-height: 164px;
    }
    .main-grid__item .text {
        font-size: 12px;
        line-height: 16px;
    }
    .main-grid.seller {
        grid-template-columns: repeat(2, 1fr);
    }
    .main-grid__item.seller .name {
        padding: 8px 0px 0px;
    }
    .main-grid__item.seller .value {
        padding: 0;
    }

    .blog-container__item, .blog-container__item img {
        max-width: 296px;
    }
    .footer {
        padding: 28px 0;
    }
    .footer .container {
        flex-wrap: nowrap;
        flex-direction: column;
        gap: 32px;
    }
    .basket-action .remove {
        margin-right: 32px;
    }
    .basket-action .remove, .basket-action .add-fav {
        font-size: 0;
    }
    .app-buttons {
        order: 1;
        margin: 0;
    }
    .app-buttons {
        margin: 0;
    }
    .footer-list {
        overflow-y: hidden;
        max-height: 32px;
    }
    .footer-list.active {
        max-height: 100%;
    }
    .footer-list__item.header {
        font-family: var(--font-bold);
        font-size: 24px;
        line-height: 32px;
        letter-spacing: -0.48px;
        color: var(--color-white);
        display: flex;
        align-items: center;
        cursor: pointer;
        justify-content: space-between;
        margin-top: 0px;
    }
    .footer-list__item {
        margin-bottom: 0;
        margin-top: 32px;
    }
    .footer-list__item.header::after {
        content: '';
        width: 20px;
        height: 20px;
        background-image: url(../images/arrow-white.svg);
        background-position: center center;
        background-repeat: no-repeat;
        background-size: contain;
        transform: rotate(180deg);
    }
    .footer-list.active .footer-list__item.header::after {
        transform: rotate(0deg);
    }
    .copyright {
        margin-top: 32px;
    }
    .main-grid__item.favorite::after {
        top: 4px;
        right: 4px;
        background-image: url(../images/favorite-mobile.svg);
    }
    .info-grid {
        grid-template-columns: 1fr;
        border-top: none;
        gap: 8px;
    }
    .info-grid__item .value input {
        border: none;
        padding: 0;
    }
    .order-product {
        border: none;
    }
    .order-product .title {
        font-family: var(--font-medium);
        font-size: 14px;
    }
    .delete-notice {
        display: none !important;
    } 
    .blog-banner-img {
        width: calc(100% + 32px);
        margin-left: -16px;
        border-radius: 0;
    }
    .profile-info-block {
        display: none;
    }
    .profile-info-block .grid {
        grid-template-columns: 1fr;
    }
    .profile-info-block.active {
        display: block;
    }
    .profile-info-block h3.title {
        display: none;
    }
    .profile-wrapper {
        flex-direction: column;
    }
    .profile-grid__item {
        /*display: none;
        border: none;*/
    }
    .profile-grid__item h4.title {
        color: var(--color-blue);
    }
    .profile-grid__item.profile-grid__item_long {
        display: block;
    }
    .profile-wrapper .profile-menu:not(.main) {
        display: none !important;
    }
    .profile-wrapper .profile-menu {
        order: 1;
    }
    .profile-grid__item .text-bold.border-top {
        border: none !important;
        margin-top: 0;
        padding-top: 0;
    }
    .profile-grid {
        grid-template-columns: 1fr;
    }
    .profile-grid__item .progress, .profile-grid__item img {
        display: none;
    }
    .profile-grid__item.no-padding {
        /*padding: 0;*/
    }
    .profile-grid__item.mobile-height {
        max-height: 110px;
        align-items: flex-start;
        justify-content: flex-start;
        border: 1px solid var(--color-gray-light);
    }
    .profile-menu__item, a.profile-menu__item {
        padding: 16px;
        background-color: var(--color-bg);
        margin-bottom: 12px;
        color: var(--color-dark);
        gap: 16px;
    }
    .profile-menu .profile-menu__item:last-child, .profile-menu a.profile-menu__item:last-child {
        background-color: transparent;
        padding-left: 0;
        color: var(--color-gray-dark);
    }
    .profile-menu__item path, .profile-menu__item circle {
        stroke: var(--color-dark);
    }
    .profile-menu__item.active path, .profile-menu__item.active circle {
        stroke: var(--color-dark);
    }
    .profile-grid__item .text-bold {
        margin: 0;
    }
    .profile-adress-nav {
        overflow-x: auto;    
        scrollbar-width: none;
        -ms-overflow-style: none;
    }
    .profile-adress-nav::-webkit-scrollbar {
        display: none;
    }
    .profile-adress-storage .grid,
    .profile-adress-conditions .grid {
        grid-template-columns: 1fr;
    }
    .profile-adress-storage .grid {
        padding-bottom: 64px;
    }
    .profile-adress-storage .copy-adress {
        top: auto;
        left: 16px;
        bottom: 16px;
        width: auto;
        display: flex;
        justify-content: center;
        background-color: var(--color-primary);
        color: var(--color-white);
        padding: 12px;
        border-radius: 8px;
    }
    .profile-adress-storage .copy-adress img {
        display: none;
    }
    .notice-dropdown-nav__item {
        color: var(--color-gray);
        padding: 4px 12px;
        font-size: 16px;
        line-height: 24px;
        font-family: var(--font-regular);
        border: 1px solid var(--color-gray);
        border-radius: 18px;
    }
    .profile-adress-nav__item,
    .notice-dropdown-nav__item {
        color: var(--color-gray);
        padding: 4px 12px;
        font-size: 16px;
        line-height: 24px;
        font-family: var(--font-regular);
        border: 1px solid var(--color-gray);
        border-radius: 18px;
    }
    .profile-adress-nav__item.active,
    .notice-dropdown-nav__item.active {
        color: var(--color-white);
        border: 1px solid var(--color-primary);
        background-color: var(--color-primary);
    }
    .product-basket-container .product-basket-block {
        display: none;
    }
    .product-wrapper {
        flex-direction: column-reverse;
    }
    .product-view-config-row .value {
        text-align: right;
    }
    .product-view-config-row .title, .product-view-config-row .value {
        flex-basis: 50%;
    }
    .product-view-img-list, .product-view-block-list {
        overflow-x: scroll;
        flex-wrap: nowrap;
    }
    .product-view-img-list__item {
        min-width: 60px;
    }
    .product-basket {
        padding: 0;
        border: none;
    }
    .product-basket-properties {
        display: none;
    }
    .product-basket-button {
        /*display: none;*/
    }

    .main-swiper-product {
        width: 100%;
        margin: 0;
    }

    .item_video {
        width: 100%;
    }

    .product-view-config {
        margin-top: 0;
    }
    /*модал*/
    .modal-wrapper {
        padding-top: 0;
    }
    .modal:not(.mobile-fill-none) {
        width: 100%;
        height: 100%;
        border-radius: 0;
        position: relative;
        padding-top: 56px;
        /* justify-content: center; */
    }
    .modal .select-primary {
        width: 100%;
    }
    #modal-reset-password .modal, #modal-login .modal {
        padding-top: 112px;
    }
    .modal.mobile-fill-none {
        margin: 48px 16px;
        height: 80%;
    }
    .modal.mobile-fill-none h2.title {
        align-items: flex-start !important;
    }
    .modal:not(.mobile-fill-none) h2.title {
        justify-content: center !important;
        font-size: 32px;
        line-height: 40px;
        letter-spacing: -0.64px; 
    }
    .modal:not(.mobile-fill-none) .close-modal {
        position: absolute;
        top: 16px;
        right: 16px;
    }
    .modal-input {
        width: 100%;
    }
    .order-steps {
        justify-content: center;
    }
    .order-steps__item {
        flex-direction: column;
        justify-content: flex-end;
        height: 85px;
        width: 138px;
        position: relative;
    }
    .order-steps__item .name {
        white-space: nowrap;
    }
    .order-steps__item::before {
        width: 32px;
        position: absolute;
        left: -24px;
        top: 52px;
    }
    .map-container {
        border-radius: 0px;
        position: relative;
        left: -16px;
        width: calc(100% + 32px);
        height: 300px;
    }
    .map-container img {
        height: 300px;
        width: 100%;
    }
    .pickup-points-container {
        padding: 0;
    }
    .map-container, .pickup-points-container {
        border: none;
    }
    .modal:not(.mobile-fill-none).modal-check-quest {
        padding-top: 16px;
    }
    .modal:not(.mobile-fill-none).modal-check-quest h2.title {
        justify-content: flex-start !important;
    }
    .vacancy-block .drop-area {
        border: 2px dashed var(--color-primary);
    }
    .vacancy-block .drop-area .text {
        color: var(--color-gray);
    }
    .vacancy-block .drop-area .text.primary-color {
        color: var(--color-primary);
    }
    .vacancy-list__item-dropdown {
        padding: 12px 16px;
    }
    .vacancy-block .policy {
        flex-direction: column;
        gap: 16px;
        margin-top: 16px;
    }
    .vacancy-list__item.active .vacancy-list__item-dropdown {
        display: block;
    }
    .vacancy-list__item, .vacancy-list__item.active {
        background-color: transparent;
        padding: 0;
    }
    .vacancy-list__item-head {
        border-radius: 8px;
        padding: 12px 16px;
    }
    .vacancy-list__item-head {
        background-image: url(../images/1688-arrow.svg);
        background-size: 20px 20px;
        background-repeat:  no-repeat;
        background-position: right 16px top 26px;
    }
    .vacancy-list__item.active .vacancy-list__item-head {
        background-color: var(--color-bg);
    }
    .vacancy-list {
        flex-basis: 100%;
    }
    .modal-current-mail-container {
        width: 100%;
    }
    #modal-current-mail .title {
        flex-wrap: wrap;
        gap: 12px;
        justify-content: flex-start !important;
    }
    .modal-current-mail__item {
        flex-direction: column;
    }
    .select-primary {
        position: static;
    }
    .select-primary-dropdown {
        position: fixed;
        bottom: -100vh;
        width: 100vw;
        pointer-events: none;
        visibility: hidden;
        display: flex;
        gap: 8px;
        padding: 16px;
        transition: 300ms ease-in-out;
        box-shadow: none;
        top: auto;
        max-height: 80vh;
    }
    .select-primary.active .select-primary-dropdown {
        pointer-events: auto;
        visibility: visible;
        bottom: 0;
        box-shadow: 0 0 0 200vh rgba(0, 0, 0, 0.5);
    }
    .select-primary-dropdown__item {
        display: flex;
        justify-content: space-between;
        align-items: center;
        border: 1px solid var(--color-gray-light);
        border-radius: 8px;
    }
    .select-primary-dropdown__item.active::after {
        background-image: url(../images/1688-accept.svg);
    }
    .select-primary-dropdown__item::after {
        content: '';
        width: 24px;
        height: 24px;
        background-position: center center;
        background-size: cover;
    }
    .select-primary .value {
        letter-spacing: -1px;
    }

    .js-payment-form .table-top-up__header .form-row .d-flex.gap-3 {
        flex-direction: column!important;
    }
}

@media (max-width: 575.98px) {
    .container.margin-top {
        margin-top: 24px;
    }
    .main-swiper, .main-swiper .swiper-slide img {
        max-height: 140px;
    }
    .main-grid:has(.favorite) {
        grid-template-columns: repeat(2, 1fr);
    }
    .about-logos img {
        width: 90px;
    }
    .profile-grid__item .text-bold {
        font-size: 12px;
        line-height: 16px;
        font-family: var(--font-medium);
    }
    .profile-grid__item .percent {
        font-size: 20px;
        line-height: 28px;
    }
    .profile-grid__item.mobile-height {
        max-height: 80px;
    }
    .settings-group {
        width: 100%;
    }
    .subcatalog-products .main-grid__item {
        max-width: 150px;
    }
    .catalog-grid {
        grid-template-columns: repeat(1, 1fr);
    }
    .order-block .primary-button.fit {
        width: 100%;
    }
    .primary-button.fit.fit-m {
        width: 100%;
    }
    .order-block .primary-button.border {
        display: none;
    }
    #find-track-order {
        width: 100%;
    }
    .track-order-search {
        max-width: none;
    }
    .grid-find-order {
        grid-template-columns: 1fr;
    }
    .profile-order-block__info {
        display: flex;
        align-items: center;
        justify-content: space-between;
    }

    .payment-history-row.head {
        display: none;
    }
    .payment-history-row {
        display: flex;
        flex-direction: column;
        margin-bottom: 12px;
        border-radius: 8px;
    }
    .payment-history-row .payment-history-cell {
        padding: 6px 12px;
    }
    .payment-history-row .payment-history-cell:first-child {
        border-radius: 8px 8px 0 0;
        padding: 8px 12px 0;
        color: var(--color-gray-dark);
        font-size: 12px;
    }
    .payment-history-row .payment-history-cell:last-child {
        border-radius: 0 0 8px 8px;
    }
    .information-list__item-head::after {
        background-image: url(../images/information-mobile.svg);
        transition: 100ms ease-in-out;
    }
    .information-list__item.active .information-list__item-head::after {
        transform: rotate(45deg);
    }
    .information-list.hide {
        display: none !important;
    }
    .information-container {
        display: none !important;
    }
    .information-container.active {
        display: flex !important;
    }
    .information-list__item, .information-list {
        width: 100%;
    }
}

@media (max-width: 380px) {
    .header-buttons {
        gap: 16px;
    }
    .modal {        
        padding: 32px 16px;
    }
    .main-grid__item.favorite, .main-grid__item.favorite img {
        width: 140px;
        min-height: auto;
    }
    .empty-container .title {
        max-width: 260px;
    }
    .catalog-nav-list.mobile {
        width: 306px;
    }
    .catalog-nav-list.mobile .catalog-nav-list__item {
        width: 140px;
        min-width: 140px;
        height: 160px;
    }
    .profile-order-block__item .block-img img, .profile-order-block__item .block-img .more-products {
        width: 70px;
    }
    .profile-order-block__item .block-img {
        max-height: 70px;
    }
    .profile-order-block__item .block-text {
        display: flex;
        flex-direction: column;
    }
    .profile-order-block__item .block-text .status {
        margin: 6px 0;
    }
}
@media (max-width: 350px) {
    .subcatalog-products .main-grid__item {
        max-width: 136px;
        min-width: auto;
    }
}
/* Fixed */
.item-list_img-wrap {
    width: 100%;
    height: auto;
    max-height: 100%;
}

.item-list_img-wrap .product-image-wrapper {
    width: 100%;
    position: relative;
    height: 0px;
    padding-top: 100%;
    overflow: hidden;
}

.item-list_img-wrap img {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: auto;
    min-height: 0px;
}

.brand-img {
    max-height: 120px;
}

.overlay-progressbar {
    display: none;
    font-weight: bold;
    position: fixed;
    left: 10%;
    z-index: 1005;
    width: 80%;
    text-align: center;
    top: 0;
    height: 100%;
    background: var(--color-white);;
}

#overlay-no-preloader {
    z-index: 1000;
    top: 0;
    width: 100%;
    height: 100%;
    position: fixed;
    opacity: 0.6;
    display: none;
    background-color: var(--color-dark);;
    color: var(--color-white);
}

.passwordAlert.error {
    color: var(--color-red);
}

.passwordAlert.success {
    color: var(--color-green);
}

.use_friend_login,
.catalog-nav-list .block {
    display: none;
}

.primary-button.fill[disabled] {
    background: var(--color-gray);
    border: 1px solid var(--color-gray);
}

.catalog-nav-list .block.active {
    display: block;
    max-height: 80vh;
    overflow-y: auto;
}

.catalog-nav-list .catalog-nav-list__item.mediumL {
    transition: 260ms ease-in-out;
}

.catalog-nav-list .catalog-nav-list__item.mediumL:hover,
.catalog-nav-list .catalog-nav-list__item.mediumL.active {
    font-family: var(--font-bold);
    font-size: 20px;
    line-height: 28px;
    letter-spacing: -0.4px;
}

.catalog-nav-list__item.mediumL.active img {
    display: block!important;
}

.mobile .subcatalog-sorting {
    position: relative;
    height: 34px;
    width: 50%;
}

.mobile .subcatalog-sorting .search-click {
    width: 100%;
}

.search-click {
    border: 0;
    cursor: pointer;
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
    outline: 0;
}

.subcatalog-sorting:after {
    content: '';
    background-image: url(../images/sorting-icon.svg);
    background-repeat: no-repeat, repeat;
    display: block;
    width: 24px;
    height: 24px;
}

.subcatalog-header.mobile .subcatalog-sorting:after {
    display: none;
}

.custom-control .ling-group,
.custom-control .ling-group-all {
    list-style: none;
    display: flex;
    align-items: center;
    justify-content: space-around;
}

.filter-input-reset,
.link-reset,
.link-reset-all {
    border-bottom: 1px dotted;
}

.checkbox-primary.toogle.hidden,
.custom-control.toogle.hidden{
    display: none;
}

.filter-form {
    gap: 32px;
}

.product-view-img-list__item {
    position: relative;
}

.product-view-img-list__item a {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
}

.product-view-img-list__item .js-product-slide-video {
    position: absolute;
}

.config_image {
    display: inline-block;
    height: 60px;
    width: 60px;
}

.config_image img {
    height: 100%;
}

.image-background-responsive {
    background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
}

.js-product-configurator-image-no-padding {
    padding: 0;
    line-height: 0;
    overflow: hidden;
}

.disabled {
    opacity: 0.3;
    border: 1px dashed !important;
}

.product-view-block-list__item.active a {
    box-shadow: inset 0px 0px 0px 2px var(--color-primary);
}

.product-info-nav .nav-link {
    padding: 0;
    border-left: 0;
    border-top: 0;
    border-right: 0;
}

.nav-tabs.product-info-nav {
    border: 0;
}

.nav-tabs.product-info-nav  .nav-link.active h4 {
    color: var(--color-dark);
    /*border-bottom: 1px solid var(--color-dark);*/
}

.productQuantity {
    border: 0;
    width: 30px;
    text-align: center;
}

.productQuantity:focus-visible {
    outline: none;
}

.modal.confirmDialog {
    display: none;
    position: fixed;
    padding: 0;
    margin: unset;
    background: transparent;
    width: 100%;
    height: 100%;
}

.modal-open {
    overflow: hidden;
}

.modal.confirmDialog .product-info,
.modal.confirmDialog .product-basket-container:last-child,
.modal.confirmDialog [data-full-info-block="MostPopularVendorItems16"]{
    display: none;
}

button.close-modal {
    background-color: transparent;
    border: 0;
}

.product-total_cost {
    display: flex;
}

.product-descriptions img {
    max-width: 100%;
}

.nav-tabs {
    border-bottom: 0;
    justify-content: flex-start;
    gap: 24px;
}

.nav-tabs .nav-link {
    border: 0;
    padding: 0 0 10px 0;
}

.nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active {
    border-bottom: 1px solid;
}

.fade:not(.show) {
    display: none;
}

.old-price {
    text-decoration: line-through;
    color: #ccc;
    font-weight: normal;
    font-size: 12px;
}

.js-basket-btn-favorite-item,
.js-basket-btn-delete-item {
    cursor: pointer;
}

.list-cart__panel-col-right {
    font-family: var(--font-bold);
}

.js-basket {
    position: relative;
}

.overlay-progressbar {
    display: none;
    font-weight: bold;
    position: fixed;
    left: 10%;
    z-index: 1005;
    width: 80%;
    text-align: center;
    top: 0;
    height: 100%;
    background: rgba(0, 0, 0, 0);
}
.overlay-progressbar .progressbar-inner-wrapper {
    position: absolute;
    width: 80%;
    left: 10%;
    top: 50%;
    transform: translateY(-50%);
    background: #fff;
    box-shadow: 0 0 55px 75px #fff;
}

#overlay {
    height: 100%;
    width: 100%;
    position: fixed;
    top: 0;
    left: 0;
    opacity: 0.5;
    display: none;
    background: #fff url(../../../../i/ajax-loader.gif) center center no-repeat;
    z-index: 1000;
}

#fromdate,
#todate {
    border: 0;
    padding: 0;
    outline: 0;
}

.profile-adress-storage .grid p strong {
    display: block;
    color: var(--color-gray-dark);
}

.nav-link {
    color: var(--color-gray);
}

.nav-tabs .nav-link.active {
    color: var(--color-dark);
}

#order-delivery-form #modal-add-recipient,
#modal-add-parcel {
    left: 0;
    top: 0;
}

.invalid .field,
.select-primary.invalid {
    border-color: var(--color-red);
}

.add-mail-container {
    border: 1px solid var(--color-gray);
    padding: 12px;
    border-radius: 8px;
}
.primary-button.pol {
    border: none;
    background-color: transparent;
    border: none;
    padding: 0;
    color: var(--color-primary);
}

.header-buttons__item img {

    pointer-events: none;

}