.image-viewer {
  position: relative;
  max-width: 100%;
  margin: 2rem auto;
}

.image-viewer img {
  width: 100%;
  max-height: 75vh;
  object-fit: contain;
  border-radius: 12px;
}

/* Navigation buttons */
.image-viewer .nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 44px;
  height: 44px;
  border-radius: 50%;
  border: none;
  background: rgba(0, 0, 0, 0.6);
  color: white;
  font-size: 26px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  z-index: 10;
}

.image-viewer:hover .nav {
  opacity: 1;
}

.image-viewer .nav.prev {
  left: 12px;
}

.image-viewer .nav.next {
  right: 12px;
}

/* Mobile: always visible */
@media (max-width: 768px) {
  .image-viewer .nav {
    opacity: 1;
  }
}


.image-viewer .viewer-stage img,
.image-viewer .viewer-stage video {
  width: 100%;
  max-height: 75vh;
  object-fit: contain;
  border-radius: 12px;
}


#theme-toggle i {
  transition: transform 0.25s ease, opacity 0.2s ease;
}
/* 
html.theme-dark #theme-toggle i {
  transform: rotate(-20deg) scale(1.1);
} */

#theme-toggle i {
  border: none;       /* remove any border */
  background: none;   /* remove background if any */
  box-shadow: none;   /* remove any shadow */
  padding: 0;         /* remove extra space */
  font-size: 1.2rem;  /* optional size */
  color: var(--accent); /* keep your theme color */
  cursor: pointer;
  transition: transform 0.25s ease, color 0.25s ease;
}

#theme-toggle {
  border: none;
  background: transparent;
  padding: 0.2rem;
}

#theme-toggle {
  border: none;
  background: transparent;
  padding: 0.2rem;
}