/* HomeMag Фильтры */
.hmf { color: var(--hmf-text); font-size: var(--hmf-fs); line-height: 1.35; }
.hmf *, .hmf *::before, .hmf *::after { box-sizing: border-box; }
.hmf a { text-decoration: none !important; box-shadow: none !important; }
.hmf .hmf-title { margin: 0 0 14px; font-size: calc(var(--hmf-ts) + 2px); font-weight: 600; text-transform: uppercase; letter-spacing: .3px; }

/* выбранные */
.hmf-active { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 var(--hmf-gap); padding: 0 0 14px; border-bottom: 1px solid var(--hmf-border); }
.hmf-chip { display: inline-flex; align-items: center; gap: 6px; padding: 5px 8px 5px 11px; border-radius: 99px; background: var(--hmf-accent); color: var(--hmf-accent-text) !important; font-size: 13px; font-weight: 600; }
.hmf-chip i { font-style: normal; font-size: 16px; line-height: 1; opacity: .85; }
.hmf-chip:hover i { opacity: 1; }
.hmf-reset { align-self: center; margin-left: 4px; color: var(--hmf-muted) !important; font-size: 13px; border-bottom: 1px dashed currentColor; }
.hmf-reset:hover { color: var(--hmf-accent) !important; }

/* группы */
.hmf-group { margin: 0 0 var(--hmf-gap); }
.hmf .hmf-gh { all: unset; box-sizing: border-box; display: flex; width: 100%; align-items: center; justify-content: space-between; gap: 8px; margin: 0 0 10px; cursor: pointer; font-size: var(--hmf-ts); font-weight: 500; text-transform: uppercase; letter-spacing: .3px; color: var(--hmf-text); }
.hmf div.hmf-gh { cursor: default; }
.hmf-caret { width: 8px; height: 8px; margin-right: 3px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg); transition: transform .2s; opacity: .6; }
.hmf-group.is-closed .hmf-caret { transform: rotate(-45deg); }
.hmf-group.is-closed .hmf-gb { display: none; }

/* подкатегории */
.hmf-cats { margin: 0; padding: 0; list-style: none; }
.hmf-cats li { margin: 0; padding: 0; list-style: none; }
.hmf-cats a { display: flex; justify-content: space-between; gap: 8px; padding: 6px 0; color: var(--hmf-text) !important; }
.hmf-cats a:hover, .hmf-cats a.is-on { color: var(--hmf-accent) !important; }
.hmf-cats a.is-on { font-weight: 700; }

.hmf-n { color: var(--hmf-muted); font-size: .86em; font-weight: 400; }

/* значения */
.hmf-opts { display: flex; flex-wrap: wrap; gap: 6px; }
.hmf-opt { display: inline-flex; align-items: center; gap: 7px; color: var(--hmf-text) !important; transition: border-color .15s, background .15s, color .15s; }
.hmf-opt.is-more { display: none; }
.hmf-group.is-expanded .hmf-opt.is-more { display: inline-flex; }
.hmf-opt.is-zero { opacity: .45; }

/* кнопки */
.hmf-chips .hmf-opt { padding: 6px 11px; border: 1px solid var(--hmf-border); border-radius: var(--hmf-r); background: var(--hmf-bg); }
.hmf-chips .hmf-opt:hover { border-color: var(--hmf-accent); }
.hmf-chips .hmf-opt.is-on { border-color: var(--hmf-accent); background: var(--hmf-accent); color: var(--hmf-accent-text) !important; }
.hmf-chips .hmf-opt.is-on .hmf-n { color: inherit; opacity: .8; }

/* кружки с подписью */
.hmf-swatches { gap: 5px; }
.hmf-swatches .hmf-opt { padding: 3px 9px 3px 3px; font-size: .93em; border: 1px solid var(--hmf-border); border-radius: 99px; background: var(--hmf-bg); }
.hmf-swatches .hmf-opt:hover { border-color: var(--hmf-accent); }
.hmf-swatches .hmf-opt.is-on { border-color: var(--hmf-accent); box-shadow: inset 0 0 0 1px var(--hmf-accent) !important; font-weight: 600; }
.hmf-sw { flex: none; width: 20px; height: 20px; border-radius: 50%; background-size: cover; background-position: center; box-shadow: inset 0 0 0 1px rgba(0,0,0,.12); }
.hmf-sw.is-light { box-shadow: inset 0 0 0 1px rgba(0,0,0,.25); }
.hmf-sw.is-multi { background: conic-gradient(#ff3b3b, #ffd23b, #3bff6a, #3bd5ff, #5a3bff, #ff3bd2, #ff3b3b); }
.hmf-sw.is-none { background: repeating-linear-gradient(45deg, #eee 0 4px, #fff 4px 8px); }

/* только кружки */
.hmf-dots { gap: 8px; }
.hmf-dots .hmf-opt { padding: 3px; border: 2px solid transparent; border-radius: 50%; }
.hmf-dots .hmf-sw { width: 28px; height: 28px; }
.hmf-dots .hmf-opt:hover { border-color: var(--hmf-border); }
.hmf-dots .hmf-opt.is-on { border-color: var(--hmf-accent); }

/* список с галочками */
.hmf-list { flex-direction: column; gap: 0; }
.hmf-list .hmf-opt { display: flex; padding: 5px 0; }
.hmf-list .hmf-opt.is-more { display: none; }
.hmf-group.is-expanded .hmf-list .hmf-opt.is-more { display: flex; }
.hmf-list .hmf-l { flex: 1; }
.hmf-box { flex: none; width: 18px; height: 18px; border: 1.5px solid var(--hmf-border); border-radius: 4px; background: var(--hmf-bg); position: relative; transition: background .15s, border-color .15s; }
.hmf-list .hmf-opt:hover .hmf-box { border-color: var(--hmf-accent); }
.hmf-list .hmf-opt.is-on .hmf-box { background: var(--hmf-accent); border-color: var(--hmf-accent); }
.hmf-list .hmf-opt.is-on .hmf-box::after { content: ""; position: absolute; left: 5px; top: 1px; width: 5px; height: 10px; border: solid var(--hmf-accent-text); border-width: 0 2px 2px 0; transform: rotate(45deg); }

.hmf .hmf-more { all: unset; margin-top: 8px; cursor: pointer; font-size: 13px; color: var(--hmf-accent); border-bottom: 1px dashed currentColor; }

/* цена */
.hmf-range { position: relative; height: 24px; margin: 4px 9px 10px; }
.hmf-range::before, .hmf-range::after { content: ""; position: absolute; top: 10px; height: 4px; border-radius: 2px; }
.hmf-range::before { left: 0; right: 0; background: var(--hmf-border); }
.hmf-range::after { left: var(--a); right: calc(100% - var(--b)); background: var(--hmf-accent); }
.hmf-range input[type=range] { position: absolute; left: -9px; right: -9px; top: 0; width: calc(100% + 18px); height: 24px; margin: 0; padding: 0; background: none; pointer-events: none; -webkit-appearance: none; appearance: none; z-index: 2; border: 0; }
.hmf-range input[type=range]::-webkit-slider-thumb { -webkit-appearance: none; pointer-events: auto; width: 18px; height: 18px; border-radius: 50%; background: var(--hmf-bg); border: 3px solid var(--hmf-accent); cursor: pointer; }
.hmf-range input[type=range]::-moz-range-thumb { pointer-events: auto; width: 14px; height: 14px; border-radius: 50%; background: var(--hmf-bg); border: 3px solid var(--hmf-accent); cursor: pointer; }
.hmf-range input[type=range]::-webkit-slider-runnable-track { background: none; }
.hmf-range input[type=range]::-moz-range-track { background: none; }
.hmf-pin { display: flex; gap: 6px; align-items: center; }
.hmf-pin label { flex: 1; display: flex; align-items: center; gap: 5px; margin: 0; font-size: 12px; color: var(--hmf-muted); }
.hmf .hmf-pin input { width: 100%; min-width: 0; height: 34px; margin: 0; padding: 0 8px; border: 1px solid var(--hmf-border); border-radius: var(--hmf-r); background: var(--hmf-bg); color: var(--hmf-text); font-size: 14px; box-shadow: none; -moz-appearance: textfield; }
.hmf .hmf-pin input::-webkit-outer-spin-button, .hmf .hmf-pin input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.hmf .hmf-apply { flex: none; height: 34px; padding: 0 12px; margin: 0; border: 0; border-radius: var(--hmf-r); background: var(--hmf-accent); color: var(--hmf-accent-text); font-weight: 700; cursor: pointer; line-height: 34px; }

/* телефон: кнопка и шторка */
.hmf-open { display: none; align-items: center; gap: 8px; margin: 0 0 14px; padding: 9px 16px; border: 1px solid var(--hmf-border); border-radius: var(--hmf-r); background: var(--hmf-bg); color: var(--hmf-text); font-size: 15px; font-weight: 600; cursor: pointer; }
.hmf-open b { display: inline-flex; min-width: 20px; height: 20px; padding: 0 6px; align-items: center; justify-content: center; border-radius: 99px; background: var(--hmf-accent); color: var(--hmf-accent-text); font-size: 12px; }
.hmf-mhead, .hmf-mfoot { display: none; }
.hmf.is-drawer { display: block; position: fixed; z-index: 100000; top: 0; bottom: 0; left: 0; width: min(92vw, 420px); overflow-y: auto; padding: 0 16px 90px; background: var(--hmf-bg); box-shadow: 0 0 40px rgba(0,0,0,.3); animation: hmf-in .2s ease-out; }
.hmf.is-drawer .hmf-mhead { display: flex; position: sticky; top: 0; z-index: 3; align-items: center; justify-content: space-between; margin: 0 -16px 16px; padding: 14px 16px; background: var(--hmf-bg); border-bottom: 1px solid var(--hmf-border); font-size: 18px; font-weight: 600; text-transform: uppercase; }
.hmf .hmf-close { all: unset; cursor: pointer; font-size: 28px; line-height: 1; padding: 0 4px; color: var(--hmf-text); }
.hmf.is-drawer .hmf-mfoot { display: block; position: fixed; bottom: 0; left: 0; width: min(92vw, 420px); padding: 12px 16px; background: var(--hmf-bg); border-top: 1px solid var(--hmf-border); }
.hmf .hmf-show { width: 100%; height: 46px; border: 0; border-radius: var(--hmf-r); background: var(--hmf-accent); color: var(--hmf-accent-text); font-size: 16px; font-weight: 700; cursor: pointer; }
.hmf-overlay { position: fixed; inset: 0; z-index: 99999; background: rgba(0,0,0,.45); }
body.hmf-lock { overflow: hidden; }
@keyframes hmf-in { from { transform: translateX(-30px); opacity: 0; } to { transform: none; opacity: 1; } }