.ocf-theme-light-block .ocf-search-btn-static, .ocf-theme-light-block .ocf-search-btn-popover, .ocf-theme-light-block .ocf-search-btn-static.ocf-disabled, .ocf-theme-light-block .ocf-search-btn-popover.ocf-disabled, .ocf-noUi-connect:before, .ocf-noUi-handle {background-color:rgb(47, 53, 59) !important;}
:root {--ds-primary-color:rgb(47, 53, 59);}
:root {--ds-links-color:rgb(27, 38, 59);}
.ds-dropdown-links .blue-link, .ds-footer .blue-link {color:rgb(27, 38, 59);}
.blue-link:hover, .ds-footer-links li a:hover, ul.ds-footer-item li a:hover, .ds-footer-item li a:hover span, .ds-module-item:hover .ds-module-title:hover, .ds-last-news-item:hover .ds-last-news-item-title:hover, .ds-switcher button:hover {color:rgb(27, 38, 59);}
.ds-price-new.red-text {color:rgb(211, 47, 47);}
:root {--ds-interactive-color:rgb(184, 198, 181);}
:root {--ds-body-bg-light-color:rgb(255, 255, 255);}
:root {--ds-primary-dark-color-light:rgb(0, 23, 31);}
:root {--ds-secondary-dark-color-light:rgb(0, 52, 89);}
.light-theme .ds-header {background:rgb(255, 255, 255);}
:root {--ds-footer-bg-light-color:rgb(255, 255, 255);}
.light-theme .ds-footer-subscribe-text, .light-theme .ds-footer-item .secondary-text, .light-theme .ds-footer-socials .secondary-text {color:rgb(0, 52, 89);}
.light-theme .ds-footer-item-title {color:rgb(0, 23, 31);}
.light-theme .ds-footer-item-title svg path {fill:rgb(0, 23, 31);}
:root {--ds-body-bg-dark-color:rgb(47, 53, 59);}
:root {--ds-primary-dark-color-dark:rgb(248, 252, 255);}
:root {--ds-secondary-dark-color-dark:rgb(144, 144, 144);}
.dark-theme .ds-header {background:rgb(47, 53, 59);}
:root {--ds-footer-bg-dark-color:rgb(20, 20, 20);}
.dark-theme .ds-footer-subscribe-text, .dark-theme .ds-footer-item .secondary-text, .dark-theme .ds-footer-socials .secondary-text {color:rgb(144, 144, 144);}
.dark-theme .ds-footer-item-title {color:rgb(248, 252, 255);}
.dark-theme .ds-footer-item-title svg path {fill:rgb(248, 252, 255);}
.oct_dynamic_stylesheet_begin{display: none;}
@media (max-width: 768px) {
    header.ds-header .ds-header-compare-button, 
    header.ds-header .ds-header-viewed-button, 
    header.ds-header .ds-header-wishlist-button {
        display: none !important;
    }
}
@media (min-width: 1200px) {
    .ds-header.with-categories-menu .ds-menu-main-catalog.with-slideshow {top: calc(100% + 28px) !important;}
    .with-categories-menu {padding-top: 0px !important;}
    .ds-menu-maincategories {border-top-width: 0px !important;}
    .telephone-header {display: none;}
    .top-bar-header {margin-bottom: 15px;}
    .fsz-12 {font-size: 1rem !important;}
}
/* Выбираем именно первый блок внутри хедера */
.ds-header > .container-xl.position-relative {
    background-color: #2F353B !important; /* Черный фон */
    color: #fff !important;            /* Белый текст */    
    /* Трюк для растягивания фона на всю ширину экрана */
    box-shadow: 0 0 0 100vmax #000;
    clip-path: inset(0 -100vmax);
}

/* Делаем все ссылки внутри этой полоски белыми */
.ds-header > .container-xl.position-relative a {color: #F2F2F2 !important;}
/* Если при наведении ссылки должны менять цвет (например, на серый) */
.ds-header > .container-xl.position-relative a:hover {color: #ccc !important;}

@media (min-width: 1600px) {
    .ds-slideshow-items-vertical {min-height: 410px !important;}
	.ds-menu-catalog-items {min-height: 410px !important;}
    .ds-menu-maincategories-desktop-box .ds-menu-maincategories::after {background: none;}
    .fsz-14 {font-size: 1rem !important;}
}

.ds-menu-maincategories-desktop-box a {
    color: #ffffff !important;
    text-decoration: none;
    margin-right: 20px; 
    font-size: 14px;
}

.ds-menu-maincategories-desktop-box a:hover {
    color: #cccccc !important; 
}

/* Цвет текста телефона */
.ds-header-phone-button .text-white {
    color: #F2F2F2 !important;
}

/* Стили для переключателя языков */
.header-lang-curr .btn-group > .btn, 
.header-lang-curr a,
.header-lang-curr span {
    color: #F2F2F2 !important; 
    background: transparent !important;
    border: none;
}

/* Активный язык */
.header-lang-curr .active {color: #28a745 !important;}
.header-lang-curr:after {color: #F2F2F2;}

@media (max-width: 768px) {
	.comp, .top-bar-header {display: none;}
}
/* Стикера */
/* 1. Стилизуем сам прямоугольник */
.ds-module-sticker-stickers_special {
    border-radius: 4px !important;  /* Делаем углы менее круглыми (как на фото) */
    font-weight: 800 !important;    /* Жирный шрифт */
    text-transform: uppercase;      /* Текст заглавными (SALE) */
    position: relative;             /* Важно для позиционирования хвостика */
    border: none !important;        /* Убираем границы, если есть */
    box-shadow: none !important;    /* Убираем тени, если есть */
}

/* 2. Создаем треугольный хвостик снизу */
.ds-module-sticker-stickers_special::after {
    content: '';
    position: absolute;
    bottom: -6px; /* Опускаем хвостик под блок. Если обрезается - уменьшите это число */
    left: 6px;    /* Отступ хвостика слева */
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 8px 8px 0 0; 
    border-color: #caff00 transparent transparent transparent; /* Цвет должен совпадать с фоном (салатовый) */
}
@media (min-width: 1200px) {
    .ds-module-sticker {
        font-size: .9rem;
    }
}
.ds-module-sticker-stickers_special {transform: rotate(5deg) !important; margin-top: 5px; margin-left: 5px;}
/****************************/
@media (max-width: 991px) {
    /* 1. Главный контейнер для правой части (Клієнту + иконки) */
    .ds-header-right {
        justify-content: center !important; /* Центрирует всю группу элементов */
        padding-right: 0 !important;
        flex-grow: 1;
        gap: 15px; /* Устанавливает ОДИНАКОВОЕ расстояние между всеми иконками */
    }

    /* 2. Сбрасываем все лишние внешние отступы Bootstrap, которые мешают */
    .ds-header-right .me-3, 
    .ds-header-right .ms-md-3,
    .ds-header-right .telephone-header,
    .ds-header-right .ds-dropdown-box,
    .ds-header-right .ds-header-search-toggle-button {
        margin: 0 !important; 
        padding: 0 !important;
    }

    /* 3. Выравниваем все кнопки строго по центральной линии (вертикально) */
    .ds-header-right > div, 
    .ds-header-right > button, 
    .ds-header-right > a {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        height: 40px; /* Одинаковая высота для всех зон клика */
    }

    /* 4. Исправляем блок "Клієнту", чтобы текст и иконка не разъезжались */
    .ds-header-user-button {
        display: flex !important;
        align-items: center !important;
        gap: 4px;
    }

    /* 5. Исправляем блок телефона */
    .ds-header-phone-button {
        display: flex !important;
        padding: 0 !important;
    }

    /* 6. Поправляем бейдж на корзине, чтобы он не смещал саму иконку */
    .ds-header-cart-button {
        padding: 0 !important;
        width: 30px;
    }
    .ds-header-cart-button .badge {
        top: -5px !important;
        right: -8px !important;
    }
}
.ds-price-old {font-size: 0.8rem !important;}
/***********/
/* 1. Скрываем всё, что вылезает за границы блока */
.ds-module-img-box {
    overflow: hidden;
    /* Убедимся, что скругление углов (если есть) применяется к контейнеру */
    border-radius: 8px; /* Опционально, если у вас скругленные блоки */
}

/* 2. Добавляем плавность переходу для самой картинки */
.ds-module-img-box img {
    transition: transform 0.3s ease-in-out;
    transform-origin: center center; /* Увеличение от центра */
    will-change: transform; /* Оптимизация производительности */
}

/* 3. Увеличиваем картинку при наведении на весь блок */
.ds-module-img-box:hover img {
    transform: scale(1.1); /* Увеличение на 10%. Можете поставить 1.2 для большего зума */
}
/********/
/* Контейнер картинки: скрываем всё, что выходит за границы при увеличении */
.ds-slideshow-plus-item-fullimg {
    overflow: hidden;
    border-radius: 4px; /* Чтобы углы обрезались красиво, если у картинки есть br-4 */
}

/* Сама картинка: задаем плавность перехода */
.ds-slideshow-plus-item-fullimg img {
    transition: transform 0.5s ease; /* Время анимации (0.5 сек) */
    display: block;
}

/* Эффект при наведении на ссылку или контейнер */
.ds-slideshow-plus-item-fullimg:hover img {
    transform: scale(1.1); /* Увеличиваем на 10%. Можно поставить 1.05 или 1.2 */
}
/***/
.ds-footer {
    background: #000; 
    padding-top: 0 !important;
}

@media (min-width: 992px) {
    .ds-footer {background: linear-gradient(to right, #ffffff 45%, #000000 45%);}
}

/* Левая часть (белая зона) */
.ds-footer .col-md-6.col-lg-5.order-0 {
    background: #fff;
    padding-top: 3rem;
    padding-bottom: 3rem;
}

/* Правая часть (черная зона) */
.ds-footer-bordered-links,
.ds-footer-socials,
.ds-footer-item-title,
.ds-footer-links a,
.ds-footer-copyrights {
    color: #F2F2F2 !important;
}
.ds-footer .secondary-text {
    color: #F2F2F2 !important;
}
.ds-footer .light-text {
    color: #F2F2F2 !important;
}

/* Заголовки в черной зоне */
.ds-footer-item-title {
    font-size: 1.25rem;
    font-weight: 600;
    margin-bottom: 1.5rem !important;
    text-transform: none;
}

/* Ссылки в черной зоне (убираем синий цвет) */
.ds-footer-links a, 
.ds-footer-item ul li a {
    color: #aaaaaa !important;
    text-decoration: none;
    transition: 0.3s;
}

.ds-footer-links a:hover {
    color: #F2F2F2 !important;
}

/* Вертикальная линия перед блоком подписки (как на фото) */
@media (min-width: 1200px) {
    .ds-footer-socials { 
        border-left: 1px solid #333;
        padding-left: 40px;
    }
}

/* Нижняя панель (Copyright и платежки) */
.ds-footer-bordered.order-3 {
    border-top: 1px solid #333 !important;
    margin-top: 0 !important;
    padding-top: 2rem !important;
    padding-bottom: 2rem !important;
}

.ds-footer-item-title svg {display: none;}

.ds-footer input[type="email"], 
.ds-footer input[type="text"] {
    background: #fff;
    border: none;
    border-radius: 0;
    padding: 12px;
}

.ds-footer-phones-shedule .ds-footer-item-title,
.ds-footer-phones-shedule .light-text,
.ds-footer-address .ds-footer-item-title,
.ds-footer-item-address,
.ds-footer .blue-link {
    color: rgb(0, 23, 31) !important;
}

.ds-dropdown .position-absolute {right: 50px !important;}
/* кнопка меню */
.button.button-outline-primary {color: #fff; background-color: green;}
.button.button-outline-primary svg path {fill: #fff;}
.ds-header .secondary-text {color: #000 !important;}
.button {border-radius: 0px !important;}
.button.ds-header-catalog-button {padding: 1.2rem 2rem;}
/********Доставка и оплата***************/
/* Общий контейнер секции */
.dp-section {
    font-family: sans-serif;
    color: #333;
    margin-bottom: 40px;
}

.dp-container {
    margin-bottom: 30px;
    display: flex;
    flex-wrap: wrap;
}

/* Левая карточка (Серая) */
.dp-main-card {
    background-color: #f8f9fa;
    padding: 30px;
    border-radius: 12px;
    height: 100%;
}

.dp-title {
    font-weight: 800;
    font-size: 18px;
    margin: 0 0 10px 0;
    letter-spacing: 0.5px;
}

.dp-intro {
    font-size: 15px;
    color: #555;
    margin-bottom: 25px;
}

/* Внутренняя карточка уведомления */
.dp-alert {
    background: #ffffff;
    padding: 20px;
    border-radius: 8px;
    border-left: 4px solid #ccc;
    box-shadow: 0 2px 10px rgba(0,0,0,0.03);
}

.dp-alert.alert-yellow { border-color: #ffb700; }
.dp-alert.alert-green { border-color: #2ecc71; }

.dp-alert-content strong {
    display: block;
    margin-bottom: 5px;
    font-size: 14px;
}

.dp-alert-content p {
    margin: 0;
    font-size: 13px;
    color: #666;
    line-height: 1.4;
}

/* Правая колонка (Список) */
.dp-details {
    padding-left: 15px;
    padding-top: 10px;
}

.dp-item {
    display: flex;
    align-items: flex-start;
    margin-bottom: 25px;
}

.dp-item-icon {
    min-width: 30px;
    font-size: 20px;
    color: #000;
    margin-right: 15px;
    padding-top: 2px; /* Выравнивание иконки по первой строке заголовка */
    text-align: center;
}

.dp-item-text h4 {
    margin: 0 0 5px 0;
    font-weight: 700;
    font-size: 16px;
}

.dp-item-text p {
    margin: 0;
    font-size: 14px;
    color: #555;
    line-height: 1.5;
}

/* Логотипы почты */
.dp-logos {
    margin-top: 15px;
    display: flex;
    gap: 20px;
    align-items: center;
}

.dp-logos img {
    height: 25px;
    width: auto;
}

/* Адаптация для мобильных */
@media (max-width: 767px) {
    .dp-main-card { margin-bottom: 20px; }
    .dp-details { padding-left: 0; }
    .dp-item-icon { min-width: 25px; font-size: 18px; }
}
/*********************/
#ds_fixed_contact_button i.fa-envelope {
    background: transparent !important;
    opacity: 1 !important;
    display: inline-flex !important;
    width: 22px !important;
    height: 22px !important;
    /* Вставляем белую иконку конверта как SVG */
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512' fill='white'%3E%3Cpath d='M464 64H48C21.49 64 0 85.49 0 112v288c0 26.51 21.49 48 48 48h416c26.51 0 48-21.49 48-48V112c0-26.51-21.49-48-48-48zm0 48v40.8l-192 158.4L80 152.8V112h384zM48 400V192.2l192 158.4c6.7 5.5 15.3 8.4 24 8.4s17.3-2.9 24-8.4l192-158.4V400H48z'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: contain !important;
}

#ds_fixed_contact_button i.fa-envelope:before {
    content: "" !important; /* Убираем пустой квадрат */
}
/* Принудительно подключаем шрифт ко всем иконкам */
.fa, .fas, .far, .fab, [class^="fa-"], [class*=" fa-"] {
    font-family: "Font Awesome 5 Free", "FontAwesome" !important;
    font-weight: 900 !important; /* Важно для версии 5 Solid */
    display: inline-block !important;
    font-style: normal !important;
    opacity: 1 !important;
    visibility: visible !important;
}

/* Если у вас старая версия FontAwesome 4 */
.fa {
    font-weight: normal !important;
}
/****/
/* Исправляем брендовые иконки (FB, Instagram и т.д.) */
.fab, [class*=" fa-facebook"], [class*=" fa-twitter"], [class*=" fa-instagram"] {
    font-family: "Font Awesome 5 Brands" !important;
    font-weight: 400 !important;
    display: inline-block !important;
    font-style: normal !important;
    opacity: 1 !important;
    visibility: visible !important;
}

/* На всякий случай для обычных иконок */
.fas, .fa {
    font-family: "Font Awesome 5 Free", "FontAwesome" !important;
    font-weight: 900 !important;
    display: inline-block !important;
    opacity: 1 !important;
    visibility: visible !important;
}

#input-sort, #input-limit {
    color: #000 !important;
}
.ds-footer-address .ds-footer-item-address {
    color: #000 !important;
}
.secondary-text2 {
    font-size: 0.8rem !important;
}
.ds-product-advantages-item-text-img {
    width: 35px;
}
.ds-footer-bordered.order-3 {border-top: 0px solid #333 !important;}
@media (min-width: 768px) {
    .ds-footer-top {border-bottom: none;}
  	#product .ds-product-fast-order-button {margin-left: 5px;}
}

/******/
.button.button-outline-primary {
    background-color: #1B263B;
}
#logo, .ds-footer-logo {
    width: 210px;
    height: auto !important;
}
.language-select {
    color: #fff !important;
}
.top-bar-header {
    background: #2F353B !important;
}.oct_dynamic_stylesheet_end{display: none;}