/**
 * UEB (Universal Elements Builder) - Базовые стили
 * Универсальная система без привязки к месту использования
 */

/* ========== Брендовые цвета соцсетей ========== */
:root {
    --light_gray: #f1f5f9;
    --social_telegram: #2AABEE;
    --social_whatsapp: #25D366;
    --social_vk: #0077FF;
    --social_youtube: #FF0000;
    --social_pinterest: #E60023;
    --social_rutube: #100943;
    --color_purple: #7276fd;
    --color_orange: #FF7700;
    --full_border_radius: 9999px;
}

/* ========== Обертка ========== */
.ueb-wrap {
    width: 100%;
}

/* ========== Пустая шапка (placeholder) ========== */
.ueb-empty-placeholder {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 60px;
    padding: 20px;
    cursor: pointer;
    transition: background-color 0.2s ease;
}

.ueb-empty-placeholder:hover {
    background-color: rgba(0, 0, 0, 0.03);
}

.ueb-empty-placeholder span {
    color: var(--text_color);
    opacity: 0.5;
    font-size: 14px;
}

/* ========== Ряды ========== */
.ueb-row {
    width: 100%;
}


.ueb-row-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    position: relative;
}

/* Стили для рядов теперь задаются через настройки ряда (floor settings) */

/* ========== Элементы (контакты) ========== */
.ueb-item {
    display: flex;
    align-items: center;
    color: var(--text_color);
}

.ueb-item svg {
    width: 20px;
    height: 20px;
    margin-right: 8px;
    flex-shrink: 0;
    color: var(--ueb-icon-color, currentColor);
}

.ueb-item span {
    white-space: nowrap;
    color: var(--ueb-text-color, inherit);
    font-size: var(--ueb-font-size, inherit);
    font-weight: var(--ueb-font-weight, inherit);
    text-transform: var(--ueb-text-transform, none);
    opacity: var(--ueb-opacity, 1);
}

/* ========== Город (выбор региона) ========== */
.ueb-city-changer {
    color: var(--second_color);
    font-weight: 700;
}

.ueb-city-changer svg path {
    stroke: var(--second_color) !important;
}

/* ========== Соцсети ========== */
.ueb-social-wrap {
    display: flex;
    align-items: center;
    gap: var(--ueb-social-gap, 20px);
}

.ueb-social {
    display: flex;
    align-items: center;
    font-size: var(--ueb-social-font-size, 14px);
    font-weight: var(--ueb-social-font-weight, 700);
    text-transform: var(--ueb-social-text-transform, lowercase);
}

.ueb-social svg {
    width: 24px;
    height: 24px;
}

.ueb-social-label {
    margin-left: 7px;
}

/* Цвета соцсетей */
.ueb-social-telegram { color: #20A0E1; }
.ueb-social-telegram svg path { fill: #20A0E1 !important; }

.ueb-social-whatsapp { color: #51C85D; }
.ueb-social-whatsapp svg path { fill: #51C85D !important; }

.ueb-social-vk { color: #0077FF; }
.ueb-social-vk svg path { fill: #0077FF !important; }

/* ========== Меню ========== */
.ueb-menu-wrap {
    display: flex;
    align-items: center;
    background: var(--ueb-menu-wrap-bg, transparent);
    border-radius: var(--ueb-menu-wrap-radius, 0);
    padding: var(--ueb-menu-wrap-py, 0) var(--ueb-menu-wrap-px, 0);
}
.ueb-menu-wrap.is-stretched { width: 100%; }
.ueb-menu-wrap.is-stretched .ueb-menu { width: 100%; justify-content: space-between; }

.ueb-menu {
    display: flex;
    list-style: none;
    margin: 0;
    padding: 0;
    gap: var(--ueb-gap, 16px);
}

.ueb-menu li {
    list-style: none;
}

.ueb-menu a {
    display: block;
    border-radius: var(--button_border_radius);
    color: var(--ueb-text-color, inherit);
    font-size: var(--ueb-font-size, 14px);
    font-weight: var(--ueb-font-weight, 400);
    text-transform: var(--ueb-text-transform, none);
    transition: all 0.2s ease;
}

/* Прозрачность, padding и фон — только первый уровень */
.ueb-menu > li > a,
.ueb-menu > li > .ueb-menu-link {
    opacity: var(--ueb-opacity, 1);
    padding: var(--ueb-item-padding-y, 0) var(--ueb-item-padding-x, 0);
    transition: all 0.2s ease;
}

.ueb-menu > li:hover > a,
.ueb-menu > li:hover > .ueb-menu-link,
.ueb-menu > li.current-menu-item > a,
.ueb-menu > li.current-menu-item > .ueb-menu-link {
    color: var(--ueb-text-hover-color, var(--main_color));
    background: var(--ueb-item-bg-hover, transparent);
}

/* Многоуровневое меню (до 3 уровней) */
.ueb-menu .ueb-menu-item {
    position: relative;
}

/* Ссылка с шевроном */
.ueb-menu .ueb-menu-link {
    display: flex;
    align-items: center;
    gap: 4px;
}

/* Шеврон — размер зависит от размера шрифта */
.ueb-menu-chevron {
    flex-shrink: 0;
    width: var(--ueb-menu-chevron-size, 0.75em);
    height: var(--ueb-menu-chevron-size, 0.75em);
    transition: transform 0.2s ease;
}

.ueb-menu .ueb-has-children:hover > .ueb-menu-link .ueb-menu-chevron {
    transform: rotate(180deg);
}

/* Wrapper подменю — позиционирование и фальшивый отступ */
.ueb-submenu-wrap {
    position: absolute;
    top: 100%;
    left: 0;
    padding-top: 12px;
    opacity: 0;
    visibility: hidden;
    transform: translateY(6px);
    transition: opacity 0.2s cubic-bezier(0.4, 0, 0.2, 1),
                transform 0.2s cubic-bezier(0.4, 0, 0.2, 1),
                visibility 0.2s;
    /* Задержка при скрытии — не дёргается при переходе между пунктами */
    transition-delay: 80ms;
    z-index: 1001;
}

/* Подменю */
.ueb-submenu {
    width: max-content;
    min-width: 211px;
    max-width: 360px;
    background: var(--white_color, #fff);
    border-radius: var(--big_border_radius, 8px);
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.10), 0 1px 4px rgba(0, 0, 0, 0.06);
    padding: 8px;
    margin: 0;
    list-style: none;
}

/* Показать подменю при hover */
.ueb-menu .ueb-has-children:hover > .ueb-submenu-wrap,
.ueb-menu .ueb-has-children.ueb-submenu-hold > .ueb-submenu-wrap {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
    /* Появление — без задержки, мгновенный отклик */
    transition-delay: 0ms;
}

/* Вложенные подменю скрыты внутри ul — не раздувают scrollHeight.
   Показываются только через JS-портал в body */
.ueb-submenu .ueb-submenu-wrap-nested {
    display: none !important;
}

/* Элементы подменю */
.ueb-submenu .ueb-menu-item {
    display: block;
}

.ueb-submenu .ueb-menu-link {
    padding: 8px 16px;
    white-space: normal;
    justify-content: space-between;
    font-size: clamp(11px, var(--ueb-font-size, 13px), 13px) !important;
    color: var(--ueb-submenu-text-color, var(--text_color));
    text-transform: none;
    font-weight: 400;
}

.ueb-submenu .ueb-menu-link:hover,
.ueb-submenu .ueb-submenu-hold > .ueb-menu-link {
    background: var(--main_color_opacity_10, rgba(0, 0, 0, 0.05));
    color: var(--ueb-submenu-hover-color, var(--main_color));
}

/* Шеврон в подменю - вправо */
.ueb-submenu .ueb-menu-chevron {
    transform: rotate(-90deg);
}

.ueb-submenu .ueb-has-children:hover > .ueb-menu-link .ueb-menu-chevron {
    transform: rotate(-90deg);
}

/* Вложенные подменю 2 и 3 уровня - wrapper открывается вправо */
.ueb-submenu-wrap-nested {
    top: -8px;
    left: 100%;
    padding-top: 0;
    padding-left: 12px;
}

/* Если не хватает места справа - открыть влево */
.ueb-submenu-wrap-nested.open-left {
    left: auto;
    right: 100%;
    padding-left: 0;
    padding-right: 12px;
    transform: translateX(6px);
}
.ueb-has-children:hover > .ueb-submenu-wrap-nested.open-left,
.ueb-has-children.ueb-submenu-hold > .ueb-submenu-wrap-nested.open-left {
    transform: translateX(0);
}

/* ========== Логотип ========== */
.ueb-logo {
    flex-shrink: 0;
}

.ueb-logo img {
    max-height: 50px;
    width: auto;
}

.ueb-logo-with-name {
    display: flex;
    align-items: center;
}

.ueb-logo-name-wrap {
    margin-left: 12px;
}

/* ========== Поиск ========== */
/* CSS переменные из UEB_VISUAL_FIELDS_STANDARD (config-driven):
   --ueb-width: ширина контейнера (default: 432px)
   --ueb-border-color: цвет рамки (default: text_color)
   --ueb-border-opacity: прозрачность рамки в % (default: 20%)
*/
.ueb-search {
    flex: 0 0 auto;
    width: var(--ueb-width, 432px);
    max-width: 100%;
    min-width: 200px;
}

.ueb-search form {
    position: relative;
    display: flex;
    align-items: center;
}

/* Поиск плагина каталога кладёт инпут в свою обёртку. Как flex-элемент она
   считает ширину по содержимому и ужимает поле до размера инпута по умолчанию,
   поэтому обёртке нужен явный рост на всю форму. */
.ueb-search form > .blocksee-search-input-wrapper,
.ueb-search .blocksee-search-wrapper,
.ueb-search .blocksee-search-form {
    flex: 1 1 auto;
    width: 100%;
    min-width: 0;
}

.ueb-search input[type="search"] {
    width: 100%;
    height: var(--ueb-height, 48px);
    padding: 0 48px 0 16px;
    background: var(--ueb-input-bg, transparent);
    color: var(--ueb-input-color, var(--text_color));
    /* --ueb-border-opacity хранится как % (например 20%) */
    border: 1px solid color-mix(
        in srgb,
        var(--ueb-border-color, var(--text_color)) var(--ueb-border-opacity, 20%),
        transparent
    );
    border-radius: var(--button_border_radius);
    font-family: var(--font);
}

.ueb-search input[type="search"]::placeholder {
    color: var(--ueb-input-color, var(--text_color));
    opacity: 0.6;
}

.ueb-search button {
    position: absolute;
    right: 12px;
    top: 50%;
    transform: translateY(-50%);
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
    color: var(--ueb-icon-color, var(--text_color));
    opacity: var(--ueb-icon-opacity, 0.6);
    transition: opacity 0.2s ease;
}

.ueb-search button:hover {
    opacity: 1;
}

.ueb-search button svg {
    display: block;
}

/* ========== Кнопка каталога ========== */
/* CSS variables set on .ueb-catalog-wrap via inline style:
   --ueb-catalog-bg, --ueb-catalog-color, --ueb-catalog-hover, --ueb-catalog-color-hover,
   --ueb-catalog-font-size, --ueb-catalog-font-weight, --ueb-catalog-transform,
   --ueb-catalog-justify, --ueb-catalog-height, --ueb-catalog-width
*/
.ueb-catalog-wrap {
    position: static;
}


.ueb-catalog-trigger {
    display: flex;
    align-items: center;
    justify-content: var(--ueb-catalog-justify, center);
    height: var(--ueb-catalog-height, 48px);
    min-width: var(--ueb-catalog-width, 120px);
    padding: 0 18px;
    background-color: var(--ueb-catalog-bg, var(--main_color_hover));
    color: var(--ueb-catalog-color, var(--white_color));
    font-weight: var(--ueb-catalog-font-weight, 600);
    font-size: var(--ueb-catalog-font-size, 14px);
    text-transform: var(--ueb-catalog-transform, uppercase);
    border-radius: var(--ueb-catalog-radius, var(--button_border_radius));
    border: none;
    cursor: pointer;
    transition: all 0.3s ease;
    user-select: none;
}

.ueb-catalog-trigger:hover,
.ueb-catalog-trigger.active {
    background-color: var(--ueb-catalog-hover, var(--second_color));
    color: var(--ueb-catalog-color-hover, var(--white_color));
}

/* CSS Animated Burger Icon */
.ueb-burger-icon {
    position: relative;
    width: 14px;
    height: 10px;
    margin-right: 8px;
    transform: translateZ(0);
}

.ueb-burger-icon span {
    display: block;
    position: absolute;
    left: 0;
    width: 100%;
    height: 1.5px;
    background-color: currentColor;
    transform-origin: center;
    transition: top 0.25s ease, transform 0.25s ease, opacity 0.25s ease;
}

/* Позиции: 0, 4.25, 8.5 */
.ueb-burger-icon span:nth-child(1) { top: 0; }
.ueb-burger-icon span:nth-child(2) { top: 4.25px; }
.ueb-burger-icon span:nth-child(3) { top: 8.5px; }

/* Active state: burger → X */
.ueb-catalog-trigger.active .ueb-burger-icon span:nth-child(1) {
    top: 4.25px;
    transform: rotate(45deg);
}

.ueb-catalog-trigger.active .ueb-burger-icon span:nth-child(2) {
    opacity: 0;
}

.ueb-catalog-trigger.active .ueb-burger-icon span:nth-child(3) {
    top: 4.25px;
    transform: rotate(-45deg);
}

/* ========== Выпадающий каталог ========== */
/* Позиционируется относительно .ueb-row-inner на всю ширину */
.ueb-catalog-dropdown {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    margin-top: 12px;
    width: 100%;
    background-color: #fff;
    border-radius: var(--middle_border_radius, 12px);
    box-shadow: 0 5px 30px rgba(34, 34, 34, 0.1);
    overflow: hidden;
    z-index: 1000;
    /* Анимация появления */
    opacity: 0;
    visibility: hidden;
    transform: translateY(-8px);
    pointer-events: none;
    transition: opacity 0.2s ease, transform 0.2s ease, visibility 0s linear 0.2s;
}

.ueb-catalog-dropdown.active {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
    pointer-events: auto;
    transition: opacity 0.2s ease, transform 0.2s ease, visibility 0s;
}

.ueb-catalog-inner {
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-width: thin;
    max-height: calc(80vh - 100px);
    padding: 40px 40px 12px;
}

.ueb-catalog-list {
    display: flex;
    flex-wrap: wrap;
    list-style: none;
    margin: 0;
    padding: 0;
    width: 100%;
}

.ueb-catalog-item {
    position: relative;
    width: var(--ueb-catalog-col-width, 25%);
    padding: 0 24px 0 70px;
    margin: 0 0 24px;
    list-style: none;
}

.ueb-catalog-item-img {
    position: absolute;
    left: 0;
    top: 0;
}

.ueb-catalog-item-img img {
    width: 50px;
    height: 50px;
    border-radius: var(--button_border_radius);
    object-fit: cover;
}

.no-image-radius .ueb-catalog-item-img img {
    border-radius: 0;
}

.ueb-catalog-item-in {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    min-height: 50px;
}

.ueb-catalog-item-in > a {
    width: 100%;
    font-weight: 600;
    font-size: var(--ueb-catalog-title-size, 16px);
}

.ueb-catalog-item-in > a:hover {
    color: var(--main_color_hover);
}

.ueb-catalog-item-in > ul {
    list-style: none;
    margin: 0;
    padding: 0;
    width: 100%;
}

.ueb-catalog-item-in > ul > li {
    list-style: none;
}

.ueb-catalog-item-in > ul > li > a {
    font-size: var(--ueb-catalog-sub-size, 13px);
    opacity: 0.7;
    padding: 2px 0 3px;
    display: block;
}

.ueb-catalog-item-in > ul > li > a:hover {
    color: var(--main_color_hover);
    opacity: 1;
}

/* Скрываем подкатегории после 3-й */
.ueb-catalog-item-in > ul > li:nth-child(n+4) {
    display: none;
}

.ueb-catalog-show-more {
    cursor: pointer;
    font-size: 14px;
    color: var(--main_color);
    width: 100%;
    margin-top: 4px;
    font-weight: 500;
}

.ueb-catalog-show-more:hover {
    opacity: 0.8;
}

/* Скрытие изображений в каталоге */
.ueb-catalog-item.no-image {
    padding-left: 0;
}

.ueb-catalog-item.no-image .ueb-catalog-item-in {
    min-height: auto;
}

/* ========== Двухпанельное меню каталога (classic) ========== */
.ueb-catalog-dropdown--classic {
    display: flex;
    overflow: visible;
    right: auto;
    margin-top: 0;
    border-radius: 0;
    transform: none;
    transition: opacity 0.25s ease, visibility 0s linear 0.25s;
}

.ueb-catalog-dropdown--classic.active {
    transform: none;
    transition: opacity 0.25s ease, visibility 0s;
}

/* Левая колонка — категории */
.ueb-classic-sidebar {
    flex-shrink: 0;
    width: 300px;
    border-left: 1px solid rgba(0,0,0,0.06);
    border-right: 1px solid rgba(0,0,0,0.06);
    overflow: hidden;
}

.ueb-classic-sidebar .ueb-classic-menu {
    list-style: none;
    margin: 0;
    padding: 8px 0;
    height: 100%;
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-width: thin;
}

.ueb-classic-item {
    list-style: none;
}

.ueb-classic-item > a {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 36px 8px 20px;
    font-size: 15px;
    font-weight: 600;
    transition: background 0.15s, color 0.15s;
    position: relative;
}

/* Иконка пункта меню каталога (term_meta _blocksee_menu_icon) */
.ueb-classic-icon {
    flex: 0 0 20px;
    width: 20px;
    height: 20px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.ueb-classic-icon img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
    display: block;
}

.ueb-classic-item > a:hover,
.ueb-classic-item.active > a {
    background: var(--main_color_opacity_10, rgba(0,0,0,0.04));
    color: var(--main_color);
}

.ueb-classic-item.has-children > a::after {
    content: '';
    position: absolute;
    right: 14px;
    top: 50%;
    margin-top: -3px;
    width: 5px;
    height: 5px;
    border-right: 1.5px solid currentColor;
    border-top: 1.5px solid currentColor;
    transform: rotate(45deg);
    opacity: 0.4;
}

/* Правая колонка — подкатегории */
.ueb-classic-content {
    flex: 1;
    min-width: 0;
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-width: thin;
    padding: 20px 28px;
}

/* Панели */
/* Панели лежат стопкой в одной грид-ячейке: высота контента = самой высокой
   панели и НЕ меняется при переключении. Раньше display:none→block на каждый
   ховер менял высоту дропдауна, пункты сайдбара съезжали под неподвижным
   курсором, нижние оказывались вне меню — навигация «застывала». Заодно
   переключение стало без reflow (только visibility) — ушли и тормоза. */
.ueb-classic-content {
    display: grid;
}

.ueb-classic-panel {
    grid-area: 1 / 1;
    visibility: hidden;
    column-count: 3;
    column-gap: 32px;
}

.ueb-classic-panel.active {
    visibility: visible;
}

/* Группа подкатегории */
.ueb-classic-group {
    break-inside: avoid;
    margin-bottom: 24px;
}

.ueb-classic-group:last-child {
    margin-bottom: 0;
}

.ueb-classic-group-title {
    display: block;
    font-size: 16px;
    font-weight: 700;
    margin-bottom: 6px;
    transition: color 0.15s;
}

.ueb-classic-group-title:hover {
    color: var(--main_color);
}

/* Дочерние ссылки — простой вертикальный список */
.ueb-classic-group-items a {
    display: block;
    padding: 3px 0;
    font-size: 14px;
    line-height: 1.4;
    transition: color 0.15s;
}

.ueb-classic-group-items a:hover {
    color: var(--main_color);
}

/* Скрытые элементы (после 5-го по умолчанию). Раскрываются по клику на «Ещё». */
.ueb-classic-group-items .ueb-classic-group-item.is-hidden {
    display: none;
}
.ueb-classic-group-items.is-expanded .ueb-classic-group-item.is-hidden {
    display: block;
}
.ueb-classic-show-more {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 0;
    background: none;
    border: 0;
    font: inherit;
    cursor: pointer;
    color: inherit;
    opacity: 0.7;
    transition: opacity 0.15s;
}
.ueb-classic-show-more:hover {
    opacity: 1;
}
.ueb-classic-show-more-icon {
    flex: 0 0 10px;
    transition: transform 0.15s;
}

/* ========== Кнопка связи ========== */
.ueb-btn-contact .order_button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: var(--button_height);
    padding: 0 24px;
    background-color: var(--main_color);
    color: #fff;
    border-radius: var(--button_border_radius);
    font-weight: 600;
    transition: all 0.3s ease;
}

.ueb-btn-contact .order_button:hover {
    background-color: var(--main_color_hover);
}

/* ========== Виджеты (корзина, избранное, сравнение) ========== */
/* CSS variables set on .ueb-widget via inline style:
   --ueb-widget-bg, --ueb-widget-bg-opacity, --ueb-widget-pt, --ueb-widget-pb, --ueb-widget-pl, --ueb-widget-pr
   --ueb-icon-color, --ueb-icon-opacity, --ueb-icon-size, --ueb-text-color, --ueb-font-size, --ueb-font-weight
*/
.ueb-widget {
    /* Контейнер только для позиционирования и flex-поведения в группах */
    position: relative;
    display: inline-flex;
    opacity: var(--ueb-widget-opacity, 1);
}

/* Все визуальные стили на .ueb-widget-link */
.ueb-widget-link {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-decoration: none;
    gap: var(--ueb-icon-gap, 4px);
    /* Фон и отступы */
    background-color: color-mix(in srgb, var(--ueb-widget-bg, transparent) var(--ueb-widget-bg-opacity, 100%), white);
    padding-top: var(--ueb-widget-pt, 0);
    padding-bottom: var(--ueb-widget-pb, 0);
    padding-left: var(--ueb-widget-pl, 0);
    padding-right: var(--ueb-widget-pr, 0);
    border-radius: var(--ueb-widget-radius-left, var(--button_border_radius)) var(--ueb-widget-radius-right, var(--button_border_radius)) var(--ueb-widget-radius-right, var(--button_border_radius)) var(--ueb-widget-radius-left, var(--button_border_radius));
    transition: background-color 0.2s ease;
}

.ueb-widget-link:hover {
    background-color: color-mix(in srgb, var(--ueb-widget-bg-hover, var(--ueb-widget-bg, transparent)) var(--ueb-widget-bg-hover-opacity, var(--ueb-widget-bg-opacity, 100%)), white);
}

/* Icon position variants */
.ueb-widget[data-icon-position="left"] .ueb-widget-link {
    flex-direction: row;
}

.ueb-widget[data-icon-position="right"] .ueb-widget-link {
    flex-direction: row-reverse;
}

.ueb-widget[data-icon-position="bottom"] .ueb-widget-link {
    flex-direction: column-reverse;
}

/* Виджеты с иконкой вне <a> (phone_callback и подобные) —
   flex-контейнер сам .ueb-widget, не .ueb-widget-link */
.ueb-widget:has(> .ueb-widget-icon-wrap) {
    gap: var(--ueb-icon-gap, 4px);
    align-items: center;
    flex-direction: column;
}

.ueb-widget[data-icon-position="left"]:has(> .ueb-widget-icon-wrap) {
    flex-direction: row;
    align-items: flex-start;
}

.ueb-widget[data-icon-position="right"]:has(> .ueb-widget-icon-wrap) {
    flex-direction: row-reverse;
    align-items: flex-start;
}

.ueb-widget[data-icon-position="bottom"]:has(> .ueb-widget-icon-wrap) {
    flex-direction: column-reverse;
}

.ueb-widget-icon-wrap {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}

.ueb-widget-icon-wrap:empty {
    display: none;
}

.ueb-widget svg {
    width: var(--ueb-icon-size, 26px);
    height: var(--ueb-icon-size, 26px);
    opacity: var(--ueb-icon-opacity, 1);
}

/* Стандартные иконки — stroke/currentColor */
.ueb-widget:not(.has-colored-icon):not(.has-fill-icon) svg {
    color: var(--ueb-icon-color, var(--text_color));
    stroke: currentColor;
    stroke-width: 1.8;
    fill: none;
}

.ueb-widget:not(.has-colored-icon):not(.has-fill-icon) svg path,
.ueb-widget:not(.has-colored-icon):not(.has-fill-icon) svg circle {
    stroke: currentColor;
}

/* Fill-иконки — используют fill вместо stroke */
.ueb-widget.has-fill-icon:not(.has-colored-icon) svg {
    color: var(--ueb-icon-color, var(--text_color));
    fill: currentColor;
    stroke: none;
}

/* Цветные иконки (Telegram, WhatsApp, VK) — сохраняем оригинальный fill */
.ueb-widget.has-colored-icon svg {
    stroke: none;
}

.ueb-widget-count {
    position: absolute;
    top: -5px;
    right: -5px;
    z-index: 3;
    min-width: var(--ueb-counter-size, 18px);
    height: var(--ueb-counter-size, 18px);
    padding: 0 4px;
    background-color: var(--ueb-counter-bg, var(--main_color));
    color: var(--ueb-counter-color, var(--white_color));
    font-size: var(--ueb-counter-font-size, 11px);
    font-weight: var(--ueb-counter-font-weight, 600);
    border-radius: var(--ueb-counter-radius, 10px);
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
}

/* Без иконки — скрыть icon-wrap и убрать лишний gap */
.ueb-widget.no-icon .ueb-widget-icon-wrap {
    display: none;
}

.ueb-widget.no-icon .ueb-widget-link {
    flex-direction: row;
}

.ueb-widget.no-icon .ueb-widget-count {
    position: static;
}

/* Счётчик на уровне виджета (не на иконке) - теперь внутри link */
.ueb-widget.counter-on-widget .ueb-widget-link > .ueb-widget-count {
    position: absolute;
    top: 5px;
    right: 5px;
    z-index: 5;
}

/* Счётчик после текста (inline) */
.ueb-widget.counter-inline .ueb-widget-text > .ueb-widget-count {
    position: static;
    top: 0;
    right: 0;
    margin-left: 8px;
}

/* Без текста */
.ueb-widget.no-text .ueb-widget-text {
    display: none;
}

/* Без текста + счётчик на виджете — inline рядом с иконкой */
.ueb-widget.no-text.counter-on-widget .ueb-widget-link {
    flex-direction: row-reverse;
    gap: 5px;
}

.ueb-widget.no-text.counter-on-widget .ueb-widget-link > .ueb-widget-count {
    position: relative;
    top: 0;
    right: 0;
}

/* Фиксированный размер виджета - применяем к link */
.ueb-widget.fixed-size .ueb-widget-link {
    width: var(--ueb-fixed-width, 140px);
    height: var(--ueb-fixed-height, 48px);
    justify-content: var(--ueb-content-align, center);
}
.ueb-widget.fixed-size .ueb-widget-content .ueb-widget-text {
    white-space: normal;
    word-wrap: break-word;
}

/* Адрес + подпись: fixed_size = max-width (без фиксации высоты) */
.ueb-address_label.fixed-size {
    max-width: var(--ueb-fixed-width, 220px);
}
.ueb-address_label.fixed-size .ueb-widget-link {
    width: auto;
    height: auto;
}

/* Обрамление виджета - на link */
.ueb-widget.has-border .ueb-widget-link {
    border: var(--ueb-widget-border-width, 1px) solid color-mix(in srgb, var(--ueb-widget-border-color, var(--text_color)) calc(var(--ueb-widget-border-opacity, 0.2) * 100%), transparent);
}

.ueb-widget-text {
    display: inline-flex;
    align-items: center;
    font-size: var(--ueb-font-size, 12px);
    font-weight: var(--ueb-font-weight, 400);
    line-height: 1;
    color: var(--ueb-text-color, var(--text_color));
    text-transform: var(--ueb-text-transform, none);
    white-space: nowrap;
}

/* Контейнер для текста с подписью */
.ueb-widget-content {
    display: flex;
    flex-direction: column;
    gap: 4px;
    /* text_align: выравнивание элементов и текста */
    align-items: var(--ueb-text-align-flex, flex-start);
    text-align: var(--ueb-text-align, left);
}

.ueb-widget-content .ueb-widget-text {
    white-space: nowrap;
}
.ueb-widget:has(> .ueb-widget-icon-wrap) .ueb-widget-text {
    line-height: 146%;
}
.ueb-widget[style*="max-width"] .ueb-widget-content .ueb-widget-text {
    white-space: normal;
    word-wrap: break-word;
}

/* Лейбл над текстом (захардкоженный) */
.ueb-widget-label {
    display: block;
    line-height: 1.3;
    font-size: 14px;
    font-weight: 400;
    opacity: 0.7;
    color: inherit;
}

/* Подпись под текстом */
.ueb-widget-subtitle {
    display: block;
    line-height: 1.3;
    font-size: var(--ueb-subtitle-font-size, 15px);
    font-weight: var(--ueb-subtitle-font-weight, 400);
    opacity: var(--ueb-subtitle-opacity, 0.7);
    color: var(--ueb-subtitle-color, inherit);
    text-transform: var(--ueb-subtitle-text-transform, none);
}

/* Дублирующий счётчик «N товаров» / «на N ₽» под лейблом виджета.
   Сидит внутри .ueb-widget-text как flex-basis: 100% (отдельная строка),
   родитель wrap'ается. Без явных выравниваний — наследует от родителя. */
.ueb-widget-text:has(> .ueb-widget-items-count) {
    display: inline-block;
    flex-wrap: wrap;
    white-space: normal;
}
.ueb-widget-items-count {
    flex: 0 0 100%;
    width: 100%;
    display: flex;
    margin-top: 2px;
    color: inherit;
    font-size: 17px;
    font-style: normal;
    font-weight: 700;
    line-height: 20px;
}
.ueb-widget-items-count-num,
.ueb-widget-items-count-prefix {
    margin-right: 4px;
}

/* Префикс (inline перед текстом) */
.ueb-widget-prefix {
    font-size: var(--ueb-prefix-font-size, 14px);
    font-weight: var(--ueb-prefix-font-weight, 400);
    opacity: var(--ueb-prefix-opacity, 0.6);
    color: var(--ueb-prefix-color, inherit);
    text-transform: var(--ueb-prefix-text-transform, none);
    margin-right: 4px;
}

/* Звезда рейтинга (yandex_rating, gis_rating, google_maps_rating) — inline после текста */
.ueb-rating-star {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1em;
    height: 1em;
    margin-left: 6px;
    flex-shrink: 0;
    vertical-align: middle;
}
.ueb-rating-star svg {
    width: 100%;
    height: 100%;
    display: block;
}

/* ========== Фиксированная шапка ========== */
header.ueb-wrap.fixed {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    background-color: rgba(255, 255, 255, 0.95);
    z-index: 1000;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
    animation: uebSlideDown 0.3s ease;
}

@keyframes uebSlideDown {
    from { transform: translateY(-100%); }
    to { transform: translateY(0); }
}

/* ========== Группы элементов ========== */
.ueb-group {
    display: flex;
    align-items: center;
    gap: 16px;
}

/* Вложенные элементы в группе наследуют flex */
.ueb-group > .ueb-item,
.ueb-group > .ueb-social-wrap,
.ueb-group > .ueb-menu-wrap,
.ueb-group > .ueb-btn-contact,
.ueb-group > .ueb-catalog-wrap {
    flex-shrink: 0;
}

/* ========== Разделители рядов ========== */
/* CSS переменные для разделителей (дефолты) */
.ueb-row {
    --ueb-separator-color: var(--text_color);
    --ueb-separator-opacity: 0.1;
    --ueb-separator-width: 1px;
}

/* Без разделителя (убираем дефолтный border у ueb-row-1) */
.ueb-row.ueb-separator-none {
    border-bottom: none;
}
.ueb-row.ueb-separator-none .ueb-row-inner {
    border-bottom: none;
}

/* Линия в контейнере */
.ueb-separator-line_inner .ueb-row-inner {
    position: relative;
}
.ueb-separator-line_inner .ueb-row-inner::after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: var(--ueb-separator-width);
    background: var(--ueb-separator-color);
    opacity: var(--ueb-separator-opacity);
}

/* Линия на всю ширину */
.ueb-separator-line_full {
    position: relative;
}
.ueb-separator-line_full::after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: var(--ueb-separator-width);
    background: var(--ueb-separator-color);
    opacity: var(--ueb-separator-opacity);
}

/* Пунктирная линия в контейнере */
.ueb-separator-dashed_inner .ueb-row-inner {
    position: relative;
}
.ueb-separator-dashed_inner .ueb-row-inner::after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 0;
    border-bottom: var(--ueb-separator-width) dashed var(--ueb-separator-color);
    opacity: var(--ueb-separator-opacity);
}

/* Пунктирная линия на всю ширину */
.ueb-separator-dashed_full {
    position: relative;
}
.ueb-separator-dashed_full::after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 0;
    border-bottom: var(--ueb-separator-width) dashed var(--ueb-separator-color);
    opacity: var(--ueb-separator-opacity);
}

/* Тень на всю ширину */
.ueb-separator-shadow {
    position: relative;
}
.ueb-separator-shadow::after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: calc(var(--ueb-separator-width) * -1);
    height: var(--ueb-separator-width);
    background: linear-gradient(to bottom, var(--ueb-separator-color), transparent);
    opacity: var(--ueb-separator-opacity);
    pointer-events: none;
}

/* Тень в контейнере */
.ueb-separator-shadow_inner .ueb-row-inner {
    position: relative;
}
.ueb-separator-shadow_inner .ueb-row-inner::after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: calc(var(--ueb-separator-width) * -1);
    height: var(--ueb-separator-width);
    background: linear-gradient(to bottom, var(--ueb-separator-color), transparent);
    opacity: var(--ueb-separator-opacity);
    pointer-events: none;
}

/* Обрамление контейнера линией */
.ueb-separator-border_inner .ueb-row-inner {
    border: var(--ueb-separator-width) solid color-mix(in srgb, var(--ueb-separator-color) calc(var(--ueb-separator-opacity) * 100%), transparent);
}

/* Обрамление контейнера тенью */
.ueb-separator-border_shadow_inner .ueb-row-inner {
    box-shadow: 0 4px var(--ueb-separator-width) 0 color-mix(in srgb, var(--ueb-separator-color) calc(var(--ueb-separator-opacity) * 100%), transparent);
}

/* ========== Split-layout ряда (rowspan-сетка) ==========
   Левая секция: фиксированная ширина 230px (по умолчанию), занимает обе строки.
   Правая часть: 1fr — по остаточному принципу.
   Ширину левой можно переопределить CSS-переменной --ueb-split-left-width. */
.ueb-row--split-left-main .ueb-row-inner {
    display: grid;
    grid-template-areas:
        "left top"
        "left bottom";
    grid-template-columns: var(--ueb-split-left-width, 230px) 1fr;
    column-gap: var(--ueb-split-column-gap, 16px);
    row-gap: var(--ueb-split-row-gap, 8px);
    align-items: center;
}
.ueb-row--split-left-main .ueb-row-section--left          { grid-area: left; display: flex; align-items: center; }
.ueb-row--split-left-main .ueb-row-section--right-top     { grid-area: top; display: flex; align-items: center; justify-content: space-between; }
.ueb-row--split-left-main .ueb-row-section--right-bottom  { grid-area: bottom; display: flex; align-items: center; justify-content: space-between; }

/* ========== Шапка поверх баннера (overlay mode) ========== */
/* Работает когда первый блок — main_banner с container_off */
/* Два режима: автоматический (всегда) ИЛИ только при включенной настройке (.ueb-overlay-banner) */
/* Только для десктопа (от 991px), на мобильных UEB-шапка скрыта */
@media screen and (min-width: 991px) {
    /* Позиционирование шапки поверх баннера */
    body:has(#wrapper_all_redcoder > .section-system-container.section-system-layout-main_banner:first-child .main_banner_out.container_off) header.ueb-wrap.ueb-overlay-banner {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        z-index: 100;
    }

    /* Компенсация высоты шапки — увеличиваем высоту баннера */
    body:has(header.ueb-wrap.ueb-overlay-banner):has(#wrapper_all_redcoder > .section-system-container.section-system-layout-main_banner:first-child .main_banner_out.container_off) #wrapper_all_redcoder > .section-system-container.section-system-layout-main_banner:first-child .main_banner_out.container_off .main_banner_in {
        height: calc(var(--visual_banner_height) + var(--ueb-header-offset, 190px));
    }

    /* Сдвигаем контент баннера вниз */
    body:has(header.ueb-wrap.ueb-overlay-banner):has(#wrapper_all_redcoder > .section-system-container.section-system-layout-main_banner:first-child .main_banner_out.container_off) #wrapper_all_redcoder > .section-system-container.section-system-layout-main_banner:first-child .main_banner_out.container_off .main_banner_content {
        padding-top: var(--ueb-header-offset, 190px);
    }
}

/* ========== Альтернативные цвета (при full-width баннере) ========== */
/* Когда включена настройка "Поверх баннера" И первый блок — main_banner с container_off, применяем alt-цвета к виджетам с .has-alt-colors */
/* Отключаем когда sticky-wrap видим (при скролле) */
/* !important нужен чтобы перебить inline styles (text color задаётся инлайном) */
body:not(:has(.ueb-sticky-wrap.is-visible)):has(header.ueb-wrap.ueb-overlay-banner):has(#wrapper_all_redcoder > .section-system-container.section-system-layout-main_banner:first-child .main_banner_out.container_off) header.ueb-wrap .ueb-widget.has-alt-colors .ueb-widget-link {
    background-color: var(--ueb-alt-bg) !important;
}

body:not(:has(.ueb-sticky-wrap.is-visible)):has(header.ueb-wrap.ueb-overlay-banner):has(#wrapper_all_redcoder > .section-system-container.section-system-layout-main_banner:first-child .main_banner_out.container_off) header.ueb-wrap .ueb-widget.has-alt-colors .ueb-widget-link:hover {
    background-color: var(--ueb-alt-bg-hover) !important;
}

body:not(:has(.ueb-sticky-wrap.is-visible)):has(header.ueb-wrap.ueb-overlay-banner):has(#wrapper_all_redcoder > .section-system-container.section-system-layout-main_banner:first-child .main_banner_out.container_off) header.ueb-wrap .ueb-widget.has-alt-colors:not(.has-colored-icon) svg {
    color: var(--ueb-alt-icon) !important;
}

body:not(:has(.ueb-sticky-wrap.is-visible)):has(header.ueb-wrap.ueb-overlay-banner):has(#wrapper_all_redcoder > .section-system-container.section-system-layout-main_banner:first-child .main_banner_out.container_off) header.ueb-wrap .ueb-widget.has-alt-colors .ueb-widget-text {
    color: var(--ueb-alt-text) !important;
}

body:not(:has(.ueb-sticky-wrap.is-visible)):has(header.ueb-wrap.ueb-overlay-banner):has(#wrapper_all_redcoder > .section-system-container.section-system-layout-main_banner:first-child .main_banner_out.container_off) header.ueb-wrap .ueb-widget.has-alt-colors .ueb-widget-subtitle {
    color: var(--ueb-alt-subtitle) !important;
}

body:not(:has(.ueb-sticky-wrap.is-visible)):has(header.ueb-wrap.ueb-overlay-banner):has(#wrapper_all_redcoder > .section-system-container.section-system-layout-main_banner:first-child .main_banner_out.container_off) header.ueb-wrap .ueb-widget.has-alt-colors .ueb-widget-prefix {
    color: var(--ueb-alt-prefix) !important;
}

/* Альт-цвет рамки: fallback на обычную рамку, толщина/прозрачность наследуются */
body:not(:has(.ueb-sticky-wrap.is-visible)):has(header.ueb-wrap.ueb-overlay-banner):has(#wrapper_all_redcoder > .section-system-container.section-system-layout-main_banner:first-child .main_banner_out.container_off) header.ueb-wrap .ueb-widget.has-alt-colors.has-border .ueb-widget-link {
    border-color: color-mix(in srgb, var(--ueb-alt-border-color, var(--ueb-widget-border-color, var(--text_color))) calc(var(--ueb-widget-border-opacity, 0.2) * 100%), transparent) !important;
}

/* ========== Альт-цвета меню (на тёмном full-width баннере) ========== */
body:not(:has(.ueb-sticky-wrap.is-visible)):has(header.ueb-wrap.ueb-overlay-banner):has(#wrapper_all_redcoder > .section-system-container.section-system-layout-main_banner:first-child .main_banner_out.container_off) header.ueb-wrap .ueb-menu-wrap.has-alt-colors .ueb-menu > li > a,
body:not(:has(.ueb-sticky-wrap.is-visible)):has(header.ueb-wrap.ueb-overlay-banner):has(#wrapper_all_redcoder > .section-system-container.section-system-layout-main_banner:first-child .main_banner_out.container_off) header.ueb-wrap .ueb-menu-wrap.has-alt-colors .ueb-menu > li > .ueb-menu-link {
    color: var(--ueb-alt-text) !important;
}

body:not(:has(.ueb-sticky-wrap.is-visible)):has(header.ueb-wrap.ueb-overlay-banner):has(#wrapper_all_redcoder > .section-system-container.section-system-layout-main_banner:first-child .main_banner_out.container_off) header.ueb-wrap .ueb-menu-wrap.has-alt-colors .ueb-menu > li:hover > a,
body:not(:has(.ueb-sticky-wrap.is-visible)):has(header.ueb-wrap.ueb-overlay-banner):has(#wrapper_all_redcoder > .section-system-container.section-system-layout-main_banner:first-child .main_banner_out.container_off) header.ueb-wrap .ueb-menu-wrap.has-alt-colors .ueb-menu > li:hover > .ueb-menu-link,
body:not(:has(.ueb-sticky-wrap.is-visible)):has(header.ueb-wrap.ueb-overlay-banner):has(#wrapper_all_redcoder > .section-system-container.section-system-layout-main_banner:first-child .main_banner_out.container_off) header.ueb-wrap .ueb-menu-wrap.has-alt-colors .ueb-menu > li.current-menu-item > a,
body:not(:has(.ueb-sticky-wrap.is-visible)):has(header.ueb-wrap.ueb-overlay-banner):has(#wrapper_all_redcoder > .section-system-container.section-system-layout-main_banner:first-child .main_banner_out.container_off) header.ueb-wrap .ueb-menu-wrap.has-alt-colors .ueb-menu > li.current-menu-item > .ueb-menu-link {
    color: var(--ueb-alt-menu-hover) !important;
}

/* ========== Осветлённая версия логотипа (тот же триггер, что alt-цвета) ========== */
/* Второй <img> логотипа скрыт; на тёмном full-width баннере подменяет основной */
.blocksee-logo__image--lightened { display: none; }

body:not(:has(.ueb-sticky-wrap.is-visible)):has(header.ueb-wrap.ueb-overlay-banner):has(#wrapper_all_redcoder > .section-system-container.section-system-layout-main_banner:first-child .main_banner_out.container_off) header.ueb-wrap .blocksee-logo--has-lightened .blocksee-logo__image:not(.blocksee-logo__image--lightened) {
    display: none;
}

body:not(:has(.ueb-sticky-wrap.is-visible)):has(header.ueb-wrap.ueb-overlay-banner):has(#wrapper_all_redcoder > .section-system-container.section-system-layout-main_banner:first-child .main_banner_out.container_off) header.ueb-wrap .blocksee-logo--has-lightened .blocksee-logo__image--lightened {
    display: block;
}

body:not(:has(.ueb-sticky-wrap.is-visible)):has(header.ueb-wrap.ueb-overlay-banner):has(#wrapper_all_redcoder > .section-system-container.section-system-layout-main_banner:first-child .main_banner_out.container_off) header.ueb-wrap .blocksee-logo--has-lightened .blocksee-logo__title,
body:not(:has(.ueb-sticky-wrap.is-visible)):has(header.ueb-wrap.ueb-overlay-banner):has(#wrapper_all_redcoder > .section-system-container.section-system-layout-main_banner:first-child .main_banner_out.container_off) header.ueb-wrap .blocksee-logo--has-lightened .blocksee-logo__subtitle {
    color: var(--blocksee-logo-lightened-text-color) !important;
}

/* ========== Адаптивность ========== */
@media screen and (max-width: 1490px) {
    .ueb-search {
        width: var(--ueb-width-1490, var(--ueb-width, 432px));
    }
}

@media screen and (max-width: 1240px) {
    .ueb-search {
        max-width: 320px;
    }
}

@media screen and (max-width: 990px) {
    .ueb-wrap {
        display: none !important;
    }

}

/* ========== Blocksee Logo Component ========== */
.blocksee-logo {
    display: inline-flex;
    align-items: center;
    opacity: var(--blocksee-logo-opacity, 1);
}

.blocksee-logo__link {
    display: inline-flex;
    align-items: center;
    gap: var(--blocksee-logo-gap, 18px);
    text-decoration: none;
    color: inherit;
}

.blocksee-logo__image {
    width: var(--blocksee-logo-width, 180px);
    height: auto;
    flex-shrink: 0;
}

.blocksee-logo__svg {
    display: flex;
    align-items: center;
    flex-shrink: 0;
    color: var(--main_color);
}

.blocksee-logo__svg svg {
    width: var(--blocksee-logo-width, 180px);
    height: auto;
}

.blocksee-logo__svg svg path {
    fill: var(--main_color) !important;
}

.blocksee-logo__text {
    display: flex;
    flex-direction: column;
    gap: 2px;
    white-space: nowrap;
    min-width: 0;
    font-family: var(--blocksee-logo-text-font, var(--font-title));
}

.blocksee-logo__title {
    font-weight: var(--blocksee-logo-title-weight, 600);
    font-size: var(--blocksee-logo-title-size, 16px);
    line-height: 1.2;
    color: var(--blocksee-logo-title-color, var(--text_color));
    opacity: var(--blocksee-logo-title-opacity, 1);
}

.blocksee-logo__subtitle {
    font-size: var(--blocksee-logo-subtitle-size, 12px);
    font-weight: var(--blocksee-logo-subtitle-weight, 400);
    color: var(--blocksee-logo-subtitle-color, var(--text_color));
    opacity: var(--blocksee-logo-subtitle-opacity, 1);
}

@media screen and (max-width: 768px) {
    /* Мобильная ширина задаётся числом, поэтому широкий логотип схлопывался в
       неразличимую полоску. Соотношение сторон приходит из рендерера, и ширина
       не опускается ниже той, при которой высота останется читаемой. */
    .blocksee-logo__image,
    .blocksee-logo__svg svg {
        width: max(
            var(--blocksee-logo-mobile-width, 120px),
            calc(var(--blocksee-logo-min-height, 26px) * var(--blocksee-logo-ratio, 1))
        );
        max-width: 100%;
        height: auto;
    }
}

/* ========== City switcher — режим «выпадающий список» ========== */
/* Триггер (иконка+текст) остаётся обычным виджетом; список выезжает под ним.
   В режиме «модалка» этих классов нет — виджет ведёт себя как ссылка-fancybox. */
.ueb-city--dropdown {
    position: relative;
}

.ueb-city--dropdown .ueb-city-dropdown-toggle {
    cursor: pointer;
}

.ueb-city-dropdown-menu {
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 120;
    min-width: 180px;
    max-height: 320px;
    margin-top: 8px;
    padding: 6px 0;
    overflow-y: auto;
    background: var(--white_color, #fff);
    border: 1px solid rgba(0, 0, 0, .1);
    border-radius: 10px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, .14);
    opacity: 0;
    visibility: hidden;
    transform: translateY(-4px);
    transition: opacity .16s ease, transform .16s ease, visibility .16s ease;
}

.ueb-city--dropdown.is-open .ueb-city-dropdown-menu {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

/* Выравнивание по правому краю (свотчер в правой части шапки) */
.ueb-city--align-right .ueb-city-dropdown-menu {
    left: auto;
    right: 0;
}

.ueb-city-dropdown-menu .region_list {
    margin: 0;
    padding: 0;
    list-style: none;
}

.ueb-city-dropdown-menu .region_list li {
    margin: 0;
}

.ueb-city-dropdown-menu .region_list a,
.ueb-city-dropdown-menu .region_list span {
    display: block;
    padding: 8px 18px;
    font-size: 14px;
    line-height: 1.3;
    white-space: nowrap;
    text-decoration: none;
    color: var(--text_color, #333);
    transition: background-color .15s ease, color .15s ease;
}

.ueb-city-dropdown-menu .region_list a:hover {
    background: var(--text_color_opacity_10, rgba(0, 0, 0, .05));
    color: var(--text_color, #333);
}

/* Текущий регион — неактивный, выделен */
.ueb-city-dropdown-menu .region_list span {
    font-weight: 600;
    color: var(--text_color, #333);
    cursor: default;
}

/* ── Текстовые виджеты (копирайт / произвольный текст; в основном футер) ── */
.ueb-widget-textonly { cursor: default; }
.ueb-widget-textonly .ueb-widget-text { white-space: normal; line-height: 1.5; }

/* ── Виджет «Соцсети (все)» — кружки 1:1 с классическим футером темы ── */
.ueb-soc-links { display: flex; align-items: center; gap: 8px; opacity: var(--ueb-opacity, 1); }
.ueb-soc-links .setable_social_item {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    /* фон кружка — widget_bg_color, глифы — icon_color (два разных поля панели) */
    background-color: var(--ueb-widget-bg, var(--main_color));
}
.ueb-soc-links .setable_social_item svg { width: 18px; height: 18px; }
.ueb-soc-links .setable_social_item svg path { fill: var(--ueb-icon-color, var(--white_color)) !important; }
.ueb-soc-links .setable_social_item.social-whatsapp { background: none; width: auto; height: auto; }
.ueb-soc-links .setable_social_item.social-whatsapp svg { width: 36px; height: 36px; }
/* WhatsApp — цельная иконка: внешний круг = фон, глиф внутри = цвет иконок */
.ueb-soc-links .setable_social_item.social-whatsapp svg g > path:first-of-type { fill: var(--ueb-widget-bg, var(--main_color)) !important; }
.ueb-soc-links .setable_social_item.social-whatsapp svg .setable_social_item_text { fill: var(--ueb-icon-color, var(--white_color)) !important; }
.ueb-soc-links .ueb-soc-empty { font-size: 13px; opacity: .5; }

/* ── Футер: сетка как в классическом подвале (замер: 438 / 250 / 3×181, gap 24) ── */
.ueb-footer .ueb-row-inner { gap: 20px; }
.ueb-footer .ueb-row-inner > .ueb-group:first-child { flex: 0 0 438px; max-width: 438px; }
.ueb-footer .ueb-group:has([data-floor-type="phone_1"]) { flex-basis: 250px; min-width: 250px; }
.ueb-footer .ueb-group:has(nav[data-floor-type^="menu"]) { min-width: 181px; }
.ueb-footer .ueb-widget-textonly { max-width: 396px; }

/* ── Логотип разработчика: цвет наследуется от настройки классического футера
   (--footer-cinar-color из опции visual_color_footer_cinar, фолбэк text_color);
   приглушение даёт штатный .cinar{opacity:.5} темы ── */
.ueb-dev-logo .cinar a { display: inline-flex; align-items: center; gap: 10px; }
.ueb-dev-logo .cinar a svg { width: 107px; height: 22px; flex-shrink: 0; }
.ueb-dev-logo .cinar a svg path { fill: var(--footer-cinar-color, var(--text_color)) !important; }
.ueb-dev-logo .cinar a span { color: var(--footer-cinar-color, var(--text_color)); }

/* ── Виджет «Логотип разработчика» ── */
.ueb-dev-logo { opacity: var(--ueb-opacity, 1); }

/* ── Футер: меню-колонки вертикальные (в шапке меню горизонтальное) ── */
.ueb-footer nav[data-floor-type="menu"] ul.ueb-menu,
.ueb-footer nav[data-floor-type="menu_2"] ul.ueb-menu,
.ueb-footer nav[data-floor-type="menu_3"] ul.ueb-menu {
    flex-direction: column;
    align-items: flex-start;
}
.ueb-footer .ueb-menu a { white-space: nowrap; }
.ueb-footer .ueb-row-inner { align-items: flex-start; }
/* Колонки-группы не сжимаются (заголовки не переносятся); первой (логотипной) сжиматься можно */
.ueb-footer .ueb-row-inner > .ueb-group { flex-shrink: 0; }
.ueb-footer .ueb-row-inner > .ueb-group:first-child { flex-shrink: 1; }

/* Текстовые виджеты: переносы строк из значения (как абзацы классического дисклеймера) */
.ueb-custom_text .ueb-widget-text { white-space: pre-line; }

/* Текстовые ссылки футера: ховер как у темы — акцентный цвет */
.ueb-widget-textonly a:hover .ueb-widget-text { color: var(--main_color) !important; }

/* Футер: контакт-элементы переносятся по строкам (в шапке — nowrap) */
.ueb-footer .ueb-item span { white-space: normal; }

/* Футер: тексты виджетов переносятся (в шапке — nowrap); адрес в колонке — многострочный */
.ueb-footer .ueb-widget .ueb-widget-text,
.ueb-footer .ueb-widget-content .ueb-widget-text {
    white-space: normal;
    line-height: 1.5;
    display: inline;
}

/* Дескриптор и тексты: переносы абзацев сохраняются (после inline-правила футера) */
.ueb-footer .ueb-custom_text .ueb-widget-text { white-space: pre-line; }

/* Футер-конструктор: разграничение с контентом сверху — как у классики (shadow_footer) */
footer.ueb-footer {
    position: relative;
    box-shadow: 0px 4px 18px 0px var(--main_color_opacity_10);
}

/* ══ Футер-конструктор: мобильная версия (правила в конце файла — каскад поверх десктопной сетки) ══ */
@media screen and (max-width: 990px) {
    footer.ueb-footer {
        display: block !important;
    }
    .ueb-footer .ueb-row-inner {
        flex-direction: column;
        align-items: flex-start;
        gap: 28px;
    }
    /* Десктопные ширины колонок в колоночном flex становятся высотами — сбрасываем */
    .ueb-footer .ueb-row-inner > .ueb-group,
    .ueb-footer .ueb-row-inner > .ueb-group:first-child {
        flex: none;
        width: 100%;
        max-width: 100%;
        min-width: 0;
    }
    .ueb-footer .ueb-group:has([data-floor-type="phone_1"]) {
        flex: none;
        min-width: 0;
    }
    .ueb-footer .ueb-widget-textonly { max-width: 100%; }
    /* Логотип сайта: полноценный размер, а не мобильная ширина шапки (50px) */
    .ueb-footer .blocksee-logo img,
    .ueb-footer .blocksee-logo svg {
        width: 200px !important;
        height: auto !important;
    }
    /* Нижний ряд: компактный столбик */
    .ueb-footer .ueb-row:last-child .ueb-row-inner { gap: 16px; }
}

/* Логотип в футер-конструкторе: без наследия классики (margin темы), плейсхолдер незаданного лого */
.ueb-footer .blocksee-logo { margin-bottom: 0; }
.ueb-logo-footer-empty {
    display: inline-flex;
    align-items: center;
    padding: 14px 18px;
    border: 1px dashed rgba(0, 0, 0, 0.25);
    border-radius: 8px;
}
.ueb-logo-footer-empty span { font-size: 13px; color: var(--text_color); opacity: .55; }

/* Дескриптор и произвольный текст: переносы строк источника сохраняются
   (футер-скоуп — сильнее правила переносов) */
.ueb-descriptor .ueb-widget-text,
.ueb-custom-text .ueb-widget-text,
.ueb-copyright .ueb-widget-text,
.ueb-footer .ueb-descriptor .ueb-widget-text,
.ueb-footer .ueb-custom-text .ueb-widget-text,
.ueb-footer .ueb-copyright .ueb-widget-text { white-space: pre-line; }


/* ============================================================
   «Скрывать на небольших экранах (≤1280px)» — per-widget опция
   (visual.hide_md). Граница md по BREAKPOINTS_STANDARD.md.
   ============================================================ */
@media (max-width: 1280px) {
	.ueb-hide-md { display: none !important; }
}
/* ступень крупнее: ≤1440 (включая 1280 и всё ниже — каскад max-width) */
@media (max-width: 1440px) {
	.ueb-hide-lg { display: none !important; }
}

/* ============================================================
   Priority+ меню: кнопка «Ещё» (li.ueb-menu-more).
   Выпадашка — штатное субменю (.ueb-submenu-wrap): стили наследуются.
   ============================================================ */
.ueb-menu-more[hidden] { display: none !important; }
.ueb-menu-more > .ueb-menu-link { cursor: pointer; white-space: nowrap; }
.ueb-menu-more-caret { margin-left: 5px; flex: 0 0 auto; }
.ueb-menu-more > .ueb-menu-link { display: inline-flex; align-items: center; }

/* Priority+: сжиматься разрешено ТОЛЬКО группе с overflow-меню — прочие
   группы (виджеты, телефон, CTA) держат min-content, иначе их контент
   слипается и вылезает. Субменю выпадают за ul — клип запрещён. */
.ueb-row-inner .ueb-group:has(.ueb-menu-wrap[data-overflow="1"]),
.ueb-row-inner .ueb-menu-wrap[data-overflow="1"] { min-width: 0; }
.ueb-menu-wrap[data-overflow="1"] .ueb-menu { min-width: 0; flex-wrap: nowrap; }

/* ========== Прогрессивный каталог ========== */
/* Слева — категории (без иконок), справа — карточки подкатегорий той же
   вёрсткой, что в режиме «Сетка». Ширину меню скрипт равняет по контейнеру. */
.ueb-catalog-dropdown--progressive {
    max-height: min(720px, calc(100vh - 140px));
    border-radius: 0 0 18px 18px;
    overflow: hidden;
    box-shadow: 0 24px 60px rgba(15, 23, 42, .18);
}

.ueb-catalog-dropdown--progressive .ueb-classic-sidebar {
    width: 280px;
    min-height: 390px;
    background: var(--ueb-progressive-sidebar-bg, #2f3142);
    border: 0;
}

.ueb-catalog-dropdown--progressive .ueb-classic-menu {
    padding: 0;
}

.ueb-catalog-dropdown--progressive .ueb-classic-item > a {
    padding: 14px 40px 14px 28px;
    color: rgba(255, 255, 255, .86);
    font-size: 16px;
    font-weight: 500;
}

.ueb-catalog-dropdown--progressive .ueb-classic-item > a:hover,
.ueb-catalog-dropdown--progressive .ueb-classic-item.active > a {
    background: rgba(255, 255, 255, .07);
    color: #fff;
}

.ueb-catalog-dropdown--progressive .ueb-classic-item.has-children > a::after {
    right: 24px;
    width: 6px;
    height: 6px;
    border-width: 1.6px;
    opacity: .55;
}

.ueb-catalog-dropdown--progressive .ueb-classic-content {
    padding: 40px 48px;
    background: #fff;
}

/* Панель категории — контейнер для сеточного списка карточек */
.ueb-catalog-dropdown--progressive .ueb-classic-panel.active {
    display: block;
    column-count: initial;
}

.ueb-catalog-dropdown--progressive .ueb-catalog-list {
    --ueb-catalog-col-width: calc(100% / var(--ueb-progressive-columns, 3));
}

@media (max-width: 1100px) {
    .ueb-catalog-dropdown--progressive .ueb-classic-sidebar {
        width: 240px;
    }
}