/* Страницы «Камеры на дорогах»: карта (Leaflet + OpenStreetMap), кнопки городов, список адресов */
.kam-count { font-weight: normal; font-size: 14px; color: #6b6b6b; white-space: nowrap; }
.faq-topic .kam-count { color: inherit; opacity: .8; margin-left: 6px; }
.division-nav .kam-count { display: block; margin-top: 2px; }
.kam-search { margin: 16px 0; }
.kam-search input { width: 100%; max-width: 480px; box-sizing: border-box; }
.kam-found { margin: 6px 0 0; color: #6b6b6b; font-size: 14px; }
.kam-results { margin: 8px 0 0; padding: 0; list-style: none; }
.kam-results li { margin: 0; padding: 6px 0; border-bottom: 1px solid #e3e9ee; }
.kam-results li::before { content: none; }
.kam-list .faq-questions li { padding-top: 6px; padding-bottom: 6px; }
.kam-addr { display: block; }
.kam-show { margin-left: 8px; padding: 0; border: 0; background: none; color: #186ea8; font: inherit; font-size: 14px; white-space: nowrap; cursor: pointer; }
.kam-show:hover { text-decoration: underline; }
.kam-models { border-collapse: collapse; margin: 0 0 16px; }
.kam-models td, .kam-models th { border: 1px solid #d5dde3; padding: 6px 12px; text-align: left; }
.kam-hidden { display: none !important; }

/* карта */
.kam-map-wrap { position: relative; margin: 12px 0 6px; }
.kam-map { height: 480px; border: 1px solid #d5dde3; border-radius: 6px; background: #eef1f3; z-index: 0; }
.kam-map-note { margin: 0 0 18px; color: #6b6b6b; font-size: 14px; }
.kam-map-toggle { position: absolute; left: 50%; bottom: 14px; z-index: 500; transform: translateX(-50%); padding: 9px 16px; border: 0; border-radius: 20px;
  background: #1b1b1b; color: #fff; font: inherit; font-size: 15px; white-space: nowrap; box-shadow: 0 2px 8px rgba(0,0,0,.3); cursor: pointer; }
@media (max-width: 529px) { .kam-map { height: 60vh; min-height: 320px; max-height: 480px; } }

/* кнопки справа внизу: «развернуть карту» над масштабом */
.kam-map .leaflet-bar a { display: flex; align-items: center; justify-content: center; color: #1b1b1b; }
.kam-map .leaflet-bar a:hover { color: #186ea8; }
.kam-map .leaflet-bottom .leaflet-control { margin-bottom: 8px; }
.kam-map .leaflet-bottom .leaflet-control-attribution { margin-bottom: 0; }

/* карта во всплывающем окне поверх страницы */
.kam-noscroll, .kam-noscroll body { overflow: hidden !important; }
.kam-map-close { display: none; }
.kam-map-full { position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 100000; margin: 0; padding: 4vh 4vw; box-sizing: border-box; background: rgba(0,0,0,.65); }
.kam-map-full .kam-map { height: 100%; min-height: 0; max-height: none; border: 0; box-shadow: 0 6px 30px rgba(0,0,0,.5); }
.kam-map-full .kam-map-toggle { display: none; }
.kam-map-full .kam-map-close { display: block; position: absolute; top: calc(4vh + 10px); right: calc(4vw + 10px); z-index: 600; width: 38px; height: 38px; padding: 0; border: 0; border-radius: 50%;
  background: #fff; color: #1b1b1b; font: 26px/38px Arial, sans-serif; text-align: center; box-shadow: 0 1px 6px rgba(0,0,0,.4); cursor: pointer; }
.kam-map-full .kam-map-close:hover { background: #1b1b1b; color: #fff; }
@media (max-width: 529px) {
  .kam-map-full { padding: 0; }
  .kam-map-full .kam-map { border-radius: 0; }
  .kam-map-full .kam-map-close { top: 10px; right: 10px; }
}

/* точка: одна камера или несколько по одному адресу */
.kam-dot { box-sizing: border-box; width: 16px; height: 16px; border: 2px solid #fff; border-radius: 50%; background: #1a8cf0; box-shadow: 0 1px 4px rgba(0,0,0,.35); }
.kam-dot-on { background: #e5342b; }
/* «пузырь» с числом камер рядом */
.kam-pill { display: inline-block; transform: translate(-50%, -50%); min-width: 14px; padding: 6px 10px; border-radius: 17px; text-align: center; background: #fff; color: #1b1b1b;
  font: bold 14px/1.2 "PT Sans", Arial, sans-serif; white-space: nowrap; box-shadow: 0 1px 6px rgba(0,0,0,.3); }
.kam-pill:hover { background: #1b1b1b; color: #fff; }
.kam-pill-wrap { width: 0 !important; height: 0 !important; overflow: visible; }

.kam-popup { font: 15px/1.35 "PT Sans", Arial, sans-serif; }
.kam-popup b { display: block; margin-bottom: 4px; }
.kam-popup span { display: block; color: #555; font-size: 14px; }
.kam-popup a { display: inline-block; margin-top: 6px; font-size: 14px; }
.leaflet-container a { color: #186ea8; }

/* анимация раскрытия групп (из Leaflet.markercluster) */
.leaflet-cluster-anim .leaflet-marker-icon, .leaflet-cluster-anim .leaflet-marker-shadow { transition: transform .3s ease-out, opacity .3s ease-in; }
.leaflet-cluster-spider-leg { transition: stroke-dashoffset .3s ease-out, stroke-opacity .3s ease-in; }
