/* iSKV — превью страницы «Поиск по карте» (/karta/), раскладка V2: карта слева на всю высоту, справа поиск и результаты.
   Подключается после tokens.css, preview.css, home.css, glass.css. v1.0+ (2026-10-30). */

/* ---------- Десктоп: страница = высота окна, прокручивается только правая панель ---------- */
.map-page { --hdr: 132px; }
.map-layout { display: grid; grid-template-columns: minmax(0, 40fr) minmax(0, 60fr); height: calc(100vh - var(--hdr)); padding: 0 var(--iskv-page-gutter) var(--iskv-space-4); gap: var(--iskv-space-4); }
@media (min-width: 992px) { body.map-page { overflow: hidden; } body.map-page .site-footer { display: none; } }

/* ---------- Карта ---------- */
.map-box { position: relative; overflow: hidden; border-radius: var(--iskv-radius-xl); background: #E9EEF0; box-shadow: var(--iskv-shadow-raised); border: 1px solid rgba(255, 255, 255, .7); }
.map-tiles { position: absolute; left: 50%; top: 50%; }
.map-tiles img { position: absolute; width: 256px; height: 256px; max-width: none; display: block; user-select: none; -webkit-user-drag: none; filter: sepia(.18) hue-rotate(130deg) saturate(1.1) brightness(1.03); } /* светлая приглушённая подложка, как будущий стиль Google Maps */
.map-tint { position: absolute; inset: 0; pointer-events: none; background: linear-gradient(180deg, rgba(214, 238, 236, .18), rgba(239, 224, 190, .10)); }
.map-markers { position: absolute; inset: 0; }
.mk { position: absolute; transform: translate(-50%, -100%); cursor: pointer; transition: transform var(--iskv-dur-fast) var(--iskv-ease); }
.mk svg { width: 30px; height: 38px; display: block; filter: drop-shadow(0 3px 6px rgba(0, 90, 82, .35)); }
.mk .pin { fill: var(--iskv-color-accent-strong); stroke: #fff; stroke-width: 1.5; }
.mk .dot { fill: #fff; }
.mk:hover, .mk.is-active { transform: translate(-50%, -100%) scale(1.18); z-index: 3; }
.mk.is-active .pin { fill: var(--iskv-gold-500); }
.mk.is-active .dot { fill: var(--iskv-ink-900); }
.cl { position: absolute; transform: translate(-50%, -50%); width: 46px; height: 46px; border-radius: 50%; display: flex; align-items: center; justify-content: center; cursor: pointer;
  font: 600 14px var(--iskv-font-sans); color: var(--iskv-white); background: rgba(0, 127, 117, .88); border: 3px solid rgba(255, 255, 255, .85);
  box-shadow: 0 0 0 6px rgba(0, 166, 153, .18), 0 6px 16px rgba(0, 90, 82, .30); transition: transform var(--iskv-dur-fast) var(--iskv-ease); }
.cl.lg { width: 56px; height: 56px; font-size: 15px; }
.cl:hover { transform: translate(-50%, -50%) scale(1.08); }
.cl.is-active { background: rgba(245, 166, 35, .95); color: var(--iskv-ink-900); transform: translate(-50%, -50%) scale(1.12); box-shadow: 0 0 0 7px rgba(245, 166, 35, .25), 0 6px 16px rgba(154, 91, 0, .30); z-index: 3; }
.map-ctrl { position: absolute; right: 14px; top: 14px; display: flex; flex-direction: column; gap: 6px; z-index: 4; }
.map-ctrl button, .map-type button { border: 1px solid var(--iskv-glass-dense-border); background: var(--iskv-glass-dense-bg); -webkit-backdrop-filter: blur(var(--iskv-glass-blur-sm)); backdrop-filter: blur(var(--iskv-glass-blur-sm)); box-shadow: var(--iskv-shadow-glass); color: var(--iskv-color-heading); cursor: pointer; }
.map-ctrl button { width: 40px; height: 40px; border-radius: 12px; font: 600 18px var(--iskv-font-sans); }
.map-type { position: absolute; left: 14px; top: 14px; z-index: 4; display: inline-flex; padding: 3px; gap: 2px; border-radius: 12px; background: var(--iskv-glass-dense-bg); -webkit-backdrop-filter: blur(var(--iskv-glass-blur-sm)); backdrop-filter: blur(var(--iskv-glass-blur-sm)); box-shadow: var(--iskv-shadow-glass); }
.map-type button { border: 0; box-shadow: none; background: transparent; height: 32px; padding: 0 12px; border-radius: 9px; font: 500 13px var(--iskv-font-sans); color: var(--iskv-color-text-muted); }
.map-type button.is-on { background: #fff; color: var(--iskv-color-heading); box-shadow: 0 1px 3px rgba(31, 45, 58, .12); }
.map-attr { position: absolute; right: 8px; bottom: 6px; z-index: 4; font-size: 10px; color: var(--iskv-color-text-muted); background: rgba(255, 255, 255, .7); padding: 1px 6px; border-radius: 6px; }
.map-attr a { color: inherit; }
/* Инфо-окно маркера */
.iw { position: absolute; z-index: 5; width: 260px; transform: translate(-50%, calc(-100% - 46px)); display: none; padding: 8px; border-radius: var(--iskv-radius-md);
  background: var(--iskv-glass-dense-bg); border: 1px solid var(--iskv-glass-dense-border); -webkit-backdrop-filter: blur(var(--iskv-glass-blur-lg)); backdrop-filter: blur(var(--iskv-glass-blur-lg)); box-shadow: var(--iskv-shadow-overlay); }
.iw.is-open { display: grid; grid-template-columns: 84px 1fr; gap: 10px; align-items: center; }
.iw-img { width: 84px; height: 64px; border-radius: 8px; background-size: cover; background-position: center; }
.iw-t { font-size: 13px; font-weight: 600; color: var(--iskv-color-heading); line-height: 1.3; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.iw-p { font-size: 15px; font-weight: 600; color: var(--iskv-color-heading); margin-top: 2px; font-variant-numeric: tabular-nums; }
.iw::after { content: ""; position: absolute; left: 50%; bottom: -7px; width: 14px; height: 14px; transform: translateX(-50%) rotate(45deg); background: inherit; border-right: 1px solid var(--iskv-glass-dense-border); border-bottom: 1px solid var(--iskv-glass-dense-border); }

/* ---------- Правая панель: поиск + результаты ---------- */
.res-pane { min-width: 0; overflow-y: auto; overscroll-behavior: contain; padding: 0 6px 24px 2px; scrollbar-width: thin; scrollbar-color: rgba(0, 127, 117, .35) transparent; }
.res-pane .search { margin-top: 0; }
.res-pane .sf { padding: 18px 20px; border-radius: var(--iskv-radius-lg); background: rgba(255, 255, 255, .40); border: 1px solid rgba(255, 255, 255, .70); box-shadow: var(--glass-shadow), var(--glass-edge); }
.res-pane .sf-grid { grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); } /* колонок столько, сколько помещается в панель: подписи полей не обрезаются */
.res-head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin: 22px 2px 14px; }
.res-head h1 { margin: 0; font-size: 22px; font-weight: 600; letter-spacing: -.01em; color: var(--iskv-color-heading); }
.res-head h1 b { color: var(--iskv-color-link); font-weight: 600; }
.res-sort { display: inline-flex; align-items: center; gap: 8px; font-size: 13px; color: var(--iskv-color-text-muted); }
.res-sort select { height: 36px; padding: 0 34px 0 12px; border-radius: 10px; }
.res-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 16px; }
.pcard.is-hot { box-shadow: 0 0 0 2px var(--iskv-teal-300), 0 16px 40px rgba(31, 45, 58, .11); }
.pager { display: flex; justify-content: center; gap: 6px; margin: 24px 0 4px; }
.pager a { min-width: 40px; height: 40px; padding: 0 12px; display: inline-flex; align-items: center; justify-content: center; border-radius: 12px; font: 500 14px var(--iskv-font-sans); color: var(--iskv-color-text); text-decoration: none; cursor: pointer;
  background: rgba(255, 255, 255, .50); border: 1px solid rgba(255, 255, 255, .75); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .85); }
.pager a:hover { background: rgba(255, 255, 255, .8); }
.pager a.is-current { background: var(--iskv-color-accent-strong); border-color: transparent; color: #fff; }

/* ---------- Переключатель «Список / Карта» (только телефоны и планшеты) ---------- */
.view-switch { display: none; }

@media (max-width: 1199px) { .map-layout { grid-template-columns: minmax(0, 45fr) minmax(0, 55fr); } }
@media (max-width: 991px) {
  .map-layout { display: block; height: auto; padding: 0 var(--iskv-page-gutter); }
  .view-switch { display: flex; justify-content: center; position: sticky; top: 64px; z-index: 40; padding: 10px 0; }
  .view-switch .ttabs { padding: 4px; }
  .view-switch .ttab { min-width: 130px; height: 38px; gap: 8px; }
  .view-switch .ttab.is-on { background: #fff; color: var(--iskv-color-heading); box-shadow: var(--iskv-shadow-glass); }
  .map-box { display: none; height: calc(100vh - 64px - 58px - 16px); min-height: 420px; margin-bottom: 16px; }
  body.view-map .map-box { display: block; }
  body.view-map .res-pane { display: none; }
  .res-pane { overflow: visible; padding: 0; }
}
@media (max-width: 575px) {
  .res-pane .sf { padding: 14px; }
  .res-pane .sf-grid { grid-template-columns: 1fr; }
  .res-head { flex-direction: column; align-items: flex-start; gap: 8px; }
  .res-head h1 { font-size: 19px; }
  .res-grid { grid-template-columns: 1fr; }
  .view-switch .ttab { min-width: 0; flex: 1; }
  .view-switch .ttabs { width: 100%; }
}

/* поля в узкой панели — 14 px, чтобы длинные подписи («Любое количество ванных комнат») помещались целиком */
.res-pane .sf .field { font-size: 14px; padding-left: 14px; padding-right: 36px; background-position: right 14px center; }

/* ---------- Карта «от края до края» (решение владельца 2026-10-30) ----------
   Без скругления, обводки и тени: слева — край окна, сверху — шапка, снизу — край экрана, справа — панель списка.
   Отступ даёт сама панель списка, а не зазор вокруг карты. */
.map-layout { padding: 0; gap: 0; height: calc(100vh - var(--hdr)); }
.map-box { border-radius: 0; border: 0; box-shadow: none; }
.map-box::after { content: ""; position: absolute; top: 0; right: 0; bottom: 0; width: 1px; background: rgba(255, 255, 255, .7); pointer-events: none; z-index: 4; } /* тонкий светлый шов со списком */
.res-pane { padding: 0 var(--iskv-page-gutter) 24px clamp(16px, 1.6vw, 28px); }
@media (max-width: 991px) {
  .map-layout { padding: 0; height: auto; } /* высота по содержимому — подвал встаёт после списка, а не поверх него */
  .res-pane { padding: 0 var(--iskv-page-gutter) var(--iskv-space-6); }
  body.view-map .site-footer { display: none; } /* в режиме «Карта» подвал не нужен: карта на весь экран */
  .map-box { margin-bottom: 0; height: calc(100vh - 64px - 58px); }
  .map-box::after { display: none; }
}

/* Телефон, режим «Карта»: карта до низа экрана (высоту задаёт theme.js), внизу — лента карточек всех объектов на карте */
.map-strip { display: none; }
@media (max-width: 991px) {
  body.view-map .map-box { height: auto; min-height: 0; }
  body.view-map .map-strip { position: absolute; left: 0; right: 0; bottom: 52px; /* над кнопкой «Privacy & Cookies Policy» баннера cookies */ z-index: 5; display: flex; gap: 10px; overflow-x: auto; scroll-snap-type: x mandatory; padding: 4px 16px; scrollbar-width: none; }
  .map-strip::-webkit-scrollbar { display: none; }
  .ms-card { flex: 0 0 82%; max-width: 330px; scroll-snap-align: center; display: grid; grid-template-columns: 104px minmax(0, 1fr); gap: 10px; align-items: center; padding: 8px; border-radius: var(--iskv-radius-md); background: rgba(255, 255, 255, .96); border: 2px solid transparent; box-shadow: 0 10px 26px rgba(31, 45, 58, .18); text-decoration: none; color: var(--iskv-color-text); }
  .ms-card.is-on { border-color: var(--iskv-color-accent-strong); }
  .ms-card i { height: 78px; border-radius: 10px; background: center / cover no-repeat var(--iskv-ink-100); }
  .ms-card span { display: grid; gap: 3px; min-width: 0; }
  .ms-card b { font-size: 13.5px; font-weight: 600; line-height: 1.3; color: var(--iskv-color-heading); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
  .ms-card em { font-style: normal; font-size: 15px; font-weight: 700; color: var(--iskv-color-heading); font-variant-numeric: tabular-nums; }
  .ms-card small { font-size: 11.5px; color: var(--iskv-color-text-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
}