/* Karta institucija — dropdown + Leaflet kontejner + popup (tema: crvena akcentna) */

.ekr-map-wrap { width: 100%; margin: 0 auto; }

/* Vizualno skrivena labela (samo za čitače ekrana) — tema nema WP core klasu */
.ekr-map-wrap .screen-reader-text {
  position: absolute !important;
  width: 1px; height: 1px;
  margin: -1px; padding: 0; border: 0;
  clip: rect(0 0 0 0); clip-path: inset(50%);
  overflow: hidden; white-space: nowrap;
}

.ekr-map-controls { margin-bottom: 12px; display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; }
.ekr-map-controls .ekr-map-select { flex: 1 1 220px; }
.ekr-map-controls .ekr-map-type { max-width: 260px; }
.ekr-map-select[hidden] { display: none; }

.ekr-map-select {
  width: 100%;
  max-width: 480px;
  padding: 12px 16px;
  font-size: 1rem;
  border: 1px solid #d8d8d8;
  border-radius: 30px;
  background: #fff;
  color: #1a1a1a;
  cursor: pointer;
  box-shadow: 0 4px 14px -8px rgba(0, 0, 0, .35);
  appearance: none;
  -webkit-appearance: none;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23c0282d' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'><polyline points='6 9 12 15 18 9'/></svg>");
  background-repeat: no-repeat;
  background-position: right 18px center;
}
.ekr-map-select:focus { outline: none; border-color: #c0282d; }

.ekr-map {
  width: 100%;
  min-height: 320px;
  border-radius: 10px;
  overflow: hidden;
  z-index: 0; /* ispod headera/overlaya */
  box-shadow: 0 10px 30px -18px rgba(0, 0, 0, .5);
}

.ekr-map-empty {
  padding: 14px;
  text-align: center;
  color: #666;
  font-size: .95rem;
}

/* Gumb "Povećaj kartu" (Leaflet custom control, gornji desni kut) */
.ekr-map-expand-btn {
  display: block;
  width: 34px;
  height: 34px;
  line-height: 34px;
  text-align: center;
  font-size: 18px;
  background: #fff;
  color: #1a1a1a;
  text-decoration: none;
  cursor: pointer;
  border-radius: 4px;
  box-shadow: 0 1px 5px rgba(0, 0, 0, .4);
}
.ekr-map-expand-btn:hover { background: #f4f4f4; color: #c0282d; }

/* Tamni backdrop iza proširene karte */
.ekr-map-backdrop {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, .55);
  z-index: 99998;
}
.ekr-map-backdrop.is-visible { display: block; }

/* Spriječi scroll iza otvorene karte */
body.ekr-map-no-scroll { overflow: hidden; }

/* Prošireni "box" preko cijele stranice.
   !important je NUŽAN na position/width/height: (1) Leaflet pri inicijalizaciji
   sam postavlja container.style.position = "relative" kao INLINE stil (treba mu
   kao pozicijski kontekst za svoje interne slojeve); (2) render helper
   (ekr_render_institution_map) postavlja inline style="height:Npx" na isti div
   (mala karta u sidebaru ≠ velika na naslovnici). Inline stil pobjeđuje običan
   CSS, pa bez !important ova pravila nikad ne prevagnu — potvrđeno browser
   testom: bez !important na position karta ostaje "zaglavljena" na izvornoj
   poziciji (samo tamni backdrop vidljiv), a bez !important na width/height
   ostaje u originalnoj (maloj) veličini usred boxa. */
.ekr-map.ekr-map-expanded {
  position: fixed !important;
  top: 4vh;
  left: 4vw;
  right: 4vw;
  bottom: 4vh;
  width: auto !important;
  height: auto !important;
  z-index: 99999;
  border-radius: 12px;
  box-shadow: 0 20px 60px rgba(0, 0, 0, .6);
}
@media (max-width: 600px) {
  .ekr-map.ekr-map-expanded { top: 2vh; left: 2vw; right: 2vw; bottom: 2vh; }
}

/* Popup — kompaktan, nikad širi od karte; dug tekst se lomi ili reže */
.ekr-map-popup { font-family: inherit; overflow-wrap: break-word; word-break: break-word; }
.ekr-map-popup-cat {
  font-size: .68rem; font-weight: 700; text-transform: uppercase; letter-spacing: .03em; margin-bottom: 2px;
}
.ekr-map-popup-title { margin: 0 0 4px; font-size: .95rem; line-height: 1.25; color: #1a1a1a; }
.ekr-map-popup-count { font-size: .76rem; font-weight: 700; color: #c0282d; margin-bottom: 3px; min-height: 1em; }
.ekr-map-popup-addr { font-size: .8rem; color: #444; margin-bottom: 5px; }
.ekr-map-popup-desc {
  font-size: .78rem; color: #666; margin-bottom: 6px; line-height: 1.35;
  /* Maks. 3 retka — ostatak se reže s "…" (cijeli opis je ionako na stranici pretrage) */
  display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
}
.ekr-map-popup-web { display: inline-block; font-size: .78rem; color: #1f6feb; text-decoration: none; margin-bottom: 6px; }
.ekr-map-popup-web:hover { text-decoration: underline; }
.ekr-map-popup-detail { display: block; font-size: .8rem; font-weight: 600; color: #c0282d; text-decoration: none; margin-bottom: 8px; }
.ekr-map-popup-detail:hover { text-decoration: underline; }
.ekr-map-popup-btn {
  display: block; text-align: center; background: #c0282d; color: #fff !important;
  padding: 7px 10px; border-radius: 18px; text-decoration: none; font-weight: 600; font-size: .8rem;
  transition: background .2s; white-space: nowrap;
}
.ekr-map-popup-btn:hover { background: #a01f24; }

.leaflet-popup-content { margin: 10px 12px; line-height: 1.35; }
/* Kad Leaflet ograniči visinu (maxHeight), sadržaj se uredno skrola */
.leaflet-popup-content.leaflet-popup-scrolled { border: 0; padding-right: 6px; }