#viewer {
	margin-top: 2em;
}

#viewer .gallery {
	width: 80vw;
	max-height: 90vh;
	position: relative;
}

/* ===== ÑÒÈËÈ ÄËß ÐÅÆÈÌÀ FADE ===== */
.carousel-cell {
  width: 100%;
  height: 90vh;
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
}

.carousel-cell img.carousel-image {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  display: block;
  opacity: 1;
}

/* ===== ÊÍÎÏÊÀ ÏÎËÍÎÝÊÐÀÍÍÎÃÎ ÐÅÆÈÌÀ ===== */
/* Êíîïêà äîëæíà áûòü ÏÎÂÅÐÕ èçîáðàæåíèÿ */
.flickity-fullscreen-button {
  position: absolute !important;
  top: 10px !important;
  right: 10px !important;
  z-index: 1000 !important;
  background: rgba(0, 0, 0, 0.5) !important;
  color: white !important;
  border: none !important;
  padding: 8px 12px !important;
  border-radius: 4px !important;
  cursor: pointer !important;
  font-size: 16px !important;
  transition: background 0.3s ease !important;
}

.flickity-fullscreen-button:hover {
  background: rgba(0, 0, 0, 0.8) !important;
}

.flickity-fullscreen-button:active {
  background: rgba(0, 0, 0, 0.9) !important;
}

/* Åñëè êíîïêà âíóòðè .flickity-slider */
.flickity-slider .flickity-fullscreen-button {
  position: absolute !important;
  top: 10px !important;
  right: 10px !important;
  z-index: 1000 !important;
}

/* ===== ÊÍÎÏÊÈ ÍÀÂÈÃÀÖÈÈ ===== */
.flickity-prev-next-button {
  z-index: 100 !important;
}

.flickity-page-dots {
	bottom: -55px !important;
}

/* fade ðåæèì */
.flickity-enabled.is-fade .flickity-slider > * {
	pointer-events: none;
	z-index: 0;
}

.flickity-enabled.is-fade .flickity-slider > .is-selected {
	pointer-events: auto;
	z-index: 1;
}

/* ===== ÊÍÎÏÊÀ ÎÒËÀÄÊÈ Â ÊÎÍÖÅ ÑÒÐÀÍÈÖÛ ===== */
#debug-toggle-btn {
  display: block;
  margin: 20px auto;
  padding: 10px 20px;
  background: #4a5568;
  color: white;
  border: none;
  border-radius: 4px;
  cursor: pointer;
  font-size: 14px;
  transition: background 0.3s ease;
}

#debug-toggle-btn:hover {
  background: #2d3748;
}