/* Лендинг Envoy v4: список городов под полем «Город» (landing-city.js). Стекло, радиус, тень и анимация общие
   с календарём (.cal, .cities в landing-cal.css). Ширина равна полю, строки 44, видно до 8, дальше прокрутка
   внутри списка. Подсвеченная строка нейтральной светлой заливкой, совпавшая часть названия жирным. */

.cities {
  margin: 0; padding: 6px; list-style: none;
  overflow-y: auto; overscroll-behavior: contain;
}
/* Прокрутка: только тонкая скруглённая пилюля без дорожки, 4 px, в 3 px от края, не доходит до скруглений.
   Chrome и Safari через ::-webkit-scrollbar (в Chrome стандартные scrollbar-* их отключили бы, поэтому те только для Firefox).
   Пока список прокручивается, полоса занимает 10 px справа: отступ слева тоже 10, подсветка строки с равными полями. */
.cities.scroll { padding: 6px 0 6px 10px; }
.cities::-webkit-scrollbar { width: 10px; background: transparent; }
.cities::-webkit-scrollbar-track { background: transparent; margin: 12px 0; }
.cities::-webkit-scrollbar-thumb {
  min-height: 40px; border: 3px solid transparent; border-radius: 999px;
  background: rgb(29 29 31 / 0.28); background-clip: padding-box;
}
.cities::-webkit-scrollbar-thumb:hover { background-color: rgb(29 29 31 / 0.42); }
@supports (-moz-appearance: none) { .cities { scrollbar-width: thin; scrollbar-color: rgb(29 29 31 / 0.28) transparent; } }
.cities li {
  display: block; height: 44px; padding: 0 12px; border-radius: var(--r-sm);
  font: 400 17px/44px var(--font); color: var(--ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  cursor: pointer; user-select: none; -webkit-tap-highlight-color: transparent;
}
.cities li b { font-weight: 600; }
.cities li[aria-selected="true"] { background: var(--band); }
.cities li.none { color: var(--graphite); cursor: default; }
