/* 5. Исправляем цвет текста описания (делаем светлее) */
.page-description.ct-hidden-sm {
    color: #ffffff !important; /* Чистый белый для максимальной читаемости на темном фоне */
    opacity: 0.5;             /* Легкая прозрачность, если белый слишком яркий */
}


/* ================================
   Скрываем диагональные разделители между секциями
   ================================ */
.ct-section-divider,
.ct-shape-divider {
    display: none !important;
    opacity: 0 !important;
}

/* --- НЕ трогаем футер и SVG, чтобы не ломать сайт --- */
/* footer и .ct-footer остаются без изменений */


/* скролл ПОДПИСКА на МОБ */ @media (max-width: 767px) { .wpforms-confirmation-container-full::before, div[id*="wpforms-confirmation"]::before { content: ""; display: block; height: 100px; margin-top: -76px; } } /* скролл ПОДПИСКА на ПК */ .wpforms-confirmation-container-full::before, div[id*="wpforms-confirmation"]::before { content: ""; display: block; height: 80px; margin-top: -76px; }


/* Белый текст + центрирование для подтверждения/алерта */
.wpforms-confirmation-container-full,
div[id*="wpforms-confirmation"] {
    color: #ffffff !important;
    text-align: center !important;
}

/* Алерт формы (ошибка) — белый текст, центрирование */
.wpforms-error-container {
    text-align: center !important;
    color: #ffffff !important; /* оставляем белый текст */
}


/* 2. ИСКЛЮЧЕНИЕ ДЛЯ КОНТАКТОВ: делаем текст темным только на странице 761 */
.page-id-761 .wpforms-confirmation-container-full,
.page-id-761 div[id*="wpforms-confirmation"] {
    color: #5B5B5B !important; /* Темно-серый/черный цвет */
}


/* 1. Плавный скролл для всего сайта */
html {
    scroll-behavior: smooth !important;
}

/* 2. Глобальный фикс для всех якорей и элементов с ошибками/подтверждениями */
/* Мы добавляем отступ сверху, равный высоте твоей шапки + запас */
[id],
.wpforms-confirmation-container-full,
.wpforms-error-container,
.wpc-filters-widget-wrapper {
    scroll-margin-top: 150px !important; /* Настрой это число под высоту своего хедера */
}

/* 3. Фикс конкретно для WPForms, чтобы при отправке не кидало резко */
.wpforms-confirmation-scroll {
    scroll-margin-top: 150px !important;
}


/* Полная фиксация цвета заголовка карточки на моб */
@media (max-width: 991px) {
    .woocommerce ul.products li.product a.woocommerce-loop-product__link {
        color: inherit !important;            /* сохраняем текущий цвет */
        background: none !important;          /* убираем фон при тапе */
        -webkit-tap-highlight-color: transparent !important;
        outline: none !important;
        user-select: none !important;
    }

    /* Отключаем любые эффекты при удержании */
    .woocommerce ul.products li.product a.woocommerce-loop-product__link:active,
    .woocommerce ul.products li.product a.woocommerce-loop-product__link:focus {
        color: inherit !important;
        background: none !important;
        outline: none !important;
    }
}


/* Индивидуальный контроль отступа над баннером на мобильных */
@media (max-width: 991px) {
    /* 1. Нацеливаемся на первый блок-разделитель Stackable внутри контента */
    .entry-content > .wp-block-stackable-spacer:first-child,
    .entry-content > [data-block-id="9d5a4ac"] {
        /* МЕНЯЙТЕ ЭТО ЗНАЧЕНИЕ: больше — баннер ниже, меньше — выше */
        height: 20px !important;

        /* Убираем лишние внешние отступы, если они есть */
        margin-top: 0 !important;
        margin-bottom: 0 !important;
    }

    /* 2. Обнуляем стандартный padding темы, чтобы он не суммировался с высотой выше */
    main#main.site-main {
        padding-top: 0 !important;
    }
}

/* Управление только верхним отступом основного контейнера на мобильных (для отсутпа над слайдером на главной)) */
@media (max-width: 991px) {
    main#main.site-main {
        /* Установите 0, чтобы убрать зазор полностью,
           или любое число (например, 10px), чтобы настроить его под себя */
        padding-top: 0px !important;
    }
}


/* Включаем аппаратное ускорение для плавного скролла */
main#main section,
ul.products,
.product {
    will-change: transform;
    transform: translateZ(0);
}

html {
    scroll-behavior: smooth !important;
}


/* Вариант 1: Опускаем весь контент выдвижной панели меню (моб) разом */
.ct-panel-content {
    padding-top: 80px !important;
}


/* Минимальная высота и форсированный рендер только на iOS (ускорение запуска)*/
@media (max-width: 1024px) {
    .single-product main#main,
    .single-product .blocksy-container {
        min-height: 100vh;
        opacity: 1 !important;
        transform: translateZ(0);
        will-change: auto;
    }
}


/* ФИНАЛЬНАЯ БЛОКИРОВКА ТЕНИ ДЛЯ СУПУТНІХ ТОВАРІВ */
@media (max-width: 990px) {
    /* Нацеливаемся через основной контейнер темы и блоки сопутствующих */
    .ct-container-full .related.products ul.products li.product,
    .ct-container-full .related.products ul.products li.product:hover,
    .ct-container-full .related.products ul.products li.product:active,
    .ct-container-full .upsells.products ul.products li.product,
    .ct-container-full .upsells.products ul.products li.product:hover,
    .ct-container-full .upsells.products ul.products li.product:active {
        /* Принудительно фиксируем тень */
        box-shadow: 0 4px 15px rgba(0, 0, 0, 0.03) !important;
        /* Полностью отключаем любые перемещения */
        transform: none !important;
        /* Убираем задержку, чтобы не было "моргания" тени */
        transition: none !important;
    }
}


/* Поиск в моб.меню */
.ct-frosted-glass {
	backdrop-filter: blur(40px) brightness(200%);
	-webkit-backdrop-filter: blur(40px) brightness(200%);
}

.ct-subscribe-form {
	--theme-form-field-height: 60px;
	--theme-form-field-padding: 0 25px;
	--theme-form-field-background-initial-color: #000;
	--theme-form-field-background-focus-color: rgba(0, 0, 0, 0.4);
	--theme-form-field-border-width: 0;
	--theme-text-color: #fff;


	--theme-button-min-height: 60px;
	--theme-button-background-initial-color: var(--theme-palette-color-1);
	--theme-button-text-initial-color: #fff;
}


/* Не отображать количество товаров в категориях */
@media only screen and (max-width: 1024px) {
.ct-map { height:400px; }
}

.count {
    display: none !important;
}


/* Тінь для всіх списків ТОВАРІВ (Каталог та Супутні товари) */
.products .product.type-product,
.related.products .product.type-product,
.upsells.products .product.type-product {
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.03) !important;
    border-radius: 8px;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    background: #ffffff;
    overflow: hidden; /* Обрізає краї картинки при збільшенні */
}


/* Ефект збільшення ТІЛЬКИ для зображень ТОВАРІВ при наведенні */
.products .product.type-product:hover img,
.related.products .product.type-product:hover img,
.upsells.products .product.type-product:hover img {
    transform: scale(1.0); /* Збільшення на 10% */
    transition: transform 0.5s ease;
}


/* Плавне повернення картинки ТОВАРУ */
.products .product.type-product img,
.related.products .product.type-product img,
.upsells.products .product.type-product img {
    transition: transform 0.5s ease;
}

/* Ефект підйому картки ТОВАРУ */
.products .product.type-product:hover,
.related.products .product.type-product:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.1) !important;
}


/* Повна відміна тіні та зуму для головного фото на сторінці товару та для БЛОГУ */
.single-product > .product,
.single-post img,
.archive .entry-content img {
    box-shadow: none !important;
    transform: none !important;
}


/* Робимо текст меню Medium Bold для всього сайту */
.ct-header [data-row] a {
    font-weight: 700 !important; /* Спробуйте 500 або 600 для м'якшого ефекту */
}


/* 1. Колір хедера тільки для головної */
.home .ct-header [data-row] {
    background-color: #121417 !important;
}


/* 2. Робимо текст меню та КОРЗИНУ світло-сірими (на 20% темніше білого) */
.home .ct-header [data-row] a:not([aria-label*="Search"]),
.home .ct-header [data-row] [data-cart] > .ct-icon-container,
.home .ct-header [data-row] .ct-label {
    color: #cccccc !important; /* М'який білий */
    fill: #cccccc !important;
}


/* Примусове перетворення мобільного логотипу на білий */
.ct-panel-content .site-logo-container img,
#offcanvas .site-logo-container img,
.ct-offcanvas-container .site-logo-container img {
    filter: brightness(0) invert(1) !important;
    opacity: 1 !important;
}


/* 3. Виправлення для іконки корзини (колір та контур) */
.home .ct-header [data-row] [data-cart] svg {
    fill: #cccccc !important;
    stroke: #cccccc !important;
}


/* 4. Інверсія логотипу: робимо темний логотип світло-сірим (не білим) */
.home .site-logo-container img {
    filter: invert(1) brightness(0.7) contrast(1.1) !important;
    transition: filter 0.3s ease;
}


/* 5. Білий фон хедера для всіх інших сторінок */
body:not(.home) .ct-header [data-row] {
    background-color: #ffffff !important;
}


/* 1. ТЕКСТ КНОПОК: Тільки на головній, тільки до наведення */
.home .ct-cart-content .buttons a:not(:hover) {
    color: #121417 !important;
}

/* 2. ТЕКСТ НАЗВИ ТОВАРУ ТА ЦІНИ: Тільки на головній, тільки до наведення */
.home .ct-cart-content .ct-cart-item a:not(:hover),
.home .ct-cart-content .ct-total:not(:hover) {
    color: #121417 !important;
}


/* УНІВЕРСАЛЬНЕ ЗАТЕМНЕННЯ НАЗВ ТОВАРІВ ТА ЦІН (ДЛЯ ВСЬОГО САЙТУ) */
.ct-cart-content .ct-cart-item .ct-item-name:not(:hover),
.ct-cart-content .ct-cart-item a:not(:hover),
.ct-cart-content .ct-cart-title:not(:hover),
.ct-cart-content .ct-cart-item .ct-item-price:not(:hover),
.ct-cart-content .ct-total:not(:hover) {
    color: #121417 !important;
}

/* ТЕКСТ У КНОПКАХ КОРЗИНИ (ДЛЯ ВСЬОГО САЙТУ ДО НАВЕДЕННЯ) */
.ct-cart-content .buttons a:not(:hover) {
    color: #121417 !important;
}


/* Полная заморозка состояния карточек на мобильных */
@media (max-width: 990px) {
    /* 1. Отключаем трансформации (увеличение) */
    .woocommerce ul.products li.product:hover img,
    .woocommerce ul.products li.product:hover {
        transform: none !important;
        transition: none !important;
    }

/* 2. Закрепляем стандартную тень (чтобы она не исчезала и не появлялась) */
    .woocommerce ul.products li.product,
    .woocommerce ul.products li.product:hover,
    .woocommerce ul.products li.product:active {
        /* Мы прописываем тень принудительно для всех состояний на мобильном */
        box-shadow: 0px 2px 15px rgba(10, 10, 10, 0.05) !important;
        background: #ffffff !important; /* Укажите цвет фона карточки, если он не прозрачный */
    }


    /* 3. Убираем системный отклик тача (синее/серое выделение при нажатии) */
    .woocommerce ul.products li.product a {
        -webkit-tap-highlight-color: transparent !important;
        outline: none !important;
    }
}


/* ФИКСАЦИЯ ЦВЕТА КНОПКИ "В КОШИКУ" (ПОСЛЕ ДОБАВЛЕНИЯ) */
.woocommerce ul.products li.product a.added_to_cart,
.woocommerce ul.products li.product a.added_to_cart:visited,
.woocommerce ul.products li.product a.added_to_cart:hover,
.woocommerce ul.products li.product a.added_to_cart:active,
.woocommerce ul.products li.product a.added_to_cart:focus {
    /* Заменяем фиолетовый на твой зеленый цвет */
    color: #9c2f2f !important;
    text-decoration: none !important;
    outline: none !important;
    box-shadow: none !important;
}

/* Убираем синее/серое выделение при нажатии на мобильном */
.woocommerce ul.products li.product a.added_to_cart {
    -webkit-tap-highlight-color: transparent !important;
}


/* 1. Делаем текст прозрачным и готовим кнопку к центровке индикатора */
.woocommerce ul.products li.product .button.loading {
    color: transparent !important;
    position: relative !important; /* База для абсолютного позиционирования индикатора */
    transition: none !important;
}

/* 2. Центрируем кольцо загрузки ПОВЕРХ прозрачного текста */
.woocommerce ul.products li.product .button.loading::after {
    content: "" !important;
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;

    /* Сдвигаем на половину размера самого кольца, чтобы был идеальный центр */
    margin-top: -8px !important;
    margin-left: -8px !important;

    opacity: 1 !important;
    visibility: visible !important;
    display: block !important;
    color: #2e9b67 !important; /* Твой зеленый */
}

/* 3. Убираем стандартные отступы WooCommerce, которые могут толкать кольцо */
.woocommerce ul.products li.product .button.loading::after {
    right: auto !important;
}


/* Полное скрытие кнопки "В кошик" в алерте об ошибке */
.woocommerce-error .button.wc-forward,
.woocommerce-message .button.wc-forward,
.woocommerce-info .button.wc-forward {
    display: none !important;
}


/* Отступ ТОЛЬКО для алертов, которые идут сразу после хедера */
main#main > .woocommerce-notices-wrapper:first-child,
#content > .woocommerce-notices-wrapper:first-child {
    margin-top: 30px !important;
    padding: 0 15px !important;
}


/* Превращаем бейдж корзины в маленькую точку */
.ct-header-cart .ct-dynamic-count-cart {
    /* Жестко задаем размер точки */
    width: 10px !important;
    height: 10px !important;
    min-width: 10px !important;

    /* Убираем внутренние отступы и обнуляем шрифт */
    padding: 0 !important;
    font-size: 0 !important;
    line-height: 0 !important;

    /* Позиционирование точки относительно иконки */
    position: absolute !important;
    top: -4px !important;
    right: -4px !important;

    /* Оформление (цвета подтянутся из настроек темы) */
    border-radius: 50% !important;
    display: flex !important;
}

/* Гарантируем, что цифры внутри не будут видны и не растянут блок */
.ct-header-cart .ct-dynamic-count-cart:empty,
.ct-header-cart .ct-dynamic-count-cart[data-count="0"] {
    display: none !important;
}


/* 1. НАЗВАНИЕ КНОПОК ПАГИНАЦИИ (ЗАМЕНА СЛОВ на Стрелки) */
.ct-pagination .page-numbers svg {
    display: none !important;
}

/* 2. Настраиваем кнопки: строгая центровка и размер */
.ct-pagination .prev.page-numbers,
.ct-pagination .next.page-numbers {
    font-size: 0 !important; /* Убираем слова */
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 45px !important;
    height: 45px !important;
    padding: 0 !important;
    margin: 0 !important;
    gap: 2px !important; /* Расстояние между двумя стрелочками */
}

/* 3. Отрисовываем ДВЕ графические стрелки */
.ct-pagination .prev.page-numbers::before,
.ct-pagination .prev.page-numbers::after,
.ct-pagination .next.page-numbers::before,
.ct-pagination .next.page-numbers::after {
    content: "" !important;
    display: block;
    width: 12px;
    height: 12px;
    background-color: currentColor; /* Цвет меняется вместе с кнопкой */
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M13.89 17.41L8.14 11.66a2.34 2.34 0 010-3.32l5.75-5.75'/%3E%3C/svg%3E") no-repeat center;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M13.89 17.41L8.14 11.66a2.34 2.34 0 010-3.32l5.75-5.75'/%3E%3C/svg%3E") no-repeat center;
    -webkit-mask-size: contain;
    mask-size: contain;
}

/* 4. Разворачиваем стрелки для правой кнопки */
.ct-pagination .next.page-numbers::before,
.ct-pagination .next.page-numbers::after {
    transform: rotate(180deg);
}


/* --- Ограничиваем действие только хлебных крошек на страницах каталога/категорий --- */
body.archive .ct-breadcrumbs,
body.tax-product_cat .ct-breadcrumbs,
body.post-type-archive-product .ct-breadcrumbs {

    /* --- 1. Скрываем только "Головна" (первый элемент) --- */
    .first-item {
        display: none !important;
    }

    /* --- 2. Скрываем разделитель сразу после "Головна" --- */
    .first-item + .ct-separator {
        display: none !important;
    }

    /* --- 3. Скрываем только последний активный пункт --- */
    .last-item {
        display: none !important;
    }

    /* --- 4. Скрываем разделитель ПЕРЕД последним пунктом --- */
    .last-item ~ .ct-separator {
        display: none !important;
    }

    /* --- 5. Настройка цвета для оставшихся ссылок (например, "Каталог") --- */
    a {
        color: #ffffff !important; /* цвет ссылок */
        opacity: 0.4 !important;
        text-decoration: none !important;
    }

    a:hover {
        opacity: 1 !important;
        text-decoration: underline !important;
    }
}


/* Убираем фоновые диагональные линии в футере и хлебных крошках */
.ct-breadcrumbs,
.site-footer {
    background-image: none !important;
}


/* Если есть разделитель после последнего элемента — скрываем */
.ct-breadcrumbs [itemprop="itemListElement"]:last-child + .ct-separator {
    display: none !important;
}


  @media (max-width: 480px) {
    /* 1. Контейнер купить в 1 клик на моб */
    .buyin1cl-input-group {
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        gap: 8px !important;
        margin: 24px 0 !important;
        height: 24px !important;
    }

    /* 2. Поле ввода — ИСПРАВЛЕНО с 0px на 40px */
    .buyin1cl-input-group input {
        height: 40px !important; /* Было 0px, теперь 40px */
        width: 160px !important;
        min-width: 160px !important;
        padding: 0 34px !important;
        margin: 0 !important;
        font-size: 14px !important;
        box-sizing: border-box !important;
    }

    /* 3. Кнопка */
    .buyin1cl-input-group button {
        height: 40px !important;
        flex-grow: 1;
        padding: 0 15px !important;
        margin: 0 !important;
        font-size: 14px !important;
        line-height: 40px !important;
        display: flex !important;
        align-items: center;
        justify-content: center;
    }
}


@media (min-width: 990px) {
    /* Весь блок "1 клік" НА ПК */
    .buyin1cl-wrapper {
        /* 1. Отступ НАД линией (от кнопки "У кошик") */
        margin-top: 25px !important;

        /* 2. Отступ ПОД линией (до поля ввода) */
        padding-top: 34px !important;

        border-top: 1px solid rgba(0,0,0,0.1) !important;
    }
}


/* Управление отступами блока Описание/Отзывы */
.woocommerce-tabs.wc-tabs-wrapper {
    /* Внутренний отступ сверху (был 60px) */
    padding-top: 40px !important;

    /* Внешний отступ сверху (можно сделать даже отрицательным, например -10px) */
    margin-top: 00px !important;

    /* Нижний отступ, чтобы не прилипало к футеру */
    padding-bottom: 0px !important;
}

/* Управление отступом самих кнопок переключения (Опис, Відгуки) */
.woocommerce-tabs ul.tabs {
    margin-top: 0px !important;
    margin-bottom: -8px !important;
}


/* Когда блок становится липким */
.buyin1cl-wrapper.is-sticky {
    position: fixed !important;
    bottom: 0 !important;
    left: 0 !important;
    width: 100% !important;
    background: #ffffff !important;
    padding: 15px !important;
    box-shadow: 0 -5px 20px rgba(0,0,0,0.15) !important;
    z-index: 99999 !important;
    margin: 0 !important;
    border-top: 1px solid #eee !important;
}

/* Настраиваем внутренний контейнер внутри липкого блока */
.is-sticky .buyin1cl-input-group {
    max-width: 480px !important;
    margin: 0 auto !important;
}


/* Увеличиваем иконки оплаты (VISA/MASTER) В ФУТЕРЕ и убираем отступ сверху */
.wp-block-group.is-layout-flex {
    flex-wrap: nowrap !important;
    gap: 8px !important;
    justify-content: flex-start !important;
    margin-top: -10px !important; /* Отрицательный отступ максимально уберет дыру между текстом и иконками */
}

.wp-block-group.is-layout-flex img {
    width: 45px !important;
    height: auto !important;
    min-width: 35px !important;
}


/* Выравниваем высоту и скругления полей Новой Почты */
.wcus-checkout-fields .zen-ui-select__value {
    height: 50px !important; /* Делаем стандартным как у темы */
    border-radius: 4px !important; /* Скругление как у полей темы */
    border: 1px solid #e2e8f0 !important; /* Цвет рамки как у Email/Телефон */
    display: flex !important;
    align-items: center !important;
    padding-left: 15px !important; /* Отступ текста как у темы */
}


/* 1. Цвет рамки при нажатии (фокусе) на поле */
.zen-ui-select--opened .zen-ui-select__value {
    border-color: #6a49f2 !important; /* Ваш фирменный фиолетовый */
    box-shadow: 0 0 0 1px #6a49f2 !important;
    outline: none !important;
}

/* 2. Фон активного пункта при наведении курсора в списке */
.zen-ui-select__option:hover {
    background-color: #6a49f2 !important;
    color: #ffffff !important;
}

/* 3. Фон уже выбранного пункта в выпадающем списке */
.zen-ui-select__option--selected {
    background-color: #f3f0ff !important;
    color: #6a49f2 !important;
}


/* 1. Полностью скрываем старую стрелку */
.select2-container--default .select2-selection--single .select2-selection__arrow {
    display: none !important;
}

/* 2. Максимально тонкая стрелка, прижатая вправо */
.select2-container--default .select2-selection--single {
    background-image: url("data:image/svg+xml,%3Csvg width='10' height='6' viewBox='0 0 10 6' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1L5 5L9 1' stroke='%23333333' stroke-width='0.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: right 8px center !important; /* Сдвинута еще правее */
    background-size: 10px !important; /* Уменьшен размер */
    padding-right: 20px !important;
}


/* Полное скрытие контейнера поля Страна */
#billing_country_field,
#shipping_country_field {
    display: none !important;
}


/* Форматирование данніх отделения справа вблоке оформления (введенные данные из НП слева (страница оплаты))*/
.np-checkout-details {
    margin-top: 6px;
    font-size: 13px;
    line-height: 1.4;
    color: #000080;
}

.np-checkout-details .np-line {
    font-weight: 600;       /* одинаковая жирность */
    margin: 0 0 2px 0;      /* небольшой отступ между строками */
    padding: 0;
    position: relative;
    padding-left: 12px;     /* место для точки */
}

.np-checkout-details .np-line::before {
    content: "•";           /* точка */
    position: absolute;
    left: 0;
    color: #000080;
    font-weight: 600;
}


/* 1. ПРОЗРАЧНОСТЬ ДЛЯ ТЕКСТА ОПЛАТЫ */
.woocommerce-order-received ul.order_details + p {
    color: transparent !important;
    user-select: none;
    height: 0 !important;
    margin: 0 !important;
}

/* 2. ЗАМЕНА ЗАГОЛОВКА "Платіжна адреса" */
.woocommerce-customer-details h2 {
    font-size: 0 !important;
    /* ОТСТУП СВЕРХУ для заголовка "Данні отримувача" */
    margin-top: 40px !important;
  	margin-bottom: 26px !important;
    /* ОТСТУП СЛЕВА для заголовка */
    margin-left: 10px !important;
}

.woocommerce-customer-details h2::before {
    content: "Данні отримувача";
    font-size: 18px !important;
    display: block;
    color: #464646;
    font-weight: 600;
}

/* 3. ОТСТУПЫ ДЛЯ БЛОКА С ТАБЛИЦЕЙ ТОВАРОВ */
.woocommerce-order-details {
    /* ОТСТУП СВЕРХУ: расстояние от верхнего серого блока до таблицы */
    margin-top: 50px !important;
    /* ОТСТУП СЛЕВА: сдвигает всю таблицу товаров вправо */
    margin-left: 10px !important;
}

/* 4. ОТСТУПЫ ДЛЯ БЛОКА С АДРЕСОМ */
.woocommerce-customer-details address {
    /* ОТСТУП СЛЕВА для самого текста адреса */
    margin-left: 10px !important;
    /* ОТСТУП СНИЗУ до подвала сайта */
    margin-bottom: 50px !important;
}


/*ФИЛЬТРЫ-ФИЛЬТРЫ-ФИЛЬТРЫ*/


/* --- МОБИЛЬНАЯ ВЕРСИЯ: иконка кнопки фильтра --- */
.wpc-filters-open-widget .wpc-icon-html-wrapper {
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
    width: 20px !important;
    height: 12px !important;
    margin-right: 6px !important;
	/* Сдвигаем иконку выше для центровки */
    margin-top: -4px !important;
    /* Сброс для Android */
    padding: 0 !important;
    box-sizing: border-box !important;
}

/* Линии внутри иконки */
.wpc-filters-open-widget .wpc-icon-html-wrapper span {
    display: block !important;
    height: 1px !important;
    width: 100% !important;
    background-color: #333 !important;
    border-radius: 1px !important;
    transform: scaleY(1) !important;

    /* ДОБАВИТЬ ЭТО: нейтрализует "жирность" от наложения линий */
    position: static !important;  /* Линии встанут строго друг под другом */
    top: auto !important;         /* Убирает старые сдвиги вверх */

    margin: 0 !important;
    padding: 0 !important;
}

/* --- ЦВЕТ ВСЕЙ ИКОНКИ (Линии + Полная покраска кружков) --- */

/* 1. Линии */
.wpc-filters-open-widget .wpc-icon-html-wrapper span {
    background-color: #92989D !important;
}

/* 2. Кружки: красим фон, границы и тени */
.wpc-filters-open-widget .wpc-icon-html-wrapper span::before,
.wpc-filters-open-widget .wpc-icon-html-wrapper span::after {
    background: #92989D !important;      /* Внутренняя заливка */
    background-color: #ffffff !important;
    border-color: #92989D !important;     /* Цвет контура кружка */
    box-shadow: none !important;          /* Убираем свечение, если оно мешает */
}


/* --- МОБИЛЬНАЯ ВЕРСИЯ: СТРОГО ПО КОНТЕЙНЕРУ --- */
@media (max-width: 991px) {
    /* 1. Базовый контейнер */
    main#main section {
        position: relative !important;
        padding-top: 0 !important;
        margin-bottom: 0px !important;
    }

    /* Отступ для товаров: ТОЛЬКО когда фильтр активен */
    .wpc-filters-open-button-container.visible ~ ul.products {
        padding-top: 58px !important;
    }

    /* 2. Кнопка фильтра */
    .wpc-filters-open-button-container.visible {
        position: absolute !important;
        top: 3px !important;   /* Опускаем кнопку вровень с правой */
        left: 0 !important;
        width: 110px !important; /* Увеличил, чтобы не резало края */
        height: 34px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: flex-start !important; /* Прижимаем к левому краю */
        z-index: 20 !important;
        background: none !important; /* Убирает синюю хрень */
    }

    /* Фиксируем высоту 34px для всех слоев */
    /* Убираем эффект матрешки: рамка только снаружи */
    .wpc-filters-open-button-container.visible a.wpc-filters-open-widget {
        height: 34px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        border: 1px solid #E7EBEE !important;
        /* Рамка только здесь */
        line-height: 1 !important; /* Убирает лишнее пространство, которое жирнит иконку */
        overflow: hidden !important; /* Обрезает лишние пиксели рендеринга */
        border-radius: 4px !important;
        background: #ffffff !important;
        padding: 0 8px !important;
        text-decoration: none !important;
        box-shadow: none !important;
        outline: none !important;
    }

    /* Обнуляем внутренний слой, чтобы не было двойных границ */
    .wpc-filters-open-button-container.visible .wpc-button-inner {
        border: none !important;
        background: none !important;
        padding: 0 !important;
        margin: 0 !important;
        display: flex !important;
        align-items: center !important;
    }

    /* 3. Кнопка сортировки (Квадратная иконка) */
    .woo-listing-top {
        position: absolute !important;
        top: 0 !important;
        right: -4px !important;
        width: 40px !important;
        height: 40px !important;
        margin: 0 !important;
        padding: 0 !important;
        display: none !important;
        align-items: center !important;
        justify-content: center !important;
        z-index: 20 !important;
    }

    /* Показываем сортировку только рядом с фильтром */
    .wpc-filters-open-button-container.visible ~ .woo-listing-top {
        display: flex !important;
    }

    /* Настройка иконки сортировки (БЕЗ ОБВОДКИ) */
    .ct-order-by-switch,
    .woocommerce-ordering {
        margin: 0 !important;
        display: flex !important;
        width: 40px !important;
        height: 40px !important;
        justify-content: center !important;
        align-items: center !important;
        border: none !important;
        color: #92989D !important;/* Обводка убрана */
        border-radius: 4px !important;
    }

    .ct-order-by-switch > a span {
        display: none !important;
    }
}

/* Прячем скобки и цифры внутри кнопки фильтра */
.wpc-filters-button-text {
    visibility: hidden !important;
    position: relative !important;
}

/* Исправленный блок: возвращаем слово Фільтри */
/* --- ПОЛНОСТЬЮ ЗАМОРАЖИВАЕМ ТЕКСТ КНОПКИ ФИЛЬТРА --- */

/* Полностью скрываем оригинальный текст (включая цифры и скобки) */
.wpc-filters-button-text {
    display: none !important;
}

/* Добавляем своё фиксированное слово */
.wpc-filters-open-button-container.visible
a.wpc-filters-open-widget::after {
    content: "Фільтри" !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 12px !important;
    font-weight: 400 !important;
    color: #515A62 !important;
}

/* 2. Кнопка фильтра — УБИРАЕМ ВЕЗДЕ, ГДЕ НЕТ КЛАССА VISIBLE */
.wpc-filters-open-button-container {
    display: none !important; /* Прячем наглухо везде */
}

/* Показываем ТОЛЬКО когда плагин сам решит, что фильтры нужны */
.wpc-filters-open-button-container.visible {
    display: flex !important;
    position: absolute !important;
    top: 3px !important;
    left: 0 !important;
    width: 110px !important;
    height: 34px !important;
    z-index: 20 !important;
    background: none !important;
}

/* Убираем количество товаров в скобках на синей кнопке "Показати" */
.wpc-filters-apply-button .wpc-filters-found-posts-wrapper {
    display: none !important;
}

/* На всякий случай обнуляем шрифт у скобок, если тема их форсирует */
.wpc-filters-apply-button .wpc-found-posts-count {
    font-size: 0 !important;
    display: none !important;
}


/* --- ПК ВЕРСИЯ: ПОЛНАЯ ИЗОЛЯЦИЯ (Глушим всё мобильное) ---
   ИСПРАВЛЕНО: в оригинале тут был вложенный @media (min-width: 992px)
   без закрытия внешнего блока — на 1 фигурную скобку меньше, чем
   открывающих, во всём файле. Слито в ОДИН блок @media, оба правила
   внутри него, ничего по смыслу не изменилось. */
@media (min-width: 992px) {
    /* Обнуляем отступы товаров, чтобы на ПК ничего не ехало */
    ul.products,
    .wpc-filters-open-button-container.visible ~ ul.products {
        padding-top: 0 !important;
        margin-top: 0 !important;
    }

    /* Прячем контейнер и все внутренние элементы сортировки */
    .woo-listing-top,
    .ct-order-by-switch,
    .woocommerce-ordering {
        display: none !important;
    }
}


/* Скрываем кнопку сразу, чтобы она не моргала (Работает в связке с JS #001) */
/* 1. Скрываем контейнер ПОЛНОСТЬЮ везде и всегда (убирает воздух на ПК и моб без фильтров) */
.wpc-filters-open-button-container {
    display: none !important;
    opacity: 0;
    pointer-events: none;
    margin: 0 !important;
    padding: 0 !important;
}

/* 2. Показываем ТОЛЬКО на мобильных и ТОЛЬКО если JS нашел фильтры */
@media (max-width: 991px) {
    .wpc-filters-open-button-container.visible {
        display: flex !important; /* Возвращаем блок в поток */
        opacity: 1;
        pointer-events: auto;
        /* Если нужен отступ кнопки от контента, добавь его сюда: */
        margin-bottom: 20px !important;
    }
}


/*ФИЛЬТРЫ-ВОЗДУХ попапу на моб*/