:root{
  --panelW: 420px;
  --nb-accent: #fb6000;
  --nb-accent-dark: #e05500;
}
body{ background:#f6f7f9; }
/* ============================================================
   Accent farba (Bootstrap primary) – #fb6000
   ============================================================ */
.btn-primary{
  background-color: var(--nb-accent) !important;
  border-color: var(--nb-accent) !important;
}


/* =========================================================
   RÝCHLA NAVIGÁCIA – TRI NBY BOXY
   ========================================================= */

.nby-guide-cards {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;

  width: 100%;
  max-width: 1180px;

  margin: 240px auto 32px;
  padding: 0 16px;
}

.nby-guide-card {
  display: grid;
  grid-template-columns: 52px minmax(0, 1fr) auto;
  align-items: center;
  gap: 13px;

  min-width: 0;
  min-height: 84px;
  padding: 14px 16px;

  color: #1f2937;
  background: #ffffff;
  border: 1px solid rgba(251, 96, 0, 0.25);
  border-radius: 18px;

  text-decoration: none;

  box-shadow: 0 7px 22px rgba(31, 41, 55, 0.07);

  transition:
    transform 0.2s ease,
    border-color 0.2s ease,
    box-shadow 0.2s ease,
    background-color 0.2s ease;
}

.nby-guide-card__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;

  width: 52px;
  height: 52px;

  color: #ffffff;
  background: #fb6000;
  border-radius: 15px;

  font-size: 1.3rem;

  box-shadow: 0 8px 18px rgba(251, 96, 0, 0.2);
}

.nby-guide-card__content {
  display: flex;
  flex-direction: column;
  gap: 3px;

  min-width: 0;
}

.nby-guide-card__content strong {
  color: #172033;

  font-size: 0.98rem;
  font-weight: 750;
  line-height: 1.25;
}

.nby-guide-card__content small {
  color: #6b7280;

  font-size: 0.8rem;
  line-height: 1.3;
}

.nby-guide-card__arrow {
  color: #fb6000;
  font-size: 1.45rem;

  transition: transform 0.2s ease;
}

.nby-guide-card:hover,
.nby-guide-card:focus-visible {
  color: #1f2937;
  background: #fffaf7;
  border-color: #fb6000;

  transform: translateY(-3px);

  box-shadow: 0 12px 28px rgba(251, 96, 0, 0.14);
}

.nby-guide-card:hover .nby-guide-card__arrow,
.nby-guide-card:focus-visible .nby-guide-card__arrow {
  transform: translateY(3px);
}

.nby-guide-card:focus-visible {
  outline: 3px solid rgba(251, 96, 0, 0.25);
  outline-offset: 3px;
}

html {
  scroll-behavior: smooth;
}

#odporucane-miesta,
#uhrada-parkovneho,
#interaktivna-mapa {
  scroll-margin-top: 220px;
}


/* TABLET A MOBIL */

@media (max-width: 991.98px) {
  .nby-guide-cards {
    grid-template-columns: 1fr;
    gap: 10px;
  }

  .nby-guide-card {
    min-height: 76px;
  }
}

@media (max-width: 767.98px) {
  .nby-guide-cards {
    gap: 9px;
    margin-bottom: 22px;
    padding: 0 12px;
  }

  .nby-guide-card {
    grid-template-columns: 46px minmax(0, 1fr) auto;
    gap: 11px;

    min-height: 70px;
    padding: 11px 13px;

    border-radius: 16px;
  }

  .nby-guide-card__icon {
    width: 46px;
    height: 46px;

    border-radius: 13px;
    font-size: 1.1rem;
  }

  .nby-guide-card__content strong {
    font-size: 0.93rem;
  }

  .nby-guide-card__content small {
    font-size: 0.76rem;
  }

  .nby-guide-card__arrow {
    font-size: 1.25rem;
  }

  .nby-guide-card:hover {
    transform: none;
  }
}

@media (max-width: 380px) {
  .nby-guide-card__content small {
    display: none;
  }

  .nby-guide-card {
    min-height: 62px;
  }
}




.btn-primary:hover,
.btn-primary:focus{
  background-color: var(--nb-accent-dark) !important;
  border-color: var(--nb-accent-dark) !important;
}
.btn-primary:active{
  background-color: var(--nb-accent-dark) !important;
  border-color: var(--nb-accent-dark) !important;
}
.text-bg-primary{
  background-color: var(--nb-accent) !important;
}

.page-wrap{
  display:grid;
  grid-template-columns: 1fr var(--panelW);
  gap: 12px;
  padding: 12px;
  max-width: 1400px;
  margin: 0 auto;
}
#map{
  height: calc(100vh - 120px);
  min-height: 520px;
  border-radius: 16px;
  overflow:hidden;
  box-shadow: 0 10px 30px rgba(0,0,0,.08);
  background:#e9ecef;
}
.side{
  height: calc(100vh - 120px);
  min-height: 520px;
  display:flex;
  flex-direction:column;
  gap: 5px;
}


/* ============================================================
   FIX: Bočný panel – Kategórie sa nesmú orezať
   (v niektorých šablónach majú obe karty omylom flex-grow-1)
   - karta s #filters má mať výšku podľa obsahu
   - karta so zoznamom (#list) má zabrať zvyšok a scrollovať
   ============================================================ */
.side .card-soft:has(#filters){
  flex: 0 0 auto !important;
}
.side .card-soft:has(#list){
  flex: 1 1 auto !important;
  min-height: 0 !important; /* umožní scroll vo vnútri */
}
#filters{
  padding-top: 6px;
  padding-bottom: 10px;
}

/* ============================================================
   "Chcem…" panely v Sprievodcovi (labely bez viditeľných radio buttonov)
   - iba vizuál (JS logika ostáva)
   ============================================================ */

#filters.chcem-panely{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap:10px;
}

@media (max-width: 520px){
  #filters.chcem-panely{ grid-template-columns: 1fr; }
}

#filters .chcem-label{
  position:relative;
  display:flex;
  align-items:center;
  gap:4px;
  font-size: .9rem;
  padding: 12px 12px;
  border-radius: 16px;
  background:#fff;
  border: 1px solid rgba(0,0,0,.08);
  box-shadow: 0 10px 26px rgba(15,23,42,.06);
  cursor:pointer;
  user-select:none;
  overflow:hidden;
}

#filters .chcem-label input{
  position:absolute;
  opacity:0;
  pointer-events:none;
  width:1px;
  height:1px;
}

#filters .chcem-ico{
  width:42px;
  height:42px;
  border-radius:999px;
  display:grid;
  place-items:center;
  background: rgba(15,23,42,.08);
  color:#0f172a;
  flex: 0 0 auto;
}

#filters .chcem-ico i{ font-size:18px; line-height:1; }

#filters .chcem-text{
  font-weight:800;
  color:#0f172a;
  line-height:1.15;
}

#filters .chcem-count{
  margin-left:auto;
  min-width: 34px;
  height: 28px;
  padding: 0 10px;
  border-radius: 999px;
  display:flex;
  align-items:center;
  justify-content:center;
  background: rgba(0,0,0,.06);
  color:#0f172a;
  font-weight:800;
  font-size: 13px;
}

#filters .chcem-label:hover{
  border-color: rgba(0,0,0,.14);
}

#filters .chcem-label.is-active{
  border-color: var(--nb-accent);
  box-shadow: 0 12px 32px rgba(251,96,0,.16);
}

#filters .chcem-label.is-active .chcem-ico{
  background: var(--nb-accent);
  color:#fff;
}

#filters .chcem-label.is-active .chcem-count{
  background: rgba(251,96,0,.12);
}





.leaflet-popup-content-wrapper {
  font-family: "Montserrat",  sans-serif !important;

}

button {
  cursor: pointer;
}

.card-soft{
  border:0;
  border-radius: 16px;
  box-shadow: 0 10px 30px rgba(0,0,0,.08);
  overflow:hidden;
}
.filters .form-check{ margin-bottom:6px; }
.list{
  overflow:auto;
  padding: 10px;
}
.list-item{
  border-radius: 14px;
  padding: 10px;
  background:#fff;
  border: 1px solid rgba(0,0,0,.06);
  cursor:pointer;
}
.list-item:hover{ background:#f8f9fb; }
.pill{
  font-size: 12px;
  padding: 4px 10px;
  border-radius: 999px;
  background: rgba(0,0,0,.06);
}
/* Detail panel (overlay) */
.detail{
  position: fixed;
  top: 0; right: 0;
  width: min(560px, 100vw);
  height: 100vh;
  background:#fff;
  box-shadow: -20px 0 60px rgba(0,0,0,.18);
  transform: translateX(105%);
  transition: transform .22s ease;
  z-index: 9999;
  display:flex;
  flex-direction:column;
}
.detail.open{ transform: translateX(0); }
.detail-header{
  padding: 14px 16px;
  border-bottom: 1px solid rgba(0,0,0,.08);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 10px;
}
.detail-body{
  padding: 14px 16px 24px;
  overflow:auto;
}
.hero{
  width:100%;
  height: 220px;
  border-radius: 14px;
  object-fit: cover;
  background:#e9ecef;
}
.thumbs{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  margin-top:10px;
}
.thumbs img{
  width: 86px;
  height: 64px;
  object-fit: cover;
  border-radius: 10px;
  border: 1px solid rgba(0,0,0,.08);
  cursor:pointer;
}
.meta-grid{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  margin-top: 12px;
}

/* "Som tu, chcem…" – intent pillky v detaile */
.detail-intents{
  margin-top: 12px;
  padding: 12px;
  border: 1px solid rgba(0,0,0,.08);
  border-radius: 14px;
  background: rgba(0,0,0,.02);
}
.detail-intents__title{
  font-weight: 700;
  margin-bottom: 8px;
}
.detail-intents__pills{
  display:flex;
  flex-wrap:wrap;
  gap: 8px;
}
.detail-intent-pill{
  display:inline-flex;
  align-items:center;
  padding: 7px 10px;
  border-radius: 999px;
  font-size: 12px;
  line-height: 1;
  text-decoration: none;
  border: 1px solid rgba(251,96,0,.35);
  background: rgba(251,96,0,.10);
  color: #fb6000;
  transition: transform .12s ease, background .12s ease;
}
.detail-intent-pill:hover{
  background: rgba(251,96,0,.16);
  transform: translateY(-1px);
}
.meta{
  border: 1px solid rgba(0,0,0,.08);
  border-radius: 14px;
  padding: 10px;
  background:#fbfcfe;
}


/* ============================================================
 Map lock button (Leaflet control) — ako mapa služieb
 ============================================================ */

.leaflet-control.map-lock-control{
border:none !important;
background:transparent !important;
box-shadow:none !important;
margin-top:10px !important;
}

/* odsadenie od okraja (pravý stĺpec) */
.leaflet-top.leaflet-right .leaflet-control.map-lock-control{
margin-right:5px !important;
}

.map-lock-wrap{
position:relative;
display:inline-block;
}

.map-lock-btn{
border:none;
border-radius:999px;
background:#0f172a;
color:#fff;
font-weight:800;
font-size:.9rem;
cursor:pointer;
box-shadow:0 8px 18px rgba(15,23,42,18);

width:42px;
height:42px;
display:flex;
align-items:center;
justify-content:center;
}

.map-lock-btn.is-unlocked{ background:#10b981; }
.map-lock-btn i{ font-size:18px; line-height:1; }

.sr-only{
position:absolute !important;
width:1px !important;
height:1px !important;
padding:0 !important;
margin:-1px !important;
overflow:hidden !important;
clip:rect(0,0,0,0) !important;
white-space:nowrap !important;
border:0 !important;
}

.map-lock-btn span{ display:none; }

.map-lock-btn:not(.is-unlocked){
animation: nbLockPulse 2.2s ease-in-out infinite;
}

@keyframes nbLockPulse{
0%{
  transform: scale(1);
  box-shadow:
    0 0 0 0 rgba(15,23,42,35),
    0 8px 18px rgba(15,23,42,18);
}
55%{
  transform: scale(1.06);
  box-shadow:
    0 0 0 10px rgba(15,23,42,00),
    0 10px 22px rgba(15,23,42,25);
}
100%{
  transform: scale(1);
  box-shadow:
    0 0 0 0 rgba(15,23,42,00),
    0 8px 18px rgba(15,23,42,18);
}
}

.map-lock-tooltip{
position:absolute;
left:54px;
top:50%;
transform:translateY(-50%);
background:rgba(255,255,255,96);
color:#0f172a;
border:1px solid rgba(148,163,184,45);
border-radius:12px;
padding:8px 10px;
font-size:.85rem;
line-height:1.2;
white-space:nowrap;
box-shadow:0 10px 26px rgba(15,23,42,14);
opacity:0;
pointer-events:none;
transition:opacity .18s ease, transform .18s ease;
}

.map-lock-tooltip::before{
content:"";
position:absolute;
left:-6px;
top:50%;
width:10px;
height:10px;
background:rgba(255,255,255,96);
border-left:1px solid rgba(148,163,184,45);
border-bottom:1px solid rgba(148,163,184,45);
transform:translateY(-50%) rotate(45deg);
}

.map-lock-tooltip.is-visible{ opacity:1; }

.leaflet-top.leaflet-right .map-lock-tooltip{
left:auto;
right:54px;
}

.leaflet-top.leaflet-right .map-lock-tooltip::before{
left:auto;
right:-6px;
border-left:none;
border-bottom:none;
border-right:1px solid rgba(148,163,184,45);
border-top:1px solid rgba(148,163,184,45);
transform:translateY(-50%) rotate(45deg);
}

.nb-tip-nudge{ color:#008374; }

@media (prefers-reduced-motion: reduce){
.map-lock-btn{ animation:none !important; }
}

/* Mobile lock behavior */
.map-soft-locked{ touch-action:pan-y pinch-zoom; }

/* ===== Zoom +/- center on mobile ===== */
.leaflet-control-zoom{
border:none !important;
box-shadow:0 8px 18px rgba(15,23,42,16) !important;
border-radius:14px !important;
overflow:hidden;
}

.leaflet-control-zoom a{
width:42px !important;
height:42px !important;
line-height:42px !important;
font-size:22px !important;
display:flex !important;
align-items:center !important;
justify-content:center !important;
}

.leaflet-control-zoom a:hover{
background:#0f172a !important;
color:#fff !important;
}

@media (max-width:768px){
/* zoom (ľavá strana) */
.leaflet-top.leaflet-left{
  top:50% !important;
  transform:translateY(-50%) !important;
}
.leaflet-top.leaflet-left .leaflet-control{
  margin-top:0 !important;
}

/* lock (pravá strana) – tiež do stredu */
.leaflet-top.leaflet-right{
  top:50% !important;
  transform:translateY(-50%) !important;
}
.leaflet-top.leaflet-right .leaflet-control{
  margin-top:0 !important;
}
}




.meta .k{ font-size:12px; color:#6c757d; }
.meta .v{ font-weight:600; }
@media (max-width: 992px){
  .page-wrap{ grid-template-columns: 1fr; }
  .side{ height:auto; min-height: unset; }
  #map{ height: 62vh; min-height: 420px; }
}

/* ============================================================
 Leaflet controls — vycentrovanie vertikálne (desktop + mobil)
 (aby zoom a zámok nikdy nešli do fixed navigácie)
 ============================================================ */
#map .leaflet-top.leaflet-left,
#map .leaflet-top.leaflet-right{
top:50% !important;
transform: translateY(-50%) !important;
}
#map .leaflet-top.leaflet-left .leaflet-control,
#map .leaflet-top.leaflet-right .leaflet-control{
margin-top:0 !important;
}

/* ============================================================
   Zaujímavosti (karty v detaile bodu)
   ============================================================ */

.facts-block{ margin-top:14px; }
.facts-head{ margin-bottom:10px; }

.facts-heading{
  font-weight:800;
  font-size:15px;
  color:#0f172a;
  display:flex;
  align-items:center;
}

.facts-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:10px;
}

@media (min-width:520px){
  .facts-grid{ grid-template-columns:1fr 1fr; }
}

.fact-card{
  border:1px solid rgba(0,0,0,.08);
  border-radius:14px;
  padding:12px;
  background:#fbfcfe;
}

.fact-top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-bottom:8px;
}

.fact-icon{
  width:34px;
  height:34px;
  border-radius:999px;
  display:grid;
  place-items:center;
  background:#0f172a;
  color:#fff;
  flex:0 0 auto;
  box-shadow:0 10px 22px rgba(15,23,42,.18);
}

.fact-icon i{ font-size:16px; line-height:1; }

.fact-tag{
  font-size:12px;
  padding:4px 10px;
  border-radius:999px;
  background: rgba(0,0,0,.06);
  color:#0f172a;
  font-weight:600;
}

.fact-title{
  font-weight:800;
  margin-bottom:6px;
  color:#0f172a;
}

.fact-text{
  font-size:13px;
  color:#475569;
  line-height:1.25;
}



/* ============================================================
   Zdrojovanie (linky a meta pri zaujímavostiach)
   ============================================================ */

.facts-meta{
  margin-top:6px;
  font-size:12px;
  color:#64748b;
}

.fact-sources{
  margin-top:10px;
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:6px;
  font-size:12px;
  color:#64748b;
}

.fact-source-label{
  font-weight:700;
  color:#0f172a;
  opacity:.6;
  display:inline-flex;
  align-items:center;
}

.fact-source-sep{
  opacity:.5;
}

.fact-sources a{
  color:inherit;
  text-decoration:underline;
  text-underline-offset:2px;
}

.fact-source-note{
  opacity:.85;
}

/* ============================================================
   Zdieľanie (ako v mapa služieb / kalendári)
   ============================================================ */
.share-section{
  margin-top: 18px;
  padding-top: 14px;
  border-top: 1px solid rgba(0,0,0,.08);
}
.share-title{
  font-weight: 800;
  color: #0f172a;
  display:flex;
  align-items:center;
  gap:8px;
  margin-bottom: 10px;
}
.share-grid{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}
.share-btn{
  border: none;
  border-radius: 999px;
  padding: 12px 14px;
  font-weight: 800;
  display:flex;
  align-items:center;
  justify-content:center;
  gap: 10px;
  color:#fff;
  box-shadow: 0 10px 26px rgba(15,23,42,.14);
  cursor:pointer;
  user-select:none;
}
.share-btn i{ font-size: 18px; line-height:1; }

.share-fb{ background:#1877f2; }
.share-msgr{ background:#0a7cff; }
.share-wa{ background:#25d366; }
.share-ig{ background: linear-gradient(45deg,#f58529,#dd2a7b,#8134af,#515bd4); }

.share-copy{
  margin-top: 10px;
  width: 100%;
  border-radius: 999px;
  padding: 12px 14px;
  border: 1px solid rgba(0,0,0,.10);
  background: #0f172a;
  color:#fff;
  font-weight: 800;
  display:flex;
  align-items:center;
  justify-content:center;
  gap: 10px;
}

.share-hint{
  margin-top: 8px;
  font-size: 12px;
  color:#64748b;
  line-height: 1.2;
}

.nb-toast{
  position: fixed;
  left: 50%;
  bottom: 16px;
  transform: translateX(-50%);
  background: rgba(15,23,42,.92);
  color:#fff;
  padding: 10px 14px;
  border-radius: 999px;
  font-weight: 700;
  font-size: 13px;
  box-shadow: 0 18px 40px rgba(0,0,0,.25);
  z-index: 100000;
  opacity: 0;
  pointer-events: none;
  transition: opacity .18s ease, transform .18s ease;
}
.nb-toast.show{
  opacity: 1;
  transform: translateX(-50%) translateY(-6px);
}

.nb-marker{
  width:35px;
  height:35px;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#fff;
  font-size:18px;
  box-shadow:0 10px 26px rgba(0,0,0,.25);
}

.nb-marker-pamiatky{ background:#8b1e3f; }       
.nb-marker-parkovanie{ background:#16a34a; }     
.nb-marker-bankomat{ background:#0ea5e9; }       
.nb-marker-wc{ background:#6366f1; }             
.nb-marker-tipy{
  background:#f59e0b;                            
  transform: translate(16px, -15px);
}
.nb-marker-komunitne{ background:#fb6000; }  


#map .leaflet-marker-icon:has(.nb-marker-tipy){
  pointer-events: none;
}

#map .leaflet-marker-icon:has(.nb-marker-tipy) .nb-marker-tipy{
  pointer-events: auto;
  clip-path: circle(50%);
}



/* ============================================================
   FIX: Hero image always fills container (detail panel)
   ============================================================ */
.hero-wrap{
  width:100%;
  height:220px;
  border-radius:14px;
  overflow:hidden;
  background:#e9ecef;
}
.hero-img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  display:block;
}
.hero-wrap.hero-fallback{
  background:#e9ecef;
}

/* ============================================================
   FIX: Leaflet controls drifting into header (zoom + lock)
   - keep vertically centered but push slightly down to avoid sticky nav
   ============================================================ */
#map{ --nb-ctrl-offset: 0px; }
@media (max-width:768px){
  #map{ --nb-ctrl-offset: 34px; }
}
#map .leaflet-top.leaflet-left,
#map .leaflet-top.leaflet-right{
  top: calc(50% + var(--nb-ctrl-offset)) !important;
  transform: translateY(-50%) !important;
}
#map .leaflet-top.leaflet-left .leaflet-control,
#map .leaflet-top.leaflet-right .leaflet-control{
  margin-top:0 !important;
}


/* ============================================================
   FIX: Leaflet controls MUST stay under sticky header/nav
   (so they never "prelietajú" do navigácie)
   ============================================================ */
#map .leaflet-top,
#map .leaflet-bottom{
  z-index: 400 !important;
}


/* ============================================================
   Fotogaléria v sprievodcovi – 1:1 vizuál + lightbox (scoped)
   (všetko viazané na .detail, aby sa nič inde neprebilo)
   ============================================================ */

.detail .detail-photo-section.sprievodca-gallery{ margin-top:14px; }

.detail .sprievodca-gallery-grid{
  display:grid;
  gap:10px;
}

.detail .sprievodca-gallery-grid.one{ grid-template-columns: 1fr; }

.detail .sprievodca-gallery-grid.two{
  grid-template-columns: 1.15fr .85fr;
  align-items:stretch;
}

.detail .sprievodca-gallery-tile{
  border:0;
  padding:0;
  background:transparent;
  cursor:pointer;
  border-radius:16px;
  overflow:hidden;
  position:relative;
  width:100%;
  display:block;
}

.detail .sprievodca-gallery-tile img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  aspect-ratio: 4 / 3;
  transform: translateZ(0);
  transition: transform 180ms ease;
}

.detail .sprievodca-gallery-tile.small img{ filter: brightness(.88); }

.detail .sprievodca-gallery-more{
  position:absolute;
  inset:0;
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight:800;
  font-size:22px;
  color:#fff;
  text-shadow: 0 2px 10px rgba(0,0,0,.45);
  pointer-events:none;
}

.detail .sprievodca-gallery-more::before{
  content:"";
  position:absolute;
  width:120px;
  height:120px;
  border-radius:999px;
  background: rgba(0,0,0,.55);
}

.detail .sprievodca-gallery-more span{
  position:relative;
  z-index:1;
}

@media (hover:hover){
  .detail .sprievodca-gallery-tile:hover img{ transform:scale(1.03); }
}

@media (max-width: 680px){
  .detail .sprievodca-gallery-grid.two{ grid-template-columns: 1fr 1fr; }
}

/* Lightbox */
html.lb-open{ overflow:hidden; }

.sprievodca-lightbox{
  position:fixed;
  inset:0;
  z-index: 10050;
  display:none;
}

.sprievodca-lightbox.open{ display:block; }

.sprievodca-lightbox-backdrop{
  position:absolute;
  inset:0;
  background: rgba(8, 10, 18, .72);
  backdrop-filter: blur(2px);
}

.sprievodca-lightbox-dialog{
  position:absolute;
  inset: 24px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius: 18px;
}

.sprievodca-lightbox-figure{
  margin:0;
  width:min(1100px, 92vw);
  height:min(720px, 82vh);
  background: rgba(0,0,0,.18);
  border-radius: 18px;
  overflow:hidden;
  display:flex;
  align-items:center;
  justify-content:center;
  position:relative;
}

.sprievodca-lightbox-img{
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  display:block;
}

.sprievodca-lightbox-counter{
  position:absolute;
  left: 18px;
  bottom: 14px;
  font-size: 13px;
  padding: 6px 10px;
  border-radius: 999px;
  background: rgba(0,0,0,.45);
  color:#fff;
}

.sprievodca-lightbox-close{
  position:absolute;
  top: 10px;
  right: 10px;
  width: 44px;
  height: 44px;
  border-radius: 999px;
  border:0;
  background: rgba(0,0,0,.45);
  color:#fff;
  font-size: 26px;
  line-height: 44px;
  cursor:pointer;
  z-index: 2;
}

.sprievodca-lightbox-nav{
  position:absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 54px;
  height: 54px;
  border-radius: 999px;
  border:0;
  background: rgba(0,0,0,.35);
  color:#fff;
  font-size: 34px;
  line-height: 54px;
  cursor:pointer;
  z-index: 2;
}

.sprievodca-lightbox-nav.prev{ left: 10px; }
.sprievodca-lightbox-nav.next{ right: 10px; }

@media (max-width: 520px){
  .sprievodca-lightbox-dialog{ inset: 12px; }
  .sprievodca-lightbox-figure{ width: 94vw; height: 78vh; }
}


/* Fix: desktop klik na Zobraziť/Skryť všetko (ak sa prekryjú vrstvou mapy) */
#btnShowAll, #btnHideAll{
  position: relative;
  z-index: 5;
  pointer-events: auto;
}