/**
 * FindEdition — module-detail-gallery-98.2.css
 * Image galleries on module detail pages.
 *
 * Copyright (c) FindEdition Developers. All rights reserved.
 */


.fe982-gallery {
  width: 100%;
  max-width: 100%;
  display: flex;
  flex-direction: column;
  gap: .75rem;
}

.fe982-gallery__stage {
  position: relative;
  width: 100%;
  max-width: 900px;
  max-height: 700px;
  margin: 0 auto;
  overflow: hidden;
  border-radius: .85rem;
  touch-action: pan-y;
}

.fe982-gallery--mobile .fe982-gallery__stage {
  max-width: 760px;
  background: linear-gradient(180deg, #0b1220 0%, #111827 100%);
  border: 1px solid rgba(148, 163, 184, .18);
}

.fe982-gallery--auto .fe982-gallery__stage {
  max-width: 960px;
  background: #09090b;
  border: 1px solid rgba(63, 63, 70, .8);
}

.fe982-gallery--recipe .fe982-gallery__stage {
  max-width: 900px;
  background: #fff7ed;
  border: 1px solid #fed7aa;
}

.fe982-gallery__main-wrap {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.fe982-gallery__main {
  width: 100%;
  height: 100%;
  display: block;
}

.fe982-gallery__main--contain { object-fit: contain; padding: 1rem; box-sizing: border-box; }
.fe982-gallery__main--cover { object-fit: cover; }

.fe982-gallery__nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 4;
  width: 2.75rem;
  height: 2.75rem;
  border: none;
  border-radius: 999px;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(15, 23, 42, .72);
  color: #fff;
  box-shadow: 0 4px 14px rgba(0,0,0,.25);
}
.fe982-gallery__nav:focus-visible { outline: 2px solid #38bdf8; outline-offset: 2px; }
.fe982-gallery__nav--prev { left: .65rem; }
.fe982-gallery__nav--next { right: .65rem; }
.fe982-gallery--recipe .fe982-gallery__nav { background: rgba(154, 52, 18, .85); }
.fe982-gallery--auto .fe982-gallery__nav { background: rgba(0,0,0,.75); }

.fe982-gallery__counter,
.fe982-gallery__role {
  position: absolute;
  z-index: 3;
  font-size: .72rem;
  font-weight: 700;
  padding: .25rem .55rem;
  border-radius: .4rem;
  background: rgba(15, 23, 42, .72);
  color: #f8fafc;
}
.fe982-gallery__counter { bottom: .65rem; right: .65rem; }
.fe982-gallery__role { top: .65rem; left: .65rem; text-transform: uppercase; letter-spacing: .04em; }

.fe982-gallery__caption {
  position: absolute;
  left: .65rem;
  right: 4.5rem;
  bottom: .65rem;
  margin: 0;
  font-size: .8rem;
  color: #f8fafc;
  background: rgba(15, 23, 42, .55);
  padding: .35rem .55rem;
  border-radius: .4rem;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.fe982-gallery__thumbs {
  display: flex;
  gap: .5rem;
  overflow-x: auto;
  padding-bottom: .15rem;
  scroll-snap-type: x proximity;
  -webkit-overflow-scrolling: touch;
}

.fe982-gallery__thumb {
  flex: 0 0 auto;
  width: 4.25rem;
  min-width: 4rem;
  min-height: 4rem;
  padding: 0;
  border: 2px solid transparent;
  border-radius: .55rem;
  overflow: hidden;
  cursor: pointer;
  background: rgba(15, 23, 42, .06);
  scroll-snap-align: start;
}
.fe982-gallery--mobile .fe982-gallery__thumb { width: 4.5rem; background: #0b1220; }
.fe982-gallery--auto .fe982-gallery__thumb { width: 5.5rem; }
.fe982-gallery--recipe .fe982-gallery__thumb { width: 5rem; background: #ffedd5; }

.fe982-gallery__thumb img {
  width: 100%;
  height: 100%;
  display: block;
}

.fe982-gallery__thumb.is-active {
  border-color: #38bdf8;
  box-shadow: 0 0 0 1px rgba(56, 189, 248, .35);
}
.fe982-gallery--auto .fe982-gallery__thumb.is-active { border-color: #f59e0b; }
.fe982-gallery--recipe .fe982-gallery__thumb.is-active { border-color: #ea580c; }

.fe982-gallery__thumb:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 2px;
}

.fe982-gallery__fallback {
  aspect-ratio: 16 / 9;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: .85rem;
}
.fe982-gallery__fallback svg { width: 4.5rem; height: 4.5rem; }
.fe982-gallery__fallback--mobile { aspect-ratio: 4 / 5; max-width: 420px; margin: 0 auto; background: linear-gradient(160deg, #0b1220, #1e293b); color: #94a3b8; }
.fe982-gallery__fallback--auto { background: linear-gradient(160deg, #09090b, #27272a); color: #a1a1aa; }
.fe982-gallery__fallback--recipe { background: linear-gradient(160deg, #fff7ed, #fed7aa); color: #c2410c; }

@media (max-width: 768px) {
  .fe982-gallery__stage { max-height: 560px; border-radius: .65rem; }
  .fe982-gallery__nav { width: 2.5rem; height: 2.5rem; }
}

@media (max-width: 430px) {
  .fe982-gallery__stage { max-height: none; }
  .fe982-gallery__thumb { min-width: 4rem; min-height: 4rem; }
}

@media (prefers-reduced-motion: reduce) {
  .fe982-gallery__main { transition: none !important; }
}