/* ====== A) SQUARE THUMBNAILS MODE ====== */

/* Slider: each slide is a square box */
.ele-gallery.splide .splide__slide {
  aspect-ratio: 1 / 1;
  overflow: hidden;
  border-radius: 12px;
}

/* Make figure fill slide (Gutenberg wraps images in figure) */
.ele-gallery.splide .splide__slide > figure {
  width: 100%;
  height: 100%;
  margin: 0;
}

/* Image fills the square; gets cropped visually */
.ele-gallery.splide .splide__slide img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* Before JS runs: keep Gutenberg gallery tiles square too */
.wp-block-gallery.ele-gallery figure {
  aspect-ratio: 1 / 1;
  overflow: hidden;
  border-radius: 12px;
}

.wp-block-gallery.ele-gallery figure img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* Optional */
.ele-gallery.splide .splide__track {
  padding-bottom: 8px;
}

.wp-ele-lightbox {
  position: fixed;
  inset: 0;
  z-index: 999999;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 24px;
}

.wp-ele-lightbox.is-open { display: flex; }

.wp-ele-lightbox__bg {
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,.85);
}

.wp-ele-lightbox__img {
  position: relative;
  z-index: 1;
  max-width: 92vw;
  max-height: 88vh;
  width: auto !important;
  height: auto !important;
  object-fit: contain !important;   /* whole image */
  aspect-ratio: auto !important;    /* not 1:1 */
  border-radius: 12px;
}

.wp-ele-lightbox__close {
  position: absolute;
  top: 12px;
  right: 16px;
  z-index: 2;
  font-size: 32px;
  line-height: 1;
  background: transparent;
  border: 0;
  color: #fff;
  cursor: pointer;
}
.ele-gallery.splide .splide__slide.is-full {
  aspect-ratio: auto !important;
  overflow: visible !important;
}

.ele-gallery.splide .splide__slide.is-full > figure {
  height: auto !important;
}

.ele-gallery.splide .splide__slide.is-full img {
  width: 100% !important;
  height: auto !important;
  max-height: 70vh;
  object-fit: contain !important;
}