/* CSS-only media lightbox for the location gallery.
   Loaded via a direct <link> in App.razor and kept as plain CSS — Blazor SSR
   has no interactivity here, so the lightbox uses the :target pseudo-class
   (click a thumbnail -> #media-N -> overlay shows). No JavaScript required. */

/* Play badge centered over a video thumbnail. */
.gallery-play {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  color: rgba(245, 240, 229, 0.92);
  pointer-events: none;
  filter: drop-shadow(0 2px 6px rgba(0, 0, 0, 0.55));
}

.lightbox {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 60;
  align-items: center;
  justify-content: center;
  padding: 1.5rem;
  background: rgba(15, 15, 17, 0.93);
}
.lightbox:target {
  display: flex;
}

/* Full-bleed click target behind the media that closes the lightbox. */
.lightbox-backdrop {
  position: absolute;
  inset: 0;
  cursor: zoom-out;
}

.lightbox-media {
  position: relative;
  max-width: 100%;
  max-height: 88vh;
  object-fit: contain;
  border-radius: 0.5rem;
  box-shadow: 0 12px 48px rgba(0, 0, 0, 0.5);
}

.lightbox-close {
  position: absolute;
  top: 1rem;
  right: 1.25rem;
  color: #f5f0e5;
  font-size: 0.8125rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  padding: 0.5rem 0.75rem;
  transition: color 150ms ease;
}
.lightbox-close:hover {
  color: #d9b27a;
}