/**
 * Theme Name: Blocksy Child
 * Description: Blocksy Child theme
 * Author: Creative Themes
 * Template: blocksy
 * Text Domain: blocksy
 */
 
 
 

 
 
 [data-stretch]>.menu {
	 justify-content: center;
 }
 
 button.single_add_to_cart_button.button.alt.ct-button.ct-button--type-1,  a.button.alt.ct-button.ct-button--type-1 {
	 margin-left: 8px!important;
 }
 
 
 
 a.button.alt.ct-button.ct-button--type-1 {
	 background: #5b38ed;
	 color: #fff;
	 transition: 0.3s all;
 }
 
 
 a.button.alt.ct-button.ct-button--type-1:hover {
	 background: #452bb1;
	 color: #fff;
	 transition: 0.3s all;
 }
 
 
 p.available-on-backorder, h2.woocommerce-loop-product__title, p.stock.in-stock, p.stock.out-of-stock {
    text-align: left;
	margin-top: -4px;
}

.ct-woo-card-stock {
	width: 100%;
}

.available-on-backorder::before {
	content: "•"!important;
	color: #ccc;
	margin-inline-end: 7px!important; /* чтобы точка не сливалась с текстом */
	font-size: 16px;
}


/* Сама точка */
.stock.in-stock::before {
	content: "•"!important;
	color: green;
	margin-inline-end: 7px!important; /* чтобы точка не сливалась с текстом */
	font-size: 16px;
}


.stock.out-of-stock::before {
	content: "•"!important;
	color: #9e02ff;
    margin-inline-end: 7px!important; /* чтобы точка не сливалась с текстом */
    font-size: 16px;
}




a.button.product_type_simple.add_to_cart_button.ajax_add_to_cart {
	overflow: visible !important;
}


/* Контейнер: разрешаем переполнение */
a.button.product_type_simple.add_to_cart_button.ajax_add_to_cart {
	overflow: visible !important;
	position: relative; /* иногда нужно для z-index */
}

/* Иконка */
/* Стили самой иконки */
.add_to_cart_button:not(.loading)::before,
.ajax_add_to_cart:not(.loading)::before {
    content: "\f290" !important;
    font-family: "Font Awesome 5 Free" !important;
    font-weight: 900 !important;
    display: inline-block !important;
    margin-right: 0 !important; /* Обнулили, так как теперь работает gap кнопки */
    font-size: 14px !important;
    line-height: 1 !important;
    vertical-align: middle !important;
    color: #5b38ed !important;
    text-shadow: 0 1px 1px rgba(0, 0, 0, 0.3) !important;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    filter: blur(0px);
    opacity: 1;
	position: relative;
	inset-inline: -10px;
    inset-block: 0px;
	z-index:1;
}

a.button.product_type_simple.add_to_cart_button.ajax_add_to_cart:hover {
	background: #5b38ed;
	color: #fff;
}

a.button.product_type_simple.add_to_cart_button.ajax_add_to_cart:hover::before {
    color: #ffffff !important; /* #ffffff — это белый цвет */
}


/* Полностью удаляем иконку сумки для товаров, которые УЖЕ В КОРЗИНЕ */
a.button.add_to_cart_button.in-cart-item::before {
    display: none !important;
    content: none !important;
    margin-right: 0 !important;
}

/* На всякий случай фиксируем, чтобы при наведении она тоже не пыталась вылезти */
a.button.add_to_cart_button.in-cart-item:hover::before {
    display: none !important;
    content: none !important;
}

/* Обнуляем отступ (gap) у самой кнопки, чтобы текст "Уже в корзине" встал ровно по центру */
a.button.add_to_cart_button.in-cart-item {
    gap: 0 !important;
}




.product-full-description-toggle {
    margin: 20px 0;
    line-height: 1.7;
    font-size: 16px;
}

.product-full-description-toggle .fade-dots {
    font-weight: bold;
    color: #555;
}

.toggle-description-button {
    color: #0073aa;
    cursor: pointer;
    font-size: 14px;
    transition: background 0.3s;
	text-decoration: underline;
}

.toggle-description-button:hover {
    color: #58b0da;
	transition: background 0.3s;
}

	
	
    .ct-product-attributes-grid {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 15px;
    }

    .ct-product-attribute {
        display: flex;
        flex-direction: column;
        padding: 10px;
        background: #f9f9f9;
        border-radius: 6px;
        transition: transform 0.2s, box-shadow 0.2s;
    }

    .ct-product-attribute:hover {
        transform: translateY(-2px);
        box-shadow: 0 4px 10px rgba(0,0,0,0.08);
    }

    .ct-attributes-label {
        color: #999;
        font-size: 0.85em;
        margin-bottom: 4px;
    }

    .ct-attributes-value {
        color: #222;
        font-weight: 500;
    }

    .ct-attributes-all-link {
        grid-column: 1/-1;
        margin-top: 10px;
    }

    .ct-attributes-all-link a {
        font-size: 0.9em;
        text-decoration: none;
        color: #0073aa;
        transition: color 0.3s;
    }

    .ct-attributes-all-link a:hover {
        color: #005177;
    }
	
	.ct-attribute-group-title {
    padding: 20px 0;
    font-weight: 600;
    font-size: 20px;
}

    @media (max-width: 992px) {
        .ct-product-attributes-grid {
            grid-template-columns: repeat(2, 1fr);
        }
    }

    @media (max-width: 576px) {
        .ct-product-attributes-grid {
            grid-template-columns: 1fr;
        }
    }
	
	form.wpc-sorting-form {
	display: flex;
    align-items: center;
    justify-content: center;
    margin-inline-start: auto;
    position: relative;
}

.widget.widget_wpc_sorting_widget {
    display: contents!important;
}


.woocommerce-additional-fields > h3, p#billing_country_field, p#calc_shipping_country_field, p#billing_city_field, p#calc_billing_state_field {
	display: none!important;
}

.woo-listing-top {
    margin-top: 25px;
}


/* Контейнер цены */
.preorder-regular-price {
    color: #999;
    margin-right: 8px;
    font-size: 0.95em;
    text-decoration: line-through;
}

.preorder-sale-price {
    color: #e74c3c;
    font-weight: 600;
    font-size: 1.1em;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    position: relative; /* Важно для позиционирования подсказки */
}

/* Иконка подсказки */
.preorder-tooltip-icon {
    cursor: help;
    font-size: 16px;
	margin-top: -30px;
    opacity: 0.85;
    transition: opacity 0.2s, background 0.2s;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: #f1f1f1;
    color: #555;
    text-decoration: none;
    line-height: 1;
    position: relative;
}

.preorder-tooltip-icon:hover {
    opacity: 1;
    background: #e0e0e0;
}

/* === КАСТОМНАЯ ПОДСКАЗКА (через data-tooltip) === */

/* Текст подсказки */
.preorder-tooltip-icon[data-tooltip]:hover::after {
    content: attr(data-tooltip);
    position: absolute;
    bottom: 130%;
    left: 50%;
    transform: translateX(-50%);
    background: #2c3e50;
    color: #fff;
    padding: 10px 14px;
    border-radius: 6px;
    font-size: 13px;
    font-weight: 400;
    line-height: 1.4;
    white-space: normal;
    z-index: 10000;
    box-shadow: 0 4px 12px rgba(0,0,0,0.25);
    width: max-content;
    max-width: 280px;
    text-align: center;
    opacity: 1;
    visibility: visible;
    pointer-events: none;
}

/* Стрелочка подсказки */
.preorder-tooltip-icon[data-tooltip]:hover::before {
    content: '';
    position: absolute;
    bottom: 118%;
    left: 50%;
    transform: translateX(-50%);
    border: 7px solid transparent;
    border-top-color: #2c3e50;
    z-index: 10000;
    pointer-events: none;
}

/* Скрываем подсказку по умолчанию */
.preorder-tooltip-icon[data-tooltip]::after,
.preorder-tooltip-icon[data-tooltip]::before {
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.2s, visibility 0.2s;
}

/* Адаптив: на мобильных сдвигаем подсказку, чтобы не уезжала за экран */
@media (max-width: 480px) {
    .preorder-tooltip-icon[data-tooltip]:hover::after {
        left: auto;
        right: 0;
        transform: none;
        max-width: 200px;
    }
    .preorder-tooltip-icon[data-tooltip]:hover::before {
        left: auto;
        right: 10px;
        transform: none;
    }
}


/* Фиолетовая кнопка "Уже в корзине" */
button.in-cart-item,
a.in-cart-item {
    background: #8e44ad !important;
    color: #fff !important;
    border-color: #8e44ad !important;
    cursor: default;
    opacity: 0.9;
}

button.in-cart-item:hover,
a.in-cart-item:hover {
    background: #7d3c98 !important;
    color: #fff !important;
    opacity: 1;
}

/* Отключаем клики по кнопке (опционально) */
.in-cart-item {
    pointer-events: none;
}



        /* ==============================================
           Уникальное пространство имён: rmt (repair-module-table)
           Все стили имеют префикс rmt-... для полной изоляции.
           Стили не влияют на остальные страницы и не перезаписываются чужими CSS.
        ============================================== */
        .rmt-table-wrapper {
            max-width: 1200px;
            width: 100%;
            margin: 0 auto;
            background: #ffffff;
            border-radius: 20px;
            overflow-x: auto;
            overflow-y: visible;
            box-sizing: border-box;
        }

        .rmt-repair-table {
            width: 100%;
            border-collapse: collapse;
            font-family: system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', sans-serif;
            font-size: 16px;
            background-color: #ffffff;
            min-width: 500px;
            box-sizing: border-box;
        }

        /* Шапка таблицы — полная изоляция */
        .rmt-repair-table thead tr {
            background: #1a2c3c;
            border-bottom: none;
        }

        .rmt-repair-table th {
            text-align: left;
            padding: 16px 18px;
            background-color: #1a2c3c;
            color: #ffffff;
            font-weight: 600;
            font-size: 0.95rem;
            letter-spacing: 0.3px;
            border: none;
            border-bottom: 2px solid #2c475c;
        }

        /* Ячейки тела таблицы */
        .rmt-repair-table td {
            padding: 16px 18px;
            border-bottom: 1px solid #e6edf4;
            background-color: #ffffff;
            color: #11212e;
            vertical-align: top;
            line-height: 1.45;
        }

        /* Последняя строка — без нижней границы */
        .rmt-repair-table tbody tr:last-child td {
            border-bottom: none;
        }

        /* Уникальные классы для контента внутри ячеек */
        .rmt-work-title {
            font-weight: 700;
            font-size: 1rem;
            color: #0f2b3b;
            margin-bottom: 6px;
            display: block;
			text-align: left;
        }

        .rmt-work-desc {
            font-size: 0.8rem;
            color: #4a627a;
            line-height: 1.4;
            margin-top: 4px;
            display: block;
			text-align: left;
        }

        .rmt-price {
            font-weight: 700;
            font-size: 1.05rem;
            color: #1c6f9e;
            white-space: nowrap;
        }

        .rmt-time {
            white-space: nowrap;
            color: #1f3b4c;
        }

        .rmt-guarantee-badge {
            background-color: #eef2f8;
            display: inline-block;
            padding: 5px 12px;
            border-radius: 40px;
            font-size: 0.8rem;
            font-weight: 500;
            color: #166088;
            white-space: nowrap;
            line-height: 1.2;
        }

        /* ========== АДАПТИВНОСТЬ (без потери структуры) ========== */
        @media screen and (max-width: 768px) {
				
			.rmt-repair-table {
				min-width: auto;
			}	
				
			
			.rmt-repair-table > thead {
				display: none;
			}
			
			.premium-tabs.premium-tabs-vertical:not(.premium-tabs-style-circle) .premium-content-wrap {
				width: 100%!important;
			}
			
			
			.rmt-repair-table tr {
				display: grid;
				text-align: left;
			}
			
			.rmt-time:before, .rmt-guarantee-badge:before {
				content: '';
				width: 12px;
				height: 12px;
				margin-right: 6px;
				background-repeat: no-repeat;
				background-position: center;
				display: inline-grid !important;
				vertical-align: middle;
			}
			
			.rmt-guarantee-badge:before {
				background-image: url("data:image/svg+xml,%3Csvg width='10' height='12' viewBox='0 0 10 12' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4.99999 12C5.09626 12 5.25271 11.9644 5.4031 11.8812C8.82669 9.98612 10 9.18416 10 7.01581V2.47128C10 1.84752 9.72921 1.65148 9.21778 1.43762C8.5078 1.14653 6.21541 0.332671 5.50543 0.0891087C5.34292 0.0356433 5.16846 0 4.99999 0C4.83152 0 4.65703 0.0475247 4.50059 0.0891087C3.79061 0.291087 1.49218 1.15247 0.78219 1.43762C0.276774 1.64554 0 1.84752 0 2.47128V7.01581C0 9.18416 1.1793 9.98019 4.59686 11.8812C4.7533 11.9644 4.90372 12 4.99999 12ZM4.99999 10.9248C4.90372 10.9248 4.80745 10.8891 4.62695 10.7822C1.84717 9.11881 0.956676 8.63165 0.956676 6.79601V2.65544C0.956676 2.45346 0.992776 2.37623 1.16125 2.31089C2.07581 1.95445 3.85077 1.36634 4.75932 1.0099C4.85559 0.968316 4.93381 0.956433 4.99999 0.956433C5.06618 0.956433 5.14438 0.974257 5.24065 1.0099C6.14922 1.36634 7.91216 1.99603 8.84477 2.31089C9.00722 2.3703 9.04331 2.45346 9.04331 2.65544V6.79601C9.04331 8.63165 8.15281 9.11288 5.37301 10.7822C5.19855 10.8891 5.09626 10.9248 4.99999 10.9248ZM4.34416 8.53067C4.54271 8.53067 4.71118 8.43562 4.83152 8.25744L7.5812 3.9802C7.65339 3.86732 7.72563 3.73663 7.72563 3.6C7.72563 3.33861 7.48493 3.16633 7.23828 3.16633C7.08183 3.16633 6.93139 3.25544 6.81705 3.43366L4.32009 7.39008L3.13477 5.87522C2.99037 5.68512 2.858 5.63169 2.69554 5.63169C2.4308 5.63169 2.22623 5.83958 2.22623 6.10694C2.22623 6.23169 2.28038 6.36238 2.36462 6.47522L3.83272 8.25744C3.98314 8.45347 4.1456 8.53067 4.34416 8.53067Z' fill='%235AA0F5' fill-opacity='0.6'/%3E%3C/svg%3E%0A");
			}
			
			.rmt-time:before {
				background-image: url("data:image/svg+xml,%3Csvg width='12' height='12' viewBox='0 0 12 12' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M6 0C9.3138 0 12 2.6862 12 6C12 9.3138 9.3138 12 6 12C2.6862 12 0 9.3138 0 6C0 2.6862 2.6862 0 6 0ZM6 0.837C4.63069 0.837 3.31746 1.38096 2.34921 2.34921C1.38096 3.31746 0.837 4.63069 0.837 6C0.837 7.36931 1.38096 8.68254 2.34921 9.65079C3.31746 10.619 4.63069 11.163 6 11.163C7.36931 11.163 8.68254 10.619 9.65079 9.65079C10.619 8.68254 11.163 7.36931 11.163 6C11.163 4.63069 10.619 3.31746 9.65079 2.34921C8.68254 1.38096 7.36931 0.837 6 0.837ZM5.442 3.3486C5.673 3.3486 5.8602 3.5364 5.8602 3.7674V6.6978H8.7906C8.89885 6.7019 9.0013 6.74779 9.07644 6.82582C9.15158 6.90386 9.19355 7.00797 9.19355 7.1163C9.19355 7.22463 9.15158 7.32874 9.07644 7.40678C9.0013 7.48481 8.89885 7.5307 8.7906 7.5348H5.442C5.33093 7.5348 5.2244 7.49068 5.14586 7.41214C5.06732 7.3336 5.0232 7.22707 5.0232 7.116V3.768C5.0232 3.5364 5.2104 3.3486 5.442 3.3486Z' fill='%235AA0F5' fill-opacity='0.6'/%3E%3C/svg%3E%0A");
			}		
			
        }


.ct-mainbox:hover > .box-title-rem h5 {
	color: #fff!important;
}


.ct-mainbox:hover > .box-desc-rem p {
	color: #ffffff3d!important;
}

/*Ширина блока корзины*/
.ct-cart-content {
	width: 350px!important;
}


span.character {
    display: block;
    margin-bottom: 20px;
}

:is([data-swatches-type=color],[data-swatches-type=image],[data-swatches-type=mixed]) .ct-swatch {
	width: 100px!important;
}


@media(max-width: 550px) {
	    [data-products].columns-4 {
        --shop-columns: repeat(1, minmax(0, 1fr))!important;
    }
}

@media(min-width: 551px) and (max-width: 850px) {
	    [data-products].columns-4 {
        --shop-columns: repeat(2, minmax(0, 1fr))!important;
    }
}


@media (min-width: 851px) and (max-width: 1599px) {
	    [data-products].columns-4 {
        --shop-columns: repeat(3, minmax(0, 1fr))!important;
    }
}


@media(min-width: 1600px) {
    [data-products].columns-2 {
        --shop-columns: repeat(2, minmax(0, 1fr))!important;
    }

    [data-products].columns-3 {
        --shop-columns: repeat(3, minmax(0, 1fr))!important;
    }

    [data-products].columns-4 {
        --shop-columns: repeat(4, minmax(0, 1fr))!important;
    }

    [data-products].columns-5 {
        --shop-columns: repeat(5, minmax(0, 1fr))!important;
    }

    [data-products].columns-6 {
        --shop-columns: repeat(6, minmax(0, 1fr))!important;
    }
}


a.added_to_cart.wc-forward {
  display: none;
}



/* Контейнер для уведомлений внизу справа */
.pafe-form-builder-alert--mail {
    position: fixed;
    bottom: 20px;
    right: 20px;
    z-index: 9999;
    display: flex;
    flex-direction: column;
    gap: 10px;
    pointer-events: none; /* Чтобы контейнер не мешал кликам, пока пуст */
}

/* Базовые стили для самих плашек уведомлений */
.pafe-form-builder-alert--mail .elementor-message {
    display: none; /* Прячем по умолчанию */
    min-width: 250px;
    padding: 15px 20px;
    border-radius: 8px;
    color: #fff;
    font-family: sans-serif;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    pointer-events: auto; /* Возвращаем кликабельность самой плашке */
    
    /* Начальное состояние для анимации (смещено вниз и прозрачное) */
    opacity: 0;
    transform: translateY(20px);
    transition: opacity 0.4s ease, transform 0.4s ease;
}

/* Цвета для разных типов уведомлений (настройте под себя) */
.pafe-form-builder-alert--mail .elementor-message-success {
    background-color: #46b450; /* Зеленый */
}

.pafe-form-builder-alert--mail .elementor-message-danger {
    background-color: #dc3232; /* Красный */
}

/* Класс, который будет активировать плавное появление */
.pafe-form-builder-alert--mail .elementor-message.show-toast {
    display: block; /* Показываем в DOM */
    opacity: 1;
    transform: translateY(0);
}


/* ==========================================================================
   ГЛОБАЛЬНЫЙ СКРОЛЛБАР ДЛЯ ВСЕГО САЙТА
   ========================================================================== */

/* 1. Настройка для Chrome, Safari, Edge, Opera, Яндекс.Браузер */

/* Задаем ширину полосы скролла */
::-webkit-scrollbar {
    width: 8px; /* Чуть-чуть увеличили до 8px, чтобы на страницах сайта его было удобно ловить мышкой */
}

/* Фон самой дорожки, по которой двигается ползунок */
::-webkit-scrollbar-track {
    background: #1a1a1a !important; /* Наш фирменный почти черный фон */
}

/* Сам ползунок (бегунок) */
::-webkit-scrollbar-thumb {
    background: #5b38ed !important; /* Фиолетовый цвет ползунка */
    border-radius: 4px;
}

/* Цвет ползунка при наведении мыши */
::-webkit-scrollbar-thumb:hover {
    background: #7352ff !important; /* Сделали его ярче при наведении, вместо серого #555555, чтобы сочетался с фиолетовым */
}


/* 2. Настройка для Firefox (современный стандарт) */
html {
    scrollbar-width: thin; /* Тонкий скроллбар */
    scrollbar-color: #5b38ed #1a1a1a; /* Первый цвет — ползунок, второй — фон дорожки */
}









/* Контейнер на странице корзины */
.cart-page-stock-container {
    margin-top: 6px;
    margin-bottom: 4px;
    display: block;
}

/* Чистый стиль баджа-капсулы */
.cart-indicator-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 10px;
    font-weight: 500;
    text-transform: lowercase; /* Текст маленькими буквами */
    padding: 2px 6px;
    border-radius: 4px; /* Прямоугольные углы */
    line-height: 1;
    vertical-align: middle;
    margin-bottom: 5px;
}

/* ЖЁСТКОЕ УДАЛЕНИЕ ЛЮБЫХ ТОЧЕК ТЕМЫ ОФОРМЛЕНИЯ */
.cart-indicator-badge i,
.cart-indicator-badge::before,
.cart-indicator-badge::after {
    display: none !important;
    content: none !important;
    width: 0 !important;
    height: 0 !important;
    margin: 0 !important;
}

/* Цветовые схемы */
.cart-indicator-badge.available-on-backorder {
    background: #fff8eb !important;
    border: 1px solid #fde68a !important;
    color: #b45309 !important;
}

.cart-indicator-badge.in-stock {
    background: #f0fdf4 !important;
    border: 1px solid #bbf7d0 !important;
    color: #166534 !important;
}

.cart-indicator-badge.out-of-stock {
    background: #fef2f2 !important;
    border: 1px solid #fecaca !important;
    color: #991b1b !important;
}


.wpc-pc-sticky-buttons {
	z-index: 0;
}



.ct-mainbox:hover h2, .ct-mainbox:hover h4 {
    color: #fff;
    trtransition: 0.2s all;
}

.ct-mainbox h2, .ct-mainbox h4 {
    trtransition: 0.2s all;
}

.e-con-full.ct-mainbox.e-flex.e-con.e-child:hover p {
	color: #aeaeae;
}


.elementor .elementor-element.elementor-widget-n-tabs:not(:has(>.elementor-widget-container))>.e-n-tabs>.e-n-tabs-heading .e-n-tab-title[aria-selected=true],
 .elementor .elementor-element.elementor-widget-n-tabs:not(:has(>.elementor-widget-container))>.e-n-tabs[data-touch-mode=true]>.e-n-tabs-heading .e-n-tab-title[aria-selected=false]:hover,
 .elementor .elementor-element.elementor-widget-n-tabs>.elementor-widget-container>.e-n-tabs>.e-n-tabs-heading .e-n-tab-title[aria-selected=true],
 .elementor .elementor-element.elementor-widget-n-tabs>.elementor-widget-container>.e-n-tabs[data-touch-mode=true]>.e-n-tabs-heading .e-n-tab-title[aria-selected=false]:hover {
	 background-color: #2B6CB0!important;
 }


[data-header*="type-1"] .ct-header [data-id="menu"] .sub-menu .ct-menu-link {
	--theme-link-initial-color: auto!important;
}

/* ==========================================================================
   1. ФИКС ШИРИНЫ ELEMENTOR (Полная адаптивность без схлопывания блока)
   ========================================================================== */
.iphone-list,
.iphone-list .elementor-widget,
.e-con.e-con > .e-con-inner > .elementor-widget.iphone-list,
.elementor.elementor .e-con > .elementor-widget.iphone-list {
    /* ИСПРАВЛЕНО: Вместо width: auto мы жестко привязываем блок к ширине экрана 
       плюс компенсируем боковые поля сайта (по 2.5rem с каждой стороны). 
       Теперь блок никогда не сожмется до одного элемента! */
    width: calc(100% + 5rem) !important;
    max-width: calc(100% + 5rem) !important;
    margin-left: -2.5rem !important;
    margin-right: -2.5rem !important;
    box-sizing: border-box !important;
}

/* ==========================================================================
   2. КОНТЕЙНЕР ЛЕНТЫ (Реанимация горизонтального скролла)
   ========================================================================== */
.elementor-widget.iphone-list ul.elementor-icon-list-items.elementor-inline-items {
    margin: 0 !important;
    padding: 0.6rem 2.0rem !important;     /* Внутренние поля строго из вашего рабочего примера */
    list-style: none !important;
    display: flex !important;
    flex-wrap: nowrap !important;        /* Элементы всегда выстроены в одну линию */
    
    /* ИСПРАВЛЕНО: Ограничиваем область видимости прокрутки ровно по границам экрана 
       и принудительно включаем заблокированный горизонтальный скролл */
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: auto !important;         
    overflow-y: hidden !important;
    box-sizing: border-box !important;
    -webkit-overflow-scrolling: touch;   /* Плавный скролл пальцем на iOS Safari */
}

/* Скрываем полосу прокрутки */
.elementor-widget.iphone-list ul.elementor-icon-list-items.elementor-inline-items::-webkit-scrollbar {
    display: none !important;
}

/* ==========================================================================
   3. СТИЛИ КНОПОК И ТЕКСТА
   ========================================================================== */
/* Отдельная кнопка-плашка (li) */
.elementor-widget.iphone-list li.elementor-icon-list-item.elementor-inline-item {
    margin: 0 1rem 0px 0 !important;    /* Расстояние между кнопками */
    
    /* ИСПРАВЛЕНО: flex: 0 0 auto гарантирует, что плашки сохранят свой 
       настоящий размер, не сожмутся и не деформируются при уменьшении экрана */
    flex: 0 0 auto !important;           
    min-width: 10.8rem !important;       
    max-width: none !important;         
}

/* Ссылка внутри плашки (дизайн карточки) */
.elementor-widget.iphone-list li.elementor-icon-list-item.elementor-inline-item a {
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    background: #f5f5f5 !important;
    border-radius: 8px !important;      /* Скругление из вашего примера */
    min-height: 100% !important;
    padding: 1rem !important;     /* Внутренние отступы из вашего примера */
    text-decoration: none !important;
    color: #343434 !important;
    text-align: center !important;
    box-sizing: border-box !important;
}

/* Текст внутри кнопки */
.elementor-widget.iphone-list .elementor-icon-list-text {
    display: block !important;
    font-size: 0.9rem !important;
    line-height: 1rem !important;
    font-weight: 400 !important;
    white-space: nowrap !important;      /* Текст строго в одну строчку */
}








/* ==========================================================================
   ДИНАМИЧЕСКИЙ ФИЛЬТР КАТЕГОРИЙ WOOCOMMERCE (ЧИСТЫЙ КОД)
   ========================================================================== */

/* Основной контейнер виджета */
.dr-sidebar-filter {
    background: #ffffff;
    border-radius: 24px;
    padding: 24px;
    width: 100%;
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.03);
    box-sizing: border-box;
}

/* Заголовок "Категории" */
.dr-filter-title {
    font-size: 18px;
    font-weight: 600;
    color: #2b2b2b;
    margin: 0 0 20px 0;
    padding-left: 8px;
}

.dr-category-tree, .dr-category-tree ul {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

.dr-root-item {
    margin-bottom: 10px;
}

/* Шапка корневого элемента (Кнопка-плашка) */
.dr-root-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: #f4f6f9;
    border-radius: 14px;
    padding: 12px 16px;
    transition: background 0.25s ease;
}

.dr-root-header:hover {
    background: #ebedf2;
}

/* Состояние, если активна сама главная категория */
.dr-root-header.dr-root-active {
    background: #ebedf2;
}
.dr-root-header.dr-root-active .dr-root-link {
    font-weight: 600;
}

.dr-root-link {
    font-size: 15px;
    font-weight: 500;
    color: #333333;
    text-decoration: none;
    flex-grow: 1;
}

/* Круглая стрелочка аккордеона */
.dr-toggle-arrow {
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #ffffff;
    border-radius: 50%;
    box-shadow: 0 2px 6px rgba(0,0,0,0.04);
    transition: transform 0.25s cubic-bezier(0.4, 0, 0.2, 1);
    cursor: pointer;
}

.dr-toggle-arrow svg {
    width: 16px;
    height: 16px;
    fill: #7d8591;
}

.dr-item-expanded .dr-toggle-arrow {
    transform: rotate(180deg);
}

/* ==========================================
   УРОВЕНЬ 2: Выпадающий список (Аккордеон)
   ========================================== */
.dr-sub-level-2 {
    display: none; 
    padding: 10px 8px 5px 12px;
}

.dr-item-expanded .dr-sub-level-2 {
    display: block;
}

.dr-sub-level-2 li {
    position: relative;
    margin: 10px 0;
}

.dr-sub-level-2 li a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 9px 12px;
    font-size: 14px;
    color: #515761;
    text-decoration: none;
    border-radius: 10px;
    transition: all 0.2s ease;
}

.dr-sub-level-2 li a:hover, 
.dr-sub-level-2 li.dr-has-flyout:hover > a {
    background: #f7f8fa;
    color: #111111;
}

.dr-chevron-right svg {
    width: 14px;
    height: 14px;
    fill: #a0a7b5;
    display: block;
}

/* Подсветка активного элемента страницы */
.dr-sub-level-2 li a.dr-active-item {
    background: #f4f6f9 !important;
    color: #111111 !important;
    font-weight: 500;
}

/* ==========================================
   УРОВНИ 3, 4, 5+: Универсальные флайауты строго вправо
   ========================================== */

/* Автоматически применяется к любой глубине подкатегорий */
.dr-sidebar-filter .dr-flyout-menu {
    position: absolute;
    left: 100%;         /* Открывать строго вправо от родителя */
    top: -10px;         /* Выравнивание по верхней границе строки */
    margin-left: 6px;   /* Элегантный зазор между окнами */
    background: #ffffff;
    border-radius: 18px;
    padding: 10px!important;
    min-width: 230px;
    box-shadow: 0 10px 35px rgba(0, 0, 0, 0.07);
    border: 1px solid #eaeaea;
    z-index: 9999;
    
    /* Плавное проявление */
    opacity: 0;
    visibility: hidden;
    transform: translateX(10px);
    transition: opacity 0.2s ease, transform 0.2s ease, visibility 0.2s;
}

/* Показываем меню при наведении */
.dr-sidebar-filter .dr-has-flyout:hover > .dr-flyout-menu {
    opacity: 1;
    visibility: visible;
    transform: translateX(0);
}

/* Ссылки внутри всплывающих окон */
.dr-flyout-menu li a {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding: 8px 12px !important;
    font-size: 13.5px !important;
    color: #515761 !important;
    border-radius: 8px !important;
    text-decoration: none !important;
    transition: all 0.2s ease !important;
}

/* Ховер во флайаутах */
.dr-flyout-menu li a:hover,
.dr-flyout-menu li.dr-has-flyout:hover > a {
    background: #f4f6f9 !important;
    color: #111111 !important;
}





/* ==========================================================================
   ОФОРМЛЕНИЕ ЗАГОЛОВКОВ И ПОДСВЕТКИ ПУТИ (ОБНОВЛЕНИЕ)
   ========================================================================== */

/* Невизуальный заголовок родительской категории в окнах флайаутов */
.dr-sidebar-filter .dr-flyout-menu .dr-flyout-title {
    font-size: 13.5px;
    font-weight: 700;
    color: #111111;
    padding: 0px 6px 10px 12px;
    margin-bottom: 8px;
    border-bottom: 1px solid #f4f6f9;
    list-style: none;
    cursor: default;
    pointer-events: none; /* Чтобы заголовок не реагировал на клики */
}

/* --- ПОДСВЕТКА ВСЕЙ АКТИВНОЙ ЦЕПОЧКИ МЕНЮ --- */

/* 1. Главный корень (Уровень 1) — если мы внутри этой категории */
.dr-root-header.dr-root-active,
.dr-root-header.dr-root-path-active {
    background: #ebedf2 !important;
}
.dr-root-header.dr-root-active .dr-root-link,
.dr-root-header.dr-root-path-active .dr-root-link {
    font-weight: 600 !important;
    color: #111111 !important;
}

/* 2. Финальная точка: ссылка на конкретную категорию, где сейчас находится юзер */
.dr-sidebar-filter li a.dr-active-item {
    background: #f4f6f9 !important;
    color: #111111 !important;
    font-weight: 600 !important;
}

/* 3. Промежуточные родители (Путь): элементы, через которые юзер «пролетел» к цели */
.dr-sidebar-filter li a.dr-active-path {
    color: #111111 !important;
    font-weight: 600 !important;
    background: #f7f8fa; /* Мягкий фон для родителей, чтобы держать контекст */
}

/* Сохраняем фон родителя активным, даже когда мы ушли мышкой глубже во флайауты */
.dr-sidebar-filter li.dr-has-flyout:hover > a.dr-active-path {
    background: #ebedf2 !important;
}



/* ==========================================================================
   РЕГИОНАЛЬНОЕ ОКНО С ЖИВЫМ ПОИСКОМ (СТИЛИЗАЦИЯ)
   ========================================================================== */

/* Обертка кнопки вызова в шапке */
.city-selector-wrapper {
    display: inline-flex;
    align-items: center;
    font-family: inherit;
}
.city-selector-wrapper .city-label {
    color: #666;
    margin-right: 4px;
    font-size: 14px;
}
.city-selector-wrapper .city-btn {
    background: none;
    border: none;
    cursor: pointer;
    font-weight: 600;
    color: #5b38ed;
    display: inline-flex;
    align-items: center;
    padding: 0;
    font-size: 14px;
}
.city-selector-wrapper .city-btn svg {
    margin-right: 6px;
    display: inline-block;
    vertical-align: middle;
}

/* Затемняющая подложка окна */
.city-modal-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.4);
    display: none;
    align-items: center;
    justify-content: center;
    z-index: 999999;
}
.city-modal-overlay.active {
    display: flex;
}

/* Контейнер формы */
.city-modal-content {
    background: #ffffff;
    width: 100%;
    max-width: 550px;
    border-radius: 12px;
    padding: 35px 30px;
    position: relative;
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.15);
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    box-sizing: border-box;
}

/* Кнопка Закрыть (крестик) */
.city-modal-close {
    position: absolute;
    top: 20px;
    right: 20px;
    background: #f2f2f2;
    border: none;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    font-size: 22px;
    line-height: 1;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #666;
    transition: background 0.2s, color 0.2s;
    padding: 0;
}
.city-modal-close:hover {
    background: #e5e5e5;
    color: #000000;
}

/* Заголовок "Ваш регион" */
.city-modal-content h3 {
    font-size: 32px;
    margin: 0 0 20px 0;
    font-weight: 500;
    color: #4a4a4a;
    letter-spacing: -0.5px;
}

/* Зона поиска */
.city-search-wrapper {
    position: relative;
    margin-bottom: 25px;
}
.city-search-input {
    width: 100%;
    padding: 14px 45px 14px 18px;
    border: 1px solid #eef0f2;
    border-radius: 8px;
    background: #f7f9fa;
    font-size: 16px;
    color: #333333;
    outline: none;
    transition: border-color 0.2s, background-color 0.2s;
    box-sizing: border-box;
}
.city-search-input:focus {
    background: #ffffff;
    border-color: #c0c4cc;
}
.city-search-input::placeholder {
    color: #bfaeae;
    opacity: 0.7;
}
.city-search-icon {
    position: absolute;
    right: 18px;
    top: 50%;
    transform: translateY(-50%);
    color: #bfaeae;
    pointer-events: none;
    width: 20px;
    height: 20px;
}

/* Сетка со списком городов в 2 колонки */
.city-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px 30px;
    max-height: 300px;
    overflow-y: auto;
    padding-right: 10px;
}
.city-sub-item {
    font-size: 18px;
    color: #2b2b2b;
    text-decoration: none;
    padding: 2px 0;
    transition: color 0.15s;
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.city-sub-item:hover {
    color: #0056b3;
}
.city-sub-item.hidden {
    display: none;
}
.city-no-results {
    grid-column: 1 / -1;
    color: #999999;
    text-align: center;
    padding: 30px 0;
    font-size: 16px;
    display: none;
}

/* Стилизация полосы прокрутки внутри окна */
.city-grid::-webkit-scrollbar {
    width: 5px;
}
.city-grid::-webkit-scrollbar-track {
    background: #f5f5f5;
    border-radius: 10px;
}
.city-grid::-webkit-scrollbar-thumb {
    background: #c1c1c1;
    border-radius: 10px;
}
.city-grid::-webkit-scrollbar-thumb:hover {
    background: #a8a8a8;
}








/* Общий контейнер */
.brands-container-xyz {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 20px;
    box-sizing: border-box;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

/* Алфавитная навигация */
.brands-nav-xyz {
    display: block;
    text-align: center;
    margin-bottom: 50px;
    line-height: 2;
}

.brands-nav-xyz a {
    display: inline-block;
    margin: 0 10px;
    text-decoration: none;
    color: #333;
    font-weight: 500;
    font-size: 16px;
    transition: color 0.2s ease;
}

.brands-nav-xyz a:hover {
    color: #000;
}

/* Секция одной буквы */
.brand-section-xyz {
    margin-bottom: 60px;
}

.brand-letter-heading-xyz {
    font-size: 32px;
    font-weight: 400;
    margin-top: 0;
    margin-bottom: 25px;
    color: #111;
}

/* Умная адаптивная CSS Grid сетка */
.brand-grid-xyz {
    display: grid;
    /* Карточки будут автоматически сжиматься/расширяться в диапазоне от 160px до 1fr, 
       заполняя всё доступное пространство без медиа-запросов */
    grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
    gap: 20px;
}

/* Карточка бренда (сохраняем квадратные пропорции 1:1) */
.brand-card-xyz {
    display: block;
    position: relative;
    background: #f8f9fa; /* Светло-серый благородный фон */
    border: 1px solid #e9ecef;
    text-decoration: none;
    transition: all 0.2s ease-in-out;
}

/* Хак для идеального квадрата */
.brand-card-xyz::before {
    content: "";
    display: block;
    padding-top: 100%; /* Делает высоту равной ширине */
}

/* Контент внутри квадратной карточки */
.brand-card-xyz img,
.brand-card-xyz .brand-fallback-xyz {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%!important;
    padding: 20px;
    box-sizing: border-box;
}

/* Центрирование и вписывание логотипа */
.brand-card-xyz img {
    object-fit: contain;
    object-position: center;
}

/* Эффект при наведении */
.brand-card-xyz:hover {
    border-color: #ced4da;
    background: #f1f3f5;
    transform: translateY(-2px);
}

/* Заглушка, если у бренда нет картинки (текст) */
.brand-fallback-xyz {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    font-weight: 600;
    color: #495057;
    text-align: center;
    word-break: break-word;
}

/* Небольшая оптимизация для совсем маленьких экранов (мобилки) */
@media (max-width: 480px) {
    .brand-grid-xyz {
        grid-template-columns: repeat(auto-fill, minmax(130px, 1fr));
        gap: 12px;
    }
    .brand-card-xyz img,
    .brand-card-xyz .brand-fallback-xyz {
        padding: 12px;
    }
    .brand-letter-heading-xyz {
        font-size: 26px;
        margin-bottom: 15px;
    }
    .brands-nav-xyz {
        margin-bottom: 30px;
    }
}