/* Каталог на телефоне: заголовок с выбором города в одну строку, фильтры без
   горизонтальной прокрутки. Подключается последним и перекрывает прежние
   мобильные правила каталога (catalog-filters.css, service-refresh.css). */
@media (max-width: 760px) {
  /* «Рестораны и кафе» и город в одной строке */
  html[data-theme] body.service-site .cf .cf-head {
    display: flex; flex-wrap: nowrap; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 14px;
  }
  html[data-theme] body.service-site .cf .cf-title { min-width: 0; font-size: clamp(22px, 6.4vw, 26px) !important; line-height: 1.15; }
  html[data-theme] body.service-site .cf .cf-city { flex: none; max-width: 48%; }
  html[data-theme] body.service-site .cf .cf-city__toggle {
    display: inline-flex; align-items: center; gap: 5px; max-width: 100%; height: 36px; padding: 0 10px 0 9px !important;
    border-radius: 999px; font-size: 14px; font-weight: 600; white-space: nowrap; text-decoration: none !important;
  }
  html[data-theme] body.service-site .cf .cf-city__toggle svg { width: 16px; height: 16px; flex: none; }
  html[data-theme] body.service-site .cf .cf-city__toggle::after {
    content: ''; flex: none; width: 7px; height: 7px; margin: -3px 0 0 3px;
    border-right: 1.8px solid currentColor; border-bottom: 1.8px solid currentColor; transform: rotate(45deg);
  }

  /* Фильтры: лента от края до края экрана, листается пальцем. Справа мягкое
     затухание, чтобы обрезанная кнопка читалась как «дальше ещё». */
  html[data-theme] body.service-site .cf .cf-bar {
    --cf-edge: calc(50vw - 50%);
    display: flex !important; flex-wrap: nowrap !important; gap: 8px; overflow-x: auto !important; overflow-y: hidden !important;
    margin: 0 calc(50% - 50vw) 20px !important; padding: 2px calc(var(--cf-edge) + 20px) 2px var(--cf-edge) !important; max-width: none;
    overscroll-behavior-x: contain;
    scrollbar-width: none; -webkit-overflow-scrolling: touch;
    -webkit-mask-image: linear-gradient(90deg, #000 calc(100% - 32px), transparent);
            mask-image: linear-gradient(90deg, #000 calc(100% - 32px), transparent);
  }
  html[data-theme] body.service-site .cf .cf-bar::-webkit-scrollbar { display: none; }
  html[data-theme] body.service-site .cf .cf-bar > .cf-view { display: none !important; }
  html[data-theme] body.service-site .cf .cf-bar > * { flex: none; }
  html[data-theme] body.service-site .cf .cf-bar .cf-chip { width: auto; height: 44px; padding: 0 14px; font-size: 14px; white-space: nowrap; }
  html[data-theme] body.service-site .cf .cf-bar .cf-chip--icon { width: 44px; padding: 0; justify-content: center; }
}

/* Нижней панели вкладок больше нет: убираем запас под неё внизу страницы. */
@media (max-width: 760px) {
  html[data-theme] body.service-site:not(.venue-page) { padding-bottom: env(safe-area-inset-bottom) !important; }
  html[data-theme] body.service-site:not(.venue-page) .main { padding-bottom: 32px !important; }
  html[data-theme] body.service-site .booking-assistant { bottom: calc(16px + env(safe-area-inset-bottom)) !important; }
}

/* Разрешаем увеличение страницы; карта обрабатывает свои жесты (Leaflet). */
html { touch-action: pan-x pan-y pinch-zoom; }
.leaflet-container { touch-action: none; }