/*
 * Experience modal gallery.
 * Keep the thumbnail viewport at three items; additional images scroll
 * horizontally inside the same viewport instead of wrapping into another row.
 */
.exp-modal-thumbs {
  flex-wrap: nowrap;
  width: 100%;
  max-width: 100%;
  overflow-x: auto;
  overflow-y: hidden;
  padding-bottom: 0.2rem;
  scroll-behavior: smooth;
  scroll-snap-type: x proximity;
  overscroll-behavior-x: contain;
  touch-action: pan-x;
  cursor: grab;
  scrollbar-width: thin;
  scrollbar-color: #a83829 transparent;
}

.exp-modal-thumbs.is-dragging {
  cursor: grabbing;
  scroll-behavior: auto;
  user-select: none;
}

.exp-modal-thumb {
  flex: 0 0 calc((100% - 1rem) / 3);
  width: calc((100% - 1rem) / 3);
  scroll-snap-align: start;
}

.exp-modal-thumb img {
  height: auto;
  aspect-ratio: 4 / 3;
  object-fit: cover;
}

.exp-modal-html strong,
.exp-modal-html b {
  font-weight: 700;
}

.exp-modal-thumbs::-webkit-scrollbar {
  height: 0.25rem;
}

.exp-modal-thumbs::-webkit-scrollbar-track {
  background: transparent;
}

.exp-modal-thumbs::-webkit-scrollbar-thumb {
  background: #a83829;
  border-radius: 999px;
}