/* AP Slideshow styles */
.ap-slideshow {
  position: relative;
  width: 100%;
  height: 100vh;
  overflow: hidden;
}
/* New style for the slide container */
.ap-slideshow .ap-slideshow-slide {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
  transition: none;
}

.ap-slideshow .ap-slideshow-slide img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  opacity: 0;
  z-index: 1;
  transform: translateX(0) scale(1);
}
.ap-slideshow .ap-slideshow-slide img.active {
  opacity: 1;
  z-index: 2;
}
/* Styles for FADE effect - Apply transition only when slideshow is set to fade */
.ap-slideshow[data-effect="fade"] .ap-slideshow-slide img {
    transition: opacity var(--ap-slideshow-transition-duration, 1s) ease-in-out; /* Apply opacity transition only for fade effect */
}

/* SLIDE EFFECT */
.ap-slideshow[data-effect="slide"] .ap-slideshow-slide img {
    transition: transform var(--ap-slideshow-transition-duration, 1s) ease-in-out, opacity var(--ap-slideshow-transition-duration, 1s) ease-in-out;
}

/* Initial (for incoming) / Outgoing (for departing) states for slide */
.ap-slideshow[data-effect="slide"] .ap-slideshow-slide img.slide-left {
    transform: translateX(-100%);
    opacity: 0;
}
.ap-slideshow[data-effect="slide"] .ap-slideshow-slide img.slide-right {
    transform: translateX(100%);
    opacity: 0;
}

/* Active state for slide - transitions to center and visible */
.ap-slideshow[data-effect="slide"] .ap-slideshow-slide img.active {
    transform: translateX(0);
    opacity: 1;
}


/* ZOOM EFFECT */
.ap-slideshow[data-effect="zoom"] .ap-slideshow-slide img {
    transition: transform var(--ap-slideshow-transition-duration, 1s) ease-in-out, opacity var(--ap-slideshow-transition-duration, 1s) ease-in-out;
}

/* Initial (for incoming) / Outgoing (for departing) states for zoom */
.ap-slideshow[data-effect="zoom"] .ap-slideshow-slide img.zoom-in {
    transform: scale(1.1);
    opacity: 0;
}

/* Active state for zoom - transitions to normal size and visible */
.ap-slideshow[data-effect="zoom"] .ap-slideshow-slide img.active {
    transform: scale(1);
    opacity: 1;
}

/* Arrows */
.ap-slideshow .ap-slideshow-arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  border: none;
  background: none;
  box-shadow: none;
  font-size: 2rem;
  z-index: 21;
  cursor: pointer;
  padding: 0;
  border-radius: 0;
  user-select: none;
  width: 50px;
  height: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: auto;
  opacity: 0;
  transition: opacity 0.4s;
}
.ap-slideshow .ap-slideshow-arrow.edge-active {
  opacity: 1;
}
.ap-slideshow .ap-slideshow-arrow.left {
  left: 10px;
}
.ap-slideshow .ap-slideshow-arrow.right {
  right: 10px;
}
.ap-slideshow .ap-slideshow-arrow:hover .ap-slideshow-arrow-svg {
  stroke: #23282d;
}
.ap-slideshow-arrow-svg {
  width: 45px;
  height: 45px;
  display: block;
  transition: stroke 0.2s;
}
.ap-slideshow .ap-slideshow-arrow:focus {
  outline: none;
  box-shadow: none;
}
.ap-slideshow .ap-slideshow-arrow.edge-active:hover .ap-slideshow-arrow-svg {
  animation: fade-arrow-bounce 2s linear infinite alternate;
}
@keyframes fade-arrow-bounce {
  0%   {transform: scale(1);}
  50%  {transform: scale(1.2);}
  100% {transform: scale(1);}
}
.ap-slideshow .ap-slideshow-edge {
  position: absolute;
  top: 0;
  width: 45%;
  height: 100% !important;
  z-index: 20;
  cursor: pointer;
  background: transparent;
  display: block;
  pointer-events: auto;
}
.ap-slideshow .ap-slideshow-edge-left {
  left: 0;
  cursor: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32"><path d="M15.41 16.59L10.83 12l4.58-4.59L14 6l-6 6 6 6 1.41-1.41z" fill="%23AEACA6"/></svg>') 16 16, w-resize;
}
.ap-slideshow .ap-slideshow-edge-right {
  right: 0;
  cursor: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32"><path d="M8.59 16.59L13.17 12 8.59 7.41 10 6l6 6-6 6-1.41-1.41z" fill="%23AEACA6"/></svg>') 16 16, e-resize;
}

/* Dots */
.ap-slideshow-dots {
    position: absolute;
    bottom: 20px;
    left: 0; /* Cover the whole width from the left */
    width: 100%; /* Cover the whole width */
    z-index: 20;
    display: flex;
    justify-content: space-around; /* Distribute dots evenly */
    align-items: center; /* Vertically center dots on the line */
    height: 1px; /* Height to contain the dots and the line */
    background: #AEACA6; /* Thin line background */
}
.ap-slideshow-dot {
    width: 15px;
    height: 15px;
    border-radius: 50%;
    background: #23282d; /* Set background to transparent for inactive state */
    border: 1px solid #AEACA6; /* White/grey contour */
    cursor: pointer;
    transition: background 0.7s, border-color 0.7s;
    flex-shrink: 0; /* Prevent dots from shrinking */
}
.ap-slideshow-dot.active {
    background: #AEACA6; /* Filled white/grey when active */
    border-color: #AEACA6; /* Ensure border matches fill color when active */
}

/* Caption */
.ap-slideshow-caption {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    text-align: center;
    color: #fff;
    background: rgba(0,0,0,0.5);
    padding: 8px 16px;
    font-size: 1.1em;
    z-index: 30;
    border-radius: 4px;
    pointer-events: none;
}
.ap-slideshow-link {
    position: absolute;
    left: 50%;
    bottom: 40px;
    transform: translateX(-50%);
    z-index: 30;
    display: none;
    pointer-events: auto;
}
.ap-slideshow-link-inner {
    display: inline-block;
    background: rgba(0,0,0,0.5);
    color: #fff;
    padding: 0px 25px;
    border-radius: 12px;
    font-size: 1.1em;
    text-decoration: none;
    transition: background 1s;
    text-align: center;
}
.ap-slideshow-link-inner:hover {
    background: rgba(0,0,0,0.9);
}