/* === BBC Shop - фильтры LABORATORI HUR (подбор ухода) === */

.shop-section--filters { display: grid; grid-template-columns: 290px minmax(0, 1fr); gap: 48px; align-items: start; }
.shop-listing { min-width: 0; }

/* Панель */
.shop-filters { position: sticky; top: calc(var(--shop-head-h, 0px) + 16px); max-height: calc(100vh - var(--shop-head-h, 0px) - 32px); /* под закреплённой шапкой */ overflow-y: auto; scrollbar-width: thin; padding-right: 6px; }
.shop-filters__form { margin: 0; }
.shop-filters__head { display: flex; align-items: center; gap: 12px; padding: 0 0 16px; border-bottom: 1px solid var(--shop-text); margin-bottom: 8px; }
.shop-filters__title { font-family: var(--shop-font-head); font-size: 15px; letter-spacing: 0.18em; text-transform: uppercase; font-weight: 400; flex: 1; }
.shop-filters__reset { font-size: 11px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--shop-muted) !important; border-bottom: 1px solid var(--shop-border); }
.shop-filters__reset:hover { color: var(--shop-accent) !important; border-bottom-color: var(--shop-accent); }
.shop-filters__close { display: none; }

/* Группа */
.shop-fgroup { border: 0; margin: 0; padding: 0 0 14px; border-bottom: 1px solid var(--shop-line); min-width: 0; }
.shop-fgroup__legend { display: grid; grid-template-columns: auto 1fr; column-gap: 10px; padding: 18px 0 0; margin-bottom: 8px; width: 100%; } /* у fieldset padding-top уходит ПОД legend - отступ сверху держим в legend */
.shop-fgroup__num { font-family: var(--shop-font-head); font-size: 12px; color: var(--shop-accent); letter-spacing: 0.08em; padding-top: 1px; grid-row: span 2; }
.shop-fgroup__name { font-family: var(--shop-font-head); font-size: 13px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--shop-text); }
.shop-fgroup__hint { font-size: 12px; color: var(--shop-muted); margin-top: 2px; }
.shop-fgroup__off { font-size: 12px; color: var(--shop-muted); font-style: italic; margin: 0 0 6px; }

.shop-fsub + .shop-fsub { margin-top: 14px; }
.shop-fsub__title { font-size: 12px; color: var(--shop-text); margin-bottom: 6px; font-weight: 500; }
.shop-fsub__title small { display: block; color: var(--shop-muted); font-weight: 400; font-size: 11px; }

/* Вариант */
.shop-fopt { display: grid; grid-template-columns: 16px minmax(0, 1fr) auto; column-gap: 10px; align-items: start; padding: 6px 0; cursor: pointer; font-size: 13px; line-height: 1.35; color: var(--shop-text); transition: color .2s var(--shop-ease); }
.shop-fopt:hover { color: var(--shop-accent); }
.shop-fopt input { position: absolute; opacity: 0; width: 1px; height: 1px; pointer-events: none; }
.shop-fopt__mark { width: 16px; height: 16px; border: 1px solid #b9b2a3; background: var(--shop-surface); margin-top: 1px; position: relative; transition: border-color .2s, background .2s; }
.shop-fopt input[type=radio] + .shop-fopt__mark { border-radius: 50%; }
.shop-fopt input:checked + .shop-fopt__mark { border-color: var(--shop-accent); background: var(--shop-accent); }
.shop-fopt input[type=checkbox]:checked + .shop-fopt__mark::after { content: ''; position: absolute; left: 4px; top: 1px; width: 5px; height: 9px; border: solid #fff; border-width: 0 1.5px 1.5px 0; transform: rotate(45deg); }
.shop-fopt input[type=radio]:checked + .shop-fopt__mark::after { content: ''; position: absolute; inset: 4px; border-radius: 50%; background: #fff; }
.shop-fopt input:focus-visible + .shop-fopt__mark { outline: 2px solid var(--shop-accent-soft); outline-offset: 2px; }
.shop-fopt__text { display: flex; flex-direction: column; min-width: 0; }
.shop-fopt__sub { font-size: 11px; color: var(--shop-muted); margin-top: 1px; }
.shop-fopt__cnt { font-size: 11px; color: var(--shop-muted); padding-top: 2px; font-variant-numeric: tabular-nums; }
.shop-fopt--any .shop-fopt__name { color: var(--shop-muted); }
.shop-fopt.is-empty { cursor: default; opacity: 0.4; }
.shop-fopt.is-empty:hover { color: var(--shop-text); }
.shop-fopt input:disabled:checked + .shop-fopt__mark { opacity: 0.6; }

/* Разделы типа продукта */
.shop-fsec__row { display: grid; grid-template-columns: minmax(0, 1fr) 28px; align-items: center; }
.shop-fopt--section .shop-fopt__name { font-weight: 500; }
.shop-fsec__toggle { background: none; border: 0; padding: 4px; cursor: pointer; color: var(--shop-muted); display: flex; justify-content: center; transition: transform .25s var(--shop-ease), color .2s; }
.shop-fsec__toggle:hover { color: var(--shop-accent); }
.shop-fsec.is-open .shop-fsec__toggle { transform: rotate(180deg); }
.shop-fsec__items { display: none; padding: 0 0 6px 26px; }
.shop-fsec.is-open .shop-fsec__items { display: block; }

.shop-filters__foot { padding: 18px 0 4px; }
.shop-filters__submit { width: 100%; justify-content: center; }
.shop-filters__form.is-auto .shop-filters__foot { display: none; }

/* Кнопка «Фильтры» и подложка - только на мобильных */
.shop-filters-open { display: none; }
.shop-filters-backdrop { display: none; }

/* Выбранные фильтры */
.shop-fchips { display: flex; flex-wrap: wrap; gap: 8px; margin: -20px 0 32px; }
.shop-fchip { display: inline-flex; align-items: center; gap: 8px; padding: 6px 12px; border: 1px solid var(--shop-border); background: var(--shop-surface); font-size: 12px; letter-spacing: 0.02em; color: var(--shop-text) !important; }
.shop-fchip span { color: var(--shop-muted); font-size: 15px; line-height: 1; }
.shop-fchip:hover { border-color: var(--shop-accent); color: var(--shop-accent) !important; }
.shop-fchip--reset { border-color: transparent; background: none; color: var(--shop-muted) !important; text-decoration: underline; text-underline-offset: 3px; }

/* Карточка товара: тексты HUR */
.shop-product__short .hur-promise { font-family: var(--shop-font-head); font-size: 15px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--shop-text); margin: 0 0 4px; }
.shop-product__short .hur-keys { font-size: 14px; color: var(--shop-accent-dk); font-style: italic; margin: 0 0 14px; }
.shop-product__short .hur-points { margin: 0 0 12px; }
.shop-product__short .hur-outro { color: var(--shop-muted); margin: 0; }
.shop-specs__flt a { color: var(--shop-text); border-bottom: 1px solid var(--shop-border); }
.shop-specs__flt a:hover { color: var(--shop-accent); border-bottom-color: var(--shop-accent); }

/* Главная магазина: быстрый подбор (выпадающие фильтры как на маркетплейсах) */
.shop-qbar { background: var(--shop-surface); border: 1px solid var(--shop-line); padding: 28px 32px 30px; margin: 0 0 56px; box-shadow: var(--shop-shadow-sm); }
.shop-qbar__head { display: flex; align-items: baseline; gap: 18px; flex-wrap: wrap; margin-bottom: 18px; }
.shop-qbar__title { font-family: var(--shop-font-head); font-size: 22px; font-weight: 400; letter-spacing: 0.14em; text-transform: uppercase; margin: 0; }
.shop-qbar__intro { margin: 0; color: var(--shop-muted); font-size: 13px; }
.shop-qbar__form { display: flex; flex-wrap: wrap; gap: 10px; align-items: stretch; }
.shop-qbar__item { position: relative; }
.shop-qbar__btn { height: 48px; display: inline-flex; align-items: center; gap: 10px; padding: 0 16px; border: 1px solid var(--shop-border); background: var(--shop-bg); border-radius: var(--shop-radius-md); font-family: inherit; font-size: 13px; color: var(--shop-text); cursor: pointer; transition: border-color .2s, background .2s, box-shadow .2s; }
.shop-qbar__btn:hover { border-color: var(--shop-accent-soft); }
.shop-qbar__item.is-open .shop-qbar__btn, .shop-qbar__item.is-active .shop-qbar__btn { border-color: var(--shop-accent); background: var(--shop-surface); }
.shop-qbar__item.is-open .shop-qbar__btn { box-shadow: 0 0 0 3px rgba(160, 124, 44, 0.12); }
.shop-qbar__item.is-off .shop-qbar__btn { opacity: 0.45; cursor: not-allowed; }
.shop-qbar__num { font-family: var(--shop-font-head); color: var(--shop-accent); font-size: 12px; }
.shop-qbar__cnt { min-width: 20px; height: 20px; padding: 0 6px; border-radius: 10px; background: var(--shop-accent); color: #fff; font-size: 11px; line-height: 20px; text-align: center; }
.shop-qbar__chev { color: var(--shop-muted); transition: transform .2s; }
.shop-qbar__item.is-open .shop-qbar__chev { transform: rotate(180deg); }
.shop-qbar__pop { position: absolute; top: calc(100% + 8px); left: 0; z-index: 50; min-width: 320px; max-width: 560px; background: var(--shop-surface); border: 1px solid var(--shop-line); border-radius: var(--shop-radius-md); box-shadow: var(--shop-shadow-lg); padding: 16px 18px 12px; }
.shop-qbar__sub { font-size: 12px; color: var(--shop-muted); margin: 4px 0 6px; }
.shop-qbar__opts { display: grid; grid-template-columns: repeat(2, minmax(150px, 1fr)); column-gap: 18px; margin-bottom: 8px; }
.shop-qbar__opt { grid-template-columns: 16px 1fr; }
.shop-qbar__pop-foot { display: flex; justify-content: space-between; align-items: center; border-top: 1px solid var(--shop-line); padding-top: 12px; margin-top: 4px; }
.shop-qbar__clear { background: none; border: 0; padding: 0; color: var(--shop-muted); font-family: inherit; font-size: 12px; cursor: pointer; text-decoration: underline; text-underline-offset: 3px; }
.shop-qbar__clear:hover { color: var(--shop-accent); }
.shop-qbar__done { height: 36px; padding: 0 18px; }
.shop-qbar__submit { height: 48px; margin-left: auto; padding: 0 28px; background: var(--shop-accent); border-color: var(--shop-accent); color: #fff; white-space: nowrap; transition: opacity .2s, background .2s; }
.shop-qbar__submit:hover { background: var(--shop-accent-dk); border-color: var(--shop-accent-dk); color: #fff; }
.shop-qbar__submit.is-loading { opacity: 0.7; }
.shop-qbar__submit:disabled { opacity: 0.5; cursor: not-allowed; }

@media (max-width: 1100px) {
    .shop-section--filters { grid-template-columns: 250px minmax(0, 1fr); gap: 32px; }
}

/* Маркер пунктов HUR (общий стиль магазина гасит li::before - перебиваем специфичностью) */
.shop-main .shop-product__short .hur-points li { padding-left: 18px; }
.shop-main .shop-product__short .hur-points li::before { content: '' !important; display: block !important; position: absolute; left: 0; top: 0.7em; width: 8px; height: 1px; background: var(--shop-accent); }

/* Подгрузка без перезагрузки */
.shop-listing { transition: opacity .2s var(--shop-ease); }
.shop-listing.is-loading { opacity: 0.45; pointer-events: none; }
.shop-filters__submit.is-loading { opacity: 0.7; }