/* ViraShop image gallery */
.vs-gallery-block {
  width: 100%;
  margin: var(--vs-gallery-block-margin, 1rem 0);
}
.vs-gallery-block__header {
  margin-bottom: .75rem;
}
.vs-gallery-block__title {
  margin: 0 0 .25rem;
  font-size: 1.35rem;
}
.vs-gallery-block__subtitle {
  margin: 0;
  opacity: .75;
}

.vs-gallery {
  position: relative;
  width: 100%;
  margin: 0;
  display: block;
  --vs-gallery-gap: 12px;
  --vs-gallery-aspect: 4/3;
  --vs-gallery-radius: 12px;
  --vs-gallery-fit: cover;
  --vs-gallery-cols-desktop: 3;
  --vs-gallery-cols-tablet: 2;
  --vs-gallery-cols-mobile: 1;
}
.vs-gallery__head {
  margin-bottom: .85rem;
}
.vs-gallery__title {
  margin: 0 0 .25rem;
  font-size: 1.25rem;
}
.vs-gallery__subtitle {
  margin: 0;
  opacity: .75;
}

.vs-gallery__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: var(--vs-gallery-gap);
}
.vs-gallery__list--grid {
  grid-template-columns: repeat(var(--vs-gallery-cols-desktop), minmax(0, 1fr));
}
.vs-gallery__list--masonry {
  columns: var(--vs-gallery-cols-desktop);
  column-gap: var(--vs-gallery-gap);
  display: block;
}
.vs-gallery__list--masonry .vs-gallery__item {
  break-inside: avoid;
  margin-bottom: var(--vs-gallery-gap);
}
.vs-gallery__list--justified {
  display: flex;
  flex-wrap: wrap;
  gap: var(--vs-gallery-gap);
}
.vs-gallery__list--justified .vs-gallery__item {
  flex: 1 1 calc((100% / var(--vs-gallery-cols-desktop)) - var(--vs-gallery-gap));
  min-width: 140px;
}
.vs-gallery__list--collage {
  grid-template-columns: repeat(6, minmax(0, 1fr));
  grid-auto-rows: 80px;
}
.vs-gallery__list--collage .vs-gallery__item:nth-child(6n+1) { grid-column: span 3; grid-row: span 2; }
.vs-gallery__list--collage .vs-gallery__item:nth-child(6n+2) { grid-column: span 2; grid-row: span 2; }
.vs-gallery__list--collage .vs-gallery__item:nth-child(6n+3) { grid-column: span 1; grid-row: span 1; }
.vs-gallery__list--collage .vs-gallery__item:nth-child(6n+4) { grid-column: span 2; grid-row: span 1; }
.vs-gallery__list--collage .vs-gallery__item:nth-child(6n+5) { grid-column: span 1; grid-row: span 2; }
.vs-gallery__list--collage .vs-gallery__item:nth-child(6n) { grid-column: span 3; grid-row: span 1; }

.vs-gallery__item {
  position: relative;
  min-width: 0;
}
.vs-gallery__figure {
  position: relative;
  margin: 0;
  overflow: hidden;
  border-radius: var(--vs-gallery-radius);
  background: #0f172a;
  aspect-ratio: var(--vs-gallery-aspect);
}
.vs-gallery--masonry .vs-gallery__figure,
.vs-gallery__list--masonry .vs-gallery__figure {
  aspect-ratio: auto;
}
.vs-gallery__link {
  display: block;
  width: 100%;
  height: 100%;
  color: inherit;
  text-decoration: none;
}
.vs-gallery__img {
  width: 100%;
  height: 100%;
  object-fit: var(--vs-gallery-fit);
  display: block;
  transition: transform .35s ease, opacity .35s ease;
}
.vs-gallery--hover-zoomfade .vs-gallery__figure:hover .vs-gallery__img,
.vs-gallery--hover-scaleup .vs-gallery__figure:hover .vs-gallery__img {
  transform: scale(1.06);
}
.vs-gallery--hover-fadeoverlay .vs-gallery__overlay {
  opacity: 0;
  transition: opacity .3s ease;
}
.vs-gallery--hover-fadeoverlay .vs-gallery__figure:hover .vs-gallery__overlay {
  opacity: 1;
}
.vs-gallery--hover-captionreveal .vs-gallery__caption,
.vs-gallery--hover-captionreveal .vs-gallery__overlay {
  transform: translateY(100%);
  transition: transform .35s ease;
}
.vs-gallery--hover-captionreveal .vs-gallery__figure:hover .vs-gallery__caption,
.vs-gallery--hover-captionreveal .vs-gallery__figure:hover .vs-gallery__overlay {
  transform: translateY(0);
}

.vs-gallery__badge {
  position: absolute;
  top: .55rem;
  inset-inline-start: .55rem;
  z-index: 2;
  padding: .2rem .55rem;
  border-radius: 999px;
  background: rgba(15, 23, 42, .72);
  color: #fff;
  font-size: .75rem;
}
.vs-gallery__overlay,
.vs-gallery__caption {
  position: absolute;
  inset: auto 0 0 0;
  padding: .75rem .85rem;
  background: linear-gradient(transparent, rgba(15, 23, 42, .78));
  color: #fff;
  z-index: 2;
}
.vs-gallery__overlay-title {
  display: block;
  font-weight: 700;
}
.vs-gallery__overlay-text,
.vs-gallery__caption {
  font-size: .875rem;
  opacity: .92;
}
.vs-gallery__layers {
  position: absolute;
  inset: 0;
  pointer-events: none;
}
.vs-gallery__layer {
  position: absolute;
  pointer-events: auto;
}

/* Carousel variant */
.vs-gallery__carousel {
  position: relative;
}
.vs-gallery__viewport {
  overflow: hidden;
}
.vs-gallery__track {
  display: flex;
  transition: transform .45s cubic-bezier(.22, 1, .36, 1);
}
.vs-gallery--carousel .vs-gallery__item {
  flex: 0 0 calc((100% - (var(--vs-gallery-cols-desktop) - 1) * var(--vs-gallery-gap)) / var(--vs-gallery-cols-desktop));
  margin-inline-end: var(--vs-gallery-gap);
}
.vs-gallery--carousel .vs-gallery__item.is-active { z-index: 1; }
.vs-gallery__nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 3;
  width: 2.25rem;
  height: 2.25rem;
  border: 0;
  border-radius: 999px;
  background: rgba(15, 23, 42, .72);
  color: #fff;
  cursor: pointer;
}
.vs-gallery__nav--prev { inset-inline-start: .5rem; }
.vs-gallery__nav--next { inset-inline-end: .5rem; }
.vs-gallery__dots {
  display: flex;
  justify-content: center;
  gap: .35rem;
  margin-top: .65rem;
}
.vs-gallery__dot {
  width: .55rem;
  height: .55rem;
  border: 0;
  border-radius: 999px;
  background: #cbd5e1;
  cursor: pointer;
}
.vs-gallery__dot.is-active { background: #0f766e; }

/* Lightbox overlay */
.vs-gallery-lightbox {
  position: fixed;
  inset: 0;
  z-index: 9999;
  background: rgba(2, 6, 23, .92);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1rem;
}
.vs-gallery-lightbox__img {
  max-width: min(96vw, 1200px);
  max-height: 86vh;
  object-fit: contain;
  border-radius: 8px;
}
.vs-gallery-lightbox__caption {
  position: absolute;
  inset: auto 0 1rem 0;
  text-align: center;
  color: #fff;
  padding: 0 1rem;
}
.vs-gallery-lightbox__close,
.vs-gallery-lightbox__prev,
.vs-gallery-lightbox__next {
  position: absolute;
  border: 0;
  background: rgba(255, 255, 255, .12);
  color: #fff;
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 999px;
  cursor: pointer;
}
.vs-gallery-lightbox__close { top: 1rem; inset-inline-end: 1rem; }
.vs-gallery-lightbox__prev { inset-inline-start: 1rem; top: 50%; transform: translateY(-50%); }
.vs-gallery-lightbox__next { inset-inline-end: 1rem; top: 50%; transform: translateY(-50%); }

.vs-gallery--placeholder,
.vs-gallery--warn {
  padding: 1rem 1.25rem;
  border: 1px dashed #cbd5e1;
  border-radius: 12px;
  background: #f8fafc;
  color: #334155;
}
.vs-gallery--warn { border-color: #fdba74; background: #fff7ed; }

@media (max-width: 1024px) {
  .vs-gallery__list--grid { grid-template-columns: repeat(var(--vs-gallery-cols-tablet), minmax(0, 1fr)); }
  .vs-gallery__list--masonry { columns: var(--vs-gallery-cols-tablet); }
  .vs-gallery--carousel .vs-gallery__item {
    flex-basis: calc((100% - (var(--vs-gallery-cols-tablet) - 1) * var(--vs-gallery-gap)) / var(--vs-gallery-cols-tablet));
  }
}
@media (max-width: 768px) {
  .vs-gallery__list--grid { grid-template-columns: repeat(var(--vs-gallery-cols-mobile), minmax(0, 1fr)); }
  .vs-gallery__list--masonry { columns: var(--vs-gallery-cols-mobile); }
  .vs-gallery--carousel .vs-gallery__item {
    flex-basis: calc((100% - (var(--vs-gallery-cols-mobile) - 1) * var(--vs-gallery-gap)) / var(--vs-gallery-cols-mobile));
  }
}
.vs-gallery--hide-desktop { display: none; }
@media (max-width: 1024px) {
  .vs-gallery--hide-desktop { display: block; }
  .vs-gallery--hide-tablet { display: none; }
}
@media (max-width: 768px) {
  .vs-gallery--hide-tablet { display: block; }
  .vs-gallery--hide-mobile { display: none; }
}