/* Public image zoom lightbox for detail pages. */

.activity-detail-page img[data-cms-image],
.axis-exhibition-detail img[data-cms-image],
.axis-exposition-detail img[data-cms-image],
.post-detail img[data-cms-image],
.activity-detail-page .rich-text img,
.axis-exhibition-detail .rich-text img,
.axis-exposition-detail .rich-text img,
.post-detail .rich-text img {
  cursor: zoom-in;
}

body.has-public-image-lightbox {
  overflow: hidden;
}

.public-image-lightbox[hidden] {
  display: none;
}

.public-image-lightbox {
  position: fixed;
  inset: 0;
  z-index: 1200;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  gap: 14px;
  padding: clamp(14px, 3vw, 28px);
  background: rgba(18, 25, 22, 0.9);
  backdrop-filter: blur(10px);
}

.public-image-lightbox__toolbar {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
}

.public-image-lightbox__button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 42px;
  height: 42px;
  border: 1px solid rgba(255, 255, 255, 0.26);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.12);
  color: #fff;
  font: 650 0.95rem/1 var(--font-sans);
  cursor: pointer;
}

.public-image-lightbox__button:hover,
.public-image-lightbox__button:focus-visible {
  border-color: rgba(255, 255, 255, 0.72);
  background: rgba(255, 255, 255, 0.22);
  outline: 0;
}

.public-image-lightbox__button--close {
  font-size: 1.45rem;
}

.public-image-lightbox__stage {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 0;
  min-height: 0;
  overflow: hidden;
}

.public-image-lightbox__image {
  display: block;
  max-width: min(100%, 1600px);
  max-height: 82vh;
  border-radius: 4px;
  object-fit: contain;
  transform-origin: center;
  transition: transform 160ms ease;
  user-select: none;
  touch-action: none;
  cursor: zoom-in;
}

.public-image-lightbox__image[data-zoomed="true"] {
  cursor: grab;
}

.public-image-lightbox__image[data-dragging="true"] {
  cursor: grabbing;
  transition: none;
}

.public-image-lightbox__caption {
  max-width: min(100%, 960px);
  margin: 0 auto;
  color: rgba(255, 255, 255, 0.78);
  font-size: 0.92rem;
  line-height: 1.45;
  text-align: center;
}