/* Zajednički modal za uvećanje slika na landing stranici (<dialog id="image-lightbox">). */

/* Skrol stranice je zaključan tačno dok je modal otvoren (bez JS stanja koje može da ostane). */
html:has(#image-lightbox[open]) {
  overflow: hidden;
}

#image-lightbox[open] {
  animation: lightbox-in 0.18s ease-out;
}

#image-lightbox[open]::backdrop {
  animation: lightbox-fade 0.18s ease-out;
}

@keyframes lightbox-in {
  from { opacity: 0; transform: scale(0.97); }
  to { opacity: 1; transform: none; }
}

@keyframes lightbox-fade {
  from { opacity: 0; }
  to { opacity: 1; }
}

@media (prefers-reduced-motion: reduce) {
  #image-lightbox[open],
  #image-lightbox[open]::backdrop {
    animation: none;
  }
}