/* =====================================================================
   Mapa krajů s kontakty
   verze 2.0.1

   V krajích, kde besedy nabízíme, je barevná tečka s počtem kontaktů.
   Po najetí myší se u ní objeví seznam; na dotykové obrazovce klepnutím,
   protože najetí prstem neexistuje.
   ===================================================================== */

.mapa-obal { margin: 18px 0; text-align: center; }

.mapa-tlacitko {
  font: inherit;
  font-size: 1.1rem;
  padding: 12px 28px;
  border: 0;
  border-radius: 6px;
  background: #4caf50;
  color: #fff;
  cursor: pointer;
}
.mapa-tlacitko:hover { background: #45a049; }
.mapa-tlacitko:focus-visible { outline: 3px solid #1d4ed8; outline-offset: 3px; }

.mapa-panel {
  margin-top: 18px;
  padding: 18px;
  background: #fff;
  border: 1px solid #ddd;
  border-radius: 12px;
}

.mapa-navod {
  margin: 0 0 12px;
  font-size: 1rem;
  color: #555;
}

/* Hint se umísťuje vůči téhle ploše */
.mapa-plocha { position: relative; }
.mapa-plocha svg { width: 100%; height: auto; display: block; overflow: visible; }

/* --- obrysy krajů ---------------------------------------------------- */
.kraj-obrys {
  fill: #eeeeee;
  stroke: #ffffff;
  stroke-width: 1.5;
}
/* Kraj s kontaktem je světle zelený, ostatní zůstávají šedé */
.kraj-obrys.kraj-aktivni { fill: #dcefdc; }

/* --- tečky ----------------------------------------------------------- */
.kraj-tecka { cursor: pointer; }
.kraj-tecka:focus { outline: none; }

.tecka {
  fill: #2e7d32;
  stroke: #fff;
  stroke-width: 2;
  transition: fill .15s;
}
.tecka-zare {
  fill: #2e7d32;
  opacity: .18;
  transition: opacity .15s, r .15s;
}
.tecka-cislo {
  font: 600 11px/1 "Poppins", system-ui, sans-serif;
  fill: #fff;
  pointer-events: none;
}

.kraj-tecka:hover .tecka,
.kraj-tecka:focus-visible .tecka,
.kraj-tecka.vybrana .tecka { fill: #1b5e20; }

.kraj-tecka:hover .tecka-zare,
.kraj-tecka.vybrana .tecka-zare { opacity: .32; }

.kraj-tecka:focus-visible .tecka-zare { opacity: .32; stroke: #1d4ed8; stroke-width: 2; }

/* --- vyskakovací seznam ---------------------------------------------- */
.mapa-hint {
  position: absolute;
  z-index: 10;
  max-width: 290px;
  min-width: 220px;
  padding: 12px 14px;
  background: #fff;
  border: 1px solid #cfd8cf;
  border-radius: 10px;
  box-shadow: 0 6px 20px rgba(0, 0, 0, .16);
  text-align: left;
  font-size: .95rem;
  line-height: 1.55;
}
.hint-nadpis {
  display: block;
  font-size: 1.05rem;
  margin-bottom: 8px;
  color: #1b5e20;
}
.hint-osoba {
  padding: 7px 0;
  border-top: 1px solid #eee;
}
.hint-osoba:first-of-type { border-top: 0; padding-top: 0; }
.hint-region { font-weight: 600; }
.mapa-hint a { word-break: break-all; }

/* Na telefonu se hint nevejde vedle tečky, ať je přes celou šířku */
@media (max-width: 640px) {
  .mapa-panel { padding: 12px; }
  .mapa-hint {
    position: static;
    max-width: none;
    margin-top: 14px;
    box-shadow: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  .tecka, .tecka-zare { transition: none; }
}