/* Mapa týmů v barvách banda!cz (assets/js/mapa.js, app/modules/mapa.php; kresba assets/img/mapa/evropa.svg z Natural Earth).
   Tmavá varianta (majitel 13. 10. 2026). Velikost a zaoblení dává stránka (katalog, úvodka, stránka týmu, Kontakt klubu);
   barvy jdou přebarvit proměnnými --mapa-* na kontejneru (web klubu zvýrazní kraj svou barvou). */
.bmapa {
  --mapa-more: #120E0C; --mapa-zeme: #241D18; --mapa-zeme-hrana: #3A302A;
  --mapa-kraj: #3A302A; --mapa-kraj-hrana: #5A4A3C; --mapa-hover: #5A4A3C; --mapa-vybrany: #8F6F12;
  --mapa-zvyraznit: #FFD600; --mapa-obrys: #8C7B69; --mapa-popisek: #8C7B69;
  --mapa-bublina: #FFD600; --mapa-bublina-text: #191411; --mapa-bublina-hrana: #191411; --mapa-bublina-hover: #F4432B;
  --mapa-bod: #F4432B;
  position: relative; overflow: hidden; background: var(--mapa-more); color: #FFF8ED;
  font-family: Inter, system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
}
.bmapa svg { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
.bmapa .zeme path { fill: var(--mapa-zeme); stroke: var(--mapa-zeme-hrana); stroke-width: 1px; stroke-linejoin: round; vector-effect: non-scaling-stroke; }
.bmapa .kraje path { fill: var(--mapa-kraj); stroke: var(--mapa-kraj-hrana); stroke-width: 1px; stroke-linejoin: round; vector-effect: non-scaling-stroke; transition: fill .15s; }
.bmapa .obrys path { fill: none; stroke: var(--mapa-obrys); stroke-width: 1.6px; stroke-linejoin: round; vector-effect: non-scaling-stroke; pointer-events: none; }
.bmapa .aktivni { cursor: pointer; }
.bmapa .kraje path.aktivni:hover, .bmapa .zeme path.aktivni:hover { fill: var(--mapa-hover); }
.bmapa .kraje path.vybrany { fill: var(--mapa-vybrany); }
.bmapa path.zvyrazneny, .bmapa .kraje path.zvyrazneny { fill: var(--mapa-zvyraznit); }
.bmapa .popisky text { fill: var(--mapa-popisek); font-family: inherit; font-size: 10px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; pointer-events: none; }
.bmapa .bublina { cursor: pointer; }
.bmapa .bublina circle { fill: var(--mapa-bublina); stroke: var(--mapa-bublina-hrana); stroke-width: 2.5; }
.bmapa .bublina text { fill: var(--mapa-bublina-text); font-family: inherit; font-size: 11px; font-weight: 800; text-anchor: middle; dominant-baseline: central; font-variant-numeric: tabular-nums; pointer-events: none; }
.bmapa .bublina:hover circle, .bmapa .bublina:focus-visible circle { stroke: var(--mapa-bublina-hover); stroke-width: 3.5; }
.bmapa .bublina:focus { outline: none; }
/* přiblížená mapa: jednotlivé týmy na přibližných místech (shluky jsou .bublina.shluk) a okénko se seznamem */
.bmapa .tym { cursor: pointer; }
.bmapa .tym circle { fill: var(--mapa-bublina); stroke: var(--mapa-bublina-hrana); stroke-width: 2.5; }
.bmapa .tym:hover circle, .bmapa .tym:focus-visible circle { stroke: var(--mapa-bublina-hover); stroke-width: 3.5; }
.bmapa .tym:focus { outline: none; }
.bmapa-seznam { position: absolute; z-index: 4; width: 260px; max-width: calc(100% - 16px); padding: 10px; border-radius: 16px;
  background: #FFF8ED; color: #191411; box-shadow: 0 12px 32px rgba(0, 0, 0, .4); font-size: 14px; }
.bmapa-seznam ul { display: grid; gap: 2px; max-height: 260px; overflow: auto; margin: 0; padding: 0 26px 0 0; list-style: none; }
.bmapa-seznam a { display: block; padding: 8px 10px; border-radius: 10px; color: #191411; text-decoration: none; }
.bmapa-seznam a:hover, .bmapa-seznam a:focus-visible { background: #F1E4CF; }
.bmapa-seznam a b { display: block; font-weight: 800; line-height: 1.25; overflow-wrap: anywhere; }
.bmapa-seznam a span { display: block; margin-top: 2px; color: #5C5046; font-size: 13px; }
.bmapa-seznam p { margin: 6px 10px 2px; color: #5C5046; font-size: 13px; }
.bmapa-seznam .zavrit { position: absolute; top: 6px; right: 6px; width: 30px; height: 30px; padding: 0; border: 0; border-radius: 50%; background: none;
  color: #5C5046; font-family: inherit; font-size: 20px; line-height: 1; cursor: pointer; }
.bmapa-seznam .zavrit:hover { background: #F1E4CF; color: #191411; }
.bmapa .tecka circle { fill: var(--mapa-bod); stroke: #FFF8ED; stroke-width: 2.5; }
.bmapa-tip { position: absolute; z-index: 3; pointer-events: none; padding: 6px 10px; border-radius: 10px; background: #191411; color: #FFF8ED;
  font-family: inherit; font-size: 13px; font-weight: 600; line-height: 1.3; white-space: nowrap; transform: translate(-50%, calc(-100% - 12px)); box-shadow: 0 6px 16px rgba(0, 0, 0, .3); }
.bmapa-tip b { color: #FFD600; font-weight: 800; }
.bmapa-prepinac { position: absolute; z-index: 2; top: 12px; right: 12px; display: inline-flex; padding: 3px; border-radius: 999px;
  background: rgba(25, 20, 17, .88); border: 1px solid #3A302A; }
.bmapa-prepinac button { border: 0; background: none; color: #D9CFC2; font-family: inherit; font-size: 13px; font-weight: 600; line-height: 1; padding: 8px 12px; border-radius: 999px; cursor: pointer; }
.bmapa-prepinac button[aria-pressed="true"] { background: #FFD600; color: #191411; }
.bmapa-prepinac button:focus-visible { outline: 3px solid #FFD600; outline-offset: 2px; }
/* přibližování (data-zoom): tlačítka + −, tažení myší; jedním prstem se dál posouvá stránka, dvěma se přibližuje mapa */
.bmapa.zoom svg { cursor: grab; touch-action: pan-x pan-y; }
.bmapa.zoom .aktivni, .bmapa.zoom .bublina { cursor: pointer; }
.bmapa.tahne svg, .bmapa.tahne svg * { cursor: grabbing; }
.bmapa-zoom { position: absolute; z-index: 2; right: 12px; bottom: 12px; display: flex; flex-direction: column; overflow: hidden;
  border-radius: 14px; background: rgba(25, 20, 17, .88); border: 1px solid #3A302A; }
.bmapa-zoom button { width: 40px; height: 40px; padding: 0; border: 0; background: none; color: #FFF8ED; font-family: inherit; font-size: 22px;
  font-weight: 600; line-height: 1; cursor: pointer; }
.bmapa-zoom button + button { border-top: 1px solid #3A302A; }
.bmapa-zoom button:hover { background: #3A302A; color: #FFD600; }
.bmapa-zoom button:focus-visible { outline: 3px solid #FFD600; outline-offset: -3px; }
.bmapa-chyba { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; margin: 0; padding: 24px; color: #D9CFC2; font-weight: 600; text-align: center; }
@media (prefers-reduced-motion: reduce) { .bmapa .kraje path { transition: none; } }