/* W3 modal: vypneme padding-top a zapneme flex centrovanie kontajnera */
.w3-modal { padding-top:0 !important; 
  background: rgba(10,17,27,.8);
}
.w3-modal.is-open{
  display:flex !important;
  align-items:center;
  justify-content:center;
  overflow:hidden; /* nech nescrolluje celé pozadie modalu */
}

/* Zrušíme fixnú šírku w3 boxu a spravíme z neho pružný kontajner */
.w3-modal .w3-modal-content,
.tw-modal-content{
  background:transparent !important;
  box-shadow:none !important;
  width:auto !important;          /* zrušiť 600px */
  max-width:unset !important;
  height:auto;
  padding:0;
  display:flex;
  align-items:center;
  justify-content:center;
}

/* Vnútorný stĺpcový wrapper, aby bol popis pod fotkou a všetko centrované */
.tw-modal-body{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  max-width:96vw;
  max-height:96vh;
  gap:10px;
}

/* Obrázok sa prispôsobí VIEWPORTU (šírke/výške) – center/contain */
.tw-modal-img{
  max-width:96vw;
  max-height:88vh; /* trocha miesta pre caption a X */
  width:auto;
  height:auto;
  object-fit:contain;
  display:block;
  margin:0 auto;
  border-radius:8px;
  box-shadow:0 10px 30px rgba(0,0,0,.4);
}

/* Popis pod obrázkom, centrovaný */
.tw-modal-caption{
  color:#e5e7eb;
  font-size:14px;
  text-align:center;
  background:rgba(0,0,0,.35);
  padding:6px 10px;
  border-radius:8px;
  max-width:min(92vw, 1200px);
}

/* Šípky v modale – centrované na výšku pri okrajoch */
.tw-modal-arrow{
  position: fixed;
  top: 50%; transform: translateY(-50%);
  z-index: 10000;
  width: 44px; height: 44px;
  font-size: 24px; line-height: 1;
  opacity: .9;
}
.tw-modal-arrow:hover{ opacity: 1; }
.tw-modal-arrow.tw-left{  left: 16px; }
.tw-modal-arrow.tw-right{ right: 16px; }


/* Disable scroll na body počas modalu (zabráni „pohupovaniu“) */
body.modal-open{ overflow:hidden; }