/*
Рыбоедов DEV
*/
/* Разработчики - глоб
Компания РОСВЕБ https://rosveb.ru
— ПРОГРАММИСТ Алексей Гуляев
Телефон +7 (982) 413-33-94
Портфолио на Profi.ru https://ivanovo.profi.ru/profile/GulyaevAG
Телеграм https://t.me/GulaevAleksey
ВКонтакте https://vk.com/dumasurgut
— АНАЛИТИК Дмитрий Раевский
Телеграм https://t.me/GulaevAleksey
ВКонтакте https://vk.com/raevskydmitry
— ДИЗАЙНЕР Валентин Беликов
Портфолио на Behance https://www.behance.net/artlisx
Телеграм https://t.me/ksenfo
ВКонтакте https://vk.com/snakejas
*/
@font-face {
font-family: 'Lobster';
src: url('fonts/lobster.ttf') format('truetype');
font-weight: 400;
font-style: normal;
}
@font-face {
font-family: 'Roboto';
src: url('fonts/Roboto-Thin.ttf') format('truetype');
font-weight: 100;
font-style: normal;
}
@font-face {
font-family: 'Roboto';
src: url('fonts/Roboto-Light.ttf') format('truetype');
font-weight: 300;
font-style: normal;
}
@font-face {
font-family: 'Roboto';
src: url('fonts/Roboto-Regular.ttf') format('truetype');
font-weight: 400;
font-style: normal;
}
@font-face {
font-family: 'Roboto';
src: url('fonts/Roboto-Medium.ttf') format('truetype');
font-weight: 500;
font-style: normal;
}
@font-face {
font-family: 'Roboto';
src: url('fonts/Roboto-Bold.ttf') format('truetype');
font-weight: 700;
font-style: normal;
}
@font-face {
font-family: 'Roboto';
src: url('fonts/Roboto-Black.ttf') format('truetype');
font-weight: 900;
font-style: normal;
}
body {
font-family: 'Roboto', Arial, sans-serif;
}
/* Глобальные CSS-переменные для цветов (пока не используются, только объявление) */
:root {
--color-svetliy-1: #F9F6F3;
--color-svetliy-2: #FFF9F3;
--color-svetliy-3: #FAF3ED;
--color-svetliy-4: #F4EEE8;
--color-nezhniy-1: #E3D8CC;
--color-nezhniy-2: #E3CCC0;
--color-nezhniy-3: #A88E80;
--color-korichneviy-new: #8C7265;
--color-korichneviy-1-txt: #867769;
--color-korichneviy-1-hover: #5F4E3F;
--color-korichneviy-2-txt: #694F44;
--color-chernyi-txt: #424242;
--color-chernyi-fon: #3D3734;
--color-red: #DA2E0E;
--color-green: #82A828;
}
a{
color: #867769;
}
footer a{
color: #ffffff;
}
.val-otz:before {
content: "";
background-image: url('data:image/svg+xml,');
display: inline-block;
background-repeat: no-repeat;
width: 23px;
height: 23px;
vertical-align: middle;
}
.val-otz:after {
content: "";
display: inline-block;
width: 77px;
height: 14px;
vertical-align: middle;
background-image: url('/upload/img/stars.svg');
background-repeat: no-repeat;
background-size: contain;
top: -1px;
position: relative;
}
body {
background-size: 100% auto;
}
.val-header-top .header-menu ul li a{
font-size: 15px;
color: #fff !important;
font-weight: 400 !important;
transition: all .2s ease;
padding: 18px 10px;
}
.val-header-top .header-menu a:hover{
background: #00000052 !important;
}
.val-otz{
display: flex !important;
align-items: center;
gap: 5px;
padding: 13px 10px !important;
width: max-content;
}
.val-header-top{
height: 198px !important;
display: flex;
flex-direction: column;
gap: 13px;
background: unset !important;
}
.val-header-top > .content-center{
background: linear-gradient(to right, rgb(17 6 0 / 55%), rgb(29 12 0 / 50%) 50%, rgb(17 6 0 / 55%)) !important;
border-radius: 0 0 20px 20px;
}
header .header-menu ul {
padding-top: unset;
}
header .header-menu {
height: 50px;
}
header .header-bottom {
background: unset;
}
.val-header-top .header-menu{
display: flex;
align-items: center;
}
.wp-grid, .content-center {
width: 100%;
max-width: unset;
padding: 0 20px;
align-items: center;
}
.val-header-top ul{
display: flex;
align-items: center;
margin-bottom: 0 !important;
}
.val-header-top ul li{
margin: 0 !important;
}
.val-search .search-field-input{
border-radius: 100px;
border: 1px solid rgb(238 238 238 / 75%);
background-color: unset !important;
color: #fff;
padding: 0 47px 0 14px;
font-size: 15px;
font-weight: 500 !important;
}
.val-search .search-field-input:focus {
border: 1px solid #fff !important;
}
.val-search .search-field-input::placeholder{
color: #ffffffb3;
font-weight: 400;
}
.header-searcher .search-container .search-field .inputers input[type="text"] {
margin-top: 2px;
width: 530px;
height: 36px;
font-weight: 400 !important;
}
.header-searcher {
width: auto;
}
.val-search .search-field-submit{
position:relative;
opacity: .7;
transition: opacity 0.2s ease;
}
.search-field-submit::after {
content: '';
position: absolute;
top: 3px;
left: 0;
right: 0;
bottom: 0;
background: #00000052;
z-index: -1;
opacity: 0;
transition: opacity 0.2s ease;
border-radius: 100px;
transform: scale(1.4); /* Увеличиваем размер на 20% */
width: 100%;
height: 80%;
}
.search-field-submit:hover {
opacity: 1;
filter: brightness(1.5); /* Делаем иконку ярче при наведении */
transition: opacity 0.2s ease;
}
.search-field-submit:hover::after {
opacity: 1;
}
/**/
.phones__dropdown {
background-color: var(--card_bg_black);
color: var(--basic_text_black);
box-shadow: 0 5px 30px rgba(34, 34, 40, .08);
position: absolute;
top: -20px;
transition: opacity .2s ease-in-out, visibility .2s ease-in-out;
z-index: 2;
top: -16px;
opacity: 0;
visibility: hidden;
/* opacity: 1; */
/* visibility: unset;*/
}
.phones__dropdown-PC{
/* opacity: 1; */
/* visibility: unset;*/
right: -5px;
}
.phones__inner {
display: flex;
align-items: center;
position: relative;
gap: 10px;
}
.phones {
display: flex;
align-items: center;
position: relative;
}
.phones__dropdown .dropdown {
min-width: min(220px, calc(100vw - 40px));
}
.p--20 {
padding: 20px;
}
.theme-root {
background: #fff;
border-radius: 0 0 20px 20px;
box-shadow: 0 0 40px 0px #0000004d;
margin: -33px 0 0 0;
}
.phones__inner:hover {
z-index: 1000;
}
.phones__inner:hover .phones__dropdown {
opacity: 1;
visibility: visible;
}
.phones{
font-size: 16px;
cursor: pointer;
}
.secondary-color {
color: #8D8D8D;
font-size: 14px;
}
.phones__dropdown .dropdown + .dropdown::before {
border-top: 1px solid #EBECEF;
content: "";
display: block;
margin: 24px 0;
width: 100%;
}
.gap--12 {
gap: 18px;
}
.flexbox {
display: flex;
flex-direction: column;
flex: 1;
}
.address__text,
.schedule__text,
.email__text a{
line-height: 18px;
margin: 6px 0 0 0;
font-weight: 500;
color: #222228;
}
.phones__phone-title {
line-height: 18px;
font-weight: 500;
color: #222228;
}
.phones a:hover {
color: #714821;
background: unset !important;
}
.phones__dropdown-items--phones .phones__dropdown-item {
gap: 10px;
display: flex;
flex-direction: column;
}
.phones__dropdown-items--phones .phones__phone-title{
font-weight: 500;
font-size: 18px;
}
.phones__dropdown-items--phones .phones__dropdown-item a:hover .phones__phone-title{
color: #714821 !important;
}
.phones__phone-first{
font-weight: 400;
font-size: 18px;
color: #fff;
line-height: 18px;
}
.icon-phone path {
fill: none; /* Убирает заливку */
stroke: #fff; /* Цвет обводки как у текста */
}
.icon-phone{
opacity: .7;
}
.icon-shevron {
opacity: .5;
}
.icon-shevron path{
fill: none; /* Убирает заливку */
stroke: #fff; /* Цвет обводки как у текста */
}
.header-menu {
width: unset !important;
}
.order-popup-table .captha input[name="captcha_word"]{
display: inline-block !important;
}
#bx_incl_area_1 ul{
margin-bottom: 0;
}
.popup-window-titlebar{
display: flex;
align-items: center;
}
.popup-window-titlebar .sale-popup-title{
font-size: 21px;
margin: 0 0 0 27px;
color: #9e9e9e;
}
.sale-reload-captcha{
position: absolute;
top: 34px;
left: 190px;
}
.order-popup-table .captcha{
position: relative !important;
}
.oneclick-popup input.captha {
width: 220px;
}
#captha-img400{
margin: 0 0 10px 0px;
}
header .header-bottom .content-center .header-slogan {
background: #fff;
}
.mainpage header .header-bottom{
box-shadow: unset;
-webkit-box-shadow: unset;
}
header .header-bottom .content-center .header-logo{
height: 116px;
max-width: 421px;
}
header .header-logo img {
width: 421px;
}
.catalog-item-page .card-item-blocks-wrap > *:last-child{
border-bottom: none;
}
header .header-bottom {
height: 116px;
margin: 0 0 9px 0;
}
.val-header-delivery{
font-size: 17px;
font-family: 'Roboto', Arial, sans-serif;
font-weight: 500;
}
header .header-bottom .content-center .header-slogan {
background: unset;
}
header .header-bottom .content-center .header-slogan{
width: 228px;
height: 95px;
min-width: unset;
}
.val-header-delivery{
position: relative;
width: 228px;
height: 95px;
display: flex;
align-items: center;
}
.val-header-delivery img{
position: absolute;
left: 0;
top: 0;
z-index: -1;
}
.val-header-delivery > span{
color: #fff;
width: 150px;
line-height: 120%;
display: inline-block;
margin: 0 0 0 20px;
}
.val-header-delivery > span > span{
line-height: 140%;
}
.val-bg-fish{
width: 774px;
height: 177px;
}
.val-bg-fish-wrap{
overflow: hidden;
width: 774px;
height: 138px;
position: absolute;
z-index: -1;
left: 0;
top: 0;
left: 50%;
transform: translateX(calc(-50% + 48px));
top: -13px;
pointer-events: none;
}
.header-top-pannel{
width: 300px;
display: flex;
flex-direction: column;
gap: 9px;
}
.header-top-pannel .content-center{
background: #fff;
height: 64px;
border-radius: 20px;
}
.val-dostavka h1{
color: #fff;
font-size: 19px;
font-family: 'Lobster', Arial, sans-serif;
letter-spacing: .4px;
line-height: 120%;
text-shadow: 0px 0px 12px #2f0b02, 0px 0px 20px #2f0b02;
margin: 0;
}
.header-bottom > .content-center{
padding: 0;
}
.val-header-top > .content-center:after{
display: none;
}
.header-top-pannel .header-top-wrap {
max-width: unset;
padding: 0;
}
.header-top-pannel .header_top_wraper {
justify-content: flex-start;
align-items: center;
gap: 14px;
}
header .header-private .authorize .authlogin:before{
background: url(img/user-yes.svg) no-repeat center !important;
margin-top: 0;
}
header .header-private .authorize .icon-login.noauth:before{
background: url(img/user.svg) no-repeat center !important;
margin-top: 0;
}
.header_top_wraper .header-private {
display: flex;
align-items: center;
padding: 0;
height: 30px;
}
.header_top_wraper .favorites{
height: 30px;
margin: 0 9px 0 0;
}
.header_top_wraper .favorites svg {
width: 30px;
height: 30px;
}
.header-top-pannel .header-cart{
padding: 0;
}
.icon.icon-cart{
background: url(img/shopping-cart.svg) no-repeat center !important;
height: 35px;
margin: 0 9px 0 0 !important;
}
header .bx_cart_block a.cart-not-empty span:not(.cart-total-price),
.header_top_wraper .favorites span{
color: #fff;
font-size: 14px;
margin: 0;
background-color: #694F44;
font-weight: 400;
width: unset;
display: block;
padding: 1px 5px;
box-shadow: 0px 1px 8px 0 hsl(0deg 0% 0% / 25%);
border-radius: 22px;
right: 6px;
}
header .bx_cart_block a.cart-not-empty span{
position: absolute;
height: 18px;
top: -18px;
}
.header_top_wraper .favorites span{
right: -9px;
}
.header-top-pannel .cart-total-price{
margin: 0 !important;
}
.header-divider {
display: inline-block;
width: 1px;
height: 16px;
background: #D9D9D9;
border-radius: 2px;
flex: 0 0 1px;
}
.main_banners{
padding: 0 !important;
z-index: 100;
position: relative;
margin: 0 0 20px 0;
gap: 20px;
z-index: 1;
}
.slider_block .slick-dots{
position: absolute;
flex-direction: row !important;
bottom: 0;
max-width: unset !important;
gap: 9px;
margin: 0;
width: 60% !important;
}
.slider_block .slick-dots li button {
width: 16px !important;
height: 4px !important;
border-radius: 4px !important;
border: 2px solid hsl(0deg 0% 100% / 20%) !important;
background-color: unset !important;
transform: unset !important;
}
.slider_block .slick-dots li.slick-active button{
background-color: #fff !important;
}
.slider_block .slick-dots li {
margin: 0px 0 !important;
}
.slider_block .slick-list {
max-width: 100% !important;
}
.slider_block .item img{
border-radius: 20px 8px 8px 20px;
}
.slider_block {
max-width: unset !important;
max-height: unset;
overflow: hidden;
flex: 0 1 68.345%;
}
.main_slider{
height: auto;
}
.slider_block .main_slider{
align-items: unset !important;
}
.main_minies {
flex: 0 1 31.655%;
max-width: unset !important;
max-height: unset;
}
.main_minies img{
border-radius: 8px 20px 20px 8px;
}
header .header-cart-items {
overflow-y: auto;
}
.header-cart .bx_cart_block a,
.header-cart .bx_cart_block span{
white-space: nowrap;
color: #404040;
background-size: 80% 80%;
display: flex;
align-items: center;
font-size: 16px;
margin: 0 5px;
}
.header-cart .bx_cart_block{
display: flex;
align-items: center;
}
.header-cart-item-right .header-cart-item-title a{
white-space: wrap !important;
}
.main-section {
z-index: unset;
border-radius: 20px;
padding: 40px 0;
background: #fff;
}
.main-section > .content-center{
padding: 0 40px;
}
.main-section .columns{
margin: 0 !important;
}
.main-section .left-column{
margin-left: 0;
width: 316px;
font-size: 15px;
line-height: 120%;
flex: 1 0 316px;
max-width: 316px;
z-index: unset;
}
.main-section .columns{
display: flex;
gap: 22px;
flex-wrap: wrap;
}
.main-section .columns:after{
display: none;
}
.main-section .content-area{
margin-left: unset !important;
flex: 1 1 auto;
}
.catalog-sections .catalog-sections-items{
margin-left: 0;
}
.catalog-sections .catalog-sections-items{
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 22px;
}
.catalog-sections .catalog-section-item {
display: flex;
flex-direction: column;
height: auto;
box-sizing: border-box;
width: 100%;
margin: 0;
box-shadow: inset 0 0 0 2px #F4EEE8;
border-radius: 20px;
max-width: unset;
/* gap тут не нужен, используйте margin у дочерних элементов */
}
.catalog-sections .catalog-section-image {
flex: 1 1 0;
display: flex;
align-items: center;
justify-content: center;
margin: 14px 14px 0 14px; /* отступ сверху и по бокам */
/* чтобы картинка не прилипала к краям */
/* position: relative; */
/* height: 188px;
height: 10vw; */
height: auto;
}
.catalog-sections .catalog-section-image img {
width: 100%;
height: 100%;
object-fit: contain;
aspect-ratio: 4 / 3;
max-height: 100%;
max-width: 100%;
border-radius: 10px;
}
.catalog-sections .catalog-section-title {
height: 50px; /* фиксированная высота */
margin: 0 14px 14px;
background: #F4EEE8;
border-radius: 10px;
padding: 10px 24px;
width: auto;
min-height: auto;
border: none;
box-shadow: unset;
transition: .3s;
}
.catalog-sections .catalog-section-title span{
text-transform: unset;
font-size: clamp(15px, 1.2vw, 16px) !important;
font-weight: 500;
color: #867769;
line-height: 110%;
}
.catalog-sections .catalog-section-title:hover {
box-shadow: unset;
transition: .6s;
}
.scrollTop{
background-color: #ffffff96;
}
.scrollTopBtn {
display: flex;
align-items: center;
justify-content: center;
position: fixed;
right: 30px;
bottom: 30px;
width: 48px;
height: 48px;
background: #8C726596;
border-radius: 50%;
box-shadow: 0 2px 10px rgba(0,0,0,0.15);
opacity: 0;
visibility: hidden;
cursor: pointer;
transform: rotate(-90deg) scale(0.7);
transition:
opacity .5s ease-out,
background .3s ease,
visibility .5s ease-out,
transform .5s ease-out;
z-index: 9999;
}
.scrollTopBtn.show {
opacity: 1;
visibility: visible;
transform: rotate(0deg) scale(1);
}
.scrollTopBtn svg {
display: block;
}
.scrollTopBtn:hover {
background: #8C7265;
}
nav.catalog-menu.second {
background: #8C7265;
border-radius: 10px;
}
nav.catalog-menu.second .catalog-section-menu .catalog-section-title a{
font-size: 15px !important;
font-weight: 500;
color: #fff !important;
line-height: 120%;
flex: 1 1 0;
padding: 0;
display: flex;
align-items: center;
height: 100%;
padding: 0 43px 0 63px;
margin: 0 -43px 0 -63px;
}
nav.catalog-menu.second .catalog-section-menu:not(.before) .catalog-section-title a{
padding: 0 20px 0 63px;
margin: 0 -20px 0 -63px;
}
.catalog-menu .catalog-section-title{
text-transform: unset;
}
.section-link {
display: inline-flex;
align-items: center;
gap: 8px;
}
.section-icon-svg {
display: inline-flex;
width: 20px;
height: 20px;
}
.section-icon-svg svg {
width: 100%;
height: 100%;
fill: currentColor; /* Наследование цвета текста */
stroke: currentColor;
}
.section-icon {
width: 20px;
height: 20px;
object-fit: contain;
}
nav.catalog-menu.second .catalog-section-menu{
padding: 0 20px !important;
margin-bottom: 0 !important;
height: 50px;
}
nav.catalog-menu.second .catalog-section-menu:first-child .catalog-section-title{
border-top: none !important;
}
nav.catalog-menu.second .catalog-section-menu:first-child:hover,
nav.catalog-menu.second .catalog-section-menu.slide:first-child{
border-radius: 10px 10px 0 0;
}
nav.catalog-menu.second .catalog-section-menu:last-child:hover,
nav.catalog-menu.second .catalog-section-menu.slide:last-child{
border-radius: 0 0 10px 10px;
box-shadow: unset !important;
}
nav.catalog-menu.second .catalog-section-menu.before .catalog-section-title .plus{
background-color: unset !important;
box-shadow: unset !important;
transition: ease all .3s;
margin: 0 -20px 0px 0;
padding: 10px 32px 12px 12px !important;
height: 50px !important;
}
nav.catalog-menu.second .catalog-section-menu.before .catalog-section-title .plus svg{
flex: 0 0 20px;
transition: ease all .3s;
}
nav.catalog-menu.second .catalog-section-menu.before .catalog-section-title .plus:hover {
background-color: unset !important;
}
nav.catalog-menu.second .catalog-section-menu .catalog-section-title {
justify-content: flex-start !important;
align-items: center;
padding: 0 0 !important;
height: 50px;
border-top: 1px solid #978175;
border-bottom: unset;
}
nav.catalog-menu.second .catalog-section-menu:hover {
background: #785d52;
box-shadow: 0px 1px 0 0px #785d52;
position: relative;
z-index: 9;
}
nav.catalog-menu.second .catalog-section-menu:hover .catalog-section-title{
border-top: 1px solid #b89f9200;
}
nav.catalog-menu.second .catalog-section-menu.slide .subs_items {
position: unset;
top: unset;
}
nav.catalog-menu.second .catalog-section-menu.slide {
background: #785d52 !important;
box-shadow: 0px 1px 0 0px #785d52;
position: relative;
z-index: 10;
transition: all .3s ease;
}
nav.catalog-menu.second .catalog-section-menu.slide .catalog-section-title{
border-top: 1px solid #785d52;
}
nav.catalog-menu.second .catalog-section-menu.slide:hover{
background: #785d52 !important;
border-bottom: unset;
box-shadow: 0px 1px 0 0px #785d52;
}
/* Иконки разделов меню в сайдбаре */
nav.catalog-menu.second .catalog-section-menu .catalog-section-title:before {
content: "";
width: 28px;
height: 28px;
display: inline-block;
background-size: contain;
background-repeat: no-repeat;
background-position: center;
margin-right: 15px;
}
#bx_1847241719_101:before{ /* Рыба */
background-image: url(img/ikonki-razdelov/1.svg);
}
#bx_1847241719_163:before{ /* Рыба по способу приготовления */
background-image: url(img/ikonki-razdelov/2.svg);
}
#bx_1847241719_683:before{ /* Рыбное филе и стейки */
background-image: url(img/ikonki-razdelov/3.svg);
}
#bx_1847241719_144:before{ /* Морепродукты */
background-image: url(img/ikonki-razdelov/4.svg);
}
#bx_1847241719_808:before,
#bx_1847241719_812:before{ /* Рыба в маринаде для гриль и запекания */
background-image: url(img/ikonki-razdelov/31.svg);
}
#bx_1847241719_158:before{ /* Икра красная */
background-image: url(img/ikonki-razdelov/5.svg);
}
#bx_1847241719_191:before{ /* Мясо */
background-image: url(img/ikonki-razdelov/6.svg);
}
#bx_1847241719_460:before{ /* Солёные закуски */
background-image: url(img/ikonki-razdelov/7.svg);
}
#bx_1847241719_505:before{ /* Живые морепродукты */
background-image: url(img/ikonki-razdelov/8.svg);
}
#bx_1847241719_495:before{ /* Бакалея */
background-image: url(img/ikonki-razdelov/9.svg);
}
#bx_1847241719_192:before{ /* Всё для суши */
background-image: url(img/ikonki-razdelov/10.svg);
}
#bx_1847241719_463:before{ /* Гастрономия */
background-image: url(img/ikonki-razdelov/11.svg);
}
#bx_1847241719_716:before{ /* Готовая еда */
background-image: url(img/ikonki-razdelov/12.svg);
}
#bx_1847241719_526:before{ /* Диетические продукты */
background-image: url(img/ikonki-razdelov/13.svg);
}
#bx_1847241719_500:before{ /* Замороженные грибы и ягоды */
background-image: url(img/ikonki-razdelov/14.svg);
}
#bx_1847241719_466:before{ /* Консервы и пресервы */
background-image: url(img/ikonki-razdelov/15.svg);
}
#bx_1847241719_527:before{ /* Кофе */
background-image: url(img/ikonki-razdelov/16.svg);
}
#bx_1847241719_472:before{ /* Мёд и варенье */
background-image: url(img/ikonki-razdelov/17.svg);
}
#bx_1847241719_441:before{ /* Овощи и фрукты */
background-image: url(img/ikonki-razdelov/18.svg);
}
#bx_1847241719_464:before{ /* Орехи и сухофрукты */
background-image: url(img/ikonki-razdelov/19.svg);
}
#bx_1847241719_465:before{ /* Полуфабрикаты */
background-image: url(img/ikonki-razdelov/20.svg);
}
#bx_1847241719_762:before{ /* Соки и напитки */
background-image: url(img/ikonki-razdelov/21.svg);
}
#bx_1847241719_194:before{ /* Соусы и приправы */
background-image: url(img/ikonki-razdelov/22.svg);
}
#bx_1847241719_453:before{ /* Сыры */
background-image: url(img/ikonki-razdelov/23.svg);
}
#bx_1847241719_642:before{ /* Хлеб и выпечка */
background-image: url(img/ikonki-razdelov/24.svg);
}
#bx_1847241719_646:before{ /* Цветы и подарки */
background-image: url(img/ikonki-razdelov/25.svg);
}
#bx_1847241719_498:before{ /* Чай */
background-image: url(img/ikonki-razdelov/26.svg);
}
#bx_1847241719_506:before{ /* Сладости и выпечка */
background-image: url(img/ikonki-razdelov/27.svg);
}
#bx_1847241719_525:before{ /* Товары для дома и гигиена */
background-image: url(img/ikonki-razdelov/28.svg);
}
#bx_1847241719_533:before{ /* Отдых и пикник */
background-image: url(img/ikonki-razdelov/29.svg);
}
/* Иконки разделов меню в сайдбаре */
nav.catalog-menu.second .catalog-section-menu.slide .subs{
left: 310px !important;
z-index: 50 !important;
top: unset;
max-height: unset;
transition: all .3s ease !important;
width: max-content !important;
padding: 20px 30px;
}
.catalog-menu .catalog-section-menu ul li a {
color: #867769;
}
.catalog-menu .catalog-section-menu ul li a:hover {
color: #2d1a08;
}
.main-section .columns .content-area {
z-index: unset;
}
nav.catalog-menu.second .catalog-section-menu .subs{
height: auto !important;
transform: translate(0px, -50px);
background-color: #ffffff !important;
box-shadow: 0 4px 100px 0 #00000080;
border-radius: 10px;
}
.catalog-section-menu.slide .plus svg{
rotate: 180deg;
transition: all .3s ease;
}
nav.catalog-menu.second .catalog-section-menu.slide .subs_items{
display: grid;
/*grid-template-columns: 1fr 1fr 1fr;
grid-template-columns: repeat(3, minmax(200px, 1fr));
grid-template-columns: repeat(3, 200px);*/
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
max-width: 640px;
min-width: 200px;
grid-auto-rows: 1fr; /* Все строки одинаковой высоты */
column-gap: 20px; /* отступ между колонками */
align-items: center;
}
nav.catalog-menu.second .catalog-section-menu .subs_items li {
padding: 0 0 0 0 !important;
margin: 0 0 0 0 !important;
line-height: 120%;
}
nav.catalog-menu.second .catalog-section-menu.before a {
width: 100% !important;
}
nav.catalog-menu.second .catalog-section-menu .subs_items li a {
padding: 6px 0 6px 0;
font-weight: 500;
font-size: 15px;
}
.catalog-menu{
margin-bottom: 15px;
}
nav.catalog-menu .catalog-section-menu .catalog-section-title,
nav.catalog-menu.second .catalog-section-menu .catalog-section-title{
padding: 0;
}
nav.catalog-menu:first-child .catalog-section-menu .catalog-section-title a,
nav.catalog-menu .catalog-section-menu .catalog-section-title a {
color: #fff !important;
font-weight: 500;
font-size: 15px;
}
.discount-link {
display: flex;
align-items: center;
background: #393532;
border-radius: 10px;
padding: 10px 20px;
position: relative;
color: #fff;
font-size: 1.2rem;
font-weight: 600;
text-decoration: none;
overflow: hidden;
transition: background 0.2s;
}
.discount-link:hover {
background: #4a423c;
}
.discount-icon-left {
margin-right: 15px;
display: flex;
align-items: center;
}
.discount-link-text {
flex: 1;
text-align: left;
}
.discount-corner {
position: absolute;
right: 0;
top: 0;
height: 100%;
width: 60px;
display: flex;
align-items: center;
justify-content: center;
}
.discount-corner:after {
content:"";
position: absolute;
transform: translate(21px, -26px);
background: linear-gradient(41deg, #FC3F1D 0%, #B91C00 60%);
box-shadow: 0 0 0 2px #fff;
width: 120px;
height: 120px;
border-radius: 120px;
}
.discount-icon-right {
display: flex;
align-items: center;
color: #fff;
font-size: 1.4rem;
z-index: 1;
}
/* Преимущества */
.val-adv-wrap{
margin: 0 0 30px 0;
display: grid;
width: 100%;
grid-template-columns: repeat(4, 1fr);
gap: 20px;
}
.val-adv{
background: #FFF9F3;
box-shadow: 0 0 0 1px #F4EEE8;
padding: 16px 22px 16px 25px;
display: flex;
border-radius: 10px;
position: relative;
overflow: hidden;
align-items: center;
transition: transform 0.3s;
}
.val-adv-img{
flex: 1 0 68px;
height: 68px;
margin-right: 28px;
z-index: 1;
}
.val-adv-text{
flex: 1 1 auto;
font-size: 16px;
font-weight: 500;
color: #867769;
cursor: default;
z-index: 1;
}
.val-adv .obj-1 img{
content: "";
width: 225px;
height: 332px;
right: 0;
top: 0;
display: block;
position: absolute;
background-image: url(img/adv/obj-1.svg);
transform: translate(20%, -50%);
}
.val-adv .obj-2 img{
content: "";
width: 136px;
height: 136px;
left: 0;
bottom: 0;
z-index: 0;
display: block;
position: absolute;
background-image: url(img/adv/obj-2.svg);
transform: translate(-50%, 47%);
}
.val-tizer-cat .val-adv-text{
font-size: 14px;
}
.val-tizer-cat .val-adv-img{
flex: 1 0 48px;
height: 48px;
margin-right: 16px;
}
.val-tizer-cat .val-adv{
padding: 14px 20px;
}
.val-tizer-cat .val-adv-img object{
width: 48px;
height: 48px;
}
.val-tizer-cat .val-adv .obj-1 object{
width: 170px;
height: 300px;
}
.val-adv:hover{
transform: translateY(-3px);
}
/* Преимущества */
.catalog-item-page .catalog-item-left-block,
.catalog-item-page .catalog-item-right-block{
margin-left: 0;
}
nav.catalog-menu.second .catalog-section-menu .catalog-section-title .plus{
display: flex;
}
.plus{
display: block;
}
span.back {
top: 0 !important;
right: 0 !important;
width: 40px;
height: 40px;
display: flex;
align-items: center;
justify-content: center;
}
span.back:hover .back-img {
opacity: 1;
}
span.back-fon{
background-color: #fff !important;
border-radius: 8px;
display: flex;
align-items: center;
justify-content: center;
width: 28px;
height: 28px;
opacity: 1;
transition: all ease .2s;
}
span.back:hover .back-fon {
background-color: #F4EEE8 !important;
}
span.back-img {
width: 28px;
height: 28px;
display: inline-block;
background-image: url(img/close.svg);
background-size: contain;
background-repeat: no-repeat;
background-position: center;
opacity: .6;
transition: all ease .2s;
}
/**/
.catalog-section-item {
transition: all 0.3s ease;
box-shadow: inset 0 0 0 2px #F4EEE8, 0 0 0 rgba(0,0,0,0);
}
.catalog-section-item:hover {
box-shadow: inset 0 0 0 2px #fff, 0 8px 32px rgba(0,0,0,0.12);
transform: translateY(-3px);
}
.catalog-section-item:hover .catalog-section-title{
background: #E3D8CC;
}
.catalog-section-item:hover .catalog-section-title span{
color: #5f4e3f;
}
.main-section .columns .content-area{
width: calc(100% - 338px);
}
.header-float {
z-index: 9999999;
box-shadow: 0 0 50px 0px #0000003d;
}
.left-column-section-title h3,
.catalog-viewed-products-title{
pointer-events: none;
cursor: default;
color: grey;
text-decoration: none;
font-family: 'Lobster', Arial, sans-serif;
color: #3D3734;
font-size: 30px;
line-height: 120%;
text-transform: none;
}
.left-column .news-list .image,
#hidden-news .image{
width: 100%;
height: 140px;
overflow: hidden;
border-radius: 10px;
}
.left-column .news-list .image img,
#hidden-news .image img{
width: 100%;
height: 100%;
object-fit: cover;
object-position: center center;
}
.left-column-section-title{
margin: 50px 0 26px 0;
padding: 0;
}
.left-column .news-list .title a,
#hidden-news .title a{
color: #424242;
font-size: 15px;
font-weight: 500;
line-height: 120%;
display: -webkit-box;
line-clamp: 3;
-webkit-line-clamp: 3;
-webkit-box-orient: vertical;
overflow: hidden;
}
#hidden-news .title a{
border: none;
}
#hidden-news .news-item{
display: flex;
flex-direction: column;
gap: 10px;
}
.hidden-news-wrap{
max-width: 450px;
padding: 0 !important;
}
#hidden-news .image{
height: 180px;
}
.left-column .news-item{
display: flex;
flex-direction: column;
gap: 8px;
}
.left-column .news-list .news-item,
#hidden-news .news-item{
margin: 0;
}
.left-column .news-list,
#hidden-news{
display: flex;
flex-direction: column;
gap: 22px;
}
.news-btn-all a{
background: #8C7265;
font-size: 15px;
font-weight: 500;
line-height: 120%;
padding: 8px 20px;
color: #fff;
display: flex;
align-items: center;
justify-content: center;
border-radius: 10px;
height: 50px;
margin: 22px 0 0 0;
border-bottom: unset;
}
.catalog-viewed-products,
.hidden-prods-wrap{
margin: 60px 0 0 0;
display: flex;
flex-direction: column;
gap: 10px;
text-align: unset;
}
.catalog-viewed-products-title{
margin: 0 0 10px 0;
}
.catalog-viewed-products .catalog-item,
.hidden-prods-wrap .catalog-item{
margin: 0;
padding: 14px;
border: 1px solid #F4EEE8;
background: #FAF3ED;
border-radius: 20px;
}
.catalog-viewed-products .image img,
.hidden-prods-wrap .image img{
mix-blend-mode: darken;
width: 116px;
height: 116px;
}
.catalog-viewed-products .catalog-item-title a,
.hidden-prods-wrap .catalog-item-title a{
color: #3D3734 !important;
font-size: 16px;
display: -webkit-box;
line-clamp: 3;
-webkit-line-clamp: 3;
-webkit-box-orient: vertical;
overflow: hidden;
line-height: 120%;
font-weight: 500;
}
.catalog-viewed-products .catalog-item,
.hidden-prods-wrap .catalog-item{
display: flex;
flex-direction: row;
gap: 10px;
margin: 0 auto !important;
min-width: 316px;
min-height: 146px;
}
.catalog-viewed-products .catalog-item:after,
.hidden-prods-wrap .catalog-item:after{
display: none;
}
.catalog-viewed-products .image,
.hidden-prods-wrap .image{
margin: 0 !important;
flex: 0 0 116px;
width: unset !important;
}
.catalog-viewed-products .catalog-item .text,
.hidden-prods-wrap .catalog-item .text{
padding: 0;
display: flex;
flex-direction: column;
justify-content: space-between;
}
.catalog-viewed-products .catalog-item-title,
.hidden-prods-wrap .catalog-item-title{
margin: 0 !important;
}
.val-price{
display: flex;
flex-direction: column;
gap: 4px;
}
.catalog-viewed-products .catalog-item .catalog-item-price,
.catalog-viewed-products .catalog-item .catalog-item-price span,
.hidden-prods-wrap .catalog-item .catalog-item-price,
.hidden-prods-wrap .catalog-item .catalog-item-price span{
color: #3D3734;
font-size: 20px;
line-height: 120%;
font-weight: 700;
}
.val-discount-wrap{
display: flex;
flex-direction: row;
gap: 10px;
}
.catalog-viewed-products .oldprice,
.catalog-viewed-products .oldprice .rub,
.hidden-prods-wrap .oldprice,
.hidden-prods-wrap .oldprice .rub{
color: #8C7265;
font-size: 16px;
line-height: 120%;
font-weight: 500;
}
.catalog-viewed-products .discount-percent,
.hidden-prods-wrap .discount-percent{
color: #8C7265;
font-size: 14px;
line-height: 120%;
font-weight: 500;
padding: 3px 11px 1px 11px;
display: flex;
box-shadow: inset 0 0 0 1px #8C7265;
border-radius: 20px;
}
.complain-button a{
background: #8C7265;
height: 50px;
display: flex;
align-items: center;
justify-content: flex-start;
color: #fff;
text-transform: none;
font-size: 15px;
font-weight: 400;
line-height: 120%;
border: none;
border-radius: 10px;
gap: 15px;
}
.complain-button a::before{
content: "";
display: inline-block;
width: 28px;
height: 28px;
background-image: url('/local/templates/optima/css/img/director.svg');
background-size: contain;
background-repeat: no-repeat;
background-position: center;
opacity: .6;
}
.complain-button a:hover{
background: #8C7265;
}
.val-about-company{
display: grid;
gap: 20px;
grid-template-columns: 1fr 1fr;
}
.val-about-company h2{
color: #3D3734;
font-size: 30px;
font-weight: 400;
line-height: 120%;
}
.val-about-company-text p{
color: #424242cc;
font-size: 16px;
font-weight: 500;
line-height: 120%;
}
.val-about-company img{
border-radius: 16px;
}
.val-about-company .video_block{
cursor: pointer;
}
.catalog-sections{
margin-bottom: 60px;
margin-top: 0;
}
.val-about-company .video_block:before {
content: "";
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 100px;
height: 100px;
background-color: #d82c0ecc;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
z-index: 2;
transition: all 0.3s ease;
}
.val-about-company .video_block:hover:before {
background-color: #d82c0ee6;
transform: translate(-50%, -50%) scale(1.1);
}
/* Белый треугольник с закругленными углами */
.val-about-company .video_block:after {
content: "";
position: absolute;
top: 50%;
left: 50%;
transform: translate(-36%, -50%);
width: 35px;
height: 42px;
background-image: url("data:image/svg+xml,%3Csvg width='36' height='44' viewBox='0 0 36 44' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M33.9782 25.0019C36.438 23.4269 36.435 19.8321 33.9726 18.2611L6.515 0.743729C3.84806 -0.957724 0.354803 0.963642 0.363649 4.1271L0.461627 39.1631C0.470454 42.3194 3.96041 44.2225 6.61856 42.5205L33.9782 25.0019Z' fill='white'/%3E%3C/svg%3E");
background-size: contain;
background-repeat: no-repeat;
background-position: center;
z-index: 3;
pointer-events: none;
transition: all 0.3s ease;
}
.val-about-company .video_block:hover:after {
transform: translate(-38%, -50%) scale(1.2);
}
.video-modal-content{
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
border-radius: 18px 18px 0 0;
overflow: hidden;
}
.catalog-popular-items h2{
color: #3D3734;
font-size: 30px;
font-weight: 400;
line-height: 120%;
}
.catalog-popular-items h2 span{
display: flex;
flex-wrap: nowrap;
justify-content: space-between;
align-items: center;
}
h2 a.heading-note{
font-family: 'Roboto', Arial, sans-serif;
color: #867769;
background: #FAF3ED;
padding: 0 16px 0 20px;
height: 32px;
display: flex;
align-items: center;
justify-content: flex-start;
border-radius: 10px;
font-size: 15px;
font-weight: 500;
}
h2 a.heading-note::after {
content: "";
display: inline-block;
width: 20px;
height: 20px;
background-image: url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg opacity='0.8'%3E%3Cpath d='M8.33337 5L12.7441 9.41074C13.0696 9.73618 13.0696 10.2638 12.7441 10.5893L8.33337 15' stroke='%23867769' stroke-width='1.5' stroke-linecap='round'/%3E%3C/g%3E%3C/svg%3E");
background-size: contain;
background-repeat: no-repeat;
background-position: center;
margin-left: 3px;
vertical-align: middle;
}
.catalog-items{
display: grid;
grid-template-columns: repeat(auto-fit, minmax(228px, 1fr));
column-gap: 22px;
row-gap: 42px;
padding: 0 !important;
}
body .catalog-items, ul.catalog-items, body div.catalog-items{
contain: unset !important;
}
.catalog-items .catalog-item, ul.catalog-items li{
width: 100%;
margin: 0 !important;
}
.val-photo-card{
border-radius: 20px;
}
.val-photo-card a{
background: #FAF3ED;
height: 179px !important;
display: flex;
display: flex !important;
align-items: center;
justify-content: center;
border-radius: 20px;
left: unset !important;
transform: unset !important;
-webkit-transform: unset !important;
overflow: hidden;
}
.catalog-items .catalog-item-image img{
mix-blend-mode: darken;
width: 84%;
object-fit: contain;
padding: 0px 14px;
}
.catalog-item-image .label.label-discount,
.catalog-item-image .label.label-offer,
.catalog-item-image .label.label-hit,
.catalog-item-image .label.label-eco{
background-image: none !important;
}
.catalog-item-image .label{
top: 0;
}
.label{
width: unset !important;
height: unset !important;
background: #8C7265a3 !important;
color: #fff;
padding: 3px 9px !important;
display: flex;
border-radius: 50px;
font-size: 14px;
position: absolute !important;
top: 10px !important;
left: 10px !important;
align-items: center;
justify-content: center;
backdrop-filter: blur(4px);
}
.label-eco{
background: #DAF0A6 !important;
color: #82A828;
}
.catalog-items .catalog-item.catalog-element{
transition: all 0.3s ease !important;
border-radius: 20px;
gap: 10px;
min-height: unset;
}
.catalog-items .catalog-item.catalog-element:hover{
box-shadow: unset;
transform: translateY(-3px) !important;
}
.catalog-items .catalog-item.catalog-element::before {
content: '';
position: absolute;
top: -10px;
left: -10px;
right: -10px;
bottom: -10px;
border-radius: 28px;
opacity: 0;
transition: opacity 0.3s ease;
z-index: -1;
box-shadow: 0 8px 32px rgba(0, 0, 0, 0.12);
}
.catalog-items .catalog-item.catalog-element:hover::before {
opacity: 1;
}
.catalog-items .catalog-item-title a{
color: #424242;
font-size: 16px;
line-height: 120%;
font-weight: 400;
text-align: unset;
display: -webkit-box;
line-clamp: 4;
-webkit-line-clamp: 4;
-webkit-box-orient: vertical;
overflow: hidden;
}
.catalog-items .catalog-item.catalog-element:hover .catalog-item-image img {
filter: unset;
opacity: unset;
transition: unset;
}
.catalog-items .catalog-item-title-and-description,
.catalog-items .catalog-item-price-and-buy{
border: none;
}
.catalog-items .catalog-item-price-and-buy{
background: unset;
padding: 0 !important;
height: 100%;
}
.catalog-items .catalog-item:not(.dayly-product-item) .catalog-item-title-and-description{
padding: 0 !important;
margin-top: 0;
}
.catalog-items .catalog-item:not(.dayly-product-item) .catalog-item-buy a{
border: none;
height: 40px;
display: flex;
justify-content: center;
align-items: center;
border-radius: 10px;
background: #8C7265;
font-size: 15px;
font-weight: 400;
transition: all 0.3s ease !important;
gap: 10px;
}
.catalog-items .catalog-item:not(.dayly-product-item) .catalog-item-buy a::before{
content:"";
background: url(img/shopping-cart-tovar.svg) no-repeat center !important;
height: 22px;
width: 22px;
}
.catalog-items .catalog-item:not(.dayly-product-item) .catalog-item-buy a span{
padding: 1px 0 0 0;
}
.catalog-items .catalog-item.catalog-element:hover .catalog-item-buy a{
border-radius: 20px;
}
.catalog-items .catalog-item:not(.dayly-product-item) .catalog-item-buy a:hover{
color: #fff;
background-color: #997f71;
}
.catalog-items .catalog-item:not(.dayly-product-item) .catalog-item-buy a.in_basket::before{
display: none;
}
.catalog-items .catalog-item:not(.dayly-product-item) .catalog-item-buy a.in_basket {
background-color: #F4EEE8;
color: #867769;
font-weight: 500;
}
.catalog-items .catalog-item:not(.dayly-product-item) .catalog-item-buy a.in_basket:hover{
background-color: #ebe2d8;
border-color: unset;
color: #867769;
}
.catalog-item-price-and-buy{
gap: 10px;
}
.catalog-items .catalog-item:not(.dayly-product-item) .catalog-item-price .normalprice,
.catalog-items .catalog-item:not(.dayly-product-item) .catalog-item-price .rub{
color: #3D3734;
font-weight: 500;
font-style: normal;
font-size: 22px;
margin: 0;
}
.catalog-items .catalog-item:not(.dayly-product-item) .catalog-item-price .unit{
color: #3D3734;
opacity: .4;
font-size: 16px;
}
.catalog-items .catalog-item:not(.dayly-product-item) .catalog-item-price .oldprice{
color: #3D3734;
opacity: .4;
font-size: 16px;
font-style: normal;
font-weight: 500;
padding: 4px 0 0 0;
}
.catalog-items .catalog-item:not(.dayly-product-item) .catalog-item-price .oldprice .rub{
font-size: 16px;
}
.val-photo-card .percent{
position: absolute;
bottom: 10px;
left: 10px;
width: unset !important;
height: unset !important;
background: #da2e0ecc;
color: #fff;
padding: 3px 9px !important;
display: flex;
border-radius: 50px;
font-size: 14px;
align-items: center;
justify-content: center;
backdrop-filter: blur(4px);
}
.catalog-items .catalog-item.catalog-element .save-item{
position: absolute;
z-index: 20;
right: 10px;
top: 10px;
width: 19px;
height: 19px;
}
.add-to-favorites:before{
margin-right: 0;
color: #8C7265;
}
.catalog-item-price-and-buy .catalog-item-title,
.catalog-item-price-and-buy .catalog-item-title-and-description{
flex: 1 1 auto !important;
}
.catalog-items .catalog-item:not(.dayly-product-item) .catalog-item-title-and-description{
-webkit-box-flex: unset;
-webkit-flex: unset;
-ms-flex: unset;
flex: unset;
}
.catalog-items .catalog-item:not(.dayly-product-item) .catalog-item-price .normalprice{
width: max-content;
}
.catalog-items .catalog-item:not(.dayly-product-item) .catalog-item-price .price{
padding-right: 0;
align-items: center;
justify-content: space-between;
}
.catalog-item-buy{
margin: 10px 0 0 0;
}
.mp-rating-value{
background-image: url('/local/templates/optima/css/img/stars.svg') !important;
height: 17px !important;
background-position: left bottom !important;
}
.mp-rating-value div{
background-image: url('/local/templates/optima/css/img/stars.svg') !important;
height: 17px !important;
background-position: left top !important;
}
.mp-rating-value{
width: 93px !important;
}
.catalog-items .catalog-item:not(.dayly-product-item) .mp-rating-value{
margin: 0;
}
.catalog-items .catalog-item:not(.dayly-product-item) .mp-rating-value-wrap{
align-items: center;
gap: 12px;
}
.catalog-items .mp-rating-value-wrap span {
font-size: 14px !important;
line-height: 120%;
color: #B1AFAE;
margin-top: 4px;
}
.catalog-items .catalog-item.catalog-element .catalog-item-image .img_block{
display: initial;
background-color: unset;
width: 100%;
mix-blend-mode: darken;
width: 100%;
object-fit: cover;
}
.banner-block-aktsii{
background-color: #FFF9F3;
padding-bottom: unset;
gap: 0;
border-radius: 20px;
box-shadow: inset 0 0 0 1px #F4EEE8;
width: 100%;
height: 195px;
overflow: hidden;
position: relative;
}
.banner-figure-1 {
position: absolute;
width: 491px;
height: 491px;
background: radial-gradient(circle, #F4EDE8 0%, #F4EDE8 100%);
border-radius: 50%;
top: -17px;
left: 105px;
pointer-events: none;
}
.banner-figure-2{
position: absolute !important;
top: -200px !important;
right: -49px;
width: 349px;
height: 529px;
pointer-events: none; /* чтобы не мешала кликам */
}
.banner-block .banner-item {
width: max-content !important;
height: max-content;
margin-left: 0;
z-index: 1;
position: relative;
top: 50%;
left: 55%;
transform: translate(-50%, -50%);
display: flex;
flex-direction: column;
gap: 26px;
}
.banner-block .banner-item .banner-item-title-label{
color: #8C7265 !important;
font-size: 48px;
display: inline-block;
padding: 0;
margin: 0;
}
.banner-block .banner-item .banner-item-wrap{
position: unset;
width: max-content;
}
.val-btn-banner-wrap .val-btn-banner{
color: #424242;
font-size: 18px;
line-height: 120%;
font-weight: 600;
padding: 10px 24px;
border-radius: 10px;
background: #fff;
}
.val-banner-img-1,
.val-banner-img-2{
mix-blend-mode: darken;
position: absolute;
z-index: 1;
}
.val-banner-img-1{
top: 9px;
right: 21px;
}
.val-banner-img-2{
top: 14px;
left: 27px;
}
.val-company--about{
margin: 60px 0 0 0;
}
.company-about__title{
color: #3D3734;
font-size: 30px;
}
.company-about__subtitle{
color: #686868;
font-size: 16px;
font-weight: 500;
}
.company-about__features{
display: grid;
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
gap: 10px;
}
.feature-card {
background: #FAF3ED;
padding: 20px;
border-radius: 20px;
display: flex;
flex-direction: column;
gap: 10px;
}
.feature-card__icon {
display: flex;
justify-content: center;
}
.feature-card__title{
font-family: 'Roboto', Arial, sans-serif;
color: #424242;
font-size: 16px;
font-weight: 500;
margin: 0;
}
.feature-card__description{
color: #676664;
font-size: 14px;
font-weight: 400;
margin: 0;
}
.val-company--about .container {
display: flex;
flex-direction: column;
gap: 30px;
padding: 0 !important;
}
.company-about__info{
display: grid;
grid-template-columns: 1fr 1fr;
gap: 20px;
}
.company-about__section-title{
color: #424242;
font-size: 22px;
font-weight: 400;
}
.clients-list__item,
.values-list__item{
color: #424242;
font-size: 16px;
font-weight: 400;
margin: 0;
padding: 0 0 0 8px;
}
.company-about__info .clients-list,
.company-about__info .values-list{
display: flex;
flex-direction: column;
gap: 16px;
margin: 0px 0 0 20px;
}
.company-about__info ul li::marker{
content: "\27A4";
color: #DA2E0E;
}
.company-about__quote{
padding: 16px 20px;
border-left: 4px solid #867769;
font-size: 16px;
color: #424242;
width: 100%;
background: #FAF3ED;
line-height: 140%;
}
.hidden-prods-wrap.pb-0.mtp-45{
margin-top: 0;
}
/* Скрываем hidden-prods-wrap на странице оформления заказа */
body:has(.VAL-ORDER-FORM) .hidden-prods-wrap,
body.order-page .hidden-prods-wrap {
display: none !important;
}
/* Футер начало */
.footer {
margin-left: calc(-50vw + 50%);
margin-right: calc(-50vw + 50%);
width: 100vw;
}
.footer-container{
max-width: 1440px;
margin: 0 auto;
padding: 50px 40px 20px !important;
}
.footer-bg {
padding-top: 0;
padding-bottom: 0;
background: linear-gradient(to right, rgb(17 6 0 / 55%), rgb(29 12 0 / 50%) 50%, rgb(17 6 0 / 55%)) !important;
}
.footer-content {
display: grid;
grid-template-columns: 1fr 1fr 1fr 1fr;
gap: 40px;
padding: 0 0 20px 0;
}
.footer-column {
display: flex;
flex-direction: column;
gap: 20px;
max-width: 260px;
}
.footer-brand {
grid-column: 1;
}
.logo-image {
height: auto;
width: 100%;
max-height: 72px;
}
/* Заголовки */
.footer-title {
font-size: 17px;
font-weight: 600;
color: #fff;
margin: 0 0 5px 0;
font-family: 'Roboto', Arial, sans-serif;
border-bottom: 1px solid #ffffff99;
padding-bottom: 4px;
}
/* Навигационные ссылки */
.footer-nav {
display: flex;
flex-direction: column;
gap: 16px;
}
.footer-links {
display: flex;
flex-direction: column;
gap: 16px;
}
.footer-link,
.contact-phone,
.contact-link,
.footer-column.o-nas li a,
.copyright p a{
color: #fff;
text-decoration: none !important;
font-size: 15px !important;
font-weight: 500;
position: relative;
transition: color 0.3s ease;
width: fit-content; /* Добавляем эту строку */
}
.footer-link::after,
.contact-phone::after,
.contact-link::after,
.footer-column.o-nas li a::after,
.copyright p a::after {
content: '';
position: absolute;
bottom: -2px;
right: 0;
width: 0;
height: 1px;
background-color: #fff;
transition: width 0.3s ease;
}
.footer-link:hover,
.contact-phone:hover,
.contact-link:hover,
.footer-column.o-nas li a:hover,
.copyright p a:hover {
color: #fff;
}
.footer-link:hover::after,
.contact-phone:hover::after,
.contact-link:hover::after,
.footer-column.o-nas li a:hover::after,
.copyright p a:hover::after {
width: 100%;
right: auto;
left: 0;
}
.footer-text {
color: #ffffffb3;
font-size: 15px;
line-height: 1.4;
margin: 0;
}
/* Социальные сети */
.social-section {
margin-top: auto;
display: flex ;
flex-direction: column;
gap: 20px;
}
.social-section-wrap{
display: flex;
flex-direction: column;
gap: 20px;
}
.social-title {
font-size: 17px;
font-weight: 600;
color: #fff;
margin: 0 0 5px 0;
font-family: 'Roboto', Arial, sans-serif;
border-bottom: 1px solid #ffffff99;
padding-bottom: 4px;
}
.social-links {
display: flex;
gap: 10px;
}
.social-link {
opacity: 1;
transition: opacity ease .3s;
}
.social-link:hover {
opacity: .8;
}
/* Контакты */
.footer-contacts {
grid-column: 4;
}
.contact-info {
display: flex;
flex-direction: column;
gap: 16px;
}
.contact-phone-wrap {
display: flex;
flex-direction: column;
gap: 6px;
}
.contact-email,
.contact-address,
.working-hours {
display: flex;
flex-direction: column;
gap: 3px;
}
.contact-label {
color: #ffffffb3;
font-size: 15px;
}
.address-text,
.hours-text {
color: #fff;
margin: 0;
font-size: 15px;
line-height: 120%;
}
.footer-column.o-nas li{
margin: 0 !important;
}
.footer-column.o-nas li::marker{
content:"";
}
.footer-column.o-nas ul {
display: flex;
flex-direction: column;
gap: 16px;
}
.footer-column.o-nas li:last-child{
display: none;
}
footer .val-otz {
color: #fff;
font-size: 15px;
text-decoration: unset !important;
align-items: center;
line-height: 100%;
border: 1px solid #ffffff99;
border-radius: 4px;
}
/* Нижняя часть футера */
.footer-bottom {
padding: 20px 0 0;
}
.footer-bottom-content {
display: flex;
justify-content: space-between;
align-items: center;
flex-wrap: wrap;
gap: 20px;
font-size: 12px;
color: #999999;
border-top: 1px solid rgba(255, 255, 255, 0.6);
padding: 20px 0;
}
footer .copyright{
height: unset;
padding: 0;
margin: 0;
border: none;
}
.copyright p,
.disclaimer p,
.developer p {
margin: 0;
color: #ffffffb3;
font-size: 15px;
font-weight: 400;
}
.developer a{
display: flex;
align-items: center;
gap: 10px;
text-decoration: unset !important;
}
.developer p{
transition: color ease .4s, opacity ease .4s;
}
.developer img{
opacity: .5;
transition: color ease .4s, opacity ease .4s;
}
.developer:hover img{
opacity: 1;
}
.developer:hover a p{
color: #fff;
}
/* Футер конец */
.header-float {
height: 64px !important;
}
.header-float .content-center{
max-width: 1410px;
padding: 0 10px;
display: flex;
flex-direction: row;
flex-wrap: nowrap;
justify-content: space-between;
height: 100%;
gap: 30px;
}
.header-float .content-center:after{
display: none;
}
.header-float .header-logo{
max-width: 190px;
padding: 0 !important;
margin: 0;
}
.header-float .header-logo a{
height: 100%;
display: flex;
align-items: center;
align-content: center;
justify-content: center;
}
.float-catalog{
color: #fff;
background: #8C7265;
border-radius: 10px;
padding: 0 20px 0 14px;
height: 42px;
display: flex !important;
align-items: center;
justify-content: center;
flex-direction: row;
font-size: 15px;
font-weight: 500;
cursor: pointer;
gap: 16px;
z-index: 10000;
}
.float-catalog:before{
content: "";
background: url(/local/templates/optima/css/img/burger-val.svg) no-repeat center !important;
width: 24px;
height: 24px;
display: block;
}
.val-panel .head_flexer{
margin: 0 0px 0px 10px;
background: unset;
}
.val-panel{
width: 348px;
}
.val-1:hover > .phones__dropdown {
opacity: 1 !important;
visibility: visible !important;
}
.val-1:hover {
z-index: 1000;
}
.val-1 svg{
cursor: pointer;
}
.val-panel .phones__dropdown{
left: -20px !important;
top: 47px;
box-shadow: 0px 20px 20px 0px #00000021;
}
.float-phone-wrap{
display: flex;
flex-direction: row;
gap: 20px;
align-items: flex-start;
margin-bottom: 20px;
border-bottom: 1px solid #EBECEF;
padding-bottom: 20px;
}
.val-header-float .header-searcher .search-container .search-field .inputers input[type="text"]{
border: 1px solid #D9D9D9 !important;
color: #424242;
margin-top: 0;
width: 100% !important;
}
.val-header-float .val-search{
flex: 1 1 100%;
}
body .val-header-float .val-search .search-field-submit {
background: url('data:image/svg+xml;utf8,') no-repeat center !important;
top: 3px;
}
body .val-header-float .val-search .search-field-submit::after{
background: #5a2c0d21;
}
.val-header-float .val-search .search-field-input::placeholder{
color: #7B7B7B;
}
div.title-search-result{
/* display: block !important; Сделать поиск всегда видимым для отладки */
margin-left: 0;
border-radius: 20px;
box-shadow: 0 0 40px 0px #0000004d;
}
/*header.header-float{
top: 170px !important; Сделать отступ сверху для плавающей шапки для отладки
}*/
.psevdo-filter{
width: unset;
padding-right: unset;
}
.filter-poisk {
flex-wrap: wrap;
gap: 5px;
margin: 0 0 20px 0;
padding-right: 30px;
}
.search-close-btn {
position: absolute;
top: 14px;
right: 12px;
height: 34px;
width: 34px;
background: #f4eee8;
border: 1px solid #f4eee8;
border-radius: 50%;
cursor: pointer;
font-size: 16px;
line-height: 22px;
text-align: center;
color: #8c7265;
z-index: 10001;
transition: all 0.2s ease;
user-select: none;
display: flex;
justify-content: center;
align-items: center;
}
/* .search-close-btn:hover {
background: #8c7265;
border-color: #8c7265;
color: #f4eee8;
} */
.btn-filter{
margin-bottom: unset;
background: #F4EEE8;
padding: 6px 14px;
color: #5F4E3F;
transition: background .3s ease;
}
.btn-filter:hover{
background: #eae2d9;
}
div.title-search-result .search-results .search-result-item .image {
float: unset;
margin-right: 0;
}
div.title-search-result .search-results .price {
font-weight: 600;
}
div.title-search-result .search-results .price .rub{
font-size: 100%;
font-weight: 400;
}
div.title-search-result .search-results .search-result-item {
display: flex;
flex-direction: row;
align-items: flex-start;
gap: 10px;
width: 100% !important;
padding: 0;
}
div.title-search-result .search-results .search-result-item:after {
display: none;
}
div.title-search-result .search-results .search-result-item .image{
background: #fff;
}
div.title-search-result .search-results .bx-image{
mix-blend-mode: darken;
}
div.title-search-result .search-results .search-result-item .element-title{
font-size: 16px;
color: #424242;
}
div.title-search-result .search-results{
display: flex;
margin: 0;
gap: 10px;
flex-direction: column;
}
div.title-search-result .contaner-item-bui{
border-bottom: 1px solid #edebeb;
padding: 0 0 10px 0;
gap: 10px;
}
div.title-search-result .search-results .btn-container{
width: auto;
align-items: flex-start;
}
div.title-search-result .search-results .btn-buy{
background-color: #8C7265;
transition: background .3s ease;
padding: 10px 30px;
}
div.title-search-result .search-results .btn-container .in_basket span{
font-size: 14px;
padding: 0;
background: unset;
color: #867769;
}
div.title-search-result .search-results .btn-container a.in_basket{
transition: background .3s ease;
padding: 10px 0px;
background-color: #F4EEE8;
min-width: 106px;
text-align: center;
border-radius: 10px;
}
div.title-search-result .search-results .btn-buy:hover{
background-color: #9b8072;
}
div.title-search-result .contaner-item-bui:nth-last-child(2){
border-bottom: none !important;
}
div.title-search-result .search-results .search-result-item.all-result{
margin: -11px 0 -16px -16px;
background: #f4eee8;
padding: 10px 0;
width: calc(100% + 32px) !important;
justify-content: center;
font-size: 16px;
color: #3D3734;
}
div.title-search-result .search-results .all-result {
transition: background .3s ease;
}
div.title-search-result .search-results .all-result:hover {
background: #eae2d9 !important;
}
/* Временные стили для отладки - корзина всегда открыта
.val-header-top .header-cart-dropdown {
display: block !important;
position: relative !important;
}
.val-header-top .header-cart-dropdown {
right: 320px;
top: 230px;
}*/
/* Временные стили для отладки - корзина всегда открыта */
header .header-cart-item {
border-bottom: 0;
background: #FAF3ED;
padding: 14px;
border-radius: 20px;
display: flex;
flex-direction: row;
gap: 10px;
border: 1px solid #F4EEE8;
}
header .header-cart-items {
display: flex;
flex-direction: column;
gap: 10px;
margin-left: -10px;
margin-right: -7px;
padding-left: 10px;
padding-right: 6px;
}
header .header-cart-buttons .button-order{
background: #8C7265;
color: white !important;
border: 0;
border-radius: 10px;
text-transform: unset;
font-weight: 400;
display: flex !important;
align-items: center;
justify-content: center;
padding: 10px 0;
margin: 0 !important;
}
header .header-cart-buttons .button-order:hover{
background-color: #9b8072;
}
.header-cart-dropdown{
box-shadow: 0px 0px 40px 0px #00000030;
border-radius: 20px;
padding: 10px 10px;
}
header .header-cart-buttons {
margin-top: 10px;
}
header .header-cart-item-image{
margin-right: 0;
float: unset;
width: unset;
text-align: unset;
}
header .header-cart-item-image img{
mix-blend-mode: darken;
}
.header-cart-item-left{
flex: 0 0 70px;
}
.header-cart-item-right{
display: flex;
flex-direction: column;
gap: 10px;
padding-right: 20px;
}
.header-cart-item-left .header-cart-item-image a{
margin: 0 !important;
}
header .header-cart-item-title{
color: #3D3734 !important;
font-size: 16px;
line-height: 120%;
font-weight: 500;
margin-bottom: 0;
}
.header-cart-item-right .header-cart-item-title a{
color: #3D3734 !important;
font-size: 16px;
display: -webkit-box !important;
line-clamp: 4;
-webkit-line-clamp: 4;
-webkit-box-orient: vertical;
overflow: hidden;
line-height: 130%;
font-weight: 400;
margin: 0 !important;
}
.header-cart-item-right .header-cart-item-summ{
margin: 0 !important;
font-size: 16px !important;
}
.header-cart-item-right .header-cart-item-summ strong{
color: #3D3734;
font-size: 20px !important;
line-height: 120%;
font-weight: 700;
}
header .header-cart-item-delete{
background-image: unset;
margin: 0;
top: 11px;
right: 10px;
}
header .header-cart-item-delete:before{
content: "";
background: url(/local/templates/optima/css/img/trash.svg) no-repeat center center;
display: flex;
width: 24px;
height: 24px;
background-size: contain;
justify-content: center;
align-items: center;
}
header .header-cart-item:after{
display: none;
}
.header-reyt-time{
display: none;
}
.main_slider {
opacity: 0;
transition: opacity 0.4s ease-in-out;
}
.main_slider.slick-initialized {
opacity: 1;
}
header.header-float .content-center .header-logo img {
width: 160px;
flex: 1 0 160px;
}
.header-searcher .search-container .search-field.pull{
box-shadow: 0 0 50px 0px #0000003d;
left: -15px;
border-radius: 0 0 20px 20px;
}
header .header-scroll .content-center{
margin: 0 !important;
padding: 0 !important;
}
header .header-scroll .header-top-pannel{
right: -20px;
}
.search-field.pull #title-search-input{
width: 100%;
margin: 0 62px 0 15px;
padding: 0 61px 0 20px;
border: 1px solid #D9D9D9 !important;
color: #424242;
}
.search-field.pull #title-search-input .search-field-input::placeholder{
color: #ffffffb3;
font-weight: 400;
}
.header-searcher .search-container .search-field span {
position: absolute;
right: 0;
}
.search-field.pull .search-field-submit::after{
opacity: 1;
}
.search-field.pull .search-field-submit{
opacity: 1;
filter: brightness(1.5);
}
.search-field.pull .search-field-submit{
right: 69px;
top: 11px;
}
.feature-card__text{
display: flex;
flex-direction: column;
gap: 10px;
}
.footer-catalog-section-menu{
max-width: 450px;
margin: 30px auto 0
}
.footer-catalog-section-menu a{
color: #fff !important;
font-weight: 500;
font-size: 15px;
}
.footer-catalog-section-menu{
display: none;
}
/* Мобилки начало */
#mobileheader{
display: none;
}
.mobile-menu{
height: 44px !important;
}
header .header-menu ul.fixed-menu{
background: #333;
width: 380px;
box-shadow: unset;
}
/* Стили для самого меню */
#mob-menu {
position: fixed;
top: 0;
left: 0;
width: 360px;
height: 100vh;
background: #fff;
overflow-y: auto;
overflow-x: hidden;
z-index: 1000;
box-shadow: 2px 0 5px rgba(0,0,0,0.1);
transform: translateX(-105%);
transition: transform 0.3s ease;
display: flex;
flex-direction: column;
gap: 20px;
padding: 0 0 20px 0;
}
/* Когда активна админская панель */
body#panel #mob-menu {
top: 39px; /* высота админской панели, обычно 55px */
}
/* Показываем меню когда активно */
#mob-menu.fixed-menu {
transform: translateX(0);
}
/* Блокируем прокрутку фона - используем ДРУГОЕ имя класса для body */
body.fixed-menu-open {
overflow: hidden !important;
position: fixed !important;
width: 100% !important;
height: 100% !important;
touch-action: none;
}
.menu-close{
left: unset;
right: 6px;
display: none !important;
top: 10px !important;
position: absolute;
}
.mob-menu-sect-wrap .menu-close{
display: block !important;
}
#mob-menu .mobile-logo a{
width: 207px;
height: 57px;
}
#mob-menu .mobile-logo a img{
mix-blend-mode: darken;
}
#mob-menu .mobile-logo a:hover{
background: unset !important;
}
#mob-menu .mobile-logo{
padding: 0 14px;
}
#mob-menu .mob-menu-sect-wrap{
display: flex;
flex-direction: column;
gap: 10px;
background: #FAF3ED;
width: 100%;
padding: 20px 10px;
}
.menu-close{
background: url('data:image/svg+xml;utf8,');
width: 44px;
height: 44px;
}
.mob-menu-sect-2{
background: #8C7265;
padding: 20px;
border-radius: 16px;
position: relative;
display: flex;
flex-direction: column;
gap: 18px;
margin-bottom: 8px;
}
.mob-menu-sect-3 span{
margin-bottom: 0 !important;
margin-top: 8px;
}
.mob-menu-sect-2 .menu-item{
color: #fff !important;
display: flex;
flex-direction: row;
gap: 20px;
align-items: center;
line-height: 120%;
font-weight: 400;
}
body .mob-menu-sect-2 .menu-item:hover{
background: unset !important;
}
.mob-menu-sect-2 .menu-item:before{
content: "";
width: 24px;
height: 24px;
}
.mob-menu-sect-2 .menu-item__kompany:before{
background: url("img/mobile-menu/kompany.svg") no-repeat;
}
.mob-menu-sect-2 .menu-item__news:before{
background: url("img/mobile-menu/news.svg") no-repeat;
}
.mob-menu-sect-2 .menu-item__pays:before{
background: url("img/mobile-menu/pays.svg") no-repeat;
}
.mob-menu-sect-2 .menu-item__contacts:before{
background: url("img/mobile-menu/contacts.svg") no-repeat;
}
.mob-menu-sect-2 .menu-item__recepts:before{
background: url("img/mobile-menu/recepts.svg") no-repeat;
}
.mob-menu-sect-2 .menu-item__action:before{
background: url("img/mobile-menu/action.svg") no-repeat;
}
.mob-menu-sect-2 .menu-item__partners:before{
background: url("img/mobile-menu/partners.svg") no-repeat;
}
.mob-menu-sect-2 .menu-item__reviews:before{
background: url("img/mobile-menu/reviews.svg") no-repeat;
}
.mob-menu-sect-2:before{
content: "";
position: absolute;
background: url("img/mobile-menu/morskie-zveri.svg") no-repeat;
width: 148px;
height: 361px;
right: 10px;
top: 10px;
}
.mob-menu-sect-2 .val-otz:after{
display: inline-block !important;
}
.mob-menu-sect-2 .val-otz{
color: #fff;
font-size: 15px;
text-decoration: unset !important;
align-items: center;
line-height: 100%;
border: 1px solid #ffffff99;
border-radius: 4px;
margin-left: 43px;
gap: 5px;
}
.mob-menu-sect-3 span{
margin: 0;
background: #3d3734;
color: #fff !important;
font-weight: 400 !important;
font-size: 15px !important;
height: 50px;
display: flex !important ;
align-items: center;
justify-content: flex-start;
padding: 0 20px 0 25px !important;
border-radius: 10px;
border: none !important;
gap: 20px;
}
.mob-menu-sect-3 span::before {
content: "";
display: inline-block;
width: 24px;
height: 24px;
background-image: url("/local/templates/optima/css/img/mobile-menu/cart.svg");
background-size: contain;
background-repeat: no-repeat;
background-position: center;
}
.mob-menu-sect-3 span::after {
content: "";
display: inline-block;
width: 20px;
height: 20px;
background-image: url("/local/templates/optima/css/img/mobile-menu/shevron.svg");
background-size: contain;
background-repeat: no-repeat;
background-position: center;
margin-left: auto;
}
.mob-menu-sect-4{
display: flex;
flex-direction: column;
gap: 20px;
margin-left: 24px;
}
.mob-menu-sect-6 .contacts-section{
display: flex;
flex-direction: column;
gap: 20px;
margin-left: 34px;
}
.mob-menu-sect-4 .bottom-menu-item{
color: #424242;
font-weight: 500;
font-size: 15px !important;
display: flex;
align-items: center;
gap: 20px;
border: none;
}
.val-header-top .header-menu .mob-menu-sect-4 a:hover{
background: unset !important;
}
.mob-menu-sect-4 .bottom-menu-item::before{
content: "";
width: 24px;
height: 24px;
background-size: contain;
background-repeat: no-repeat;
background-position: center;
display: inline-block;
opacity: .3;
flex: 0 0 24px;
}
.mob-menu-sect-4 .mob-user::before{
background-image: url("/local/templates/optima/css/img/mobile-menu/mob-user.svg");
}
.mob-menu-sect-4 .mob-cart::before{
background-image: url("/local/templates/optima/css/img/mobile-menu/mob-cart.svg");
}
.mob-menu-sect-4 .mob-heart::before{
background-image: url("/local/templates/optima/css/img/mobile-menu/mob-heart.svg");
}
.mob-menu-sect-5 .header-calendar{
background: radial-gradient(circle at center, #A88E80 0%, #9D7C6D 100%);
padding: 14px 20px;
border-radius: 20px;
display: flex;
gap: 16px;
}
.mob-menu-sect-5 .calendar-list{
background: unset;
display: flex;
flex-direction: column;
height: auto !important;
width: unset;
flex: unset;
-webkit-box-flex: unset;
margin: 7px 0 0 0;
max-width: 72px;
align-items: center;
}
.mob-menu-sect-5 .calendar-day{
color: #fff;
font-size: 54px;
font-weight: 400;
line-height: 86%;
}
.mob-menu-sect-5 .calendar-month{
color: #fff;
font-size: 16px;
font-weight: 400;
line-height: 120%;
text-align: center;
}
.mob-menu-sect-5 .calendar-tittle{
color: #fff;
font-size: 15px;
font-weight: 400;
}
.mob-menu-sect-5 .calendar-left{
display: flex;
flex-direction: column;
gap: 6px;
}
.calendar-time{
color: #fff;
font-size: 16px;
padding: 10px 17px 10px 12px;
background: #ffffff33;
display: flex;
align-items: center;
gap: 12px;
justify-content: center;
border-radius: 100px;
border: 1px solid #ffffff1a;
box-shadow: 0 2px 10px 0 #0000001a;
line-height: 120%;
}
.calendar-time::before{
content: "";
background-image: url("/local/templates/optima/css/img/mobile-menu/loading.svg");
width: 20px;
height: 20px;
background-size: contain;
background-repeat: no-repeat;
background-position: center;
display: inline-block;
}
.mob-menu-sect-6 h3{
font-family: 'Roboto', Arial, sans-serif;
color: #8A8A8A;
font-size: 17px;
margin: 0;
}
.mob-menu-sect-6 .contacts-section a:hover{
background: none !important;
}
.mob-menu-sect-6 .contacts-section a,
.mob-menu-sect-6 .contacts-section .contact-item,
.mob-menu-sect-6 .bottom-menu-item{
color: #4E4E4E;
font-size: 15px;
font-weight: 500;
line-height: 120%;
}
.mob-menu-sect-6 .bottom-menu-item{
display: flex;
align-items: center;
gap: 20px;
}
.mob-menu-sect-6 .bottom-menu-item::before{
content: "";
width: 24px;
height: 24px;
background-size: contain;
background-repeat: no-repeat;
background-position: center;
display: inline-block;
flex: 0 0 24px;
}
.mob-menu-sect-6 .mob-phone::before{
background-image: url("/local/templates/optima/css/img/mobile-menu/mob-phone.svg");
}
.mob-menu-sect-6 .mob-grafik::before{
background-image: url("/local/templates/optima/css/img/mobile-menu/mob-grafik.svg");
}
.mob-menu-sect-6 .mob-mail::before{
background-image: url("/local/templates/optima/css/img/mobile-menu/mob-mail.svg");
}
.mob-menu-sect-6 .mob-location::before{
background-image: url("/local/templates/optima/css/img/mobile-menu/mob-location.svg");
}
.mob-menu-sect-6 .mob-location{
align-items: flex-start;
}
.mob-menu-sect-6 .social-links{
opacity: .5;
}
.nicescroll-cursors{
background: rgb(0, 0, 0) !important;
background-color: rgb(0, 0, 0) !important;
}
#hidden-catalog.fixed-catalog {
overflow: visible; /* Оставляем, чтобы внешний контейнер не резал контент */
height: 100vh; /* Полная высота экрана */
}
#hidden-catalog .catalog-menu {
overflow-y: auto; /* Включаем скролл */
height: 100vh; /* Задаем высоту чуть меньше родителя */
}
#hidden-catalog .catalog-menu .catalog-section-menu.before .catalog-section-title .plus{
background-color: unset;
box-shadow: unset;
}
#hidden-catalog .catalog-menu .catalog-section-menu.before .catalog-section-title .plus svg{
flex: 0 0 20px;
opacity: .35;
}
#hidden-catalog .catalog-menu .catalog-section-menu.before .catalog-section-title .plus:hover {
background-color: unset;
}
#hidden-catalog .plus svg path{
stroke: #000;
}
#hidden-catalog.fixed-catalog{
background: #fff;
width: 360px;
display: flex;
flex-direction: column;
gap: 4px;
padding: 0 0 0 0;
left: 0;
box-shadow: unset;
}
#hidden-catalog .catalog-menu .catalog-section-menu .catalog-section-title a {
color: #424242 !important;
font-size: 15px;
font-weight: 500;
}
#hidden-catalog .catalog-menu .catalog-section-menu .catalog-section-title{
padding: 0;
}
#hidden-catalog .catalog-menu .catalog-section-menu{
margin: 0;
}
#hidden-catalog .catalog-menu{
display: flex;
flex-direction: column;
gap: 20px;
padding: 20px;
}
#hidden-catalog .catalog-menu .catalog-section-menu.before a{
width: 100%;
}
#hidden-catalog .catalog-header .menu-close{
display: block !important;
position: absolute;
right: 21px;
left: unset;
}
#hidden-catalog .back-to-menu-btn{
color: #8A8A8A;
font-size: 15px;
font-weight: 500;
}
#hidden-catalog .catalog-header{
padding: 18px 20px 20px 20px;
display: flex;
flex-direction: row;
gap: 8px;
align-items: center;
cursor: pointer;
width: 300px;
}
#hidden-catalog .catalog-header::before{
content: "";
background-image: url("/local/templates/optima/css/img/mobile-menu/back.svg");
width: 28px;
height: 28px;
background-size: contain;
background-repeat: no-repeat;
background-position: center;
display: inline-block;
flex: 0 0 28px;
}
#hidden-catalog .catalog-title{
font-family: 'Roboto', Arial, sans-serif;
color: #8A8A8A;
font-size: 15px;
font-weight: 500;
padding: 0 20px 0 20px;;
margin: 0;
}
#hidden-catalog .catalog-menu .catalog-section-menu.slide .subs{
height: 100vh;
width: 360px !important;
max-height: unset !important;
background-color: #fff !important;
padding: 0;
display: flex;
flex-direction: column;
gap: 4px;
}
#hidden-catalog span.back{
position: relative;
width: 300px;
right: unset !important;
display: flex;
justify-content: flex-start;
height: unset;
padding: 18px 20px 20px 20px;
}
#hidden-catalog span.back-img{
background-image: url("/local/templates/optima/css/img/mobile-menu/back.svg");
flex: 0 0 28px;
opacity: 1;
}
#hidden-catalog span.back-fon{
background-color: unset !important;
width: unset;
gap: 8px;
}
#hidden-catalog span.back-fon:after{
content: "Назад";
color: #8A8A8A;
font-size: 15px;
font-weight: 500;
}
#hidden-catalog .catalog-menu .catalog-section-menu.slide .subs_items{
padding: 20px;
display: flex;
flex-direction: column;
gap: 20px;
}
#hidden-catalog .catalog-menu .catalog-section-menu .subs_items li{
margin: 0;
padding: 0;
}
#hidden-catalog .catalog-menu .catalog-section-menu .subs_items li a{
color: #424242 !important;
font-size: 15px;
font-weight: 500;
}
#hidden-catalog .catalog-menu .catalog-section-menu .subs_items li:last-child {
margin-bottom: unset;
}
#mobileheader .header-menu{
height: 50px;
max-width: unset !important;
gap: 10px;
}
#mobileheader .mobile-logo.logo-out{
width: 133px;
height: 36px;
}
#mobileheader .mobile-logo.logo-out a{
background: unset!important;
}
/* Базовые стили для шапки */
header .header-top {
font-size: 79%;
/* Добавляем плавный переход для всех изменений кроме position */
transition: transform 0.3s ease, box-shadow 0.3s ease, opacity 0.3s ease;
/* Сохраняем естественную высоту */
min-height: 65px; /* вместо фиксированной высоты */
}
/* Стили для фиксированной шапки */
header .header-scroll {
position: fixed;
top: 0;
left: 0;
right: 0; /* Вместо calc(100% - 30px) используем left и right */
z-index: 100;
/* Убираем принудительную высоту - пусть будет естественной */
/* height: 65px; */
/* Сохраняем только transition для top (для админ-панели) */
transition: top 0.3s ease;
/* Добавляем тень для визуального отделения */
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
/* Анимация появления */
animation: slide-header 0.3s ease forwards;
}
/* Анимация появления фиксированной шапки */
@keyframes slide-header {
from {
transform: translateY(-100%);
opacity: 0;
}
to {
transform: translateY(0);
opacity: 1;
}
}
/* Класс для компенсации высоты (добавляется к body) */
/*.header-fixed-compensate {
Отступ будет задаваться через JavaScript динамически
}*/
/* Дополнительные стили для плавности */
.val-header-top {
height: auto !important;
}
/* Если нужны отступы по бокам только для фиксированной шапки */
header .header-scroll .container,
header .header-scroll > div {
margin-left: 15px;
margin-right: 15px;
}
header .header-top {
font-size: 79%;
}
header .header-scroll {
position: fixed !important;
top: 0 !important;
left: 0 !important;
right: 0 !important;
width: auto !important;
z-index: 100 !important;
transition: top 0.3s ease;
animation: slide-header 0.3s ease forwards;
box-shadow: unset;
}
@keyframes slide-header {
from {
transform: translateY(-100%);
opacity: 0;
}
to {
transform: translateY(0);
opacity: 1;
}
}
.val-header-top {
height: auto !important;
}
header .header-scroll {
position: fixed;
top: 0;
left: 0;
right: 0;
z-index: 100;
/* остальные стили */
}
.header-searcher span.svg_search,
.header-searcher .search-container .search-field span{
cursor: pointer;
}
/* Мобилки конец */
/* Поиск */
/*div.title-search-result {
display: block !important;
}*/
div.title-search-result .contaner-item-bui{
flex-direction: row !important;
}
div.title-search-result {
/*top: 55px !important;*/
left: 15px !important;
}
body div.title-search-result {
width: calc(100vw - 25px) !important;
left: 50% !important;
transform: translateX(-50%);
max-width: 720px;
overflow-y: auto; /* вертикальный скролл */
overflow-x: hidden; /* горизонтальный скролл скрыт */
/* max-height: 520px; */
/* display: block !important; */
}
div.title-search-result .search-results .btn-container{
justify-content: flex-start;
margin: 0;
width: unset !important;
}
.title-search-result {
position: fixed !important;
/* top: 50px !important; */
z-index: 1000 !important;
}
/* Поиск */
/* Плавающая шапка - кнопка "Каталог" начало */
.float-catalog.catalog-active {
background-color: #8C7265 !important;
color: #fff !important;
}
/*.float-catalog.catalog-active:before,
.float-catalog.catalog-active:after {
background-color: #fff !important;
}*/
/* Плавающая шапка - кнопка "Каталог" конец */
/* Мобильная нижняя навигация начало */
/* Мобильная нижняя навигация */
.mobile-bottom-nav {
position: fixed;
bottom: 0;
left: 0;
right: 0;
background-color: #ffffff;
box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.1);
z-index: 1000;
display: none; /* Скрыта по умолчанию */
}
/* Показывать только на мобильных устройствах */
@media (max-width: 768px) {
.mobile-bottom-nav {
display: block;
}
/* Скрываем mobile-bottom-nav на странице оформления заказа */
.VAL-ORDER-FORM ~ .mobile-bottom-nav,
body:has(.VAL-ORDER-FORM) .mobile-bottom-nav,
.VAL-ORDER-FORM .mobile-bottom-nav {
display: none !important;
}
/* Добавляем отступ снизу к body, чтобы контент не перекрывался навигацией */
body {
padding-bottom: 70px !important;
}
/* Убираем отступ снизу на странице оформления заказа, так как там своя кнопка */
body:has(.VAL-ORDER-FORM),
body.order-page {
padding-bottom: 0 !important;
}
/* Скрываем футер на странице оформления заказа */
body:has(.VAL-ORDER-FORM) .footer.footer-bg,
body.order-page .footer.footer-bg {
display: none !important;
}
}
.mobile-nav-list {
display: flex;
justify-content: space-around;
align-items: center;
margin: 0;
padding: 0;
list-style: none;
height: 70px;
}
.mobile-nav-item {
flex: 1;
text-align: center;
margin: 0;
}
.mobile-nav-link {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
padding: 8px 4px;
text-decoration: none;
color: #666;
font-size: 12px;
line-height: 1.2;
transition: color 0.3s ease;
position: relative;
}
.mobile-nav-link:hover {
color: #867769;
text-decoration: none;
}
.mobile-nav-link.active {
color: #867769;
}
/* Контейнер для иконки */
.mobile-nav-icon {
width: 24px;
height: 24px;
margin-bottom: 4px;
background-color: currentColor;
mask-size: contain;
mask-repeat: no-repeat;
mask-position: center;
}
/* Иконки */
.mobile-nav-list .icon-home {
mask-image: url("data:image/svg+xml;utf8,");
}
.mobile-nav-list .icon-catalog {
mask-image: url("data:image/svg+xml;utf8,");
}
.mobile-nav-list .icon-favorites {
mask-image: url("data:image/svg+xml;utf8,");
}
.mobile-nav-list .icon-cart {
mask-image: url("data:image/svg+xml;utf8,");
}
/* Счетчик для корзины и избранного */
.mobile-nav-badge {
position: absolute;
top: 2px;
right: 43%;
transform: translateX(50%);
background-color: #ff4757;
color: white;
border-radius: 10px;
padding: 2px 6px;
font-size: 10px;
line-height: 1;
min-width: 16px;
text-align: center;
display: none;
}
.mobile-nav-badge.show {
display: block;
}
/* Мобильная навигация конец */
/* Каталог в плавающей шапке начало */
/* Стили для поп-апа каталога */
.catalog-popup-section {
border-bottom: 1px solid #f0f0f0;
background: white;
}
.catalog-popup-section:last-child {
border-bottom: none;
}
.catalog-popup-section-header {
padding: 16px 25px;
display: flex;
justify-content: space-between;
align-items: center;
cursor: pointer;
transition: background 0.2s;
background: white;
}
.catalog-popup-section-link {
text-decoration: none;
color: #333;
font-weight: 600;
font-size: 16px;
flex: 1;
}
.catalog-popup-section-link:hover {
color: #333;
}
.catalog-popup-toggle {
font-size: 20px;
color: #666;
font-weight: bold;
transition: transform 0.2s;
margin-left: 15px;
user-select: none;
}
.catalog-popup-section.expanded .catalog-popup-toggle {
transform: rotate(45deg);
}
.catalog-popup-children {
background: #fef9f3;
margin: 0;
padding: 0;
list-style: none;
max-height: 0;
overflow: hidden;
transition: all 0.3s ease-out;
}
.catalog-popup-section.expanded .catalog-popup-children {
max-height: none;
padding: 10px 0;
display: grid;
grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
}
.catalog-popup-subitem {
margin: 0;
}
.catalog-popup-subitem a {
display: block;
padding: 4px 24px;
text-decoration: none;
color: #867769;
font-size: 14px;
transition: all 0.2s;
border-left: 3px solid transparent;
}
.catalog-popup-subitem a:hover {
color: #2d1a08;
}
.catalog-popup-close:hover {
background: #f0f0f0;
color: #333;
}
/* Адаптивность */
@media (max-width: 768px) {
.catalog-popup-content {
width: 95% !important;
max-height: 90vh !important;
}
.catalog-popup-header {
padding: 15px 20px !important;
}
.catalog-popup-header h2 {
font-size: 20px !important;
}
.catalog-popup-section-header {
padding: 14px 20px;
}
.catalog-popup-subitem a {
padding: 8px 40px;
}
.catalog-popup-subitem a:hover {
padding-left: 44px;
}
}
/* Каталог в плавающей шапке конец */
.catalog-top .owl-next,
.catalog-top .owl-prev{
top: 104px;
right: 27px;
z-index: 1;
box-shadow: 0 0 20px 0px #0000006e;
border-radius: 50px;
width: 40px;
height: 40px;
background-size: contain;
}
.owl-prev, .owl-next {
background-image: url("data:image/svg+xml;utf8,");
}
.catalog-top .owl-prev{
top: 104px;
left: 8px;
}
.val-pohozhie-tovary .catalog-items{
display: grid !important;
grid-template-columns: repeat(auto-fit, minmax(228px, 1fr));
column-gap: 22px;
row-gap: 42px;
padding: 0 !important;
}
.val-pohozhie-tovary{
margin: 50px 0;
}
.catalog-items.tiles .catalog-item{
width: unset;
}
#bx-soa-delivery,
#bx-soa-paysystem,
#bx-soa-properties,
#bx-soa-basket{
background: #fff;
}
ul.catalog-items li::marker{
display: none;
content: "";
}
ul.catalog-items{
margin-left: unset;
}
header .header-searcher .search-field-submit{
right: 7px;
left: unset;
}
.show{
display: flex !important;
}
.fancybox-wrap {
top: 10px !important;
/* left: 0 !important; */
transform: translateX(0);
}
.fancybox-skin{
padding: 5px 20px 20px !important;
}
.fancybox-wrap .login-form #tab1{
padding-top: 0;
}
.header-form .c-bxmaker-authuserphone_login-default-box{
padding: 16px 15px 0px;
}
/* Стили регистрации и авторизации поп-ап окна */
.shirina {
width: 400px;
padding: 30px 15px 0px;
}
.shirina .input-flex {
width: 100%;
}
div.bx-auth-reg input.bx-auth-input {
vertical-align:middle;
}
div.bx-auth-reg span.bx-auth-secure {
background-color:#FFFAE3;
border:1px solid #DEDBC8;
padding:2px;
display:inline-block;
vertical-align:middle;
}
div.bx-auth-reg div.bx-auth-secure-icon {
background-image:url(images/sec.png);
background-repeat:no-repeat;
background-position:center;
width:19px;
height:18px;
}
div.bx-auth-reg div.bx-auth-secure-unlock {
background-image:url(images/sec-unlocked.png);
}
.name-input{
width: 100%;
max-width: 240px;
font-weight: 400;
font-size: 16px;
padding-bottom: 7px;
}
.input-flex{
display: flex;
flex-flow: column;
}
.bx-auth-reg thead td{
padding-bottom: 16px;
}
.bx-auth-reg thead td b{
font-size: 22px;
font-weight: 600;
text-transform: uppercase;
}
.smart-captcha{
min-width: 310px;
}
.bx-auth-reg form input{
border-radius: 8px;
font-size: 16px;
line-height: 100%;
padding: 18px 8px;
text-align: inherit;
width: 100%;
margin-bottom: 10px;
}
.bx-auth-reg form input:focus-visible{
outline: unset;
}
.bx-auth-reg form [name="register_submit_button"]{
margin-top: 20px;
padding: 15px 45px;
background-color:#942525 ;
border-radius: 10px;
font-size: 16px;
color: white;
font-size: 16px;
border: unset;
}
.captha-title{
margin: 0 20px;
font-size: 16px;
font-weight: 400;
}
.bx-auth-reg form [name="register_submit_button"]:hover{
background-color:#b32c2c ;
}
.bx-auth-reg tfoot{
display: flex;
justify-content: center;
}
.bx-auth-reg tbody{
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
.bx-auth-reg thead{
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
.smart-captcha{
margin-top: 20px;
}
@media all and (max-width:950px){
.bx-auth-reg form input{
padding: 14px 6px;
}
.bx-auth-reg thead td{
padding-bottom: 8px;
}
.bx-auth-reg form [name="register_submit_button"]{
padding: 10px 45px;
margin-top: 4px;
}
.bx-auth-reg form input{
margin-bottom: 5px;
}
}
@media all and (max-width:600px){
.registrations {
max-height: 70vh;
overflow: auto;
}
.shirina {
max-width: 100%;
}
}
@media all and (max-width:400px){
.input-flex{
width: 70vw;
}
.capctha-fx{
width: 77vw;
}
.smart-captcha{
min-width: 255px !important;
}
}
/* Стили регистрации и авторизации поп-ап окна */
.bx-soa-cart-total-button-container.visible-xs{
display: block !important;
}
.ns-bitrix.c-sale-order-ajax.c-sale-order-ajax-simple-1 .bx-soa-sidebar {
width: 100%;
}
.slogan{
color: rgb(0,0,0);
font-size: 20px;
font-family: 'Lobster', Arial, sans-serif;
letter-spacing: .4px;
line-height: 120%;
text-shadow: 0px 0px 12px #2f0b02, 0px 0px 20px #2f0b02;
width: max-content;
text-shadow:
-1.5px -1.5px 0 rgb(255, 255, 255),
1.5px -1.5px 0 rgb(255, 255, 255),
-1.5px 1.5px 0 rgb(255, 255, 255),
1.5px 1.5px 0 rgb(255, 255, 255),
0px -2px 0 rgb(255, 255, 255),
0px 2px 0 rgb(255, 255, 255),
-2px 0px 0 rgb(255, 255, 255),
2px 0px 0 rgb(255, 255, 255);
position: relative;
top: 0px;
margin: 0 0px 7px 10px;
}
nav.catalog-submenu-horizontal, nav.suber{
display: none;
}
.header-delivery__bordered{
border-bottom: unset;
}
.main-section--cart .button.button-return,
.VAL-RETURN-ZAKAZ{
background-color: unset !important;
border: unset !important;
color: var(--color-chernyi-txt) !important;
text-transform: unset;
font-weight: 500;
font-size: 16px;
opacity: 0.8 !important;
display: flex;
align-items: center;
line-height: 120%;
padding: 0;
width: max-content;
}
.main-section--cart .button.button-return:hover,
.VAL-RETURN-ZAKAZ:hover{
opacity: 1 !important;
}
.main-section--cart .button.button-return:before,
.VAL-RETURN-ZAKAZ:before{
content: "";
background-image: url('data:image/svg+xml,');
background-repeat: no-repeat;
width: 20px;
height: 20px;
background-position: center center;
}
.main-section--cart h1,
.main-section--order h1{
color: var(--color-korichneviy-new);
font-size: 48px;
text-align: left;
margin: 30px 0 0 0;
}
.cart-block-info{
background-color: #F5F5F5;
color: #787878;
font-size: 16px;
font-weight: 500;
line-height: 120%;
padding: 12px 20px;
border-radius: 10px;
transition: color 0.3s ease;
cursor: default;
max-width: 391px;
}
.cart-block-info:hover{
color: var(--color-chernyi-txt);
}
.cart-block-info-container{
display: flex;
flex-wrap: wrap;
gap: 10px;
justify-content: flex-end;
padding-left: 280px;
margin: -60px 0 0 0;
}
.main-section--cart .cart-item{
background-color: var(--color-svetliy-3);
border-radius: 20px;
padding: 16px 24px;
}
.main-section--cart .cart-items{
display: flex;
flex-direction: column;
gap: 10px;
}
.cart-item-label--weight{
color: #9E9B98;
font-size: 16px;
font-weight: 500;
}
.main-section--cart .cart-items .item-title a{
color: var(--color-chernyi-fon);
font-size: 18px;
font-weight: 500;
line-height: 120%;
display: inline-block;
}
.main-section--cart .cart-items .item-title a:hover{
text-decoration: unset;
}
.main-section--cart .cart-item-info{
display: flex;
flex-direction: column;
gap: 6px;
}
.main-section--cart .cart-item-photo{
width: 80px;
height: 80px;
mix-blend-mode: darken;
}
.main-section--cart .cart-item-main{
display: flex;
gap: 16px;
align-items: center;
}
.main-section--cart .cart-items .price{
text-align: unset;
}
.main-section--cart .price{
display: flex;
gap: 12px;
align-items: center;
}
.main-section--cart .price .current_price,
.main-section--cart .price .current_price span{
color: var(--color-korichneviy-new);
font-size: 18px;
font-weight: 500;
line-height: 120%;
}
.main-section--cart .price .old_price,
.main-section--cart .price .old_price span{
color: #9E9B98;
font-size: 16px;
font-weight: 500;
line-height: 120%;
text-decoration: line-through;
}
.main-section--cart .price .price_percent{
color: #9E9B98;
font-size: 14px;
font-weight: 500;
line-height: 120%;
border: 1px solid #9E9B98;
border-radius: 50px;
padding: 3px 8px 1px 8px;
display: flex;
align-items: center;
justify-content: center;
}
.main-section--cart .cart-items .delete-item {
width: 24px;
height: 24px;
transform: unset;
opacity: 0.3;
}
.main-section--cart .cart-items .delete-item:hover {
opacity: 0.5;
}
.main-section--cart .cart-items .delete-item:before {
content: "";
background: url(/local/templates/optima/css/img/trash.svg) no-repeat center center;
display: flex;
width: 24px;
height: 24px;
background-size: contain;
justify-content: center;
align-items: center;
}
.main-section--cart .quantity{
background-color: #fff;
box-shadow: 0 0 40px 0 rgba(0, 0, 0, 0.07);
border-radius: 100px;
font-size: 17px;
font-weight: 500;
color: var(--color-chernyi-fon);
width: 160px;
min-width: 160px;
height: 42px;
display: flex;
align-items: center;
justify-content: center;
position: relative;
}
.main-section--cart .quantity input{
border: none !important;
font-size: 17px !important;
font-weight: 500 !important;
color: var(--color-chernyi-fon) !important;
text-align: right !important;
/* width: 2.3em; */
margin-right: 14px;
height: 80% !important;
padding: 0.4em 1em 0.4em 0;
}
.main-section--cart .quantity input:focus{
border: none !important;
box-shadow: none !important;
outline: none !important;
}
.main-section--cart .quantity .measure-name{
position: absolute;
transform: translate(14px, 1px);
color: #7B7B7B !important;
font-size: 15px !important;
font-weight: 500 !important;
}
.main-section--cart .quantity-down,
.main-section--cart .quantity-up{
border: none !important;
display: flex !important;
align-items: center;
justify-content: center;
height: 100% !important;
width: auto !important;
padding: 0 !important;
flex: 1 1 auto !important;
background-color: unset !important;
}
.main-section--cart .quantity-down span{
background-image: url(/local/templates/optima/css/img/quantity-down.svg);
background-repeat: no-repeat;
background-position: center center;
width: 24px !important;
height: 24px !important;
background-size: contain;
display: block;
}
.main-section--cart .quantity-up span{
background-image: url(/local/templates/optima/css/img/quantity-up.svg);
background-repeat: no-repeat;
background-position: center center;
width: 24px !important;
height: 24px !important;
background-size: contain;
display: block;
}
.main-section--cart .quantity-down:hover,
.main-section--cart .quantity-up:hover{
background-color: unset !important;
}
.main-section--cart .quantity-down:hover span{
background-image: url(/local/templates/optima/css/img/quantity-down.svg) !important;
background-repeat: no-repeat;
}
.main-section--cart .quantity-up:hover span{
background-image: url(/local/templates/optima/css/img/quantity-up.svg) !important;
background-repeat: no-repeat;
}
.main-section--cart .cart-items .total,
.main-section--cart .cart-items .total span{
font-size: 20px;
color: var(--color-chernyi-fon);
font-weight: 700;
min-width: 82px;
}
.main-section--cart .linked-items-container{
margin-top: 10px;
display: flex;
flex-direction: column;
gap: 4px;
}
.linked-item-wrapper{
margin: 0 !important;
}
.linked-item-wrapper a{
border: none !important;
box-shadow: 0 0 40px 0 rgba(0, 0, 0, 0.07);
height: 40px;
padding: 8px 14px;
display: flex;
align-items: center;
justify-content: center;
gap: 12px;
background-color: #fff !important;
border-radius: 30px;
transition: transform 0.3s ease;
}
.linked-item-wrapper a .linked-item-icon{
width: 24px;
height: 24px;
display: flex;
align-items: center;
justify-content: center;
}
.linked-item-price{
color: #A1A1A1;
font-weight: 500;
font-size: 16px;
}
.linked-item-added .linked-item-price{
color: #82A828;
}
.linked-item-block.linked-item-added{
background: #DAF0A6 !important;
color: #82A828;
font-weight: 500;
font-size: 16px;
}
.main-section--cart .ml-auto{
white-space: nowrap;
margin-top: 2px;
}
.ml-auto, .mx-auto{
margin-left: unset !important;
}
.linked-item-price{
margin-left: auto !important;
}
.linked-item-remove {
transition: opacity 0.3s ease;
}
.linked-item-remove svg{
opacity: 0.4;
width: 24px;
height: 24px;
}
.linked-item-name{
margin-top: 2px;
color: var(--color-korichneviy-new);
font-weight: 500;
font-size: 16px;
}
.linked-item-added .linked-item-name{
color: var(--color-chernyi-fon);
}
.linked-item-disabled{
opacity: 0.5;
}
.linked-item-block:not(.linked-item-added):not(.linked-item-disabled):hover{
transform: translateX(5px);
}
.button-order-submit{
height: 50px !important;
display: flex;
align-items: center;
justify-content: center;
background-color: var(--color-korichneviy-new) !important;
border-radius: 10px !important;
color: #fff !important;
font-size: 15px !important;
font-weight: 500 !important;
width: 100%;
text-transform: unset !important;
max-width: 350px;
margin: 0 !important;
}
.button-order-submit:hover{
background-color: #775e53 !important;
}
.basket_items_wrapper{
display: flex !important;
flex-direction: row;
gap: 38px;
}
.basket_items_sidebar{
width: 300px;
min-width: 300px;
margin-bottom: 15px;
}
.cart-total-wrapper{
height: max-content;
position: sticky;
top: 80px;
width: 100%;
}
.cart-total-wrapper .cart-total,
.cart-total-wrapper .cart-buttons{
width: 100%;
margin: 0;
}
h3.cart-total-label {
font-size: 36px;
color: var(--color-chernyi-fon);
font-family: "Lobster", Arial, sans-serif;
margin: 0 0 -5px 0;
}
.cart-total-values span {
display: flex !important;
align-items: center;
gap: 4px;
font-size: 15px;
font-weight: 500;
color: #A1A1A1;
}
.cart-total-wrapper {
display: flex;
justify-content: space-between;
align-items: flex-start;
gap: 20px;
flex-direction: column;
}
.cart-total-row{
display: flex;
justify-content: space-between;
align-items: flex-end;
gap: 10px;
width: 100%;
}
.cart-total-value.total-sum,
.cart-total-value.total-sum span{
color: var(--color-chernyi-fon);
font-size: 22px;
font-weight: 500;
}
.cart-total-row-wrapper,
.cart-total-row-wrapper .rub{
display: flex;
flex-direction: column;
gap: 10px;
width: 100%;
color: #A1A1A1;
font-size: 15px;
font-weight: 500;
}
.cart-total-row-wrapper .cart-total-value{
display: flex;
gap: 4px;
white-space: nowrap;
align-items: flex-start;
}
.cart-delivery-banner{
width: 100%;
}
.cart-delivery-banner .header-calendar{
background: #F5F5F5;
margin: 0;
}
.cart-delivery-banner .calendar-tittle,
.cart-delivery-banner .calendar-day,
.cart-delivery-banner .calendar-month,
.cart-delivery-banner .calendar-time{
color: #787878;
}
.cart-delivery-banner .calendar-time::before{
background-image: url(/local/templates/optima/css/img/mobile-menu/loading-black.svg);
}
.cart-delivery-banner .header-calendar{
justify-content: space-between;
}
.disabled-order{
opacity: 0.5;
pointer-events: none;
cursor: not-allowed;
user-select: none;
pointer-events: none;
user-select: none;
user-select: none;
}
.basket-empty{
height: 25vh;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
.basket-empty h2{
color: #a5a5a5;
margin: -20px 0 0 0;
}
.cart-item-main-content{
display: flex;
flex-direction: row;
align-items: center;
gap: 16px;
flex: 1 1 auto;
}
.cart-item-main-content-total{
display: flex;
flex-direction: row;
align-items: center;
gap: 16px;
}
.mob-btn-buy{
display: none;
}
/* Мобильная плавающая кнопка оформления заказа */
#bx-soa-mobile-floating-button.mob-btn-buy.val-order-btn-mob {
position: fixed;
bottom: 0;
left: 0;
right: 0;
width: 100%;
background: #fff;
box-shadow: 0 -7px 10px rgba(0, 0, 0, 0.1);
padding: 15px;
z-index: 1100;
}
#bx-soa-mobile-floating-button.mob-btn-buy.val-order-btn-mob .button-order-submit {
justify-content: space-between;
max-width: unset;
}
#bx-soa-mobile-floating-button.mob-btn-buy.val-order-btn-mob .mob-btn-buy__sum-wrapper {
display: flex;
align-items: center;
gap: 10px;
}
#bx-soa-mobile-floating-button.mob-btn-buy.val-order-btn-mob .mob-btn-buy__sum,
#bx-soa-mobile-floating-button.mob-btn-buy.val-order-btn-mob .mob-btn-buy__sum span {
font-size: 18px;
font-weight: 500;
color: #fff;
white-space: nowrap;
width: 100%;
}
#bx-soa-mobile-floating-button.mob-btn-buy.val-order-btn-mob .mob-btn-buy__discount,
#bx-soa-mobile-floating-button.mob-btn-buy.val-order-btn-mob .mob-btn-buy__discount span {
font-size: 14px;
color: #BAAAA3;
text-decoration: line-through;
white-space: nowrap;
width: 100%;
}
/* Скрываем на десктопе */
@media (min-width: 768px) {
#bx-soa-mobile-floating-button.mob-btn-buy.val-order-btn-mob {
display: none !important;
}
}
/* Отступ снизу для контента, чтобы кнопка не перекрывала */
@media (max-width: 767px) {
.VAL-ORDER-FORM {
padding-bottom: 80px;
}
/* Скрываем основную кнопку "Оформить заказ" на мобильных, так как есть плавающая */
.VAL-ORDER-FORM .bx-soa-cart-total-button-container.visible-xs,
.VAL-ORDER-FORM .bx-soa-cart-total-button-container {
display: none !important;
}
}
.header-menu.PC-menu{
margin: 0 !important;
}
.one-click-val{
display: none !important;
}
.VAL-ORDER-FORM .bx-soa-delivery-and-paysystem{
margin: 0 !important;
display: flex;
flex-direction: column;
gap: 24px;
}
.VAL-ORDER-FORM > .bx-soa{
padding: 0 !important;
}
.VAL-ORDER-FORM .bx-soa-delivery-and-paysystem-item{
background-color: #faf3ed !important;
padding: 16px 24px 24px !important;
border-radius: 20px;
}
.main-section--order h1{
margin: 30px 0 34px 0;
}
.VAL-ORDER-FORM #bx-soa-delivery,
.VAL-ORDER-FORM #bx-soa-paysystem,
.VAL-ORDER-FORM #bx-soa-properties{
background: unset;
}
.VAL-ORDER-FORM .bx-soa-section-title:before{
background-size: 50px;
background-repeat: no-repeat !important;
background-position: center center !important;
width: 50px !important;
height: 50px !important;
left: -78px !important;
top: -12px !important;
}
.VAL-ORDER-FORM .VAL-DELIVERY-BLOCK-TITLE:before{
background-image: url(/local/templates/optima/css/img/order/delivery.svg) !important;
display: block !important;
}
.VAL-ORDER-FORM .VAL-PAY-BLOCK-TITLE:before{
background-image: url(/local/templates/optima/css/img/order/pay.svg) !important;
display: block !important;
}
.VAL-ORDER-FORM .VAL-USER-BLOCK-TITLE:before{
background-image: url(/local/templates/optima/css/img/order/user.svg) !important;
display: block !important;
}
.VAL-ORDER-FORM .bx-soa-section-title-container{
overflow: unset !important;
padding: 0px 0 0px 78px !important;
}
.VAL-ORDER-FORM .bx-soa-section-title{
color: var(--color-chernyi-fon) !important;
font-size: 30px !important;
margin: 16px 0 0 0 !important;
}
.VAL-ORDER-FORM #bx-soa-delivery,
.VAL-ORDER-FORM #bx-soa-paysystem{
display: flex;
flex-direction: column;
gap: 24px;
}
.VAL-ORDER-FORM .bx-soa-section-content{
padding: 0 !important;
}
.VAL-ORDER-FORM .bx-soa-pp-item-container{
display: flex;
flex-direction: column;
gap: 10px;
}
.VAL-ORDER-FORM .bx-soa-pp-item-container > .bx-soa-pp-company{
padding: 12px 15px 12px 52px !important;
background: #fff;
border-radius: 10px;
position: relative !important;
display: flex !important;
flex-direction: column;
gap: 24px;
border: 2px solid rgb(255, 255, 255) !important;
margin-top: 10px !important;
}
.VAL-ORDER-FORM .bx-soa-pp-company.bx-selected{
border: 2px solid rgba(140, 114, 101, 0.6) !important;
}
html .ns-bitrix.c-sale-order-ajax.c-sale-order-ajax-simple-1 .bx-soa-pp-item-container .bx-soa-pp-company.bx-selected .bx-soa-pp-company-graf-container,
html .ns-bitrix.c-sale-order-ajax.c-sale-order-ajax-simple-1 .bx-soa-pp-item-container .bx-soa-pp-company:hover .bx-soa-pp-company-graf-container,
html .ns-bitrix.c-sale-order-ajax.c-sale-order-ajax-simple-1 .radio-inline:hover label:before,
html .ns-bitrix.c-sale-order-ajax.c-sale-order-ajax-simple-1 .radio-inline.radio-inline-checked label:before{
background-color: var(--color-nezhniy-3) !important;
border-color: var(--color-nezhniy-3) !important;
width: 22px !important;
height: 22px !important;
top: 15px !important;
left: 15px !important;
}
html .ns-bitrix.c-sale-order-ajax.c-sale-order-ajax-simple-1 .bx-soa-pp-item-container .bx-soa-pp-company.bx-selected .bx-soa-pp-company-graf-container:after{
width: 10px !important;
height: 10px !important;
top: 4px !important;
left: 4px !important;
}
html .ns-bitrix.c-sale-order-ajax.c-sale-order-ajax-simple-1 .bx-soa-pp-item-container .bx-soa-pp-company-graf-container{
width: 22px !important;
height: 22px !important;
top: 15px !important;
left: 15px !important;
border: 2px solid rgba(168, 142, 128, 0.3) !important;
background-color: #fff !important;
}
.VAL-ORDER-FORM .bx-soa-pp-company-smalltitle{
color: var(--color-chernyi-fon) !important;
font-size: 18px !important;
font-weight: 500 !important;
padding: 0 !important;
margin: 0 !important;
padding-right: 100px !important;
}
.VAL-ORDER-FORM .bx-soa-pp-company-smalltitle .bx-soa-delivery-mkad-text{
color: rgba(66, 66, 66, 0.5) !important;
opacity: 0;
transition: opacity 0.5s ease-in-out;
}
.VAL-ORDER-FORM .bx-soa-pp-company-smalltitle .bx-soa-delivery-mkad-text.bx-soa-mkad-visible{
opacity: 1;
}
.VAL-ORDER-FORM .bx-soa-pp-delivery-cost{
position: absolute;
right: 15px;
top: 12px;
background-color: rgba(140, 114, 101, 0.6) !important;
color: #fff !important;
font-size: 16px !important;
font-weight: 500 !important;
border-radius: 100px !important;
padding: 4px 14px !important;
line-height: 120% !important;
white-space: nowrap;
max-height: 27px;
display: flex !important;
align-items: center;
justify-content: center;
gap: 4px;
}
.VAL-ORDER-FORM .bx-soa-pp-delivery-cost span{
padding: 0 !important;
border-radius: unset !important;
background: unset !important;
color: #fff !important;
font-size: 16px !important;
font-weight: 500 !important;
}
.VAL-ORDER-FORM .bx-soa-pp-company-parameters{
padding: 0 !important;
}
.VAL-ORDER-FORM .bx-soa-pp-list-termin,
.VAL-ORDER-FORM .bx-soa-pp-field > label:first-of-type,
.VAL-ORDER-FORM .bx-soa-pp-company-description{
color: var(--color-korichneviy-1-txt) !important;
font-size: 16px !important;
font-weight: 500 !important;
line-height: 120% !important;
}
.VAL-ORDER-FORM .bx-soa-pp-list-description{
color: rgba(66, 66, 66, 0.5) !important;
font-size: 16px !important;
font-weight: 400 !important;
}
.VAL-ORDER-FORM .bx-soa-pp-list li{
display: flex !important;
align-items: center !important;
gap: 10px !important;
}
.VAL-ORDER-FORM .bx-soa-pp-list li:before{
content: '';
background-image: url(/local/templates/optima/css/img/order/timer.svg);
background-size: 34px;
background-repeat: no-repeat;
background-position: center center;
width: 34px;
height: 34px;
flex: 0 0 34px;
}
.VAL-ORDER-FORM .bx-soa-pp-list .bx-soa-pp-list-item:before{
background-image: url(/local/templates/optima/css/img/order/calendar.svg);
}
.VAL-ORDER-FORM .bx-soa-pp-list{
padding: 0 !important;
}
.VAL-ORDER-FORM .bx-soa-pp-field > label:first-of-type{
flex: 1 1 100%;
display: flex;
align-items: center;
gap: 10px;
margin-bottom: 0 !important;
}
.VAL-ORDER-FORM .bx-soa-pp-field > label:first-of-type::before{
content: '';
background-image: url(/local/templates/optima/css/img/order/time.svg);
background-size: 34px;
background-repeat: no-repeat;
background-position: center center;
display: flex;
width: 34px;
height: 34px;
}
/* Иконка флага только для варианта "Доставка за МКАД" */
.VAL-ORDER-FORM .bx-soa-pp-field > label.mkad-delivery-label:first-of-type::before{
background-image: url(/local/templates/optima/css/img/order/flag.svg);
}
.mkad-input-wrapper{
position: relative;
}
.mkad-input-wrapper span{
position: absolute;
right: 95px;
top: 50%;
transform: translateY(-50%);
color: rgba(66, 66, 66, 0.5) !important;
font-size: 14px !important;
font-weight: 400 !important;
pointer-events: none;
}
.mkad-fix-button{
width: 50px;
height: 28px;
background-color: #8c726599;
border-radius: 5px;
border: none;
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
padding: 0;
transition: background-color 0.2s ease;
position: absolute;
right: 5px;
}
.mkad-fix-button:hover{
background-color: #8c7265cc;
}
.mkad-fix-button:active{
background-color: #8c7265ff;
}
.mkad-fix-button svg{
display: block;
width: 18px;
height: 18px;
}
.VAL-ORDER-FORM .bx-soa-pp-field{
display: flex;
flex-direction: row;
align-items: center;
gap: 6px;
flex-wrap: wrap
}
.VAL-ORDER-FORM .bx-soa-timeslot-tile{
color: var(--color-chernyi-fon) !important;
font-size: 15px !important;
margin: 0 !important;
border: 1px solid var(--color-nezhniy-1) !important;
border-radius: 100px !important;
padding: 4px 6px 4px 16px !important;
display: flex !important;
align-items: center !important;
gap: 6px !important;
}
/*
.VAL-ORDER-FORM .bx-soa-timeslot-tile:nth-child(2){
margin-left: 45px !important;
} */
.VAL-ORDER-FORM .bx-soa-pp-company:first-child .bx-soa-pp-company-block .bx-soa-pp-field-timeslots{
margin-left: 45px !important;
}
.VAL-ORDER-FORM .bx-soa-pp-company:first-child .bx-soa-pp-company-block .bx-soa-pp-field-timeslots label:first-of-type{
margin-left: -45px !important;
}
.VAL-ORDER-FORM .bx-soa-timeslot-tile input{
display: none !important;
}
.VAL-ORDER-FORM .bx-soa-timeslot-tile-active span{
font-weight: 400 !important;
}
.VAL-ORDER-FORM .bx-soa-timeslot-tile-active{
background-color: var(--color-svetliy-4) !important;
border-color: var(--color-svetliy-4) !important;
}
.VAL-ORDER-FORM .bx-soa-timeslot-price{
color: var(--color-korichneviy-new) !important;
font-size: 15px !important;
padding: 4px 13px !important;
background-color: var(--color-svetliy-4) !important;
border-radius: 100px !important;
max-height: 25px;
display: flex !important;
align-items: center !important;
justify-content: center !important;
}
.VAL-ORDER-FORM .bx-soa-timeslot-tile-active .bx-soa-timeslot-price{
color: #fff !important;
background-color: rgba(140, 114, 101, 0.6) !important;
}
.VAL-ORDER-FORM .bx-soa-pp-company-description{
padding: 0 !important;
gap: 10px !important;
align-items: center !important;
flex-wrap: wrap;
}
.VAL-ORDER-FORM .bx-soa-pp-company-description br{
display: none;
}
.VAL-ORDER-FORM .bx-soa-pp-company-description::before{
content: '';
background-image: url(/local/templates/optima/css/img/order/bag.svg);
background-size: 34px;
background-repeat: no-repeat;
background-position: center center;
width: 34px;
height: 34px;
}
.VAL-ORDER-FORM .bx-soa-timeslot-tile:hover:not(.bx-soa-timeslot-tile-active){
background-color: unset !important;
}
.val-km-input{
display: flex;
gap: 15px;
}
.mkad-discount-info.val-km-input{
width: 100%;
}
.VAL-ORDER-FORM .bx-soa-pp-company-block .form-group{
display: flex;
flex-direction: row;
flex-wrap: wrap;
gap: 12px;
}
.VAL-ORDER-FORM .bx-soa-pp-company-block .form-group input.form-control{
max-width: 150px;
background-color: var(--color-svetliy-4) !important;
color: var(--color-chernyi-fon) !important;
font-size: 15px !important;
border-radius: 6px !important;
margin-left: 45px;
position: relative;
line-height: 120%;
}
.VAL-ORDER-FORM .bx-soa-pp-company-block .form-group .bx-soa-service-small{
color: rgba(66, 66, 66, 0.5) !important;
font-size: 16px !important;
font-weight: 400 !important;
}
.VAL-ORDER-FORM .bx-soa-pp-inner-ps{
display: flex;
align-items: center;
gap: 12px;
}
/* Контейнер для toggle switch, текста и бейджа */
.bonus-toggle-wrapper{
display: flex;
align-items: center;
gap: 12px;
width: 100%;
}
/* Toggle switch */
.bonus-toggle-switch{
position: relative;
display: inline-block;
width: 44px;
height: 24px;
cursor: pointer;
margin: 0 !important;
flex: 0 0 44px;
}
.ns-bitrix.c-sale-order-ajax.c-sale-order-ajax-simple-1 #bx-soa-paysystem .bx-soa-pp-desc-container{
margin-top: 22px !important;
margin-bottom: 0 !important;
}
.bonus-toggle-switch input{
opacity: 0;
width: 0;
height: 0;
}
.toggle-slider{
position: absolute;
cursor: pointer;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-color: #D4D4D4;
transition: 0.3s;
border-radius: 24px;
}
.toggle-slider:before{
position: absolute;
content: "";
height: 18px;
width: 18px;
left: 3px;
bottom: 3px;
background-color: white;
transition: 0.3s;
border-radius: 50%;
}
.bonus-toggle-switch input:checked + .toggle-slider{
background-color: var(--color-chernyi-txt);
}
.bonus-toggle-switch input:checked + .toggle-slider:before{
transform: translateX(20px);
}
/* Текст "Использовать бонусы на вашем счету" */
.bonus-text-container{
display: flex;
column-gap: 8px;
row-gap: 0px;
cursor: pointer;
flex-wrap: wrap;
}
.bonus-text-main{
color: var(--color-chernyi-txt);
font-size: 16px;
font-weight: 400;
line-height: 1.2;
}
.bonus-text-sub{
color: rgba(61, 55, 52, 0.5);
font-size: 16px;
font-weight: 400;
line-height: 1.2;
}
/* Бейдж с суммой */
.bonus-amount-badge{
background-color: rgba(140, 114, 101, 0.6) !important;
color: #fff !important;
font-size: 16px !important;
font-weight: 500 !important;
border-radius: 100px !important;
padding: 4px 14px !important;
line-height: 120% !important;
white-space: nowrap;
max-height: 28px;
display: flex !important;
align-items: center;
justify-content: center;
gap: 4px;
}
/* Тоггл для свойства заказа (ORDER_PROP_26) */
.bx-soa-customer-field .soa-property-container .bonus-toggle-wrapper {
display: flex;
align-items: center;
justify-content: flex-start;
width: 100%;
}
.bonus-amount-badge .wsnw,
.bonus-amount-badge .rub{
color: white;
font-weight: 500;
font-size: 16px !important;
}
/* Тоггл для согласия на обработку персональных данных */
.bx-soa-orderSave-consent .consent-toggle-wrapper{
display: flex;
gap: 12px;
width: 100%;
margin: 20px 0 0 0;
}
.bx-soa-orderSave-consent .consent-toggle-switch{
position: relative;
display: inline-block;
width: 44px;
flex: 0 0 44px;
height: 24px;
cursor: pointer;
margin: 0 !important;
}
.bx-soa-orderSave-consent .consent-toggle-switch input{
opacity: 0;
width: 0;
height: 0;
}
.bx-soa-orderSave-consent .consent-toggle-switch .toggle-slider{
position: absolute;
cursor: pointer;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-color: #D4D4D4;
transition: 0.3s;
border-radius: 24px;
}
.bx-soa-orderSave-consent .consent-toggle-switch .toggle-slider:before{
position: absolute;
content: "";
height: 18px;
width: 18px;
left: 3px;
bottom: 3px;
background-color: white;
transition: 0.3s;
border-radius: 50%;
}
.bx-soa-orderSave-consent .consent-toggle-switch input:checked + .toggle-slider{
background-color: var(--color-chernyi-txt);
}
.bx-soa-orderSave-consent .consent-toggle-switch input:checked + .toggle-slider:before{
transform: translateX(20px);
}
.bx-soa-orderSave-consent .consent-text{
color: var(--color-chernyi-txt);
font-size: 16px;
font-weight: 400;
line-height: 1.2;
cursor: pointer;
}
.bx-soa-orderSave-consent .main-user-consent-request{
display: flex;
align-items: center;
gap: 12px;
width: 100%;
}
.bx-soa-orderSave-consent .main-user-consent-request input[type="checkbox"]{
opacity: 0;
width: 0;
height: 0;
position: absolute;
}
.bx-soa-orderSave-consent .main-user-consent-request-announce-link{
color: var(--color-chernyi-txt);
font-size: 16px;
font-weight: 400;
line-height: 1.2;
cursor: pointer;
}
#bx-soa-paysystem .bx-soa-pp-company .bxe-light{
display: none;
}
.VAL-ORDER-FORM #bx-soa-properties{
background-color: #faf3ed !important;
padding: 16px 24px 24px !important;
border-radius: 20px;
margin-top: 24px !important;
display: flex;
flex-direction: column;
gap: 38px;
}
html .ns-bitrix.c-sale-order-ajax.c-sale-order-ajax-simple-1 #bx-soa-properties .bx-authform-input-container input,
html .ns-bitrix.c-sale-order-ajax.c-sale-order-ajax-simple-1 #bx-soa-properties .bx-sls .dropdown-block,
html .ns-bitrix.c-sale-order-ajax.c-sale-order-ajax-simple-1 #bx-soa-properties .bx-slst .dropdown-block,
html .ns-bitrix.c-sale-order-ajax.c-sale-order-ajax-simple-1 #bx-soa-properties textarea.form-control,
html .ns-bitrix.c-sale-order-ajax.c-sale-order-ajax-simple-1 #bx-soa-properties select,
html .ns-bitrix.c-sale-order-ajax.c-sale-order-ajax-simple-1 #bx-soa-properties .form-control{
background: #ffffff !important;
border: 2px solid #ffffff !important;
border-radius: 10px;
}
html .ns-bitrix.c-sale-order-ajax.c-sale-order-ajax-simple-1 .has-error .bx-authform-input-container input,
html .ns-bitrix.c-sale-order-ajax.c-sale-order-ajax-simple-1 .bx-authform-input-container .has-error input,
html .ns-bitrix.c-sale-order-ajax.c-sale-order-ajax-simple-1 .has-error .bx-sls .dropdown-block,
html .ns-bitrix.c-sale-order-ajax.c-sale-order-ajax-simple-1 .bx-sls .has-error .dropdown-block,
html .ns-bitrix.c-sale-order-ajax.c-sale-order-ajax-simple-1 .has-error .bx-slst .dropdown-block,
html .ns-bitrix.c-sale-order-ajax.c-sale-order-ajax-simple-1 .bx-slst .has-error .dropdown-block,
html .ns-bitrix.c-sale-order-ajax.c-sale-order-ajax-simple-1 .has-error select,
html .ns-bitrix.c-sale-order-ajax.c-sale-order-ajax-simple-1 .has-error .form-control{
border-color: #da2e0eb3 !important;
}
#bx-soa-properties .bx-soa-customer-field[data-property-id-row="26"]{
flex-direction: row-reverse !important;
align-items: center;
gap: 8px;
margin-top: 10px !important;
}
#bx-soa-properties .bx-soa-customer-field[data-property-id-row="26"] .bx-soa-custom-label{
margin: 0;
color: var(--color-chernyi-txt);
font-size: 16px;
font-weight: 400;
line-height: 1.2;
}
#bx-soa-properties .bx-soa-customer-field[data-property-id-row="26"] .bx-soa-custom-label small{
color: rgba(61, 55, 52, 0.5);
font-size: 16px;
font-weight: 400;
line-height: 1.2;
}
/* Плавное переключение доставки без белого экрана */
#bx-soa-delivery {
position: relative;
transition: opacity 0.2s ease-in-out;
}
.bx-delivery-switch-loader {
position: absolute;
top: 10px;
right: 10px;
width: 20px;
height: 20px;
z-index: 1000;
opacity: 0;
transition: opacity 0.3s ease-in-out;
pointer-events: none;
}
.bx-delivery-switch-loader img {
width: 20px;
height: 20px;
display: block;
}
/* Плавное переключение между блоками доставки */
.VAL-ORDER-FORM .bx-soa-pp-company {
transition: opacity 0.2s ease-in-out, transform 0.2s ease-in-out;
}
.VAL-ORDER-FORM .bx-soa-pp-company.bx-selected {
opacity: 1;
}
/* Улучшаем визуальное переключение */
.VAL-ORDER-FORM #bx-soa-delivery .bx-soa-section-content {
transition: opacity 0.2s ease-in-out;
}
/* Плавное переключение оплаты без белого экрана */
#bx-soa-paysystem {
position: relative;
transition: opacity 0.2s ease-in-out;
}
.bx-paysystem-switch-loader {
position: absolute;
top: 10px;
right: 10px;
width: 20px;
height: 20px;
z-index: 1000;
opacity: 0;
transition: opacity 0.3s ease-in-out;
pointer-events: none;
}
.bx-paysystem-switch-loader img {
width: 20px;
height: 20px;
display: block;
}
/* Плавное переключение между блоками оплаты */
.VAL-ORDER-FORM .bx-soa-pp-company {
transition: opacity 0.2s ease-in-out, transform 0.2s ease-in-out;
}
/* Улучшаем визуальное переключение */
.VAL-ORDER-FORM #bx-soa-paysystem .bx-soa-section-content {
transition: opacity 0.2s ease-in-out;
}
/* Floating Label для текстовых полей формы заказа */
.bx-soa-customer-field .soa-property-container {
position: relative;
}
.bx-soa-customer-field .floating-label-wrapper {
position: relative;
display: block;
}
html .bx-soa-customer-field .floating-label-wrapper input[type="text"] {
width: 100%;
padding: 0 16px;
font-size: 18px;
line-height: 100%;
color: #424242;
background: #ffffff;
border: 2px solid #ffffff;
border-radius: 6px;
transition: border-color 0.3s ease, padding-top 0.3s ease;
outline: none;
box-sizing: border-box;
height: 54px !important;
display: flex;
align-items: center;
}
.bx-soa-customer-field .floating-label-wrapper textarea {
width: 100%;
padding: 20px 16px 20px 16px;
font-size: 18px;
line-height: 100%;
color: #424242;
background: #ffffff;
border: 1px solid #ffffff;
border-radius: 6px;
transition: border-color 0.3s ease, padding-top 0.3s ease, padding-bottom 0.3s ease;
outline: none;
box-sizing: border-box;
height: auto;
min-height: 56px;
vertical-align: middle;
}
.bx-soa-customer-field .floating-label-wrapper.focused input[type="text"],
.bx-soa-customer-field .floating-label-wrapper.has-value input[type="text"] {
padding-top: 28px;
padding-bottom: 8px;
align-items: flex-end;
}
.bx-soa-customer-field .floating-label-wrapper.focused textarea,
.bx-soa-customer-field .floating-label-wrapper.has-value textarea {
padding-top: 28px;
padding-bottom: 12px;
}
html .bx-soa-customer-field .floating-label-wrapper input[type="text"]:focus,
html.bx-soa-customer-field .floating-label-wrapper textarea:focus {
border-color: rgba(140, 114, 101, 0.6) !important;
border-width: 2px !important;
}
.bx-soa-customer-field .floating-label {
position: absolute;
left: 16px;
top: 50%;
transform: translateY(-50%);
font-size: 18px;
line-height: 100%;
color: rgba(66, 66, 66, 0.5);
pointer-events: none;
transition: all 0.3s ease;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
max-width: calc(100% - 32px);
background: transparent;
z-index: 1;
}
.bx-soa-customer-field .floating-label-wrapper.focused .floating-label,
.bx-soa-customer-field .floating-label-wrapper.has-value .floating-label {
top: 10px;
transform: translateY(0);
font-size: 14px;
line-height: 100%;
color: rgba(66, 66, 66, 0.5);
}
.bx-soa-customer-field .floating-label-wrapper input[type="text"]:focus + .floating-label,
.bx-soa-customer-field .floating-label-wrapper textarea:focus + .floating-label {
top: 10px;
transform: translateY(0);
font-size: 14px;
line-height: 100%;
color: rgba(66, 66, 66, 0.5);
}
/* Скрываем стандартный placeholder */
.bx-soa-customer-field .floating-label-wrapper input[type="text"]::placeholder,
.bx-soa-customer-field .floating-label-wrapper textarea::placeholder {
color: transparent;
opacity: 0;
}
.bx-soa-customer-field input[type="text"][data-calendar-only="true"]:focus-visible,
#bx-soa-delivery .soa-property-container input[type="text"][data-calendar-only="true"]:focus-visible {
box-shadow: 0 0 0 2px rgba(140, 114, 101, 0.6) !important;
outline: none !important;
}
/* Позиционирование тултипов снизу полей, чтобы не смещать контент */
.bx-soa-customer-field .soa-property-container {
position: relative;
}
.bx-soa-customer-field .floating-label-wrapper {
position: relative;
}
.bx-soa-customer-field .bx-soa-tooltip.bx-soa-tooltip-static.tooltip.bottom {
position: absolute;
top: 100%;
left: 0;
margin-top: 8px;
z-index: 1000;
width: 100%;
pointer-events: none;
}
.bx-soa-customer-field .bx-soa-tooltip.bx-soa-tooltip-static.tooltip.bottom .tooltip-arrow {
position: absolute;
top: -6px;
left: 20px;
width: 0;
height: 0;
border-width: 0 6px 6px;
border-style: solid;
border-bottom-color: #f2dede;
border-top-color: transparent;
border-left-color: transparent;
border-right-color: transparent;
}
.bx-soa-customer-field .bx-soa-tooltip.bx-soa-tooltip-static.tooltip.bottom .tooltip-inner {
position: relative;
display: block;
background: #da2e0e1f !important;
color: #ce2b0d !important;
font-size: 16px !important;
border-radius: 6px;
line-height: 120%;
padding: 6px 10px;
}
.bx-soa-customer-field .bx-soa-tooltip.bx-soa-tooltip-static.tooltip.bottom .tooltip-arrow {
border-bottom-color: #da2e0e1f !important;
border-top-color: #da2e0e1f !important;
}
#bx-soa-properties .bx-soa-customer-field:not([data-property-id-row="36"]){
display: flex;
flex-direction: column-reverse;
margin: 0;
justify-content: flex-end;
}
#bx-soa-properties .bx-soa-customer-field .bx-soa-custom-label:not([for="soa-property-26"]),
#bx-soa-properties .soa-property-container.input-group {
display: none;
}
/* Делаем label кликабельным для свойства 26 (тоггл) */
#bx-soa-properties .bx-soa-customer-field[data-property-id-row="26"] .bx-soa-custom-label {
cursor: pointer;
}
#bx-soa-properties .bx-soa-customer-field .tooltip.bottom{
padding: 0 !important;
top: unset;
}
#bx-soa-properties .bx-soa-customer{
display: flex;
flex-direction: row;
gap: 10px;
flex-wrap: wrap;
}
#bx-soa-properties .bx-soa-customer-field{
flex: 1 1 100% !important;
}
#bx-soa-properties .bx-soa-customer-field[data-property-id-row="2"],
#bx-soa-properties .bx-soa-customer-field[data-property-id-row="3"],
#bx-soa-properties .bx-soa-customer-field[data-property-id-row="6"],
#bx-soa-properties .bx-soa-customer-field[data-property-id-row="25"]{
flex: 1 1 48% !important;
}
/* Стили для поля с календарем (дата доставки) */
#bx-soa-properties .bx-soa-customer-field[data-property-id-row="29"] .soa-property-container,
#bx-soa-properties .bx-soa-customer-field[data-property-id-row="29"] .soa-property-container.input-group {
position: relative !important;
display: flex !important;
min-height: 34px;
gap: 8px;
margin-bottom: 22px;
align-items: center;
width: max-content;
}
#bx-soa-delivery .soa-property-container{
margin: 0 !important;
display: flex;
align-items: center;
justify-content: center;
gap: 8px;
}
#bx-soa-delivery .soa-property-container .calendar-label-text{
display: none !important;
}
/* Скрываем стандартную иконку календаря */
#bx-soa-properties .bx-soa-customer-field[data-property-id-row="29"] .input-group-addon {
display: none !important;
}
#bx-soa-properties .bx-soa-customer-field[data-property-id-row="29"] input[type="text"][data-calendar-only="true"],
#bx-soa-paysystem-and-delivery .soa-property-container input[type="text"][data-calendar-only="true"] {
position: relative;
cursor: pointer;
border-radius: 100px;
border: none;
height: 34px;
display: flex;
align-items: center;
justify-content: center;
padding: 14px 16px;
font-size: 16px;
color: var(--color-chernyi-fon);
transition: box-shadow 0.2s ease;
}
#bx-soa-paysystem-and-delivery .soa-property-container input[type="text"][data-calendar-only="true"]{
background-color: var(--color-svetliy-4) !important;
}
/* Текст "Дата доставки" между иконкой и инпутом */
#bx-soa-properties .bx-soa-customer-field[data-property-id-row="29"] .calendar-label-text {
font-size: 16px;
line-height: 1.2;
color: var(--color-chernyi-txt, #3d3734);
pointer-events: none;
white-space: nowrap;
}
/* Иконка календаря через ::before контейнера */
#bx-soa-properties .bx-soa-customer-field[data-property-id-row="29"] .soa-property-container::before,
#bx-soa-properties .bx-soa-customer-field[data-property-id-row="29"] .soa-property-container.input-group::before {
content: '' !important;
background-image: url(/local/templates/optima/css/img/order/calendar-wb.svg) !important;
display: flex;
align-items: center;
justify-content: center;
background-size: 34px;
background-repeat: no-repeat;
background-position: center center;
width: 34px;
height: 34px;
}
/* Шеврон через ::after контейнера */
#bx-soa-properties .bx-soa-customer-field[data-property-id-row="29"] .soa-property-container::after,
#bx-soa-properties .bx-soa-customer-field[data-property-id-row="29"] .soa-property-container.input-group::after,
#bx-soa-delivery .soa-property-container::after {
content: '' !important;
position: absolute !important;
top: 50% !important;
transform: translateY(-50%) !important;
width: 20px !important;
height: 20px !important;
background-image: url(/local/templates/optima/css/img/order/shevron.svg) !important;
background-size: contain !important;
background-repeat: no-repeat !important;
background-position: center !important;
pointer-events: none !important;
z-index: 10 !important;
transition: transform 0.2s ease !important;
display: block !important;
right: 8px;
}
#bx-soa-delivery .bx-soa-pp-company:nth-child(2) .soa-property-container::after {
display: none !important;
}
#bx-soa-delivery .bx-soa-pp-company:nth-child(2) .soa-property-container input {
padding: 14px 0px 14px 16px;
}
/* Поворот шеврона при открытии календаря */
#bx-soa-properties .bx-soa-customer-field[data-property-id-row="29"] .soa-property-container[data-calendar-open="true"]::after,
#bx-soa-properties .bx-soa-customer-field[data-property-id-row="29"] .soa-property-container.calendar-open::after,
#bx-soa-properties .bx-soa-customer-field[data-property-id-row="29"] .soa-property-container.input-group[data-calendar-open="true"]::after,
#bx-soa-properties .bx-soa-customer-field[data-property-id-row="29"] .soa-property-container.input-group.calendar-open::after,
#bx-soa-delivery .soa-property-container.calendar-open::after {
transform: translateY(-50%) rotate(180deg) !important;
}
/* Стили для иконок, добавленных через JavaScript */
#bx-soa-properties .bx-soa-customer-field[data-property-id-row="29"] .calendar-icon-custom {
position: absolute !important;
left: 16px !important;
top: 50% !important;
transform: translateY(-50%) !important;
width: 20px !important;
height: 20px !important;
background-image: url(/local/templates/optima/css/img/order/calendar-wb.svg) !important;
background-size: contain !important;
background-repeat: no-repeat !important;
background-position: center !important;
pointer-events: none !important;
z-index: 10 !important;
display: block !important;
}
#bx-soa-properties .bx-soa-customer-field[data-property-id-row="29"] .shevron-icon-custom {
position: absolute !important;
right: 16px !important;
top: 50% !important;
transform: translateY(-50%) !important;
width: 12px !important;
height: 12px !important;
background-image: url(/local/templates/optima/css/img/order/shevron.svg) !important;
background-size: contain !important;
background-repeat: no-repeat !important;
background-position: center !important;
pointer-events: none !important;
z-index: 10 !important;
transition: transform 0.3s ease !important;
display: block !important;
}
#bx-soa-properties .bx-soa-customer-field[data-property-id-row="29"] .soa-property-container[data-calendar-open="true"] .shevron-icon-custom,
#bx-soa-properties .bx-soa-customer-field[data-property-id-row="29"] .soa-property-container.calendar-open .shevron-icon-custom {
transform: translateY(-50%) rotate(180deg) !important;
}
/* Стили для календаря */
.daterangepicker{
border: none !important;
border-radius: 30px !important;
box-shadow: unset !important;
font-family: 'Roboto', Arial, sans-serif !important;
background-color: unset !important;
}
.daterangepicker .drp-calendar{
box-shadow: 0px 10px 30px 0px rgba(0, 0, 0, 0.2);
padding: 28px !important;
border-radius: 30px !important;
max-width: 400px !important;
background-color: #fff !important;
}
.daterangepicker.opensright:before {
left: 29px !important;
}
.daterangepicker.opensright:after {
left: 30px !important;
}
.daterangepicker .calendar-table th.month{
font-size: 18px !important;
font-weight: 500 !important;
color: var(--color-chernyi-fon) !important;
}
.daterangepicker .calendar-table thead > tr:nth-child(2){
background-color: var(--color-svetliy-3) !important;
margin-top: 10px;
border-radius: 8px;
}
.daterangepicker .calendar-table table thead > tr th{
border-radius: 0 !important;
color: var(--color-chernyi-fon) !important;
font-size: 14px !important;
font-weight: 500 !important;
}
.daterangepicker .drp-calendar.left .calendar-table {
padding-right: 0 !important;
}
.daterangepicker .calendar-table th, .daterangepicker .calendar-table td {
width: 48px !important;
height: 42px !important;
}
/* Убираем display: table-row для строк календаря, используем block */
.daterangepicker .calendar-table {
display: block !important;
}
.daterangepicker .calendar-table thead {
display: block !important;
}
.daterangepicker .calendar-table thead tr {
display: flex !important;
flex-direction: row !important;
justify-content: space-between !important;
}
.daterangepicker .calendar-table thead tr th {
display: flex !important;
align-items: center !important;
justify-content: center !important;
flex: 0 0 48px !important;
}
.daterangepicker .calendar-table tbody {
display: block !important;
}
.daterangepicker .calendar-table tbody tr {
display: flex !important;
flex-direction: row !important;
justify-content: space-between !important;
}
.daterangepicker .calendar-table tbody tr td {
display: flex !important;
align-items: center !important;
justify-content: center !important;
flex: 0 0 48px !important;
width: 48px !important;
height: 48px !important;
color: rgba(61, 55, 52, 0.5) !important;
font-size: 16px;
text-decoration: unset !important;
}
.daterangepicker td.available:hover,
.daterangepicker th.available:hover{
border-radius: 8px !important;
}
.daterangepicker .calendar-table tbody td.available,
.daterangepicker .calendar-table tbody td.available:hover {
background-color: var(--color-svetliy-3) !important;
border-radius: 100px !important;
width: 48px !important;
height: 48px !important;
font-size: 16px !important;
font-weight: 500 !important;
color: var(--color-chernyi-fon) !important;
}
.daterangepicker .calendar-table tbody td.active,
.daterangepicker .calendar-table tbody td.active:hover {
background-color: var(--color-nezhniy-3) !important;
border-radius: 100px !important;
width: 48px !important;
height: 48px !important;
font-size: 16px !important;
font-weight: 500 !important;
color: #fff !important;
}
.daterangepicker .calendar-table tbody td.ends {
opacity: 0.5 !important;
}
.col-sm-12:not(.bx-soa-customer) .bx-soa-customer-field{
margin: 14px 0 0 0 !important;
}
.col-sm-12:not(.bx-soa-customer) .bx-soa-customer-field #orderDescription{
padding-top: 28px;
padding-bottom: 8px;
}
/* Блок "Сайдбар" */
.VAL-ORDER-FORM{
display: flex !important;
flex-direction: row;
gap: 38px;
margin: 0;
flex-wrap: nowrap;
}
.VAL-ORDER-FORM .bx-soa{
flex: 1 1 100%;
max-width: 100%;
width: 100%;
}
.VAL-ORDER-FORM:before,
.VAL-ORDER-FORM:after{
display: none;
}
#bx-soa-total{
width: 300px;
min-width: 300px;
margin-bottom: 15px;
padding: 0;
margin: 0;
flex: 0 0 300px;
}
#bx-soa-total .bx-soa-cart-total{
border: none !important;
padding: 0 !important;
}
#bx-soa-total .bx-soa-cart-total .bx-soa-cart-total-line-items{
border-top: 1px solid #E8E7E6;
padding: 10px 0 4px 0 !important;
margin: 20px 0 0 0;
}
#bx-soa-total .bx-soa-cart-total .bx-soa-cart-d,
#bx-soa-total .bx-soa-cart-total .bx-soa-cart-d .rub{
font-size: 15px !important;
font-weight: 500 !important;
line-height: 120% !important;
color: rgba(66, 66, 66, 0.5) !important;
}
#bx-soa-total .bx-soa-cart-total-line-discount .bx-soa-cart-d,
#bx-soa-total .bx-soa-cart-total-line-discount .bx-soa-cart-d .rub,
#bx-soa-total .bx-soa-cart-total-line-bonuses .bx-soa-cart-d,
#bx-soa-total .bx-soa-cart-total-line-bonuses .bx-soa-cart-d .rub,
#bx-soa-total .bx-soa-cart-total-line-delivery .bx-soa-price-free,
#bx-soa-total .bx-soa-cart-total-line-delivery .bx-soa-price-free .rub{
color: #82A828 !important;
width: max-content !important;
}
#bx-soa-total .bx-soa-cart-total-line-delivery{
border-top: 1px solid #E8E7E6;
padding: 10px 0 4px 0 !important;
margin: 8px 0 0 0;
}
.ns-bitrix.c-sale-order-ajax.c-sale-order-ajax-simple-1 .bx-soa-coupon {
margin-top: 0px !important;
}
html .ns-bitrix.c-sale-order-ajax.c-sale-order-ajax-simple-1 .bx-soa-button.bx-soa-button-colored {
background-color: var(--color-korichneviy-new) !important;
border-color: var(--color-korichneviy-new) !important;
height: 50px !important;
padding: 8px 20px !important;
border-radius: 10px !important;
font-size: 15px !important;
font-weight: 500 !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
}
html .ns-bitrix.c-sale-order-ajax.c-sale-order-ajax-simple-1 .bx-soa-button.bx-soa-button-colored:hover {
background-color: #775e53 !important;
border-color: #775e53 !important;
}
#bx-soa-total .bx-soa-orderSave-consent .consent-text{
color: rgba(66, 66, 66, 0.5);
font-size: 14px;
}
.ns-bitrix.c-sale-order-ajax.c-sale-order-ajax-simple-1 .bx-soa-cart-total-button-container{
padding-top: 0 !important;
}
html #bx-soa-total .bx-soa-cart-total .bx-soa-cart-total-line-total .bx-soa-cart-t,
html #bx-soa-total .bx-soa-cart-total .bx-soa-cart-total-line-total .bx-soa-cart-d,
html #bx-soa-total .bx-soa-cart-total .bx-soa-cart-total-line-total .bx-soa-cart-d .rub {
font-weight: 500 !important;
font-size: 22px !important;
line-height: 120% !important;
color: var(--color-chernyi-fon) !important;
}
.ns-bitrix.c-sale-order-ajax.c-sale-order-ajax-simple-1 .bx-soa-cart-total-line.bx-soa-cart-total-line-total{
padding: 10px 0 20px 0 !important;
margin: 0 !important;
border: none !important;
}
.bx-soa-delivery-name-line .bx-soa-delivery-name-link{
color: var(--color-chernyi-txt) !important;
font-size: 15px !important;
font-weight: 400 !important;
line-height: 120% !important;
}
.ns-bitrix.c-sale-order-ajax.c-sale-order-ajax-simple-1 .bx-soa-cart-total-line.bx-soa-delivery-name-line{
border-top: 1px solid #E8E7E6;
padding: 10px 0 0 0 !important;
margin: 5px 0 0 0;
}
.ns-bitrix.c-sale-order-ajax.c-sale-order-ajax-simple-1 .bx-soa-cart-t{
font-size: 15px !important;
font-weight: 500 !important;
line-height: 120% !important;
color: rgba(66, 66, 66, 0.5) !important;
width: max-content !important;
}
.ns-bitrix.c-sale-order-ajax.c-sale-order-ajax-simple-1 .bx-soa-cart-total-line {
padding: 4px 0 !important;
}
#bx-soa-total .bx-soa-coupon .bx-soa-coupon-label{
display: none;
}
#bx-soa-total .bx-soa-coupon .bx-soa-coupon-input input{
background-color: var(--color-svetliy-4) !important;
height: 50px !important;
border-radius: 10px !important;
padding: 4px 16px !important;
border: none !important;
font-size: 18px !important;
font-weight: 400 !important;
line-height: 100% !important;
color: rgba(66, 66, 66, 0.5) !important;
}
#bx-soa-total .bx-soa-coupon .bx-soa-coupon-input input::placeholder{
color: rgba(66, 66, 66, 0.5) !important;
opacity: 1 !important;
}
#bx-soa-total .bx-soa-coupon .bx-soa-coupon-input input::-webkit-input-placeholder{
color: rgba(66, 66, 66, 0.5) !important;
opacity: 1 !important;
}
#bx-soa-total .bx-soa-coupon .bx-soa-coupon-input input::-moz-placeholder{
color: rgba(66, 66, 66, 0.5) !important;
opacity: 1 !important;
}
#bx-soa-total .bx-soa-coupon .bx-soa-coupon-input input:-ms-input-placeholder{
color: rgba(66, 66, 66, 0.5) !important;
opacity: 1 !important;
}
.ns-bitrix.c-sale-order-ajax.c-sale-order-ajax-simple-1 .bx-soa-coupon-input:after{
background-image: url('data:image/svg+xml,');
background-repeat: no-repeat !important;
background-position: center !important;
border-right: unset !important;
border-bottom: unset !important;
width: 20px !important;
height: 20px !important;
transform: translateY(-50%) !important;
top: 50% !important;
margin-top: unset !important;
padding: 20px 20px;
}
.ns-bitrix.c-sale-order-ajax.c-sale-order-ajax-simple-1 .bx-soa-coupon-item strong.bx-soa-coupon-item-danger {
color: var(--color-red) !important;
font-weight: 500 !important;
font-size: 15px !important;
font-family: 'Roboto', Arial, sans-serif;
}
.ns-bitrix.c-sale-order-ajax.c-sale-order-ajax-simple-1 .bx-soa-coupon-item strong.bx-soa-coupon-item-used {
color: rgba(66, 66, 66, 0.5) !important;
font-weight: 500 !important;
font-size: 15px !important;
font-family: 'Roboto', Arial, sans-serif;
}
.ns-bitrix.c-sale-order-ajax.c-sale-order-ajax-simple-1 .bx-soa-coupon-item strong.bx-soa-coupon-item-success {
color: #82A828 !important;
font-weight: 500 !important;
font-size: 15px !important;
font-family: 'Roboto', Arial, sans-serif;
}
.ns-bitrix.c-sale-order-ajax.c-sale-order-ajax-simple-1 .bx-soa-tooltip.bx-soa-tooltip-coupon .tooltip-inner,
.ns-bitrix.c-sale-order-ajax.c-sale-order-ajax-simple-1 .bx-soa-tooltip.bx-soa-tooltip-danger .tooltip-inner {
color: rgba(66, 66, 66, 0.5) !important;
font-size: 15px !important;
line-height: 120% !important;
text-align: left;
font-weight: 500 !important;
font-family: 'Roboto', Arial, sans-serif;
}
.fancy-content-c {
margin: 0 !important;
width: 100% !important;
font-size: 16px !important;
line-height: 130% !important;
}
.fancybox-opened .fancybox-skin{
padding: 20px 40px !important;
}
.main-user-consent-request-popup-cont{
border-radius: 20px !important;
}
.main-user-consent-request-popup-header{
font-family: "Lobster", Arial, sans-serif;
font-size: 28px !important;
color: var(--color-korichneviy-new) !important;
}
.main-user-consent-request-popup-text{
border: none !important;
padding: 0 !important;
}
.main-user-consent-request-popup-button{
font-size: 15px !important;
font-weight: 600 !important;
line-height: 120% !important;
border-radius: 10px !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
text-transform: unset !important;
padding: 25px 42px !important;
margin: 0 !important;
}
.main-user-consent-request-popup-buttons{
gap: 10px;
}
.main-user-consent-request-popup-button-acc {
background-color: var(--color-korichneviy-new) !important;
color: #fff !important;
}
.main-user-consent-request-popup-button-rej {
background: #F6EDE3 !important;
color: var(--color-korichneviy-1-txt) !important;
border: none !important;
box-shadow: none !important;
}
.mkad-discount-info.val-km-input .val-km-input{
gap: 0;
flex-direction: column;
}
/* Таблица условий доставки за МКАД (mkad_discount.js) */
.mkad-discount-info {
margin-top: 10px;
}
.mkad-discount-table {
display: flex;
flex-direction: column;
width: 100%;
max-width: 100%;
background: #fff;
color: #333;
border: 1px solid #eee;
border-radius: 8px;
box-shadow: 0 1px 4px rgba(0, 0, 0, 0.08);
overflow: hidden;
}
.mkad-discount-table__row {
display: flex;
flex-wrap: nowrap;
align-items: stretch;
min-width: 0;
}
.mkad-discount-table__row--head {
background: #f5f5f5;
}
.mkad-discount-table__row--head .mkad-discount-table__cell {
font-weight: 600;
color: var(--color-korichneviy-1-txt);
}
.mkad-discount-table__row:not(:last-child) .mkad-discount-table__cell {
border-bottom: 1px solid #eee;
}
.mkad-discount-table__cell {
flex: 1 1 0;
min-width: 0;
padding: 10px 12px;
font-size: 14px;
line-height: 1.35;
color: #333;
}
.mkad-discount-table__cell:first-child {
flex: 1.2 1 0;
font-weight: 700;
}
.mkad-discount-table__cell:nth-child(2) {
flex: 1.8 1 0;
}
.mkad-discount-table__cell:last-child {
flex: 0.7 1 0;
}
/* --- Стили для кастомного чекбокса рассылки (бронебойная связка input + .rassil-toggle-slider) --- */
/* Контейнер: тоггл и текст в ряд */
.custom-consent-rassil-container {
display: flex;
align-items: flex-start;
gap: 15px;
}
/* Контейнер тоггла */
.custom-consent-rassil-container .rassil-toggle-switch {
position: relative;
display: inline-block;
width: 44px;
height: 24px;
flex-shrink: 0;
margin: 0;
vertical-align: middle;
cursor: pointer;
}
/* Чекбокс скрыт, но растянут на всю кнопку и поверх слайдера — ловит клики */
.custom-consent-rassil-container .rassil-toggle-switch input {
position: absolute;
opacity: 0;
width: 100%;
height: 100%;
top: 0;
left: 0;
margin: 0;
padding: 0;
z-index: 1;
cursor: pointer;
}
/* Слайдер — только декор, клики проходят к input */
.custom-consent-rassil-container .rassil-toggle-slider {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-color: #ccc;
transition: 0.3s;
border-radius: 34px;
pointer-events: none;
z-index: 0;
}
/* Кружок внутри слайдера */
.custom-consent-rassil-container .rassil-toggle-slider:before {
position: absolute;
content: "";
height: 18px;
width: 18px;
left: 3px;
bottom: 3px;
background-color: white;
transition: 0.3s;
border-radius: 50%;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
}
/* Состояние ВКЛЮЧЕНО: цвет фона (!important перебивает стили Битрикса) */
.custom-consent-rassil-container .rassil-toggle-switch input:checked + .rassil-toggle-slider {
background-color: var(--color-chernyi-txt) !important;
}
/* Состояние ВКЛЮЧЕНО: сдвиг кружка */
.custom-consent-rassil-container .rassil-toggle-switch input:checked + .rassil-toggle-slider:before {
transform: translateX(20px);
}
/* Текст: кликабельный за счёт for="...", onclick="" для Safari/iOS */
.custom-consent-rassil-container .custom-consent-rassil-label {
cursor: pointer;
margin: 0;
user-select: none;
}
#bx-soa-properties .bx-soa-customer-field[data-property-id-row="83"]{
display: none;
}
.catalog-items.tiles .catalog-item{
max-width: 370px;
width: 100%;
justify-self: center;
}
/* 1600 Мобилки начало */
@media screen and (max-width: 1600px) {
.val-header-top .phones__dropdown {
right: -10px;
left: unset !important;
/*opacity: 1;
visibility: unset;*/
}
header .header-menu {
max-width: unset;
}
.scrollTopBtn{
bottom: 110px;
}
}
/* 1600 Мобилки конец */
/* 1400 Мобилки начало */
@media screen and (max-width: 1400px) {
.header-searcher .search-container .search-field .inputers input[type="text"]{
width: 370px;
}
.main-section{
padding: 20px 0;
}
.main-section > .content-center {
padding: 0 20px;
}
.val-banner-img-2{
width: 200px;
}
.val-banner-img-1 {
width: 140px;
}
.banner-block-aktsii{
height: 160px;
}
.banner-block .banner-item .banner-item-title-label {
font-size: 42px;
}
.val-btn-banner-wrap .val-btn-banner {
font-size: 16px;
}
.banner-block .banner-item {
gap: 16px;
}
}
/* 1400 Мобилки конец */
/* 1300 Мобилки начало */
@media screen and (max-width: 1300px) {
/* .val-otz:after {
display: none;
} */
.footer .val-otz:after {
display: inline-block;
}
.val-header-top .header-menu ul li a{
white-space: nowrap;
}
.catalog-sections .catalog-sections-items{
gap: 12px;
}
.val-about-company{
display: flex;
flex-direction: column-reverse;
}
.val-about-company .play{
width: auto;
}
.val-about-company .video_block{
max-width: 600px;
}
div.catalog-items .catalog-item, ul.catalog-items li{
width: unset;
}
.catalog-top {
margin-top: 50px;
margin-bottom: 0;
}
}
/* 1300 Мобилки конец */
/* 1200 Мобилки начало */
@media screen and (max-width: 1200px) {
.phones__phone-first {
display: none;
}
header .header-searcher .search-field-submit {
width: 30px;
height: 30px;
margin-left: 0;
}
.phones__inner {
gap: 0;
}
.header-searcher .search-container .search-field .inputers input[type="text"],
.header-searcher{
width: 100%;
}
.val-header-top > .content-center {
padding: 0 8px;
gap: 16px;
}
.phones__dropdown-PC{
left: unset !important;
right: 0;
top: 38px;
}
.main_banners{
min-height: unset !important;
}
.val-adv-wrap{
display: none;
}
.val-banner-img-2{
display: none;
}
.banner-block .banner-item{
left: 230px;
}
.banner-figure-1{
left: -150px;
}
.slider_block .slick-dots li button{
width: 8px !important;
}
.cart-delivery-banner .header-calendar{
gap: 4px;
}
.basket_items_sidebar {
width: 270px;
min-width: 270px;
}
.cart-delivery-banner .calendar-time::before{
display: none;
}
.cart-delivery-banner .header-calendar{
flex-direction: column-reverse;
}
.basket_items_sidebar {
min-width: 212px;
}
.main-section--cart .basket_items_wrapper {
gap: 24px;
}
.main-user-consent-request-popup-text,
.main-user-consent-request-popup-link {
height: calc(100vh - 220px);
}
.main-user-consent-request-popup-cont {
min-height: unset;
}
}
/* 1200 Мобилки конец */
/* 991 Мобилки начало */
@media screen and (max-width: 992px) {
.header-menu .show-menu-btn{
background: url('data:image/svg+xml,');
display: inline-block;
background-repeat: no-repeat;
width: 50px;
height: 50px;
background-position: center center;
left: unset;
position: relative;
}
#mobileheader{
display: flex;
}
.header-bottom .header-logo{
display: none !important;
}
.PC-menu{
display: none !important;
}
.phones{
display: none;
}
.header-top-pannel{
position: absolute;
top: -64px;
right: 0;
}
.val-dostavka{
display: none;
}
.header-top-pannel .content-center{
background: unset;
}
.header-top-pannel .content-center{
height: 51px;
padding: 0 !important;
}
.header-divider{
display: none;
}
header .header-private .authorize .icon-login.noauth:before {
background: #fff !important;
mask: url(img/user.svg) no-repeat center;
-webkit-mask: url(img/user.svg) no-repeat center;
}
.header-cart .icon.icon-cart {
background: #fff !important;
mask: url(img/shopping-cart.svg) no-repeat center !important;
-webkit-mask: url(img/shopping-cart.svg) no-repeat center !important;
}
.header_top_wraper .favorites svg path{
stroke: #fff;
}
.header-cart .bx_cart_block span.cart-total-price{
display: none;
}
.header_top_wraper .favorites span,
.header-cart .bx_cart_block a.cart-not-empty span:not(.cart-total-price){
background-color: #fff;
color: #694F44;
font-weight: 500;
}
.header-top-pannel{
width: unset;
}
.header-searcher span.svg_search{
position: absolute;
display: flex;
padding: 0;
right: 176px;
top: 10px;
width: 30px;
height: 30px;
margin: 0;
left: unset;
}
.header-searcher span.svg_search svg path{
fill: #fff;
}
.header-searcher span.svg_search svg{
width: 30px;
height: 30px;
}
.val-header-delivery > span{
text-align: left;
}
.header-reyt-time .val-otz:after{
display: inline-block !important;
margin: 0 0 2px 0;
}
.header-reyt-time{
display: flex;
flex-direction: column;
margin: 0;
}
.header-reyt-time a{
color: #fff;
font-size: 15px;
font-weight: 500;
gap: 9px;
}
.header-reyt-time span{
color: #fff;
font-size: 15px;
font-weight: 500;
text-shadow: 0px 0px 12px #2f0b02, 0px 0px 20px #2f0b02;
margin: 0px 12px 3px 0;
text-align: right;
}
header .header-bottom .content-center{
padding-bottom: 0;
}
.val-header-top{
height: auto !important;
}
header .header-bottom {
height: auto;
}
.val-bg-fish-wrap{
height: 117px;
width: 360px;
}
.val-bg-fish {
object-fit: cover;
object-position: right;
margin-left: -30px;
}
.main_minies{
margin: 0 !important;
gap: 20px;
}
.main_minies a{
max-width: unset !important;
width: 50% !important;
}
.main_minies img{
width: 100%;
border-radius: 8px 8px 20px 20px;
}
.slider_block .item img {
border-radius: 20px 20px 8px 8px;
}
.header-scroll .header-slogan,
.header-scroll .header-reyt-time,
.header-scroll .val-bg-fish-wrap{
display: none !important;
}
header .header-scroll .header-top-pannel {
right: -10px !important;
}
.val-header-top.header-scroll > .content-center{
background: linear-gradient(to right, rgb(17 6 0 / 74%)) !important;
}
.slider_block{
margin-top: 0 !important;
}
.val-about-company {
display: grid;
}
.val-banner-img-2{
display: block;
}
.banner-block .banner-item{
left: 55%;
}
.banner-figure-1{
left: 105px;
}
.val-banner-img-2 {
width: 180px;
}
.val-banner-img-2 {
left: 17px;
}
.banner-block .banner-item .banner-item-title-label {
font-size: 37px;
}
.val-banner-img-1 {
right: 11px;
}
.val-banner-img-1 {
width: 128px;
}
.banner-block-aktsii {
height: 147px;
}
.banner-figure-2 {
right: -269px;
}
.hidden-prods-wrap .catalog-viewed-products-title{
margin: 0 auto 10px;
}
.hidden-prods-wrap .catalog-item{
width: 450px;
}
.hidden-prods-wrap{
padding: 0 15px;
margin: 40px 0 !important;
}
.footer-content {
grid-template-columns: 1fr 1fr;
grid-template-rows: auto auto;
}
.footer-content .footer-brand {
grid-column: 1;
grid-row: 1;
}
.footer-content .footer-klients {
grid-column: 2;
grid-row: 1;
}
.footer-content .footer-column.o-nas {
grid-column: 1;
grid-row: 2;
}
.footer-content .footer-column.footer-contacts {
grid-column: 2;
grid-row: 2;
}
.scrollTopBtn{
bottom: 70px;
}
.footer-catalog-section-menu{
display: block;
}
.fancybox-wrap {
top: 10px !important;
left: 0 !important;
transform: translateX(0);
}
#bx-soa-order{
display: flex;
flex-direction: column;
}
.ns-bitrix.c-sale-order-ajax.c-sale-order-ajax-simple-1 .bx-soa-sidebar {
display: block !important;
flex: 0 0 100%;
max-width: 100%;
}
.cart-block-info-container {
padding-left: 0;
margin: 0 0 0 0;
}
.cart-block-info-container {
justify-content: flex-start;
}
.main-section--cart h1 {
font-size: 40px;
text-align: center;
margin: 16px 0 10px 0;
}
.cart-block-info{
font-size: 14px;
max-width: 330px;
padding: 8px 12px;
}
.main-section--cart .bx_ordercart .bx_sort_container{
min-height: unset;
}
.main-section--cart .catalog-section-menu.footer-catalog-section-menu,
.main-section--cart .hidden-news-wrap{
display: none;
}
.main-section--cart .basket_items_wrapper {
flex-direction: column;
align-items: center;
}
.main-section--cart .hidden-prods-wrap{
margin: 10px 0 0 0 !important;
}
.cart-delivery-banner .calendar-time::before{
display: block;
}
.cart-delivery-banner .header-calendar{
flex-direction: row;
}
.main-section--order h1{
font-size: 40px;
}
.main-section--order .footer-catalog-section-menu,
.main-section--order .hidden-news-wrap{
display: none;
}
#bx-soa-total-mobile{
display: none !important;
}
.main-section--order h1 {
margin: 30px 0 20px 0;
}
#bx-soa-total {
width: auto;
min-width: unset;
max-width: 600px;
margin: 0 auto 20px;
}
.VAL-ORDER-FORM .bx-soa-delivery-and-paysystem {
gap: 20px;
}
#bx-soa-properties .bx-soa-customer-field[data-property-id-row="2"],
#bx-soa-properties .bx-soa-customer-field[data-property-id-row="3"],
#bx-soa-properties .bx-soa-customer-field[data-property-id-row="6"],
#bx-soa-properties .bx-soa-customer-field[data-property-id-row="25"]{
flex: 1 1 100%!important;
}
#bx-soa-properties .bx-soa-customer-field .tooltip.bottom{
font-size: 16px !important;
}
#bx-soa-total{
flex: 0 0 auto;
}
}
/* 991 Мобилки конец */
/* 767 Мобилки начало */
@media screen and (max-width: 767px) {
.main-section > .content-center {
padding: 0 15px;
}
body {
background: url(../img/fon.webp) repeat center top #ffffff !important;
background-size: contain !important;
}
header .header-bottom .content-center .header-slogan{
margin: 0 !important;
padding: 0 !important;
}
header .header-cart-item-delete{
opacity: .5;
}
.main_banners,
.main_minies{
gap: 10px;
}
.catalog-sections .catalog-sections-items {
grid-template-columns: repeat(2, 1fr);
}
.mainpage .main-section {
padding: 20px 0;
margin: 0 -15px;
background: #F2F2F2;
}
.main-section {
padding: 10px 0;
border-radius: 0;
margin: 0 -15px;
background: #F2F2F2;
}
.mainpage .main-section .columns .content-area{
background: #F2F2F2;
}
.catalog-sections .catalog-section-item{
background: #fff;
box-shadow: unset;
}
.catalog-sections .catalog-section-title span{
color: #fff;
}
.catalog-sections .catalog-section-title{
border-radius: 60px;
background: #8C7265;
}
.catalog-section-item:hover {
box-shadow: unset;
transform: unset;
}
.catalog-section-item:hover .catalog-section-title {
background: #8C7265;
}
.catalog-section-item:hover .catalog-section-title span {
color: #fff;
}
.val-about-company{
display: flex;
}
.val-about-company > .val-about-company-text{
padding: 0 10px;
}
h2 a.heading-note span{
display: none;
}
.catalog-popular-items h2 span{
justify-content: flex-start;
}
h2 a.heading-note::after{
width: 28px;
height: 28px;
margin: 0;
}
h2 a.heading-note{
margin: 0;
padding: 20px 10px;
background: none;
}
.catalog-items .catalog-item.catalog-element::before{
display: none;
}
.catalog-items .catalog-item.catalog-element{
background: #fff;
min-width: 156px;
}
.val-photo-card {
margin: 3px;
}
.catalog-items .catalog-item-price-and-buy{
margin: 0 10px 10px;
}
.catalog-items .catalog-item.catalog-element:hover {
box-shadow: unset;
transform: unset !important;
}
.catalog-items .catalog-item.catalog-element:hover .catalog-item-buy a {
border-radius: 10px;
}
.catalog-items .catalog-item:not(.dayly-product-item) .catalog-item-price .normalprice, .catalog-items .catalog-item:not(.dayly-product-item) .catalog-item-price .rub{
font-size: 18px;
font-weight: 700;
}
.catalog-items .catalog-item:not(.dayly-product-item) .catalog-item-price .unit {
font-size: 14px;
}
.catalog-items .catalog-item:not(.dayly-product-item) .catalog-item-price .oldprice {
font-size: 14px;
}
.catalog-items .catalog-item:not(.dayly-product-item) .catalog-item-price .oldprice .rub {
font-size: 14px;
color: #3D3734;
font-weight: 500;
}
.catalog-items .catalog-item-title a{
font-size: 12px;
font-weight: 500;
line-clamp: 6;
-webkit-line-clamp: 6;
}
.catalog-items .catalog-item:not(.dayly-product-item) .catalog-item-buy a{
font-size: 14px;
font-weight: 500;
}
.label{
font-size: 12px;
font-weight: 500;
}
.catalog-items .catalog-item.catalog-element .save-item{
width: 24px;
height: 24px;
}
.add-to-favorites:before{
font-size: 190%;
}
.val-photo-card .percent{
font-size: 12px;
line-height: 120%;
}
.catalog-items .owl-item .catalog-item:not(.dayly-product-item), ul.catalog-items .owl-item li{
width: unset;
}
.catalog-top .owl-stage{
display: flex;
align-items: stretch;
}
.catalog-top .owl-item{
height: auto;
}
.catalog-top .owl-next,
.catalog-top .owl-prev{
top: 92px;
right: 0;
}
.catalog-popular-items h2 span{
align-items: flex-end;
}
.catalog-items .mp-rating-value-wrap span{
font-size: 12px !important;
}
/**/
.mp-rating-value {
flex: 0 1 62px;
width: 100% !important;
background-size: 100%;
height: 12px !important;
overflow: hidden;
}
.mp-rating-value div{
flex: 0 1 62px;
background-size: 100%;
}
.catalog-items .catalog-item:not(.dayly-product-item) .mp-rating-value-wrap{
gap: 4px;
}
.catalog-items .mp-rating-value-wrap span{
margin-top: 2px;
}
.catalog-top {
margin-top: 30px;
}
.catalog-popular-items .catalog-items:after{
display: none;
}
.catalog-popular-items .owl-dots{
display: none;
}
.banner-block-aktsii{
background-color: #fff;
}
.banner-block-aktsii {
height: 320px;
}
.banner-block .banner-item{
top: 82px;
}
.banner-block .banner-item .banner-item-title-label {
font-size: 40px;
color: #8C7265;
}
.banner-block .banner-item{
align-items: center;
}
.val-btn-banner-wrap .val-btn-banner{
background: #F4EEE8;
font-weight: 500;
font-size: 18px;
}
.val-banner-img-2 {
width: 277px;
bottom: 0px;
top: unset;
left: calc(50% - 120px);
transform: translateX(-50%);
}
.val-banner-img-1 {
width: 184px;
bottom: 0;
top: unset;
left: calc(50% + 160px);
transform: translateX(-50%);
}
.banner-figure-1 {
left: -180px;
bottom: -330px;
top: unset;
}
.banner-figure-2 {
right: -130px;
top: -290px !important;
width: 358px;
}
.banner-block .banner-item {
left: 50%;
}
.company-about__features {
grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
}
.feature-card {
background: #fff;
}
.company-about__quote{
background: #ffffff;
}
.company-about__title {
margin-bottom: 0;
}
.hidden-prods-wrap .catalog-item {
background: #ffffff;
}
.hidden-prods-wrap .catalog-item{
border: none;
}
.main-section .catalog-items{
gap: 15px;
}
.catalog-items, ul.catalog-items > div, .hidden-carusel-items ul.catalog-items{
margin-left: unset;
}
.scrollTopBtn{
display: none;
}
.scrollTopBtn.show{
display: none !important;
}
.catalog-sections .catalog-section-title{
transition: background-color 0.1s, transform 0.1s;
}
.catalog-sections .catalog-section-title:active{
background-color: #a88e80; /* измените цвет фона при нажатии */
transform: scale(0.97);
}
.main-section.main-section--cart{
background: #fff;
}
.main-section--cart .cart-total,
.main-section--cart .cart-buttons{
display: none;
}
.main-section--cart .cart-items .item-title a {
font-size: 16px;
}
.main-section--cart .cart-item {
padding: 15px;
}
.main-section--cart .cart-item-main {
align-items: flex-start;
flex-direction: column;
}
.cart-item-main-content-total{
padding-left: 110px;
width: 100%;
position: relative;
}
.main-section--cart .cart-items .cart-item .quantity a{
border: none !important;
}
.linked-item-name,
.linked-item-price,
.linked-item-block.linked-item-added{
font-size: 15px;
line-height: 110%;
}
.main-section--cart .cart-item-main-content-total .buttons{
margin-left: auto;
margin-right: 13px;
width: unset !important;
}
.main-section--cart .cart-items .total{
right: 58px;
position: absolute;
}
.main-section--cart .ml-auto-added{
display: none;
}
.main-section--cart .button-order-submit{
width: 100%;
}
.main-section--cart .basket_items_sidebar{
margin: -20px 0 15px 0;
}
/*
.cart-delivery-banner .calendar-tittle, .cart-delivery-banner .calendar-day, .cart-delivery-banner .calendar-month, .cart-delivery-banner .calendar-time{
color: #fff;
}
.cart-delivery-banner .header-calendar{
background: radial-gradient(circle at center, #A88E80 0%, #9D7C6D 100%);
}
.cart-delivery-banner .calendar-time::before{
background-image: url(/local/templates/optima/css/img/mobile-menu/loading.svg);
} */
.basket_items_sidebar{
width: 300px;
}
.mob-btn-buy{
display: flex;
background-color: #ffffff;
position: fixed;
bottom: 70px;
left: 0;
width: 100%;
box-shadow: 0 -7px 10px rgba(0, 0, 0, 0.1);
padding: 15px;
z-index: 1100;
}
/* Переопределение для плавающей кнопки оформления заказа - должна быть внизу экрана */
#bx-soa-mobile-floating-button.mob-btn-buy.val-order-btn-mob {
bottom: 0 !important;
display: flex !important;
}
.mob-btn-buy .button-order-submit{
justify-content: space-between;
max-width: unset;
}
.mob-btn-buy__sum-wrapper{
display: flex;
align-items: center;
gap: 10px;
}
.mob-btn-buy__sum,
.mob-btn-buy__sum span{
font-size: 16px;
font-weight: 500;
color: #fff;
}
.mob-btn-buy__discount,
.mob-btn-buy__discount span{
font-size: 14px;
color: #BAAAA3;
text-decoration: line-through;
}
.main-section.main-section--order{
border-radius: 0;
padding: 10px 0;
}
.main-section--order .content-center{
background: #fff;
padding: 15px 15px;
border-radius: 30px 30px 0 0;
}
.VAL-RETURN-ZAKAZ:before{
width: 30px;
height: 30px;
background-color: #F9F6F3;
border-radius: 8px;
margin-right: 0;
}
.VAL-RETURN-ZAKAZ{
gap: 12px;
color: var(--color-korichneviy-1-txt) !important;
}
.main-section--order h1 {
margin: 10px 0 14px 0;
}
.VAL-ORDER-FORM .bx-soa-pp-company-parameters{
border-top: 1px solid #E8E7E6;
padding: 12px 0 0 0 !important;
}
.VAL-ORDER-FORM .bx-soa-pp-item-container > .bx-soa-pp-company{
gap: 12px;
}
.VAL-ORDER-FORM .bx-soa-pp-company-block{
padding-top: 8px !important;
}
.VAL-ORDER-FORM .bx-soa-pp-company-block .form-group {
flex-direction: column;
flex-wrap: nowrap;
align-items: flex-start;
gap: 4px;
}
.VAL-ORDER-FORM .bx-soa-pp-company:nth-child(3) .bx-soa-pp-company-block .form-group{
flex-direction: row;
flex-wrap: wrap;
align-items: center;
gap: 12px;
}
.VAL-ORDER-FORM .bx-soa-pp-company-block .bx-soa-timeslot-tile{
min-width: 256px;
justify-content: space-between;
}
.VAL-ORDER-FORM .bx-soa-pp-company-smalltitle{
display: flex !important;
flex-wrap: wrap;
line-height: 1.2 !important;
column-gap: 8px;
}
.VAL-ORDER-FORM .bx-soa-pp-item-container > .bx-soa-pp-company{
padding: 16px 15px 13px 52px !important;
}
.VAL-ORDER-FORM .bx-soa-delivery-and-paysystem {
gap: 15px;
}
#bx-soa-paysystem .bx-soa-pp-company-smalltitle{
padding-right: 0 !important;
}
.bonus-amount-badge{
margin-left: auto;
}
.VAL-ORDER-FORM #bx-soa-properties {
margin-top: 15px !important;
}
#bx-soa-total{
max-width: unset;
}
#bx-soa-total .bx-soa-cart-total{
background-color: #F2F2F2;
margin: 0 -15px;
padding: 20px 15px !important;
width: calc(100vw - 15px) !important;
}
.VAL-ORDER-FORM {
padding-bottom: 0px;
gap: 0;
}
#bx-soa-total {
margin: 0 auto 70px;
}
#bx-soa-total .bx-soa-coupon .bx-soa-coupon-input input{
background-color: #ffffff !important;
}
.bx-soa-orderSave-consent .consent-toggle-wrapper {
margin: 0;
}
.main-user-consent-request-popup-cont {
height: unset;
}
body:not(.mainpage) .main-section:not(.main-section--order) .content-center{
background: #fff;
padding: 15px 15px;
border-radius: 30px 30px 0 0;
}
.breadcrumbs{
width: 100%;
overflow-x: auto; /* Включаем горизонтальный скролл */
white-space: nowrap; /* Запрещаем перенос строк */
-webkit-overflow-scrolling: touch; /* Плавный скролл на iOS */
margin: 0 -15px;
width: calc(100% + 30px);
padding-left: 15px;
padding-right: 15px; /* Добавляем симметричный отступ справа */
padding-bottom: 12px; /* Важно: место для самой полосы скролла */
overflow-x: auto;
white-space: nowrap;
-webkit-overflow-scrolling: touch;
/* Включаем отображение скроллбара в Firefox */
scrollbar-width: thin;
scrollbar-color: #ccc transparent;
}
/* Стилизация полосы прокрутки для Chrome, Safari и Edge */
.breadcrumbs::-webkit-scrollbar {
height: 4px; /* Высота горизонтальной полосы */
display: block; /* Убеждаемся, что она не скрыта */
}
.breadcrumbs::-webkit-scrollbar-track {
background: transparent; /* Фон дорожки */
}
.breadcrumbs::-webkit-scrollbar-thumb {
background-color: #cccccc; /* Цвет ползунка */
border-radius: 10px; /* Скругление */
}
.breadcrumbs ul{
display: flex;
align-items: center;
gap: 8px;
flex-wrap: nowrap;
align-items: center;
}
.breadcrumbs li:before{
display: none;
}
.breadcrumbs li:not(:last-child){
background-color: var(--color-svetliy-3);
border-radius: 50px;
display: inline-block;
padding: 6px 10px;
margin: 0 !important;
color: rgba(66, 66, 66, 0.5);
font-size: 14px;
font-weight: 500;
line-height: 1.2;
text-align: center;
flex: 0 0 auto; /* Не даем элементам сжиматься */
}
.breadcrumbs li > span,
.breadcrumbs li:last-child{
display: block !important;
color: rgba(66, 66, 66, 0.5);
font-size: 14px;
font-weight: 500;
line-height: 1.2;
text-align: center;
white-space: nowrap;
margin: 0;
}
}
/* 767 Мобилки конец */
/* 600 Мобилки начало */
@media screen and (max-width: 600px) {
.main_banners{
background: unset !important;
}
.val-header{
margin: 0 -15px;
}
.header-bottom{
padding: 0 15px;
}
.header-top-pannel {
right: -20px;
}
.val-header-top > .content-center{
border-radius: 0;
}
.main_slider .item{
aspect-ratio: 16 / 9;
border-radius: 0;
overflow: hidden;
}
.main_minies img{
border-radius: unset;
}
.banner-small-container{
border-radius: 10px;
overflow: hidden;
box-shadow: 0 2px 16px 0 rgb(0 0 0 / 10%);
}
.banner-small-container::before{
content: "";
position: absolute;
top: 0px;
bottom: 0px;
left: 0px;
right: 0px;
border: 2px solid #ffffff;
border-radius: 10px;
pointer-events: none;
}
.slider_block .item img {
border-radius: 20px;
}
.slider_block{
overflow: visible;
margin-bottom: 20px;
}
.slider_block .slick-dots{
bottom: -25px;
}
.slider_block .slick-dots{
width: 100% !important;
}
.main_banners{
margin: 0 0 10px 0;
}
.slider_block .slick-dots li button{
border: 2px solid hsl(0deg 0% 100% / 59%) !important;
}
.slider_block .slick-dots li.slick-active button{
background-color: #000000bf !important;
border-color: transparent !important;
}
div.title-search-result .contaner-item-bui{
flex-direction: column !important;
}
div.title-search-result .search-results .btn-container a{
width: 100% !important;
}
.header-searcher span.svg_search{
right: 168px;
}
header .header-scroll .header-top-pannel {
right: -30px !important;
}
.main-section {
padding: 10px 0;
}
.main-section > .content-center {
padding: 0 10px;
}
.hidden-news-wrap.content-center{
padding: 0 10px !important;
}
.container{
padding-right: 10px;
padding-left: 10px;
}
.header-cart-dropdown{
right: 15px;
}
.main-section {
margin: 0 -10px;
}
.val-about-company .video_block:before{
width: 16vw;
height: 16vw;
}
.val-about-company .video_block:after{
width: 5vw;
height: 7vw;
}
.catalog-items{
margin-bottom: 0 !important;
grid-template-columns: 1fr 1fr;
}
.catalog-top {
margin-top: 0px;
}
.val-about-company{
margin-bottom: 20px;
}
.val-banner-img-2 {
width: 277px;
bottom: 70px;
top: unset;
left: calc(50% - 30px);
transform: translateX(-50%);
}
.val-banner-img-1 {
width: 184px;
bottom: 0;
top: unset;
left: calc(50% + 120px);
transform: translateX(-50%);
}
.banner-block-aktsii {
height: 430px;
}
.banner-block .banner-item{
width: 70% !important;
text-align: center;
}
.banner-item-title-label-aktsii{
line-height: 40px;
}
.banner-block .banner-item {
top: 100px;
}
.company-about__info{
display: flex;
flex-direction: column;
}
.hidden-prods-wrap .catalog-viewed-products-title{
margin: 0 0 10px;
}
.hidden-prods-wrap .catalog-item{
width: 100%;
}
.hidden-prods-wrap{
margin-bottom: 8px !important;
}
.footer-content {
grid-template-columns: 1fr;
grid-template-rows: auto;
margin: 0 auto;
max-width: 320px;
}
.footer-content .footer-brand {
grid-column: 1;
grid-row: 1;
}
.footer-content .footer-klients {
grid-column: 1;
grid-row: 2;
}
.footer-content .footer-column.o-nas {
grid-column: 1;
grid-row: 3;
}
.footer-content .footer-column.footer-contacts {
grid-column: 1;
grid-row: 4;
}
.scrollTopBtn{
bottom: 30px;
}
.footer-catalog-section-menu{
padding: 0 10px;
}
.main-section .columns .val-banner{
margin-top: 15px !important;
}
.val-search .search-field-input{
font-size: 16px;
}
.main-section--cart .button.button-return:before{
width: 30px;
height: 30px;
background-color: #F9F6F3;
border-radius: 8px;
}
.main-section--cart .button.button-return{
font-size: 14px;
color: var(--color-korichneviy-1-txt);
opacity: 1;
margin-top: 4px;
}
.main-section--cart .button.button-return:before{
background-image: url('data:image/svg+xml,');
}
.main-section--cart .cart-items .total{
position: unset;
order: 2;
flex-basis: 100%;
text-align: left;
}
.main-section--cart .cart-item-main-content-total .buttons{
margin: 0 !important;
order: 1;
}
.cart-item-main-content-total{
flex-wrap: wrap;
row-gap: 8px;
}
.main-section--cart .linked-item-wrapper a{
height: unset;
gap: 8px;
}
.main-section--order > .content-center {
padding: 0;
}
.VAL-RETURN-ZAKAZ {
padding: 15px 0 0 15px;
}
.main-section--cart .button.button-return:before {
margin-right: 0;
}
.main-section--cart .button.button-return{
gap: 12px;
}
.main-section--order h1 {
text-align: center;
}
.VAL-ORDER-FORM .bx-soa-pp-company-description{
align-items: flex-start !important;
}
.VAL-ORDER-FORM .bx-soa-pp-company-description::before{
flex: 0 0 34px;
}
.VAL-ORDER-FORM #bx-soa-delivery, .VAL-ORDER-FORM #bx-soa-paysystem {
gap: 14px;
}
.daterangepicker{
right: unset !important;
left: 50% !important;
transform: translateX(-50%);
}
.daterangepicker.opensright:before,
.daterangepicker.opensright:after{
display: none !important;
}
.daterangepicker{
width: unset !important;
}
.val-km-input{
flex-wrap: wrap;
row-gap: 4px;
margin-top: 7px;
}
.VAL-ORDER-FORM .bx-soa-pp-company:nth-child(3) .bx-soa-pp-company-block .form-group{
row-gap: 4px;
padding-left: 45px;
}
.VAL-ORDER-FORM .mkad-delivery-label{
margin-left: -45px;
}
.VAL-ORDER-FORM .bx-soa-pp-company-block .form-group input.form-control{
margin-left: 0;
}
.bonus-toggle-wrapper{
align-items: flex-start;
}
.main-user-consent-request-popup-header {
display: -webkit-box;
-webkit-box-orient: vertical;
line-clamp: 2;
-webkit-line-clamp: 2;
line-height: 110%;
max-height: unset;
overflow: visible;
max-width: unset;
white-space: unset;
}
.main-user-consent-request-popup-cont{
width: 101%;
}
}
/* 600 Мобилки конец */
/* 450 Мобилки начало */
@media screen and (max-width: 450px) {
.val-header-delivery img{
display: none;
}
.val-header-delivery::after{
content: "";
background: linear-gradient(to right, rgb(17 6 0 / 55%), rgb(29 12 0 / 50%) 50%) !important;
width: 100%;
height: 100%;
position: absolute;
border-radius: 10px;
}
.val-header-delivery > span{
z-index: 1;
text-align: left;
margin: 0;
}
.val-header-delivery{
padding: 10px 20px;
justify-content: center;
width: auto;
}
.val-header-top > .content-center {
padding: 0;
}
#mobileheader .header-menu {
gap: 0px;
}
.val-header-delivery{
font-size: 15px;
font-weight: 400;
height: 85px;
}
.val-header-delivery > span{
width: 120px;
}
.val-bg-fish-wrap{
display: none;
}
header .header-bottom .content-center .header-slogan{
width: auto;
height: auto;
max-width: unset;
}
.header-reyt-time a,
.header-reyt-time span{
font-weight: 400;
gap: 4px;
}
.header-reyt-time .val-otz{
padding: 8px 0px !important;
}
#mobileheader .mobile-logo.logo-out {
width: 114px;
display: flex;
align-items: center;
}
.header-cart .icon.icon-cart{
width: 26px !important;
object-fit: contain;
height: 26px !important;
background-size: contain !important;
mask-size: contain !important;
-webkit-mask-size: contain !important;
}
.header_top_wraper .favorites svg {
width: 26px;
height: 26px;
}
header .header-private .authorize .icon-login.noauth:before{
mask-size: contain !important;
-webkit-mask-size: contain !important;
width: 26px !important;
object-fit: contain;
height: 26px !important;
}
.header-searcher span.svg_search svg {
width: 26px;
height: 26px;
}
.header_top_wraper .favorites span{
top: -5px;
}
.header_top_wraper .favorites {
height: 28px;
}
header .header-scroll .header-top-pannel {
right: -40px !important;
}
.header-top-pannel .header_top_wraper {
gap: 7px;
}
header .header-private .authorize .icon-login{
padding: 0 8px 0 0;
}
.header-searcher span.svg_search{
right: 140px;
top: 12px;
}
.catalog-sections .catalog-section-title span{
font-size: 12px !important;
}
.catalog-sections .catalog-section-title{
padding: 0px 10px;
margin: 0 7px 7px;
height: 34px;
}
.val-about-company h2{
font-size: 26px;
}
.val-about-company-text p {
font-size: 14px;
}
.val-photo-card a{
height: 158px !important;
}
.catalog-top {
margin-bottom: 0px;
}
.catalog-popular-items{
margin-top: 0;
}
.catalog-item-buy {
margin: 0;
}
.val-banner-img-2{
width: 241px;
}
.val-banner-img-1{
width: 146px;
left: calc(50% + 80px);
}
.banner-block-aktsii {
height: 410px;
}
.feature-card{
flex-direction: row;
}
.feature-card__icon{
flex: 0 0 auto;
}
.feature-card{
gap: 18px;
}
.feature-card__title{
line-height: 120%;
}
.hidden-prods-wrap{
padding: 0 10px;
}
#hidden-news .image {
height: 140px;
}
.hidden-prods-wrap{
margin-bottom: 3px !important;
}
.main-section .catalog-items {
gap: 10px;
}
.catalog-items.tiles{
width: unset;
margin: 0 !important;
}
.catalog-items .catalog-item-image img{
width: 100%;
}
.cart-block-info {
font-size: 13px;
padding: 12px 20px;
max-width: unset;
width: 100%;
}
.cart-block-info-container{
flex-direction: column;
}
.min-order-basket-txt .header-delivery__bordered br,
.cart-block-info-container .cart-block-info br{
display: none;
}
.main-section--cart h1 {
font-size: 30px;
}
.main-section--cart .quantity{
width: 145px;
min-width: 145px;
}
.main-section--cart .quantity-up span,
.main-section--cart .quantity-down span{
width: 18px !important;
height: 18px !important;
}
.basket_items_sidebar{
width: 100%;
}
.VAL-RETURN-ZAKAZ {
font-size: 14px;
}
.main-section--order h1{
font-size: 30px;
}
.VAL-ORDER-FORM .bx-soa-pp-item-container > .bx-soa-pp-company{
padding: 16px 15px 13px 15px !important;
}
.VAL-ORDER-FORM .bx-soa-pp-company-smalltitle {
padding-right: 88px !important;
padding-left: 30px !important;
font-size: 16px !important;
}
.VAL-ORDER-FORM .bx-soa-delivery-and-paysystem-item{
padding: 15px !important;
}
.VAL-ORDER-FORM .bx-soa-section-title {
font-size: 25px !important;
line-height: 13px !important;
}
.VAL-ORDER-FORM .bx-soa-section-title:before {
background-size: 40px;
width: 40px !important;
height: 40px !important;
left: -58px !important;
}
.VAL-ORDER-FORM .bx-soa-section-title-container {
padding: 0px 0 0px 58px !important;
}
.VAL-ORDER-FORM #bx-soa-delivery, .VAL-ORDER-FORM #bx-soa-paysystem {
gap: 10px;
}
.VAL-ORDER-FORM .bx-soa-pp-company-block .bx-soa-timeslot-tile{
min-width: unset !important;
width: 100%;
}
.daterangepicker .drp-calendar {
padding: 9px 4px !important;
}
.daterangepicker .calendar-table {
border-radius: 24px !important;
}
.daterangepicker {
width: 100% !important;
}
.VAL-ORDER-FORM .bx-soa-pp-list li {
row-gap: 4px !important;
flex-wrap: wrap;
}
.VAL-ORDER-FORM .bx-soa-pp-list-item .bx-soa-pp-list-description,
#bx-soa-paysystem-and-delivery .soa-property-container input[type="text"][data-calendar-only="true"]{
width: 100%;
}
#bx-soa-paysystem-and-delivery .soa-property-container input[type="text"][data-calendar-only="true"]{
margin-left: 45px !important;
}
.VAL-ORDER-FORM .bx-soa-pp-company-block .form-group input.form-control {
width: 100%;
max-width: unset;
}
.mkad-input-wrapper {
width: 100%;
}
.mkad-input-wrapper span{
right: unset;
left: 40px;
}
#bx-soa-properties .bx-soa-customer,
#bx-soa-properties .bx-soa-section-content.container-fluid .row .col-sm-12{
padding: 0 5px;
}
.main-user-consent-request-popup-button{
width: 100%;
}
.pfc-container {
gap: 20px;
padding: 15px 20px;
justify-content: space-between;
width: 100%;
}
.pfc-value {
font-size: 20px;
}
.spec-row.is-brand .spec-value {
flex-direction: column;
align-items: flex-start;
}
}
/* 450 Мобилки конец */
#YtmDiscountPopup, .YtmDiscountPopup {
display: none !important;
}