/*
 * Токены оформления для компонентов MuseCMS на витрине Sofa.
 *
 * Компонентный CSS ядра (muse-catalog.css, muse-product-cards.css и соседние)
 * читает палитру, шрифт и радиусы из переменных `--brand-*`, которые обычно
 * приходят из системной theme.css. На маршрутах Sofa системная тема отключена
 * (D-0007), иначе поверх исходной темы лёг бы второй дизайн — и компоненты
 * оставались без переменных: фильтры, сортировка и поиск выводились браузерными
 * дефолтами.
 *
 * Поэтому переменные задаются здесь, значениями действующей темы исходная тема. Это
 * дешевле и честнее, чем копировать компонентный CSS в проект: логика и
 * оформление компонентов продолжают обновляться вместе с ядром, а витрина
 * задаёт только свою палитру.
 *
 * Источник цветов — лицензированная тема исходная тема `themes/6/theme.css`:
 * #bd1c3c основной акцент, #a81834 — нажатое состояние.
 */
:root {
    --brand-accent: #bd1c3c;
    --brand-accent-2: #d82044;
    --brand-soft: #f7f7f7;
    --brand-danger: #bd1c3c;
    --brand-danger-line: #e8b8c3;
    --brand-badge-new: #4a9c5d;
    --brand-badge-top: #bd1c3c;

    /* исходная тема везде использует Open Sans; компонент должен попадать в тот же ритм строк. */
    --brand-font: "Open Sans", Arial, Helvetica, sans-serif;

    /* Исходный шаблон почти не скругляет углы: кнопки и карточки прямоугольные. */
    --brand-radius: 0px;
    --brand-radius-ctl: 0px;
    --brand-radius-pill: 2px;

    --brand-shadow-rgb: 26, 29, 39;

    /* Запасной акцент для правил, которые обращаются к --acc напрямую. */
    --acc: #bd1c3c;
    --acc-2: #d82044;

    /*
     * Ниже — переменные системной темы (theme.css:2-20), которую витрина
     * отключает целиком (D-0007). Компонентный CSS ядра (.au-*, .acc-*,
     * .mu-*, .co-*, .mc-*) читает их БЕЗ запасного значения в самом правиле —
     * без определения здесь получаются невидимые элементы: D-0033 нашёл
     * кнопку входа белым текстом на прозрачном фоне, потому что
     * `background: var(--grad)` резолвился в пусто. Структурные величины
     * (радиусы, нейтральные ink/mut/line) взяты из темы как есть — они не
     * привязаны к бренду; `--grad`/`--acc`/`--co-acc*` заменены на красную
     * палитру Sofa вместо демо-розовой. исходная тема-исходник плоский, без
     * градиентов и почти без скруглений (см. выше), но здесь это чужая,
     * core-own страница (D-0031) — тонкий градиент и обычные радиусы темы
     * уместны и не выглядят инородно.
     */
    --grad: linear-gradient(135deg, var(--brand-accent), var(--brand-accent-2));
    --grad-strong: linear-gradient(135deg, var(--brand-accent), var(--brand-accent-2));
    --ink: #1a1d27;
    --mut: #6a7180;
    --line: #e8eaf0;
    --brand-line: #e8eaf0;
    --brand-soft-2: #fbeef2;
    --brand-soft-3: #fbeef2;
    --brand-ok: #2f8f64;
    --brand-ok-bg: #eef8f1;
    --brand-ok-line: #cfead8;
    --brand-selected: #fbeef2;
    /* D-0073: были 9px/16px «как в системной теме». Источник почти нигде не
       скругляет — держим общий язык острых углов и на core-own страницах. */
    --brand-radius-sm: 0px;
    --brand-radius-lg: 0px;
    --brand-font-display: var(--brand-font);
    --brand-cta-transform: none;
    --brand-cta-track: normal;
    --mc-acc: var(--brand-accent);
    --co-acc: var(--brand-accent);
    --co-acc2: var(--brand-accent-2);
    --co-ink: var(--ink);
    --co-mut: var(--mut);
    --co-line: var(--line);
    --co-rad: 0px;
}

/*
 * D-0037: страницы каталога снова двухколоночные, как у источника —
 * `.left_block` (дерево разделов с мега-меню, sofa_catalog_sidebar_menu())
 * занимает исходные 234px float:left, `.right_block.wide_N` держит
 * padding-left:258px под него (правило есть в исходном исходная тема CSS, здесь
 * ничего перебивать не нужно). Раньше (D-0027) `.left_block` не было вообще —
 * колонку фильтров давал сам компонент каталога, поэтому right_block
 * растягивался на 100% через !important-override. Теперь эта колонка снова
 * есть, override снят.
 *
 * Категорийный фасет компонента (`.mc-facet-cats`) спрятан — дерево слева
 * теперь единственная навигация по разделам; дублировать её вторым деревом
 * внутри фильтров компонента избыточно.
 */
.sofa-catalog .mc-facet-cats {
    display: none;
}

/* Мега-меню дерева разделов (D-0037): раскрытие по hover/focus — тем же
 * приёмом, что и у mega-menu в шапке (sofa_shell_head()): исходный JS,
 * который считает position/opacity флай-аута, в проект не подключён (не
 * тянем main.js целиком), поэтому раскрытие — чистым CSS.
 *
 * D-0073, две правки. Первая: скоуп был `.left_block …`, но скрипт каталога
 * переносит меню в сайдбар компонента (`.mc-filters`) — предка `.left_block`
 * там нет, и весь блок молча не применялся (проверено на живом DOM: 0
 * совпадений). Держим меню по его собственному классу, он в каталоге один.
 * Вторая: раскрытие переключало `display`, а он не анимируется — панель
 * возникала рывком. Теперь панель всегда в потоке, а показывается через
 * opacity/visibility, так что переход можно сгладить; на ЗАКРЫТИЕ добавлена
 * небольшая задержка, чтобы меню не схлопывалось от случайного пересечения
 * курсором по дороге к подразделу. */
.sofa-catalog .menu_top_block > ul.menu.dropdown > li.has-child > ul.dropdown {
    display: block !important;
    position: absolute;
    left: 100%;
    top: 0;
    z-index: 390;
    background: #fff;
    box-shadow: 0 6px 24px rgba(20, 22, 30, .12);
    opacity: 0;
    visibility: hidden;
    transform: translateX(-6px);
    transition: opacity .2s ease .15s, transform .2s ease .15s, visibility 0s linear .35s;
}

.sofa-catalog .menu_top_block > ul.menu.dropdown > li.has-child:hover > ul.dropdown,
.sofa-catalog .menu_top_block > ul.menu.dropdown > li.has-child:focus-within > ul.dropdown {
    opacity: 1;
    visibility: visible;
    transform: none;
    transition: opacity .18s ease, transform .18s ease, visibility 0s;
}

@media (prefers-reduced-motion: reduce) {
    .sofa-catalog .menu_top_block > ul.menu.dropdown > li.has-child > ul.dropdown,
    .sofa-catalog .menu_top_block > ul.menu.dropdown > li.has-child:hover > ul.dropdown {
        transition: none;
        transform: none;
    }
}

/* Плитки подкатегорий над товарами (.section_block из исходного каталога). */
.sofa-catalog .section_block {
    margin-bottom: 24px;
}

.sofa-catalog .sections_wrapper .item {
    border: 1px solid #ededed;
    text-align: center;
    padding: 14px 8px;
    transition: border-color .15s;
}

.sofa-catalog .sections_wrapper .item:hover,
.sofa-catalog .sections_wrapper .item.active {
    border-color: var(--brand-accent);
}

.sofa-catalog .sections_wrapper .item .name a {
    font-weight: 600;
    color: #222;
}

.sofa-catalog .sections_wrapper .item .name .count {
    color: #8a93a6;
    font-weight: 400;
}

/*
 * Деталка товара (D-0051): переписана на реальные классы исходной темы
 * (.item_main_info/.right_info/.tabs_section — тот же bootstrap.css/
 * template_styles.css, что уже подключён), своя раскладка сюда больше не
 * нужна — сняты `.sofa-detail-columns`/`.sofa-detail-tabs`.
 */
