:root {
    --primary: #2A9B9B;
    --secondary: #1D7777;
    --semi-dark: #4D6174;
    --semi-gray: #73889C;
}
a{
    outline: none;
}
#app,
body {
    min-height: 100vh;
    overflow-x: hidden;
}
#app {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
}
.no-scroll{
    overflow: hidden;
}
.content {
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
}
button{
    outline: none;
}
.btn{
    background: none;
    border: none;
    cursor: pointer;
    color: var(--primary);
    text-align: center;
    display: flex;
    width: 100%;
    height: 47px;
    align-items: center;
    justify-content: center;
    transition: all ease-in-out 0.2s;
    margin-top: 15px;
    font-size: 15px;
    text-decoration: none;
}
.btn-full{
    background: var(--primary);
    color: #fff!important;
}
.btn-full:hover{
    background: var(--secondary);
}
.btn-white{
    background: #fff;
}
.btn.btn-outline{
    background: none;
    border: 2px solid var(--primary);
}
.btn.btn-outline:hover{
    background: var(--primary);
    color: #fff;
}
.btn-white.btn.btn-outline{
    background: none;
    border: 2px solid #fff;
    color: #fff;
}
.btn-white.btn.btn-outline:hover{
    background: #fff;
    color: #2A7B9B!important;
}
.btn-table{
    display: table;
    width: auto;
    padding: 0 40px;
}
.btn-flex{
    display: inline-flex;
    width: auto;
    padding: 0 40px;
}
.btn-small{
    height: 30px;
    font-size: 13px;
}
.radius-5{
    border-radius: 5px;
}
body {
    font-family: Roboto, Arial, sans-serif;
    font-size: 15px;
    margin: 0;
    padding: 0;
}
.main-menu-bl{
    background-color: var(--primary);
}
.main-menu ul{
    margin: 0;
    padding: 0;
    list-style: none;
}
.main-menu ul li{
    display: inline-flex;
}
.main-menu ul li a{
    display: flex;
    height: 50px;
    align-items: center;
    color: #fff;
    font-size: 17px;
    padding: 0 15px;
    text-decoration: none;
    transition: all ease-in-out 0.2s;
}
.main-menu ul li.active a,
.main-menu ul li a:hover{
    background-color: var(--secondary);
}
.breadcrumb {
    display: flex;
    flex-wrap: wrap;
    list-style: none;
    padding: 0;
    margin: 30px 0 0;
    font-size: 13px;
    line-height: 1.5;
    color: #818181;
}

.breadcrumb li {
    display: flex;
    align-items: center;
    margin-right: 5px;
    white-space: normal; /* позволяет перенос слов внутри */
}

.breadcrumb .divider {
    margin: 0 5px;
    color: #818181;
}

.breadcrumb a {
    color: #818181;
    text-decoration: none;
}

.breadcrumb a:hover {
    text-decoration: underline;
}

.breadcrumb .active .last {
    color: #B2B2B2;
    font-weight: normal;
}

/* Убираем лишние отступы у последнего элемента */
.breadcrumb li:last-child {
    margin-right: 0;
}
header{
    flex: 0 0 auto;
}
.header{
    padding: 15px 0;
}
.search-input{
    background-color: #F8F9FA;
    border: 1px solid #F3F3F3;
    border-radius: 3px;
    position: relative;
}
.search-input input{
    background: none;
    border: none;
    outline: none;
    width: 100%;
    height: 38px;
    padding: 0 40px 0 15px;
}
.search-input .search-submit-btm{
    background: none;
    border: none;
    outline: none;
    cursor: pointer;
    position: absolute;
    right: 3px;
    line-height: 1;
    top: 5px;
}
.search-input .search-submit-btm svg{
    fill: #A6ADB3;
}
.top-search-result-box{
    display: none;
}
.top-search-form{
    position: relative;
}
.top-search-result-box{
    display: none;
    position: absolute;
    top: 100%;
    width: 100%;
    background-color: #fff;
    -webkit-box-shadow: 0 0 12px rgba(0, 0, 0, .1);
    box-shadow: 0 0 12px rgba(0, 0, 0, .1);
    z-index: 99;
    border-radius: 5px;
}
#search-results{
    width: 100%;
    max-height: 300px;
    overflow-y: auto;
    margin: 0;
    padding: 0;
    list-style: none;
}
#search-results li{
    margin-bottom: 5px;
    padding: 5px 15px 8px;
}
#search-results li:hover{
    background-color: #fcfcfc;
}
#search-results li a{
    color: #000;
    border-bottom: 1px dashed #000;
    font-size: 14px;
}
#search-results li a:hover{
    color: var(--primary);
    border-color: var(--primary);
}
#show-all-results {
    display: table;
    margin: auto;
    color: var(--primary);
}
.top-search-result-box-bottom{
    padding: 8px 0;
    -webkit-box-shadow: 0 0 12px rgba(0, 0, 0, .1);
    box-shadow: 0 0 12px rgba(0, 0, 0, .1);
}
.search-page-search-box {
    margin-bottom: 30px;
}
.search-page-search-box input {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    height: 40px;
    outline: none;
    padding: 14px 20px;
    border-radius: 5px;
    border: 1px solid #ccc;
}
.search-page-search-box .button {
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    width: auto;
    max-width: 100%;
    margin-left: 12px;
    height: 40px;
    background: var(--primary);
    color: #fff;
    border: none;
    cursor: pointer;
    padding: 0 30px;
    border-radius: 5px;
}
.search-page .search-result-list{
    padding: 0;
    margin: 0;
    list-style: none;
}
.search-page .search-result-list li{
    margin-bottom: 15px;
}
.search-page .search-result-list li a{
    color: var(--primary);
}
.bottom-mobile-nav{
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    z-index: 9;
    background: #fff;
    box-shadow: 0 -4px 10px rgba(34,45,74,.1);
    padding: 10px 0;
}
.header__burger {
    display: block;
    position: relative;
    width: 1.5rem;
    height: 1.125rem;
    border-bottom: .125rem solid #475e71;
    -webkit-transition: border-bottom-color .3s ease;
    -o-transition: border-bottom-color .3s ease;
    transition: border-bottom-color .3s ease;
    cursor: pointer;
}
.header__burger::before, .header__burger::after {
    content: "";
    position: absolute;
    left: 0;
    width: 100%;
    height: .125rem;
    background-color: #475e71;
    -webkit-transition: background-color .3s ease,-webkit-transform .3s ease;
    -o-transition: transform .3s ease,background-color .3s ease;
    transition: transform .3s ease,background-color .3s ease,-webkit-transform .3s ease;
}
.header__burger::after {
    top: 50%;
}
.header-phones,
.header-whatsapp{
    padding-left: 30px;
    position: relative;
}
.header-whatsapp::before{
    position: absolute;
    content: "";
    top: 0;
    left: 0;
    background-image: url("../images/icons/whatsapp-icon.svg");
    background-repeat: no-repeat;
    width: 18px;
    height: 18px;
}
.header-phones::before{
    position: absolute;
    content: "";
    top: 0;
    left: 0;
    background-image: url("../images/icons/phone-icon.svg");
    background-repeat: no-repeat;
    width: 18px;
    height: 18px;
}
.header-phones .title,
.header-whatsapp .title{
    margin: 0 0 10px;
    font-size: 13px;
    color: var(--semi-gray);
}
.header-phones a,
.header-whatsapp a{
    color: #62717E;
    font-size: 14px;
    font-weight: 600;
    text-decoration: none;
}
.header-phones .phones{
    position: relative;
}
.header-phones .main-phone a{
    position: relative;
    padding-right: 20px;
}
.header-phones .main-phone a::after{
    position: absolute;
    content: "";
    top: 2px;
    right: 0;
    background-image: url("../images/icons/carret-wown-icon.svg");
    background-repeat: no-repeat;
    width: 10px;
    height: 10px;
}
.header-phones .phones .expand-phones{
    display: none;
    position: absolute;
    top: 0;
    left: -30px;
    width: calc(100% + 30px);
    background: #fff;
    padding: 0 15px;
    box-shadow: 0 0 10px rgba(0,0,0,.2);
    z-index: 2;
    border-radius: 4px;
}
.header-phones .phones:hover .expand-phones{
    display: block;
}
.lang-switch{
    position: relative;
    padding: 5px 12px 5px 15px;
    background: #ECF3FE;
    border-radius: 5px;
}
.lang-switch .current-lang{
    position: relative;
    cursor: pointer;
    padding-right: 13px;
    font-size: 15px;
    font-weight: 700;
    color: #666;
    max-width: 40px;
}
.lang-switch .current-lang::after{
    position: absolute;
    content: "";
    top: 5px;
    right: 0;
    width: 7px;
    height: 7px;
    border-right: 1px solid #777;
    border-bottom: 1px solid #777;
    transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
}
.lang-switch ul{
    display: none;
    list-style: none;
    margin: 0;
    padding: 5px 12px 5px 15px;
    width: 100%;
    background-color: #fff;
    border-radius: 0 0 5px 5px;
    box-shadow: 0 0 15px rgba(0,0,0,0.1);
}
.lang-switch ul.active{
    display: block;
    position: absolute;
    top: 25px;
    left: 0;
    z-index: 2;
}
.lang-switch ul li a{
    font-size: 15px;
    text-decoration: none;
    color: #555;
    display: block;
    padding: 3px 0;
}
.header-link-btn{
    text-decoration: none;
    color: #73889C;
    font-size: 13px;
    display: table;
    margin: auto;
}
.header-link-btn .icon{
    display: block;
    text-align: center;
    margin-bottom: 5px;
    position: relative;
}
.header-link-btn .count_cart_products,
.favorites-link .count_favourites {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background: #ff4141;
    position: absolute;
    top: -2px;
    right: -7px;
    color: #fff;
    font-size: 10px;
    font-style: normal;
    font-weight: 800;
    line-height: 10px;
    box-shadow: 0 4px 10px rgba(34, 45, 74, 0.2);
}
.header-link-btn .icon svg{
    height: 22px;
}
.header-link-btn .icon svg path{
    color: var(--primary);
    stroke: var(--primary);
}
.header-link-btn .name{
    display: block;
}
.icon-account-wrapper{
    display: table;
    height: 22px;
    width: 22px;
    padding: 2px;
    margin: auto;
    background: #ECF3FE;
    border-radius: 50%;
}
.icon-account-wrapper svg{
    height: 18px!important;
    fill: var(--primary);
}
.module-brands{
    margin-bottom: 40px;
}
.module-brands .list-brands{
    align-items: center;
}
.module-brands .brand-item{
    max-height: 50px;
    display: flex;
    margin-top: 15px;
    margin-bottom: 15px;
}
.module-brands .brand-item img{
    object-fit: contain;
}
.list-products .product-col{
    margin-bottom: 30px;
}
.list-products .product-item{
    border: 1px solid #EAEAEA;
    border-radius: 10px;
    padding: 15px;
    display: flex;
    flex-direction: column;
    box-shadow: 0 0 10px rgba(0,0,0,0);
    transition: all 0.3s;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    height: 100%;
}
.list-products .product-item:hover{
    box-shadow: 0 0 10px rgba(0,0,0,.2);
}
.list-products .image {
    margin-bottom: 20px;
    flex: 0 0 auto;
}
.list-products .image a {
    display: block;
    text-decoration: none;
    position: relative;
    width: 100%;
    padding-top: 58.39%;
}
.list-products .image a span {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
}
.list-products .image a img {
    object-fit: contain;
    width: 100%;
    height: auto;
}
.list-products .product-title{
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
}
.list-products .product-title a {
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    overflow: hidden;
    margin-top: 15px;
    text-decoration: none;
    font-size: 15px;
    color: var(--semi-dark);
    min-height: 54px;
}
.list-products .product-price {
    margin-top: 15px;
    flex: 0 0 auto;
}
.list-products .product-price .price {
    font-size: 20px;
    color: var(--semi-dark);
    font-weight: 700;
}
.list-products .product-button-link {
    margin-top: 15px;
    flex: 0 0 auto;
}
.list-products .product-button-link  a{
    display: block;
    line-height: 38px;
    border-radius: 19px;
    color: #fff;
    text-align: center;
    font-weight: 700;
    background: var(--primary);
    text-decoration: none;
}
.module-doctors .show-more,
.module-articles .show-more,
.module-products .show-more{
    text-align: center;
}
.module-products,
.module-steps{
    margin-bottom: 40px;
}
.module-steps .wrapper{
    background: #F5F6FA;
    border-radius: 10px;
    padding: 30px;
}
.module-doctors .h3-title,
.module-articles .h3-title,
.module-products .h3-title,
.module-brands .h3-title,
.module-steps .h3-title {
    text-align: center;
    font-size: 22px;
    color: var(--semi-dark)!important;
    margin-bottom: 40px!important;
}
.module-articles{
    background: #f5f6fa;
    padding: 40px 0;
    margin: 40px 0;
}
.module-articles .card-col{
    margin-bottom: 30px;
}
.module-articles .item-article{
    background: #fff;
    border-radius: 10px;
    padding: 15px;
    height: 100%;
}
.module-articles .item-article .title{
    padding-top: 15px;
}
.module-articles .item-article .title a{
    text-decoration: none;
    color: var(--semi-dark);
}
.module-articles .item-article:hover .title a{
    color: var(--semi-gray);
}
.module-articles .show-more{
    margin-top: 20px;
}
.module-brands .h3-title{
    text-align: left;
}
.module-steps .step-col {
    text-align: center;
    position: relative;
}
.module-steps .step-col::before,
.module-steps .step-col::after {
    position: absolute;
    content: "";
    display: block;
    top: 24px;
    width: calc(50% - 60px);
    border-top: 1px solid #C5D0E2;
}
.module-steps .step-col::before{
    left: 0;
}
.module-steps .step-col::after{
    right: 0;
}
.module-steps .step-col:first-child::before,
.module-steps .step-col:last-child::after {
    display: none;
}
.module-steps .step {
    background-color: var(--primary);
    color: #fff;
    display: table;
    font-weight: 600;
}
.module-steps .text {
    font-size: 15px;
    color: var(--semi-gray);
}
.module-list-media .col-item{
    margin-bottom: 30px;
}
.container-video {
    position: relative;
    padding-top: 61%;
    cursor: pointer;
}
.image-wrapper {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
}
.image-wrapper img {
    display: block;
    width: 100%;
    height: auto;
    border-radius: 8px; /* опционально, если хочешь скругления */
}
.play-button {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 60px;
    height: 60px;
    background: rgba(0, 0, 0, 0.6); /* тёмный полупрозрачный фон */
    border-radius: 50%;
    cursor: pointer;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: background 0.3s ease;
}
.play-button::before {
    content: '';
    width: 0;
    height: 0;
    border-left: 16px solid white; /* треугольник */
    border-top: 10px solid transparent;
    border-bottom: 10px solid transparent;
    margin-left: 3px; /* немного смещаем треугольник для выравнивания */
}
.container-video:hover .play-button {
    background: var(--primary); /* затемнение при наведении */
}
.module-doctors{
    margin: 40px 0;
}
.blog-post-page .page-body{
    margin-top: 30px;
}
.blog-post-page .title-header{
    color: var(--semi-dark);
}
.article-sidebar{
    width: 350px;
}
.other-articles-list .h3-title{
    color: var(--semi-dark);
    text-transform: uppercase;
    margin-bottom: 20px;
    font-weight: 600;
}
.other-articles-list ul{
    padding: 0!important;
    margin: 0;
    list-style: none;
}
.other-articles-list ul li{
    margin-top: 20px;
}
.other-articles-list ul a{
    text-decoration: none;
    color: var(--semi-dark);
    display: block;
}
.other-articles-list ul a:hover{
    color: #000;
}
.other-articles-list .date{
    font-size: 12px;
    display: block;
    color: var(--semi-gray);
    margin-top: 7px;
}
.blog-articles-page .post-item{
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    height: 100%;
    overflow: hidden;
    background: #FFF;
    -webkit-box-shadow: 1px 10px 9px rgba(0,0,0,.15);
    box-shadow: 1px 10px 9px rgba(0,0,0,.15);
    border-radius: 10px;
    color: #000;
}
.blog-articles-page .post-item .post-item__text {
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    padding: 18px 15px 15px;
}
.blog-articles-page .post-item .post-item__title a{
    margin-bottom: 14px;
    font-weight: 600;
    font-size: 15px;
    -webkit-transition: all .35s;
    transition: all .35s;
    text-decoration: none;
    color: var(--semi-dark);
}
.blog-articles-page .post-item:hover .post-item__title a{
    color: #000;
}
.main-text{
    color: var(--semi-dark);
    margin: 40px 0;
}
.main-text h2,
.main-text h3{
    font-weight: 600;
}
.title-header{
    color: var(--primary);
    font-size: 25px;
    font-weight: 700;
    margin: 20px 0 20px;
}
.page-body{
    color: var(--semi-dark);
}
.page-body h2{
    font-size: 20px;
    margin: 25px 0 20px;
    font-weight: 700;
}
.page-body ol,
.page-body ul{
    padding-left: 40px;
}
.page-body ol li,
.page-body ul li{
    margin-bottom: 7px;
}
.brand-page .description-box,
.brand-page .text-box{
    font-size: 15px;
    color: var(--semi-gray);
}
.header-title{
    color: var(--semi-dark);
    font-size: 25px;
    font-weight: 700;
    margin: 20px 0;
}
.allow-checkout-text{
    display: none;
    background: #fff4f4;
    padding: 5px 15px;
    border-radius: 10px;
    color: var(--semi-dark);
}
.allow-checkout-text a{
    color: var(--primary);
}
a.disabled{
    opacity: .7;
}
.cart-page h3{
    color: var(--semi-dark);
    font-size: 18px;
    margin: 20px 0;
}
.cart-page .cart-products .cart-item{
    margin-bottom: 20px;
}
.cart-page .cart-products .cart-item .cart-product-title a{
    text-decoration: none;
    color: var(--primary);
    font-weight: 600;
}
.cart-page .cart-products .cart-item .product-options{
    color: var(--semi-dark);
    font-size: 12px;
    padding-top: 7px;
}
.cart-page .cart-products .cart-item .product-sum{
    font-weight: 600;
    min-width: 80px;
}
.cart-page .cart-products .cart-item .product-qty-box{
    font-size: 12px;
    color: var(--semi-gray);
    margin-bottom: 2px;
}
.cart-page .btn-cart-item-delete{
    background: none;
    color: red;
    border: none;
    cursor: pointer;
    outline: none;
}
.cart-page .cart-total{
    font-size: 22px;
    font-weight: 700;
    letter-spacing: .5px;
    color: #4e6073;
    text-align: left;
    margin-bottom: 20px;
    min-width: 200px;
}
.confirm-btn-cart-box button,
.cart-bottom a{
    align-items: center;
    justify-content: center;
    background-color: var(--primary);
    border: 0;
    border-radius: 21px;
    color: #fff;
    text-decoration: none;
    transition: .15s;
}
.confirm-btn-cart-box button:hover,
.cart-bottom a:hover{
    background-color: var(--secondary);
}
.sidebar{
    width: 290px;
}
.sidebar .title-h3{
    font-size: 17px;
    font-weight: 600;
    color: #4D6174;
    margin-bottom: 15px;
}
.menu-brands ul{
    margin: 0;
    padding: 0;
    list-style: none;
}
.menu-brands ul li{
    padding: 5px 0;
}
.menu-brands ul li a{
    color: var(--semi-gray);
    text-decoration: none;
    transition: all 0.3s;
}
.menu-brands ul li a:hover,
.menu-brands ul li.active a{
    color: var(--primary);
}
.discount-info-box{
    background: #F5F6FA;
    padding: 15px;
    border-radius: 10px;
    margin-bottom: 15px;
    color: var(--semi-dark);
}
.product-category-page h1{
    color: var(--semi-dark);
    font-size: 25px;
    font-weight: 700;
    margin: 20px 0 40px;
}
.product-category-page .brand-products-area .list-item{
    box-shadow: 0 0 10px rgba(0,0,0,.06);
    padding: 30px 30px 0;
    border-radius: 10px;
    margin-bottom: 30px;
}
.product-category-page .brand-products-area .list-item .brand-name a{
    font-size: 20px;
    font-weight: 600;
    color: var(--primary);
    text-decoration: none;
}
.product-category-page .brand-products-area .list-item .brand-name a span{
    color: var(--semi-dark);
}
.product-category-page .brand-products-area .list-item .item-short-text{
    font-size: 15px;
    color: #73889C;
}
.product-category-page .brand-products-area .list-item .brand-logo img{
    height: 23px;
    width: auto;
}
.product-category-page .brand-products-area .list-item  .brand-products {
    margin-top: 15px;
}
.product-category-page .brand-products-area .list-item  .brand-products .product-item{
    margin-bottom: 30px;
}
.product-category-page .brand-products-area .list-item  .brand-products .product-item a{
    display: block;
    text-decoration: none;
    position: relative;
    width: 100%;
    padding-top: 58.39%;
}
.product-category-page .brand-products-area .list-item  .brand-products .product-item a span{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    border: 1px solid #EEEEEE;
}
.product-category-page .brand-products-area .list-item  .brand-products .product-item a img{
    object-fit: contain;
    width: 100%;
    height: auto;
}
.filter-btn{
    cursor: pointer;
    background-color: var(--primary);
    border: none;
    border-radius: 5px;
    color: #fff;
    padding: 5px 15px;
    display: flex;
    align-items: center;
    outline: none;
    margin-bottom: 15px;
}
.filter-btn span{
    padding-left: 10px;
}
.filter-box{
     width: 290px;
    background: #F5F6FA;
    border-radius: 10px;
    padding: 15px;
}
.filter-box .filter-item-box{
    margin-bottom: 15px;
}
.filter-box .field-header{
    font-weight: 600;
    color: #4D6174;
    margin-bottom: 15px;
    margin-top: 20px;
}
.filter-box .filter-price input {
    display: block;
    background: #fff;
    border: none;
    border-radius: 3px;
    color: #4D6174;
    padding: 8px 10px;
    outline: none;
}
.filter-price .f-title{
    margin-top: 0;
}
.filter-box .price-track-box{
    margin-top: 20px;
}
#slider-range{
    background-color: var(--primary)!important;
}
.ui-widget.ui-widget-content {
    border: 1px solid var(--primary)!important;
}
.ui-widget-header{
    background: var(--primary)!important;
}
.ui-slider-horizontal {
    height: 3px!important;
}
.ui-slider-horizontal .ui-slider-handle.handle-left::before {
    display: none;
}
.ui-slider-horizontal .ui-state-active,
.ui-slider-horizontal .ui-state-default,
.ui-slider-horizontal .ui-state-default:hover{
    border: 3px solid var(--primary)!important;
    width: 13px!important;
    height: 13px!important;
    border-radius: 50%!important;
    background: #fff!important;
    outline: none;
}
.ui-slider-horizontal .ui-slider-handle {
    top: -6px!important;
}
.filter-fields-box .field-value{
    margin-bottom: 10px
}
.filter-fields-box .field-value.muted{
    opacity: .5;
}
.filter-fields-box .field-value label{
    display: flex;
    align-items: center;
    cursor: pointer
}
.filter-fields-box .filter-field-value-checkbox{
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    flex: 0 0 18px;
    width: 18px;
    height: 18px;
    border: 2px solid #8EA2B4;
    border-radius: .25em;
    outline: 0 !important;
    background: none;
    margin: 0 !important;
    cursor: pointer;
}
.filter-fields-box .filter-field-value-checkbox:checked{
    background-color: var(--primary);
    border-color: var(--primary);
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3e%3cpath fill='%23fff' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z'/%3e%3c/svg%3e");
    opacity: 1 !important;
    background-size: 10px 10px;
    background-repeat: no-repeat;
    background-position: center center;
}
.filter-fields-box .field-value .field-value-title{
    padding-left: 10px;
    font-size: 13px;
    color: #777;
}
.filter-box .fltr_count_products {
    font-size: 10px;
    background-color: var(--primary);
    color: #fff;
    margin-left: 10px;
    padding: 3px 5px;
    border-radius: 8.55px;
    line-height: 11px;
}
.filter-buttons-box{
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}
.reset-form {
    background-color: var(--semi-dark);
    color: #fff;
    display: table;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    width: auto;
    max-width: 100%;
    margin-right: 10px;
    padding: 7px 15px;
    border-radius: 3px;
    text-decoration: none;
    font-size: 13px;
}
.result-filter-link{
    background-color: var(--primary);
    color: #fff;
    -ms-flex-preferred-size: 0;
    flex-basis: 0;
    -ms-flex-positive: 1;
    flex-grow: 1;
    max-width: 100%;
    text-align: center;
    padding: 7px 15px;
    border-radius: 3px;
    text-decoration: none;
    font-size: 13px;
}
.filter_count_products{
    font-size: 12px;
}
nav ul.pagination {
    padding: 0;
    list-style: none;
    display: flex;
    align-items: center;
}
nav ul.pagination li {
    margin-bottom: 0;
    margin-left: 2px;
    margin-right: 2px;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    width: auto;
    max-width: 100%;
}
nav ul.pagination li a {
    text-decoration: none;
    color: #555;
    position: relative;
    transition: .5s;
}
nav ul.pagination li .page-link-c {
    align-self: center;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    height: 37px;
    width: 37px;
    text-decoration: none;
    color: #555;
    font-family: Rotonda, Arial, sans-serif;
    position: relative;
}
nav ul.pagination li.active span {
    background-color: #adb5ca;
    color: #fff;
}
nav ul.pagination .page-link-f span {
    font-size: 14px;
    font-weight: 400;
}
nav ul.pagination .arrow.next {
    transform: rotate(90deg);
    margin-left: 10px;
}
nav ul.pagination .arrow.prev {
    transform: rotate(-90deg);
    margin-right: 10px;
}
nav ul.pagination .arrow {
    display: inline-block;
    background: url("data:image/svg+xml,%3Csvg%20width%3D%2216%22%20height%3D%2216%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M7.361.238a.977.977%200%20011.278%200l7.097%206.377a.755.755%200%20010%201.147.977.977%200%2001-1.278%200L8%201.96%201.542%207.762a.977.977%200%2001-1.277%200%20.755.755%200%20010-1.147L7.36.238z%22%20fill%3D%22%23000%22%2F%3E%3Crect%20width%3D%222%22%20height%3D%2216%22%20rx%3D%221%22%20transform%3D%22matrix(-1%200%200%201%209%200)%22%20fill%3D%22%23000%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;
    cursor: pointer;
    width: 11px;
    height: 11px;
    transition: .5s;
    position: relative;
    top: 1px;
}
nav ul.pagination .page-prev.disabled,
nav ul.pagination .page-next.disabled{
    display: none;
}
.swiper-wrapper{
    align-items: center;
}
.swiper-wrapper .swiper-slide,
.swiper-wrapper .swiper-slide a{
    display: flex;
    justify-content: center;
}
.product__slider__thumbs{
    margin-top: 15px;
}
.product__slider__thumbs .swiper-slide{
    border-radius: 5px;
    overflow: hidden;
    width: 100px!important;
    height: 100px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    cursor: pointer;
}
/* Картинка внутри превью */
.product__slider__thumbs .slider__image {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

/* Само изображение */
.product__slider__thumbs img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain; /* чтобы изображение влезало без обрезки */
}
.product__slider__thumbs .swiper-slide-thumb-active{
    border: 1px solid #F0F0F0;
}
.product-page .product-main-title{
    color: var(--primary);
    font-size: 25px;
    font-weight: 700;
    margin: 20px 0 40px;
}
.product-page .product-main-title span{
    color: var(--semi-dark);
}
.product-page .product-images-container{
    margin-bottom: 30px;
    margin-top: 20px;
}
.product-params-box{
    box-shadow: 0 0 25px 0 rgba(0, 0, 0, 0.07);
    padding: 30px;
}
.btn-add-to-favorites{
    background: none;
    border: none;
    cursor: pointer;
    line-height: 1;
}
.btn-add-to-favorites svg{
    width: 25px;
    height: 25px;
}
.btn-add-to-favorites svg path{
    color: #73889C;
}
.btn-add-to-favorites.inf svg path{
    color: var(--primary);
    fill: var(--primary);
}
.icon-comments{
    display: inline-flex;
    width: 15px;
    height: 15px;
}
.icon-comments svg{
    fill: #73889C;
}
.product-comment-rating-box{
    display: flex;
    align-items: center;
    flex: 0 0 auto;
}
.product-comment-rating-box .product-rating-value{
    color: var(--semi-gray);
    font-weight: 800;
    font-size: 13px;
    margin-left: 5px;
    margin-right: 10px;
}
.product-comment-rating-box .product-comments-count{
    color: var(--semi-gray);
    font-size: 13px;
    margin-left: 5px;
}
.gray-box{
    background-color: #F5F6FA;
    border-radius: 10px;
    padding: 20px;
    margin-bottom: 30px;
}
.gray-box .box-title{
    font-size: 15px;
    color: #73889C;
    margin-bottom: 15px;
}
.product-page .brand-logo img{
    height: 23px;
    width: auto;
}
.product-page .price-box .price{
    font-size: 24px;
    color: var(--semi-dark);
    font-weight: 700;
    margin-bottom: 15px;
}
.product-page .cart-button-box{
    padding-top: 20px;
}
.product-page .cart-button-box .box-title{
    font-size: 15px;
    color: #73889C;
    margin-bottom: 15px;
}
.total-sum-to-cart{
    text-align: center;
    margin-top: 15px;
    color: var(--semi-dark);
}
.total-sum-to-cart #total-sum-to-cart-value{
    font-size: 20px;
    font-weight: 600;
}
.btn-buy {
    background: none;
    border: none;
    cursor: pointer;
}
.product-page .price-box .btn-buy.btn-full{
    background: var(--primary);
    color: #fff;
    text-align: center;
    display: flex;
    width: 100%;
    height: 47px;
    align-items: center;
    justify-content: center;
    transition: all ease-in-out 0.3s;
    margin-top: 15px;
}
.product-page .price-box .btn-buy.btn-full:hover{
    background-color: var(--secondary);
}
.btn-buy svg{
    margin-right: 10px;
}
.payment-info ul{
    margin: 30px 0 0 0;
    padding: 0;
    list-style: none;
    display: flex;
    align-items: center;
}
.payment-info ul li{
    display: inline-flex;
    max-height: 25px;
}
.payment-info ul li img{
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
    height: auto;
}
.delivery-info .item{
    margin: 10px 0;
    font-size: 14px;
    color: var(--semi-gray);
}
.delivery-info .item .sub-title{
    display: flex;
    color: #F02020;
    font-size: 15px;
    align-items: center;
}
.delivery-info .item .sub-title .icon{
    width: 50px;
}
.delivery-info .item .sub-title .icon svg{
    fill: var(--primary);
}
.consultation-box{
    box-shadow: 0 0 25px 0 rgba(0, 0, 0, 0.07);
    padding: 30px;
    text-align: center;
}
.consultation-box .title{
    font-size: 17px;
    color: var(--semi-dark);
    font-weight: 700;
    margin-top: 30px;
}
.consultation-box .text{
    font-size: 14px;
    color: var(--semi-gray);
    margin-top: 20px;
}
.consultation-box .btn{
    margin-top: 30px;
}
.tabs {
    margin-top: 40px;
}

.tab-buttons {
    display: flex;
    border-bottom: 1px solid #ccc;
    margin-bottom: 10px;
}

.tab-button {
    background: none;
    border: none;
    border-bottom: 2px solid transparent;
    padding: 10px 16px;
    cursor: pointer;
    font-size: 16px;
    transition: all ease-in-out 0.2s;
    color: var(--semi-gray);
}

.tab-button:hover {
    border-bottom: 2px solid #aaa;
}

.tab-button.active {
    border-bottom: 2px solid var(--primary); /* зелёная граница */
    color: var(--semi-dark);
}

.tab-content {
    position: relative;
    padding-top: 5px;
    color: var(--semi-dark);
}
.tab-content ul li{
    margin-bottom: 7px;
}

.tab-pane {
    display: none;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.tab-pane.active {
    display: block;
    opacity: 1;
}
.fields .field-row:nth-child(odd) {
    background-color: #f9f9f9; /* светлый фон для нечётных */
}

.fields .field-row:nth-child(even) {
    background-color: #ffffff; /* белый фон для чётных (опционально) */
}

/* немного отступов и стилей, чтобы выглядело аккуратно */
.fields .field-row {
    padding: 8px 12px;
    border-bottom: 1px solid #eee;
}
.select-options {
    display: block;
    font-size: 14px;
    color: var(--semi-dark);
    cursor: pointer;
    line-height: 1.3;
    padding: .6em 1.4em .5em .8em; width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    margin: 0;
    border: 1px solid #ECECEC;
    box-shadow: 0 1px 0 1px rgba(0,0,0,.04);
    border-radius: 8px;
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
    background-color: #fff;
    background-image: url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22292.4%22%20height%3D%22292.4%22%3E%3Cpath%20fill%3D%22%23007CB2%22%20d%3D%22M287%2069.4a17.6%2017.6%200%200%200-13-5.4H18.4c-5%200-9.3%201.8-12.9%205.4A17.6%2017.6%200%200%200%200%2082.2c0%205%201.8%209.3%205.4%2012.9l128%20127.9c3.6%203.6%207.8%205.4%2012.8%205.4s9.2-1.8%2012.8-5.4L287%2095c3.5-3.5%205.4-7.8%205.4-12.8%200-5-1.9-9.2-5.5-12.8z%22%2F%3E%3C%2Fsvg%3E');
    background-repeat: no-repeat, repeat;
    background-position: right .7em top 50%, 0 0;
    background-size: .65em auto, 100%;
}
.select-options::-ms-expand { display: none; }
.select-options option { font-weight:normal; }
*[dir="rtl"] .select-css,
:root:lang(ar) .select-options,
:root:lang(iw) .select-options {
    background-position: left .7em top 50%, 0 0;
    padding: .6em .8em .5em 1.4em;
}
.select-options option:disabled {
    color: #999;
    background-color: #f8f9fa; /* светло-серый */
    opacity: 0.6;
}
.options__nav-tabs {
    display: flex;
    margin: 0 0 30px 0;
    padding: 0;
    list-style: none;
    position: relative;
}
.options__nav-tabs::before {
    position: absolute;
    content: "";
    height: 100%;
    width: 100%;
    top: 0;
    left: 0;
    border: 2px solid #E2E2E2;
    border-radius: 20px;
    z-index: -1;
}
.options__nav-tabs .options__nav-item {
    -ms-flex-preferred-size: 0;
    flex-basis: 0;
    -ms-flex-positive: 1;
    flex-grow: 1;
    max-width: 100%;
}

.options__nav-tabs .options__nav-link {
    display: flex;
    height: 40px;
    text-decoration: none;
    color: var(--semi-dark);
    background: none;
    border-radius: 20px;
    justify-content: center;
    align-items: center;
    transition: color 0.3s, border-color 0.3s;
    font-weight: 600;
}
.options__nav-tabs .options__nav-link.active {
    color: #fff;
    background: var(--primary);
    border-color: var(--primary);
}
.options__tab-content {
    position: relative;
}
.options__tab-pane {
    height: 0;
    overflow: hidden;
    opacity: 0;
    transition: opacity 0.9s ease;
}
.options__tab-pane.active {
    height: auto;
    opacity: 1;
}
.options__tab-pane .form-group{
    margin-bottom: 20px;
}
.options__tab-pane .form-group label,
.quantity-bl label{
    display: block;
    color: var(--semi-gray);
}
.options__tab-pane  .same-options,
.quantity-bl{
    display: flex;
}
.quantity-bl label,
.options__tab-pane .same-options label,
.options__tab-pane .same-options .select,
.quantity-bl .quantity-input-box,
.options__tab-pane .same-options .quantity-input-box{
    -ms-flex-preferred-size: 0;
    flex-basis: 0;
    -ms-flex-positive: 1;
    flex-grow: 1;
    max-width: 100%;
    align-content: center;
}
.options__tab-pane .different-options label{
    margin-bottom: 10px;
}
.quantity-input-box-wrapper{
    display: flex;
    max-height: 40px;
}
.quantity-input-box .qty-input{
    border: 1px solid #ECECEC;
    line-height: 1.3;
    font-size: 14px;
    text-align: center;
    padding: 7px 5px;
    color: var(--semi-dark);
    outline: none;
    max-width: 100px;
}
.quantity-input-box button{
    background: none;
    border: 1px solid #ECECEC;
    font-size: 20px;
    color: var(--primary);
    padding: 7px 20px;
    cursor: pointer;
    transition: background-color .2s;
}
.quantity-input-box button:hover{
    background-color: #fdfdfd;
}
.quantity-input-box .option-qty-minus{
    border-radius: 8px 0 0 8px;
    border-right: none;
}
.quantity-input-box .option-qty-plus{
    border-radius: 0 8px 8px 0;
    border-left: none;
}
.options__tab-pane .eye-name{
    font-weight: 600;
    margin-bottom: 15px;
    color: var(--semi-dark);
}
.options__tab-pane .alert-info{
    background-color: #fbfbfb;
    border-radius: 8px;
    padding: 15px;
    display: flex;
    font-size: 14px;
    color: var(--semi-gray);
}
.options__tab-pane .alert-info .icon{
    padding-right: 20px;
}
.options__tab-pane .alert-info .icon svg path{
    fill: var(--primary);
}
.discount-info{
    color: var(--semi-gray);
    font-weight: 600;
    margin-top: 15px;
}
.cart-r-col p {
    font-size: 13px;
    color: #777;
}
.cart-r-col form .form-control{
    margin-bottom: 10px;
}
.cart-r-col form .form-control label {
    display: block;
    font-weight: 700;
    font-size: 15px;
    color: #777;
    margin-bottom: 6px;
}
.cart-r-col form .form-control input,
.cart-r-col form .form-control textarea {
    border: 1px solid #e4e4e4;
    border-radius: 3px;
    background: 0 0;
    display: block;
    width: 100%;
    font-size: 18px;
    padding: 8px 10px;
    color: #777;
    outline: 0;
}
.cart-r-col form h3,
.cart-r-col h2 {
    font-weight: 700;
    letter-spacing: .5px;
    color: #4e6073;
    font-size: 17px;
    margin-bottom: 0;
}
.cart-r-col ul {
    list-style: none;
    padding: 0;
}
.branches li,
#payment_ul li,
#shipment_ul li {
    margin-bottom: 0 !important;
}
.branches li label,
#payment_ul li label,
#shipment_ul li label {
    display: block;
    padding: 3px 0;
    font-size: 15px;
    color: #777;
}
.order-create a{
    color: var(--primary);
}
.order-create .cart-total {
    font-weight: 800;
    border-top: 1px solid #eee;
    padding-top: 20px;
    margin-bottom: 20px;
    font-size: 20px;
}
.order-create .cart-total {
    font-weight: 600;
    font-size: 17px;
}
.order-create .delivery-note {
    margin-top: 10px;
    margin-bottom: 20px;
}
.cart-r-col form .error-form,
.list-products .product-card.open .btn-buy-small,
.rating-area:not(:checked) > input {
    display: none;
}
.error-form {
    color: red;
    font-size: 12px;
    display: none;
}
.rules-return-products{
    margin-top: 20px;
    background-color: #f5f6fa;
    border-radius: 8px;
    padding: 15px;
    display: flex;
    font-size: 14px;
    color: var(--semi-gray);
}
.rules-return-products .icon{
    padding-right: 20px;
    padding-top: 17px;
}
.rules-return-products .icon svg path {
    fill: red;
}
footer{
    margin-top: 40px;
    background-color: #F5F6FA;
    padding-top: 30px;
    font-size: 14px;
    flex: 0 0 auto;
}
footer .footer-logo{
    margin-bottom: 30px;
}
.contact-item{
    margin-bottom: 20px;
    font-size: 14px;
}
.contact-item .item-title{
    color: #A2ABB1;
    margin-bottom: 10px;
}
.contact-item .item-text{
    color: #555;
}
.contact-item .item-text p{
    margin: 7px 0;
}
.contact-item a{
    color: #555;
    font-weight: 600;
    text-decoration: none;
}
.footer-phones .note,
.expand-phones .note,
.contact-item .note{
    color: var(--semi-gray);
    font-size: 13px;
}
.mobile-nav{
    position: fixed;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: #fff;
    z-index: 999;
    transition: left ease-in-out .2s;
}
.mobile-nav.open{
    left: 0;
}
.close-btn {
    display: block;
    width: 20px;
    height: 20px;
    padding: 0;
    border: none;
    background-color: transparent;
    background-image: url(data:image/svg+xml;base64,PHN2ZyBpZD0i44Os44Kk44Ok44O8XzEiIGRhdGEtbmFtZT0i44Os44Kk44Ok44O8IDEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgdmlld0JveD0iMCAwIDI4MzQuNjUgMjgzNC42NSIgZmlsbD0iIzAwMCI+PHRpdGxlPmljb248L3RpdGxlPjxwYXRoIGQ9Ik0xNTc2LjQyLDE0MDYuNzYsMjc4NCwxOTkuMTlhNTYuODYsNTYuODYsMCwwLDAsMC04MC4xOGwtNzguOTItNzguOTJhNTYuODYsNTYuODYsMCwwLDAtODAuMTgsMEwxNDE3LjMyLDEyNDcuNjYsMjA5Ljc1LDQwLjA5YTU2Ljg2LDU2Ljg2LDAsMCwwLTgwLjE4LDBMNTAuNjUsMTE5YTU2Ljg2LDU2Ljg2LDAsMCwwLDAsODAuMThMMTI1OC4yMywxNDA2Ljc2LDUwLjY1LDI2MTQuMzRhNTYuODYsNTYuODYsMCwwLDAsMCw4MC4xOGw3OC45Miw3OC45MmE1Ni44Niw1Ni44NiwwLDAsMCw4MC4xOCwwTDE0MTcuMzIsMTU2NS44NiwyNjI0LjksMjc3My40NGE1Ni44Niw1Ni44NiwwLDAsMCw4MC4xOCwwbDc4LjkyLTc4LjkyYTU2Ljg2LDU2Ljg2LDAsMCwwLDAtODAuMThaIi8+PC9zdmc+);
    text-shadow: 0 1px 0 #555;
    color: #555;
    font-size: 30px;
    text-decoration: none;
    cursor: pointer;
    line-height: 1;
    position: absolute;
    top: 15px;
    right: 15px;
}
.mobile-menu-wrapper{
    padding: 15px;
    width: auto;
    display: table;
    margin: 40px auto 0;
}
.mobile-menu-wrapper .logo{
    text-align: center;
    margin-bottom: 40px;
}
.main-menu-mobile-bl li{
    display: block!important;
}
.main-menu-mobile-bl li a{
    color: var(--primary)!important;
    text-align: center;
    justify-content: center;
}
.main-menu-mobile-bl li.active a{
    color: #fff!important;
}
.main-menu-mobile-bl li a:hover{
    background-color: unset!important;
}
.color-yellow{
    color: #eadf3d;
}
.main-banner{
    margin-top: 15px;
    border-radius: 10px;
    padding: 40px 20px;
    background: #2A7B9B;
    background: linear-gradient(90deg,rgb(42, 155, 155) 51%, rgb(4, 58, 106) 100%, rgb(0, 0, 0) 100%);
}
.main-banner .title{
    color: #fff;
    font-size: 30px;
    font-weight: 600;
    text-transform: uppercase;
}
.main-banner .title-note{
    color: #fff;
}
.form-login{
    display: table;
    margin: auto;
    min-width: 300px;
}
.form-login h1{
    color: var(--semi-dark);
    font-size: 25px;
    font-weight: 700;
    margin: 20px 0;
}
.form-login .form-group{
    margin-bottom: 15px;
}
.form-login label{
    display: block;
    margin-bottom: 5px;
    color: var(--semi-gray);
    font-weight: 600;
}
.form-login .form-input{
    background: #fff;
    outline: none;
    display: block;
    border: 1px solid #e4e4e4;
    border-radius: 3px;
    padding: .7rem;
    width: 100%;
}
.form-login .remember_me label{
    display: flex;
    font-weight: normal;
}
.form-login .remember_me input{
    margin-right: 10px;
}
.form-login a{
    color: var(--primary);
    font-size: 14px;
    margin-right: 15px;
}
.form-login a:hover{
    text-decoration: none;
}
.form-login .error-box{
    background: #ffe2e2;
    padding: 10px;
    border-radius: 5px;
    color: var(--semi-dark);
}
.form-login .error-box ul{
    margin-bottom: 5px;
}
.ar-form{
    position: relative;
}
.ar-form .form-input-box{
    margin-bottom: 15px;
}
.ar-form .form-input-box input{
    background: #fff;
    outline: none;
    display: block;
    border: none;
    border-radius: 3px;
    padding: .7rem;
    width: 100%;
}
.ar-form .form-input-box textarea{
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border: none;
    border-radius: .125rem;
    color: #707070;
    display: block;
    font-size: 14px;
    outline: none;
    padding: 1rem;
    transition: all .2s ease-in;
    width: 100%;
    resize: none;
}
.ar-form .form-input-box label {
    display: block;
    color: #61717d;
    font-size: 14px;
    margin-bottom: 5px;
    font-weight: 600;
}
.ar-form .form-input-box label sup {
    color: red;
}
.ar-form .note {
    color: var(--semi-gray);
}
.ar-form .form-submit{
    display: table;
    margin: auto;
    margin: auto;
    border: none;
    background: var(--primary);
    color: #fff;
    padding: 10px 50px;
    cursor: pointer;
}
.success-message {
    position: absolute;
    top: 0;
    left: 0;
    display: none;
    height: 100%;
    z-index: 1;
    width: 100%;
}
.success-message .success-message-wrapper{
    background: rgb(255, 255, 255);
    display: flex;
    height: 100%;
    width: 100%;
    justify-content: center;
    align-items: center;
    text-align: center;
    padding: 40px;
    z-index: 1;
    font-size: 18px;
    color: #4f6682;
}
.process-message {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    background: rgba(255, 255, 255, 0.4);
    width: 100%;
    display: none;
}
.loader {
    width: 108px;
    height: 108px;
    border-radius: 50%;
    display: inline-block;
    position: absolute;
    border: 3px solid;
    border-color: var(--secondary) var(--secondary) transparent transparent;
    box-sizing: border-box;
    top: calc(50% - 54px);
    left: calc(50% - 54px);
    animation: rotation 1s linear infinite;
}
.loader::after,
.loader::before {
    content: '';
    box-sizing: border-box;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    border: 3px solid;
    border-color: transparent transparent #ed5037 #ed5037;
    width: 90px;
    height: 90px;
    border-radius: 50%;
    box-sizing: border-box;
    animation: rotationBack 0.5s linear infinite;
    transform-origin: center center;
}
.loader::before {
    width: 92px;
    height: 92px;
    border-color: #577f9f #577f9f transparent transparent;
    animation: rotation 1.5s linear infinite;
}

@keyframes rotation {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}
@keyframes rotationBack {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(-360deg);
    }
}
.module .h3-title,
.footer-phones .item-phone .item-title{
    text-transform: uppercase;
    color: #555;
    font-weight: 600;
    margin-bottom: 20px;
    margin-top: 15px;
}
.footer-phones .item-phone p{
    margin: 7px 0;
}
.footer-phones .item-phone a{
    color: #677178;
    font-weight: 600;
    text-decoration: none;
}
.footer-2 p{
    color: #677178;
}
.footer-menu{
    margin-top: 30px;
}
.footer-menu ul{
    padding: 0;
    margin-top: 0;
    margin-bottom: 0;
    list-style: none;
}
.footer-menu ul li{
    margin-bottom: 15px;
}
.footer-menu ul li a{
    color: #323232;
    text-decoration: none;
}
.copyright{
    border-top: 1px solid #EBEBEB;
    padding: 10px 0;
    font-size: 14px;
    color: #677178;
}
.add-to-cart-widget {
    position: fixed;
    right: -200px;
    top: 50%;
    background-color: var(--primary);
    padding: 20px;
    border-radius: 5px 0 0 5px;
    box-shadow: 0 0 10px rgba(0,0,0,.1);
    width: 178px;
    color: #fff;
    -webkit-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;
    z-index: 1000;
}
.add-to-cart-widget.active {
    right: 0;
}
.rating-area {
    overflow: hidden;
    display: table;
}
.rating-area:not(:checked) > input {
    display: none;
}
.rating-area:not(:checked) > label {
    float: right;
    width: 29px;
    padding: 0;
    cursor: pointer;
    font-size: 28px;
    line-height: 28px;
    color: lightgrey;
}
.rating-area > label:before {
    font-family: FontAwesome;
}
.rating-area:not(:checked) > label:before {
    content: '★';
}
.rating-area > input:checked ~ label {
    color: #f7ce0a;
}
.rating-area > input:checked ~ label::before {
    content: '★';
}
.rating-area:not(:checked) > label:hover,
.rating-area:not(:checked) > label:hover::before,
.rating-area:not(:checked) > label:hover ~ label::before,
.rating-area:not(:checked) > label:hover ~ label {
    color: #f7ce0a;
    content: '★';
}
.rating-area > input:checked + label:hover,
.rating-area > input:checked + label:hover ~ label,
.rating-area > input:checked ~ label:hover,
.rating-area > input:checked ~ label:hover ~ label,
.rating-area > label:hover ~ input:checked ~ label {
    color: #f7ce0a;
}
.rating-area > input:checked + label::before ~ label::before,
.rating-area > label:hover ~ input ~ label::before,
.rating-area > input:checked + label::before{
    content: '★';
}
.rate-area > label:active {
    position: relative;
}
.rating-mini {
    display: inline-block;
    font-size: 0;
}
.rating-mini span {
    padding: 0;
    font-size: 20px;
    line-height: 1;
    color: lightgrey;
}

.rating-mini > span:before {
    content: '★';
}
.rating-mini > span.active {
    color: gold;
}
.reviews-title{
    align-items: center;
}
.reviews-title .note{
    color: var(--semi-gray);
    font-size: 13px;
    margin: 5px 0 30px;
}
.reviews-rating{
    font-size: 14px;
    font-weight: 700;
    color: var(--semi-dark);
}
.review-item{
    margin-bottom: 30px;
}
.review-item .r-name{
    font-weight: 600;
    color: var(--semi-dark);
}
.review-item .date{
    color: var(--semi-gray);
    font-size: 12px;
    margin-top: 5px;
}
.review-item .r-text{
    color: var(--semi-gray);
    margin-top: 10px;
}
#form-review .rf-title{
    font-size: 20px;
    font-weight: 600;
    color: var(--semi-dark);
    margin-bottom: 15px;
}
#form-review .r-f-error,
#form-review .r-f-success-msg{
    display: none;
}
#form-review .r-f-error{
    font-size: 13px;
    color: #f75959;
    margin-top: 5px;
}
#form-review .form-group{
    margin-bottom: 15px;
}
#form-review label{
    display: block;
    font-weight: 600;
    margin-bottom: 10px;
}
#form-review .form-control{
    display: block;
    width: 100%;
    border: none;
    background: #fff;
    border-radius: 4px;
    padding: 10px;
    color: var(--semi-dark);
    outline: none;
}
#form-review textarea{
    min-height: 100px;
}
#form-review .send-button{
    background: var(--primary);
    color: #fff;
    border-radius: 5px;
    margin-bottom: 15px;
}
#form-review .r-f-success-msg {
    color: var(--semi-dark);
    font-size: 13px;
    margin-top: 20px;
    text-align: center;
}
.spinner {
    position: absolute;
    height: 60px;
    width: 60px;
    border: 3px solid transparent;
    border-top-color: var(--semi-dark);
    top: 50%;
    left: 50%;
    margin: -30px;
    border-radius: 50%;
    animation: spin 2s linear infinite;
}
.send-spinner{
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background: #ffffffa8;
}
.spinner-inner1{
    position: absolute;
    display: flex;
    justify-content: center;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    align-items: center;
}
.spinner::before,
.spinner::after{
    content:'';
    position: absolute;
    border: 3px solid transparent;
    border-radius: 50%;
}
.spinner::before{
    border-top-color: var(--primary);
    top: -12px;
    left: -12px;
    right: -12px;
    bottom: -12px;
    animation: spin 3s linear infinite;
}
.spinner::after{
    border-top-color: #FFFBFE;
    top: 6px;
    left: 6px;
    right: 6px;
    bottom: 6px;
    animation: spin 4s linear infinite;
}

@keyframes spin{
    0% {transform: rotate(0deg);}
    100% {transform: rotate(360deg);}
}
.popup {
    position: fixed;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    display: -ms-flexbox;
    display: -webkit-box;
    display: flex;
    -ms-flex-align: center;
    -webkit-box-align: center;
    align-items: center;
    min-width: 320px;
    padding: 20px 10px;
    background-color: rgba(0, 0, 0, 0.63);
    visibility: hidden;
    opacity: 0;
    -webkit-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
    overflow-x: hidden;
    overflow-y: visible;
    width: 100%;
    pointer-events: none;
    z-index: 999;
    -webkit-tap-highlight-color: transparent;
}
.popup_video {
    padding: 50px;
}
.popup.visible {
    pointer-events: all;
    visibility: visible;
    opacity: 1;
}
.popup__video {
    position: relative;
    width: 100%;
    height: 0;
    padding-bottom: 56.25%;
    background: #000;
}
.popup__video iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: none;
}
.popup__wrap {
    position: relative;
    width: 100%;
    padding: 0;
    margin: auto;
    opacity: 0;
    -webkit-transform: scale(0.8);
    transform: scale(0.8);
    -webkit-transition: opacity .5s, -webkit-transform .5s;
    transition: opacity .5s, -webkit-transform .5s;
    transition: opacity .5s, transform .5s;
    transition: opacity .5s, transform .5s, -webkit-transform .5s;
    background-color: #fff;
}
.popup__wrap.active {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1);
}
.popup_video .popup__wrap {
    max-width: 1400px;
    font-size: 0;
}
.btn-close-popup {
    position: absolute;
    top: -40px;
    right: 0;
    width: 30px;
    height: 30px;
    display: inline-block;
    cursor: pointer;
    background: none;
}
.btn-close-popup::before,
.btn-close-popup::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 20px;
    height: 2px;
    background-color: #fff; /* белый цвет */
    transform-origin: center;
    transition: background-color 0.3s ease;
}
.btn-close-popup::before {
    transform: translate(-50%, -50%) rotate(45deg);
}
.btn-close-popup::after {
    transform: translate(-50%, -50%) rotate(-45deg);
}
.btn-close-popup:hover::before,
.btn-close-popup:hover::after {
    background-color: #ddd;
}
.f-button.is-close-btn {
    background-color: rgba(0, 0, 0, 0);
    border: none;
    cursor: pointer;
    padding: 8px;
    position: absolute;
    z-index: 1;
    top: -25px!important;
    right: -25px!important;
    background-color: #09111c;
    border-radius: 50%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    opacity: 1!important;
    width: 50px;
    height: 50px;
    -webkit-transition: all .3s ease 0s;
    -o-transition: all .3s ease 0s;
    transition: all .3s ease 0s;
}
.f-button.is-close-btn:hover {
    background-color: #323842;
    -webkit-transform: rotate(-180deg);
    -ms-transform: rotate(-180deg);
    transform: rotate(-180deg);
}
.modal .h3-title {
    font-size: 25px;
    color: #071c2e;
    font-weight: 700;
    margin-bottom: 20px;
}
.form .form-group {
    margin-bottom: 15px;
}
.form .form-group label {
    display: block;
    color: #61717d;
    font-size: 14px;
    margin-bottom: 5px;
    font-weight: 600;
}
.form .form-input,
.form .form-textarea {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    font-family: Lato, Arial, Sans-serif, serif;
    border: none;
    border-radius: .125rem;
    color: #707070;
    display: block;
    font-size: 14px;
    outline: none;
    padding: 1rem;
    transition: all .2s ease-in;
    width: 100%;
    resize: none;
}
.modal .form .form-input,
.modal .form .form-textarea {
    background-color: #f2f5f7;
    color: #84949f;
}
.modal .form-send-error {
    display: none;
    color: red;
    font-size: 14px;
    margin-bottom: -7px;
}
.modal .success-message {
    position: absolute;
    top: 0;
    left: 0;
    display: none;
    height: 100%;
    z-index: 1;
    width: 100%;
}
.modal .success-message .success-message-wrapper {
    background: rgb(255, 255, 255);
    display: flex;
    height: 100%;
    width: 100%;
    justify-content: center;
    align-items: center;
    text-align: center;
    padding: 40px;
    z-index: 1;
    font-size: 18px;
    color: #4f6682;
}
.modal .form .form-footer {
    padding-top: 20px;
}
.modal .form .form-group label {
    display: block;
    color: #61717d;
    font-size: 14px;
    margin-bottom: 5px;
    font-weight: 600;
}
.modal .form .checkbox-label {
    position: relative;
    font-weight: 500 !important;
}
.modal .form .form-group label sup {
    color: red;
}
.sort-form {
    display: flex;
    align-items: center;
    margin-bottom: 20px;
}
.sort-select {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    background-color: #fff;
    border: 1px solid #ddd;
    border-radius: 10px;
    padding: 10px 40px 10px 15px;
    font-size: 14px;
    font-weight: 500;
    color: var(--semi-dark);
    cursor: pointer;
    transition: all 0.2s ease;
    background-image: url("data:image/svg+xml;utf8,<svg fill='none' stroke='%23333' stroke-width='2' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'><path d='M6 9l6 6 6-6'/></svg>");
    background-repeat: no-repeat;
    background-position: right 12px center;
    background-size: 16px;
}
.sort-select:hover {
    border-color: #aaa;
    box-shadow: 0 0 4px rgba(0, 0, 0, 0.1);
}
.sort-select:focus {
    outline: none;
}
.sort-select option {
    font-weight: 400;
}