/* __MAMA_GALLERY_SELFCONTAINED_CSS__
   Gallery frontend is intentionally scoped so site-theme CSS cannot break it.
*/
.gallery-system-section{--mg-gap:16px;--mg-radius:18px;position:relative}
.gallery-system-section *,
.gallery-system-section *::before,
.gallery-system-section *::after{box-sizing:border-box}

.gallery-system-section .gallery-system{
  position:relative;
  width:100%;
  min-width:0;
}
.gallery-system-section .gallery-viewport{
  position:relative;
  width:100%;
  min-width:0;
}
.gallery-system-section .gallery-track{
  width:100%;
  min-width:0;
  gap:var(--mg-gap);
}
.gallery-system-section .gallery-item{
  position:relative;
  min-width:0;
  margin:0!important;
  padding:0!important;
  overflow:hidden;
  border:0;
  border-radius:var(--mg-radius);
  background:#f3f4f6;
  scroll-snap-align:start;
}
.gallery-system-section .gallery-item[hidden],
.gallery-system-section .gallery-item.is-gallery-hidden{display:none!important}

.gallery-system-section .gallery-item>img,
.gallery-system-section .gallery-item>.gallery-video-preview,
.gallery-system-section .gallery-item>video{
  display:block!important;
  width:100%!important;
  max-width:none!important;
  min-width:0!important;
  margin:0!important;
  border:0!important;
  border-radius:inherit!important;
  object-fit:cover;
  object-position:center;
}
.gallery-system-section .gallery-mode-fit .gallery-item>img,
.gallery-system-section .gallery-mode-fit .gallery-item>.gallery-video-preview,
.gallery-system-section .gallery-mode-fit .gallery-item>video{object-fit:contain;background:#f3f4f6}

.gallery-system-section .gallery-system[data-effective-view="grid"] .gallery-viewport{overflow:visible!important}
.gallery-system-section .gallery-system[data-effective-view="grid"] .gallery-track{
  display:grid!important;
  grid-template-columns:repeat(var(--gallery-cols,3),minmax(0,1fr))!important;
  gap:var(--mg-gap)!important;
  overflow:visible!important;
  transform:none!important;
  scroll-snap-type:none!important;
}
.gallery-system-section .gallery-system[data-effective-view="grid"] .gallery-item{
  width:auto!important;
  max-width:none!important;
  flex:none!important;
}
.gallery-system-section .gallery-system[data-effective-view="grid"] .gallery-item>img,
.gallery-system-section .gallery-system[data-effective-view="grid"] .gallery-item>.gallery-video-preview,
.gallery-system-section .gallery-system[data-effective-view="grid"] .gallery-item>video{
  height:var(--gallery-h,320px)!important;
}
.gallery-system-section .gallery-system[data-effective-view="grid"] .gallery-nav,
.gallery-system-section .gallery-system[data-effective-view="grid"] .gallery-dots{display:none!important}

.gallery-system-section .gallery-system[data-effective-view="slider"] .gallery-viewport{
  overflow:hidden!important;
  width:100%!important;
}
.gallery-system-section .gallery-system[data-effective-view="slider"] .gallery-track{
  display:flex!important;
  align-items:stretch!important;
  gap:var(--mg-gap)!important;
  width:100%!important;
  overflow-x:auto!important;
  overflow-y:hidden!important;
  scroll-snap-type:x mandatory!important;
  scroll-behavior:smooth;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:none;
  touch-action:pan-x pan-y;
}
.gallery-system-section .gallery-system[data-effective-view="slider"] .gallery-track::-webkit-scrollbar{display:none}
.gallery-system-section .gallery-system[data-effective-view="slider"] .gallery-item{
  flex:0 0 var(--mg-slide-width,32%)!important;
  width:var(--mg-slide-width,32%)!important;
  max-width:var(--mg-slide-width,32%)!important;
}
.gallery-system-section .gallery-system[data-effective-view="slider"] .gallery-item>img,
.gallery-system-section .gallery-system[data-effective-view="slider"] .gallery-item>.gallery-video-preview,
.gallery-system-section .gallery-system[data-effective-view="slider"] .gallery-item>video{
  height:var(--gallery-slider-h,460px)!important;
}

.gallery-system-section .gallery-nav{
  position:absolute!important;
  z-index:8!important;
  top:50%!important;
  width:44px!important;
  height:44px!important;
  margin:-22px 0 0!important;
  padding:0!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  border:0!important;
  border-radius:999px!important;
  background:#fff!important;
  color:#111!important;
  box-shadow:0 6px 24px rgba(0,0,0,.16)!important;
  cursor:pointer!important;
  transform:none!important;
}
.gallery-system-section .gallery-nav.gallery-prev{left:12px!important}
.gallery-system-section .gallery-nav.gallery-next{right:12px!important}
.gallery-system-section .gallery-nav:disabled{opacity:.35!important;cursor:default!important}
.gallery-system-section .gallery-nav svg{display:block!important;width:24px!important;height:24px!important}
.gallery-system-section .gallery-dots{
  display:flex;
  justify-content:center;
  align-items:center;
  gap:7px;
  min-height:20px;
  padding-top:12px;
}
.gallery-system-section .gallery-dots button{
  width:7px;
  height:7px;
  min-width:7px;
  margin:0;
  padding:0;
  border:0;
  border-radius:999px;
  background:#c9c9c9;
  font-size:0;
  cursor:pointer;
  transition:width .2s ease,background .2s ease;
}
.gallery-system-section .gallery-dots button.is-active{width:22px;background:#222}

.gallery-system-section .gallery-item figcaption{
  position:relative!important;
  display:flex!important;
  flex-direction:column!important;
  gap:5px!important;
  margin:0!important;
  padding:12px 14px 14px!important;
  background:#fff!important;
  color:inherit!important;
}
.gallery-system-section .gallery-item figcaption em{font-style:normal;opacity:.62;font-size:12px}
.gallery-system-section .gallery-item figcaption b{font-size:16px;line-height:1.3}
.gallery-system-section .gallery-item figcaption span{font-size:14px;line-height:1.45;opacity:.78}
.gallery-system-section .gallery-item figcaption a{position:relative!important;inset:auto!important;display:inline-flex!important;width:max-content!important;height:auto!important;margin-top:4px!important}

.gallery-system-section .gallery-filter-chips{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin:0 0 18px;
}
.gallery-system-section .gallery-filter-chips button,
.gallery-system-section .gallery-category-list button{cursor:pointer}
.gallery-system-section .gallery-filter-chips button.active{font-weight:700}

.gallery-system-section .gallery-video-badge{
  position:absolute;
  left:14px;
  bottom:14px;
  z-index:3;
  width:42px;
  height:42px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:999px;
  background:rgba(0,0,0,.55);
  pointer-events:none;
}

/* Lightbox */
.mama-gallery-lightbox{
  position:fixed;
  inset:0;
  z-index:2147483000;
  display:none;
  align-items:center;
  justify-content:center;
  padding:24px;
  background:rgba(0,0,0,.86);
}
.mama-gallery-lightbox.is-open{display:flex}
.mama-gallery-lightbox__media{max-width:min(92vw,1400px);max-height:88vh;display:block;object-fit:contain;background:#000}
.mama-gallery-lightbox__close,
.mama-gallery-lightbox__prev,
.mama-gallery-lightbox__next{
  position:fixed;
  z-index:2;
  width:46px;
  height:46px;
  border:0;
  border-radius:999px;
  background:#fff;
  color:#111;
  font-size:28px;
  line-height:1;
  cursor:pointer;
}
.mama-gallery-lightbox__close{right:18px;top:18px}
.mama-gallery-lightbox__prev{left:18px;top:50%;transform:translateY(-50%)}
.mama-gallery-lightbox__next{right:18px;top:50%;transform:translateY(-50%)}

@media(max-width:768px){
  .gallery-system-section{--mg-gap:12px}
  .gallery-system-section .gallery-system[data-effective-view="grid"] .gallery-track{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
  .gallery-system-section .gallery-system[data-effective-view="slider"] .gallery-item{
    flex-basis:84%!important;
    width:84%!important;
    max-width:84%!important;
  }
  .gallery-system-section .gallery-system[data-effective-view="slider"] .gallery-item>img,
  .gallery-system-section .gallery-system[data-effective-view="slider"] .gallery-item>.gallery-video-preview,
  .gallery-system-section .gallery-system[data-effective-view="slider"] .gallery-item>video{
    height:var(--gallery-slider-h,360px)!important;
  }
  .gallery-system-section .gallery-system[data-effective-view="slider"] .gallery-nav{display:none!important}
  .gallery-system-section .gallery-dots{display:none!important}
  .mama-gallery-lightbox{padding:12px}
  .mama-gallery-lightbox__prev,.mama-gallery-lightbox__next{display:none}
}