/* Start:/local/templates/shop/components/bitrix/catalog.smart.filter/.default/style.css?179269644510873*/
/* Фильтры каталога — обновление 22.10.2026 (template.php, script.js) */

/* «Распродажа» — только быстрой кнопкой «Со скидкой», своего списка в ряду нет */
.Catalog-row_filterModal .selectList_filter[data-code="SALE"] { display: none !important; }

/* быстрые кнопки над фильтрами */
.Filter-quick { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0 0 14px; }
.Filter-quickBtn { height: 36px; padding: 0 16px; border: 1px solid #e2e2de; border-radius: 18px; background: transparent; color: #212121; font: inherit; font-size: 14px; line-height: 1; cursor: pointer; white-space: nowrap;
                   transition: background .2s ease, border-color .2s ease, color .2s ease; }
.Filter-quickBtn:hover { border-color: #212121; }
.Filter-quickBtn:focus-visible { outline: 2px solid #212121; outline-offset: 2px; }
.Filter-quickBtn.is-active { background: #212121; border-color: #212121; color: #fff; }
.Filter-quickBtn[hidden], .Filter-quickSep[hidden] { display: none; }
.Filter-quickSep { width: 1px; height: 20px; margin: 0 4px; background: #e2e2de; }

/* кнопки фильтров: по ширине текста, с выбором — тёмные и с подписью «Бренд: Rolex» */
@media (min-width: 1025px) {
    .Catalog-filter .Catalog-row_filterModal { display: flex !important; flex-wrap: wrap; gap: 8px !important; }
    .Catalog-filter .Catalog-row_filterModal > .selectList_filter { flex: 0 0 auto !important; width: auto !important; min-width: 0 !important; max-width: none !important; }
    .Catalog-filter .selectList_filter > .selectList-header { gap: 10px; min-width: 0; height: 48px; padding: 0 16px 0 20px; border-radius: 24px; background: #fff; transition: background .2s ease, color .2s ease; }
    .Catalog-filter .selectList_filter .selectList-title { white-space: nowrap; font-size: 15px; }
    .Catalog-filter .Filter-active > .selectList-header { background: #212121; color: #fff; }
    .Catalog-filter .Filter-active > .selectList-header .selectList-icon svg path { stroke: #fff; }
    .Catalog-filter .Filter-sum { display: inline-block; max-width: 180px; overflow: hidden; text-overflow: ellipsis; vertical-align: bottom; font-weight: 600; }

    /* выпадающий список: аккуратная карточка */
    .Catalog-filter .selectList_filter .selectList-dropdown { min-width: 280px; border-radius: 20px; box-shadow: 0 18px 50px rgba(0, 0, 0, .12); }
    /* окно открывается от левого края своей кнопки (было по центру — широкое окно брендов уезжало на поля) */
    .Catalog-filter .selectList_filter .selectList-dropdown { left: 0 !important; right: auto !important; transform: none !important; margin-left: 0 !important; }
    .Catalog-filter .Filter-brands .selectList-dropdown { width: 560px; max-width: calc(100vw - 40px); }
    .Catalog-filter .Filter-brands.selectList_OPEN .selectList-dropdown { height: auto !important; max-height: 480px !important; }   /* только открытый: закрытый прячется нулевой высотой */
    .Catalog-filter .Filter-brands .selectList-dropdownIns { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 36px; background: linear-gradient(#ececea, #ececea) 50% 0 / 1px 100% no-repeat; align-content: start; max-height: 480px; }
    /* строка бренда — сеткой: квадратик · название · число; поле-галочка не занимает места (было: название обрезалось, колонки «съезжали») */
    .Catalog-filter .Filter-brands .selectList-item { position: relative; display: grid !important; grid-template-columns: 24px minmax(0, 1fr) auto; align-items: center; column-gap: 10px; min-width: 0; width: auto; padding: 6px 0; }
    .Catalog-filter .Filter-brands .selectList-item .toggle-check { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: pointer; }
    .Catalog-filter .Filter-brands .selectList-text { display: block; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    .Catalog-filter .Filter-brands .Filter-count { padding-left: 0; margin: 0; }
    .Catalog-filter .Filter-brands .Filter-search, .Catalog-filter .Filter-brands .Filter-group, .Catalog-filter .Filter-brands .Filter-empty { grid-column: 1 / -1; }

    /* сортировка — тихой кнопкой справа */
    .Catalog-filter .Catalog-unit_modal { flex: 1 1 auto !important; min-width: 0; max-width: none !important; }   /* фильтры берут остаток ряда, сортировка — свою ширину */
    .Catalog-filter .Catalog-unit_sort { margin-left: auto; flex: 0 0 auto !important; width: auto !important; max-width: none !important; }   /* по ширине текста, не вылезает за правый край */
    .Catalog-filter .Catalog-unit_sort .selectList_sort { flex: 0 0 auto !important; width: auto !important; }
    .Catalog-filter .selectList_sort > .selectList-header { padding-right: 0 !important; }
    .Catalog-filter .selectList_sort .selectList-dropdown { left: auto !important; right: 0 !important; }
    .Catalog-filter .selectList_sort > .selectList-header { background: transparent; padding-left: 8px; padding-right: 8px; }
    .Catalog-filter .selectList_sort .selectList-title::before { content: "Сортировка: "; color: #9a9a96; margin-right: 4px; white-space: nowrap; }
    .Catalog-filter .selectList_sort .selectList-title { display: flex; align-items: center; font-size: 15px; white-space: nowrap; }
}

/* поиск по брендам, группы, количество */
.Filter-search { padding: 0 0 10px; background: #fff; }   /* без «прилипания»: при прокрутке сквозь него просвечивал список */
.Filter-searchInput { background-color: #f7f7f5 !important; }
.Filter-searchInput:focus { background-color: #fff !important; }
.Filter-searchInput { width: 100%; height: 42px; padding: 0 14px 0 40px; border: 1px solid #e2e2de; border-radius: 21px; background: #f7f7f5 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%239a9a96' stroke-width='1.8' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='M20 20l-4-4'/%3E%3C/svg%3E") 14px 50% no-repeat;
                      font: inherit; font-size: 15px; color: #212121; outline: none; -webkit-appearance: none; appearance: none; }
.Filter-searchInput:focus { border-color: #212121; background-color: #fff; }
.Filter-searchInput::-webkit-search-cancel-button { cursor: pointer; }
.Catalog-filter .selectList-item.is-hidden { display: none !important; }
.Filter-group { position: relative; z-index: 1; background: #fff; padding: 4px 0; margin: 6px 0 0; font-size: 11px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: #9a9a96; }
.Filter-empty { padding: 12px 0; font-size: 14px; color: #6b7280; }
.Filter-empty a { color: #212121; text-decoration: underline; text-underline-offset: 3px; }
.Catalog-filter .selectList-item { align-items: center; }
.Filter-count { margin-left: auto; padding-left: 10px; font-size: 13px; color: #9a9a96; font-variant-numeric: tabular-nums; }
.Catalog-filter .toggle_disabled .Filter-count { opacity: .5; }

/* выбранное — метками с крестиком */
.Catalog-filter .Catalog-filterControl { margin: 20px 0 -10px; }   /* ровно: кнопки → метки 20 px, метки → товары 20 px */
.Catalog-filter .Catalog-filterAnimControl { margin: 0 !important; padding: 0 !important; }
.Catalog-filter .Catalog-filterClear::after, .Catalog-filter .Catalog-filterClear::before { display: none !important; }   /* лишний белый крестик у «Сбросить всё» */
.Catalog-filter .Catalog-filterAnimControl { display: flex; flex-wrap: wrap; gap: 8px; }
.Catalog-filter .Catalog-filterElement { min-width: 0; min-height: 34px; padding: 0 12px 0 14px; gap: 8px; border: 0; background: #fff; font-size: 14px; cursor: pointer; }
.Catalog-filter .Catalog-filterElement::after { content: "×"; font-size: 18px; line-height: 1; color: #9a9a96; transition: color .2s ease; }
.Catalog-filter .Catalog-filterElement:hover::after { color: #212121; }
.Catalog-filter .Catalog-filterNum { display: none; }
.Catalog-filter .Catalog-filterClear { min-height: 34px; padding: 0 14px; background: transparent; color: #212121; font-size: 14px; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }

/* телефон и планшет: полноэкранные фильтры — разделы гармошкой, внизу «Показать модели» */
@media (max-width: 1024px) {
    /* строка прокручивается вбок и НЕ влияет на ширину страницы (на странице бренда сетка растягивалась до её полной длины — 22.10.2026) */
    .Filter-quick { contain: inline-size; min-width: 0; flex-wrap: nowrap; overflow-x: auto; margin: 0 calc(var(--pdWrap, 16px) * -1) 12px; padding: 0 var(--pdWrap, 16px); scrollbar-width: none; }
    .Filter-quick::-webkit-scrollbar { display: none; }
    .Filter-quickBtn { flex-shrink: 0; height: 34px; font-size: 13px; }
    #filter .Catalog-row_filterModal { row-gap: 0 !important; }
    #filter .selectList_filter { border-bottom: 1px solid #e2e2de; }
    #filter .selectList_filter > .selectList-header { margin: 0 !important; }
    #filter .selectList_filter .selectList-icon { display: flex !important; }
    #filter .selectList_filter > .selectList-header { display: flex; align-items: center; justify-content: space-between; min-height: 56px; cursor: pointer; }
    #filter .selectList_filter .selectList-icon { transition: rotate .25s ease; }
    #filter .selectList_filter.Filter-expanded .selectList-icon { rotate: 180deg; }
    #filter .Filter-sum { font-weight: 500; color: #6b7280; }
    #filter .selectList_filter > .selectList-dropdown { display: none !important; }
    #filter .selectList_filter.Filter-expanded > .selectList-dropdown { display: block !important; padding-bottom: 14px; }
    #filter .Catalog-footer_mobile { position: sticky; bottom: 0; z-index: 2; padding: 12px 0 calc(12px + env(safe-area-inset-bottom)); background: #f4f4f4; opacity: 1 !important; }
}
@media (prefers-reduced-motion: reduce) { #filter .selectList_filter .selectList-icon, .Filter-quickBtn { transition: none; } }
@media (max-width: 1024px) { .Middle-grid { grid-template-columns: minmax(0, 1fr); } }

/* End */
/* /local/templates/shop/components/bitrix/catalog.smart.filter/.default/style.css?179269644510873 */