/* MATUR.TOCHKA — удобство как на маркетплейсах: подсказки поиска, нижнее меню, шторка фильтров,
   «Вы смотрели», «Сообщить о поступлении», плашка «на экран телефона». Цвета только из темы. */

/* ---------- подсказки поиска ---------- */
.head .search{position:relative;overflow:visible}
.head .search input:focus-visible{outline:0}
.head .search input{border-radius:12px 0 0 12px}
.sugg{display:none;position:absolute;left:-1.5px;right:-1.5px;top:calc(100% + 6px);z-index:60;background:#fff;border:1px solid var(--border);border-radius:16px;box-shadow:0 16px 40px rgba(37,36,43,.14);padding:6px;max-height:min(70vh,560px);overflow:auto;overscroll-behavior:contain;text-align:left}
.sugg.on{display:block}
.sugg a{color:var(--graphite)}
.sg-h{display:flex;justify-content:space-between;align-items:center;padding:10px 10px 4px;font-size:12px;color:var(--text2)}
.sg-h button{font-size:12px;color:var(--theme-accent-hover)}
.sg-row,.sg-p{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:10px;min-height:44px}
.sg-row:hover,.sg-p:hover,.sugg .sel{background:var(--milk)}
.sg-row>svg.i{width:18px;height:18px;color:var(--text2);flex:0 0 18px}
.sg-t{flex:1;min-width:0;line-height:1.3}
.sg-t b{font-weight:700}
.sg-t small{display:block;font-size:12px;color:var(--text2)}
.sg-p .sg-t{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:13px}
.sg-p .sg-t small{display:none}
.sg-n{font-size:12px;color:var(--text2)}
.sg-x{width:32px;height:32px;display:grid;place-items:center;border-radius:50%;color:var(--text2)}
.sg-x:hover{background:var(--border)}
.sg-x svg.i{width:14px;height:14px}
.sg-im{width:40px;height:40px;flex:0 0 40px;border-radius:8px;overflow:hidden;background:var(--milk);display:grid;place-items:center}
.sg-im img{width:100%;height:100%;object-fit:cover}
.sg-im .ph{display:grid;place-items:center;width:100%;height:100%}
.sg-im svg.i{width:20px;height:20px;color:var(--text2)}
.sg-pr{font-size:13px;white-space:nowrap;color:var(--theme-accent-hover)}
.sg-all{display:flex;justify-content:center;align-items:center;gap:4px;margin:4px;padding:11px;border-radius:12px;background:var(--theme-accent-soft);color:var(--theme-accent-pressed)!important;font-weight:600;font-size:14px}
.sg-all svg.i{width:16px;height:16px}
.sg-pop{display:flex;flex-wrap:wrap;gap:6px;padding:4px 8px 10px}
.sg-pop a{background:var(--milk);border:1px solid var(--border);border-radius:999px;padding:7px 12px;font-size:13px;color:var(--graphite)}
.sg-pop a:hover{border-color:var(--theme-accent)}
.sg-pop.center{justify-content:center;margin-top:14px}
.sg-empty{padding:16px 12px;color:var(--text2);font-size:14px}
.sg-empty a{color:var(--theme-accent-hover);text-decoration:underline}

/* ---------- нижнее меню (только телефон) ---------- */
.bnav{display:none}
@media(max-width:899px){
 .bnav{display:grid;grid-template-columns:repeat(5,1fr);position:fixed;left:0;right:0;bottom:0;z-index:70;background:#fff;border-top:1px solid var(--border);padding:4px 4px env(safe-area-inset-bottom);box-shadow:0 -6px 20px rgba(37,36,43,.05)}
 .bnav a{position:relative;display:flex;flex-direction:column;align-items:center;gap:2px;padding:6px 2px 5px;font-size:11px;line-height:1.2;color:var(--text2);-webkit-tap-highlight-color:transparent}
 .bnav a svg.i{width:24px;height:24px}
 .bnav a.on{color:var(--theme-accent)}
 .bnav a.on svg.i{stroke-width:2.1}
 .bnav .cnt{top:2px;right:calc(50% - 22px);font-style:normal}
 .bnav .cnt:empty{display:none}
 body.has-bnav{padding-bottom:calc(62px + env(safe-area-inset-bottom))}
 body.has-bnav .toast{bottom:calc(74px + env(safe-area-inset-bottom));z-index:89}
 body.has-bnav .theme-switcher{bottom:calc(70px + env(safe-area-inset-bottom))}
 /* иконки шапки дублируются в нижнем меню — на телефоне оставляем шапке логотип, каталог и поиск */
 .head .hicons{display:none}
 .hrow1{grid-template-areas:"logo logo logo" "cat search search"!important}
 .sugg{max-height:calc(100vh - 190px)}
}
body.sheet-open,body.mega-open{overflow:hidden}

/* ---------- фильтры: на телефоне — шторка снизу ---------- */
.fsh{display:none}
.fapply{display:grid;gap:8px}
.ftog .fcnt{display:inline-grid;place-items:center;min-width:20px;height:20px;padding:0 6px;margin-left:4px;border-radius:10px;background:var(--theme-accent);color:#fff;font-size:12px}
.fbg{display:none}
#apply:disabled{opacity:.5;cursor:default}
@media(max-width:899px){
 .filters{display:block!important;position:fixed;left:0;right:0;bottom:0;z-index:96;max-height:86vh;overflow:auto;overscroll-behavior:contain;border-radius:22px 22px 0 0;padding:0 16px;transform:translateY(105%);transition:transform .25s ease;box-shadow:0 -12px 40px rgba(37,36,43,.18)}
 .filters.on{transform:none}
 .fsh{display:flex;justify-content:space-between;align-items:center;position:sticky;top:0;z-index:2;background:#fff;margin:0 -16px 6px;padding:16px 16px 10px;border-bottom:1px solid var(--border)}
 .fsh b{font-size:18px;font-family:Manrope,Inter,sans-serif}
 .fsh-x{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:var(--milk)}
 .fapply{position:sticky;bottom:0;background:#fff;margin:8px -16px 0;padding:12px 16px calc(12px + env(safe-area-inset-bottom));border-top:1px solid var(--border)}
 .fapply .btn{height:50px;border-radius:14px}
 .fbg{display:block;position:fixed;inset:0;z-index:95;background:rgba(37,36,43,.4);opacity:0;pointer-events:none;transition:opacity .2s}
 .fbg.on{opacity:1;pointer-events:auto}
}
@media(prefers-reduced-motion:reduce){.filters,.fbg{transition:none}}

/* ---------- «Сообщить о поступлении» ---------- */
.p .btn.wait{font-size:12px;line-height:1.2}
.p .btn.wait.on{background:var(--milk);color:var(--text2)}
.btn.wait svg.i{width:16px;height:16px}

/* ---------- «Вы смотрели» ---------- */
.seen .lnk{font-size:13px}
.seen .lnk:hover{color:var(--theme-accent-hover)}

/* ---------- плашка «на экран телефона» ---------- */
.inst{position:fixed;left:10px;right:10px;bottom:calc(72px + env(safe-area-inset-bottom));z-index:88;display:flex;align-items:center;gap:12px;background:#fff;border:1px solid var(--border);border-radius:18px;box-shadow:0 12px 36px rgba(37,36,43,.18);padding:12px 8px 12px 12px;animation:inst-in .3s ease}
.inst img{width:44px;height:44px;border-radius:11px;flex:0 0 44px}
.inst-t{flex:1;min-width:0;line-height:1.3}
.inst-t b{display:block;font-size:14px}
.inst-t span{font-size:12px;color:var(--text2)}
.inst .btn{flex:0 0 auto}
.inst-x{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;color:var(--text2);flex:0 0 32px}
.inst-x svg.i{width:16px;height:16px}
@keyframes inst-in{from{transform:translateY(16px);opacity:0}}
@media(prefers-reduced-motion:reduce){.inst{animation:none}}

/* ---------- цены и скидки ----------
   Не зависят от выбранной темы: цена всегда яркая, скидка — зелёная. */
:root{
 --market-price:#F91155;
 --market-price-soft:#FFF0F4;
 --market-discount:#0E9F6E;
}
.p .pr,
.pbig,
.pricepill b,
.sg-pr,
.ci-row .sum,
.ord .r>b,
.sb-p,
.prs>b{
 color:var(--market-price)!important;
}
.pricepill{background:var(--market-price-soft)!important}
.pricepill span{color:var(--text2)!important}
.chip.sale,
.discount,
.discount-badge{
 background:var(--market-discount)!important;
 color:#fff!important;
}