/* ============================================================================
   v3 · МАГАЗИНЫ (Figma 24:2). Разметка — views/shopfirst.js → shopsViewV3().
   Тёмная шапка вкладки (общая с каталогом, 20-catalog.css) + чипы + карточки:
   полоса из 3 фото, монограмма, имя, подпись, «● Открыто 9–20 · 0,4 км · ~40 мин», плашки.
   ========================================================================== */

html.dv3 [data-view="shops"].v3-shops{ background:var(--bg); min-height:100vh; padding-bottom:calc(84px + env(safe-area-inset-bottom)); }
html.dv3 .v3-thead-sub{
  display:inline-flex; align-items:center; gap:2px; margin:2px 16px 0; padding:0; border:0; background:none;
  color:var(--on-head-2); font:inherit; font-size:12px; cursor:pointer; max-width:calc(100% - 32px);
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
html.dv3 .v3-thead-sub .v3-i{ width:12px; height:12px; }
html.dv3 .v3-shops .v3-shops-search{ cursor:text; }

html.dv3 .v3-shops .js-chips{ margin:0; padding:14px 16px 2px; }
html.dv3 .v3-shops .js-chips[hidden]{ display:none; }
html.dv3 .v3-shops .v3-chip.is-on{ background:var(--head); color:var(--on-head); border-color:var(--head); }
html.dv3 .v3-shops-cnt{ padding:12px 16px 8px; font-size:13px; color:var(--muted); }
html.dv3 .v3-shops-cnt:empty{ padding:6px 0 0; }
html.dv3 .v3-shops-list{ display:flex; flex-direction:column; gap:12px; padding:0 12px 16px; }
html.dv3 .v3-shops-empty{ color:var(--muted); font-size:14px; line-height:1.4; }

html.dv3 .v3-shopc{
  display:flex; flex-direction:column; width:100%; padding:0; border:0; overflow:hidden;
  background:var(--paper); border-radius:var(--v3-r-card); color:var(--ink);
  font:inherit; text-align:left; cursor:pointer;
}
html.dv3 .v3-shopc:active{ opacity:.85; }
html.dv3 .v3-shopc:focus-visible{ outline:2px solid var(--green); outline-offset:2px; }
html.dv3 .v3-shopc-strip{ display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:2px; height:110px; background:var(--paper); }
html.dv3 .v3-shopc-strip .v3-photo{ border-radius:0; height:110px; }
html.dv3 .v3-shopc-strip .v3-photo img{ object-fit:contain; padding:12px; box-sizing:border-box; }
/* одно фото (только плитка магазина) — во всю ширину */
html.dv3 .v3-shopc-strip:has(> :only-child){ grid-template-columns:1fr; }
html.dv3 .v3-shopc-strip:has(> :only-child) img{ object-fit:cover; padding:0; mix-blend-mode:normal; }
html.dv3 .v3-shopc-strip:empty{ display:none; }

html.dv3 .v3-shopc-body{ display:flex; flex-direction:column; gap:8px; padding:14px 14px 14px; }
html.dv3 .v3-shopc-top{ display:flex; align-items:center; gap:12px; }
html.dv3 .v3-shopc-t{ flex:1; min-width:0; display:flex; flex-direction:column; gap:2px; }
html.dv3 .v3-shopc-t b{ font-size:17px; font-weight:700; line-height:1.2; }
html.dv3 .v3-shopc-t span{ font-size:13px; color:var(--muted); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
html.dv3 .v3-shopc-chev{ width:20px; height:20px; color:var(--v3-sub); }
html.dv3 .v3-shopc-meta{ display:flex; align-items:center; gap:6px; flex-wrap:wrap; font-size:13px; color:var(--muted); }
html.dv3 .v3-shopc-meta .v3-dot{ color:var(--green); }
html.dv3 .v3-shopc-meta b{ font-weight:600; }
html.dv3 .v3-shopc-meta b.is-open{ color:var(--green); }
html.dv3 .v3-shopc-meta b.is-closed{ color:var(--red); }
html.dv3 .v3-shopc.is-closed .v3-shopc-meta .v3-dot{ color:var(--red); }
html.dv3 .v3-shopc-pills{ display:flex; flex-wrap:wrap; gap:6px; }
html.dv3 .v3-shopc-pills:not(:has(*)){ display:none; }
html.dv3 .v3-shopc-pills .v3-pill{ font-size:11px; }
html.dv3 .v3-shopc-pills .v3-pill .v3-i{ width:12px; height:12px; }

/* Закрытый — приглушённо: фото и имя тише, но карточка кликабельна (заказ к открытию) */
html.dv3 .v3-shopc.is-closed .v3-shopc-strip,
html.dv3 .v3-shopc.is-closed .v3-shopc-top{ opacity:.6; }

@media (max-width:359px){
  html.dv3 .v3-shopc-strip, html.dv3 .v3-shopc-strip .v3-photo{ height:92px; }
}
@media (min-width:1024px){
  html.dv3 .v3-shops-list{ display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); max-width:960px; }
}

/* Зона нажатия чипа-фильтра ≥ 40 при видимых 35 */
html.dv3 .v3-shops .js-chips .v3-chip{ position:relative; }
html.dv3 .v3-shops .js-chips .v3-chip::after{ content:''; position:absolute; inset:-4px -2px; }
/* Серый фон снимков («почти белый») растворяем в подложке, как на плитках каталога */
html.dv3 .v3-shopc-strip .v3-photo img{ mix-blend-mode:multiply; filter:brightness(1.06) contrast(1.06); }
html.dv3.dk .v3-shopc-strip .v3-photo img{ mix-blend-mode:normal; filter:none; }
/* Логотип на белом — тонкая рамка, иначе белый знак «висит» на белой карточке */
html.dv3 .v3-shopc-logo{ border:1px solid var(--line); box-sizing:border-box; }

/* ── 01.10 · ОДИН шаблон карточки магазина для всех: полоса фиксированной высоты, фото — fit-
   квадраты от края до края (cover, без полей, рамок, фильтров и серой подложки); 2 фото — две
   колонки, 1 (плитка бренда) — обложка на всю ширину той же высоты. Логотип — один формат. */
html.dv3 .v3-shopc-strip{ width:100%; align-self:stretch; box-sizing:border-box; height:116px; gap:2px; background:var(--paper); }
html.dv3 .v3-shopc-body{ width:100%; box-sizing:border-box; align-self:stretch; }
html.dv3 .v3-shopc-strip:has(> :nth-child(2):last-child){ grid-template-columns:repeat(2, minmax(0, 1fr)); }
html.dv3 .v3-shopc-strip .v3-photo{ position:relative; height:116px; min-width:0; border-radius:0; background:var(--v3-photo); }
html.dv3 .v3-shopc-strip .v3-photo img, html.dv3.dk .v3-shopc-strip .v3-photo img,
html.dv3 .v3-shopc-strip:has(> :only-child) img{
  position:absolute; inset:0; width:100%; height:100%; max-width:none;
  object-fit:cover; object-position:center; padding:0; border:0; border-radius:0;
  mix-blend-mode:normal; filter:none;
}
html.dv3 .v3-shopc-logo{
  position:relative; width:44px; height:44px; flex:none; border:0 !important; border-radius:12px;
  background:#fff !important; overflow:hidden;
}
html.dv3 .v3-shopc-logo::after{ content:''; position:absolute; inset:0; border-radius:inherit; box-shadow:inset 0 0 0 1px rgba(16,40,24,.09); pointer-events:none; }
html.dv3 .v3-shopc-logo img{ width:100%; height:100%; object-fit:cover; }
html.dv3 .v3-shopc{ transition:transform .2s cubic-bezier(.3,1.6,.5,1); }
html.dv3 .v3-shopc:active{ opacity:1; transform:scale(.98); }
@media (max-width:359px){ html.dv3 .v3-shopc-strip, html.dv3 .v3-shopc-strip .v3-photo{ height:96px; } }
@media (prefers-reduced-motion:reduce){ html.dv3 .v3-shopc{ transition:none; } }