/* Shared masonry styles for all Spaces pages */

.image-container {
  width: 100%;
  border-radius: 4px;
  overflow: hidden;
}

.image-container img {
  width: 100%;
  height: auto;
  display: block;
}

.image-container video {
  width: 100%;
  height: auto;
  display: block;
  background: #000;
}

.image-gallery-grid {
  position: relative;
  width: 100%;
  box-sizing: border-box;
}

.image-gallery-grid > * {
  display: block;
  position: absolute;
  box-sizing: border-box;
  transition: transform 0.3s ease;
}

/* If tiles are links (Gallery), remove default underline */
.image-gallery-grid > a {
  text-decoration: none;
  color: inherit;
}

.image-gallery-grid .image-container {
  width: 100%;
  max-width: 100%;
  overflow: hidden;
  display: block;
  margin: 0;
  box-sizing: border-box;
}

/* Prevent lazy-load deadlock for absolutely-positioned masonry tiles */
.image-gallery-grid.gallery-masonry-grid .image-container {
  min-height: 220px;
  background: rgba(0, 0, 0, 0.03);
}

.image-gallery-grid .image-container img {
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  display: block !important;
  object-fit: contain !important;
  box-sizing: border-box !important;
}

.video-tile .video-thumb-frame img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
}

.video-tile .video-thumb-frame video {
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
}

.image-gallery-grid .image-container video {
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  display: block !important;
  object-fit: contain !important;
  box-sizing: border-box !important;
}