.smSlide {
  display: none;
  width: 100%;
  position: relative;
  overflow: hidden;
}

.smSlide img {
  display: block;
  width: 100%;
  height: auto;
}

.sm-caption {
  position: absolute;
  bottom: 20px;
  left: 50%;
  transform: translateX(-50%);
  background: rgba(0, 0, 0, 0.6);
  color: #fff;
  padding: 8px 16px;
  border-radius: 4px;
  opacity: 0;
  transition: opacity 0.6s ease-in-out;
  pointer-events: none;
  max-width: 90%;
  text-align: center;
  z-index: 2;
}

.sm-caption.active { opacity: 1; }

.sm-prev-btn,
.sm-next-btn {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  background: rgba(0, 0, 0, 0.2);
  color: white;
  border: none;
  border-radius: 50%;
  width: 34px;
  height: 34px;
  font-size: 20px;
  cursor: pointer;
}

.sm-prev-btn:hover,
.sm-next-btn:hover {
  background-color: rgba(0, 0, 0, 0.5); /* ✅ hover effect */
}

.sm-prev-btn { left: 10px; }
.sm-next-btn { right: 10px; }


/* Εφέ fade */
.sm-fade { animation: smFade 1s ease-in-out; }
@keyframes smFade {
  from { opacity: 0; }
  to { opacity: 1; }
}


/* Εφέ zoom */
.sm-zoom-out { animation: smZoomOut 1s ease-in-out; }
@keyframes smZoomOut {
  from { transform: scale(1.2); opacity: 0; }
  to { transform: scale(1); opacity: 1; }
}

.sm-zoom-in { animation: smZoomIn 1s ease-in-out; }
@keyframes smZoomIn {
  from { transform: scale(0.8); opacity: 0; }
  to { transform: scale(1); opacity: 1; }
}


/* Εφέ slide-right (από δεξιά προς τα αριστερά) */
.sm-slide-right { animation: smSlideRight 1s ease-in-out; }
@keyframes smSlideRight {
  from { transform: translateX(100%); opacity: 0; }
  to { transform: translateX(0); opacity: 1; }
}

/* slide-left (από αριστερά προς τα δεξιά) */
.sm-slide-left { animation: smSlideLeft 1s ease-in-out; }
@keyframes smSlideLeft {
  from { transform: translateX(-100%); opacity: 0; }
  to { transform: translateX(0); opacity: 1; }
}

/* slide-up (από κάτω προς τα πάνω) */
.sm-slide-up { animation: smSlideUp 1s ease-in-out; }
@keyframes smSlideUp {
  from { transform: translateY(100%); opacity: 0; }
  to { transform: translateY(0); opacity: 1; }
}

/* slide-down (από πάνω προς τα κάτω) */
.sm-slide-down { animation: smSlideDown 1s ease-in-out; }
@keyframes smSlideDown {
  from { transform: translateY(-100%); opacity: 0; }
  to { transform: translateY(0); opacity: 1; }
}


/* sm-flip-horizontal */
.sm-flip-horizontal {
  animation: smFlipHorizontal 0.6s ease-out forwards;
  transform-origin: center;
}
@keyframes smFlipHorizontal {
  0% { transform: rotateY(-90deg); opacity: 0; }
  100% { transform: rotateY(0); opacity: 1; }
}

/* sm-flip-vertical */
.sm-flip-vertical {
  animation: smFlipVertical 0.6s ease-out forwards;
  transform-origin: center;
}
@keyframes smFlipVertical {
  0% { transform: rotateX(90deg); opacity: 0; }
  100% { transform: rotateX(0); opacity: 1; }
}


/* sm-reveal */
.sm-reveal {
  animation: smReveal 1s ease-in-out forwards;
  position: relative;
  overflow: hidden;
}

@keyframes smReveal {
  0% {clip-path: polygon(0 50%, 100% 50%, 100% 50%, 0 50%); opacity: 0;}
  100% {clip-path: polygon(0 0%, 100% 0%, 100% 100%, 0 100%); opacity: 1;}
}