/* === SLIDESHOW PAGE === */
body.slideshow-page {
    overflow: hidden;
    height: 100vh;
    margin: 0;
    padding: 0;
}

/* Hide navbar */
body.slideshow-page nav.navbar.swiper-navbar {
    display: none;
}

/* Full screen for content containers */
body.slideshow-page .contentZone,
 {
    margin: 0;
    padding: 0;
    height: calc(100vh - 140px);
    width: 100vw;
}
.slideshow-swiper {
    height: 100vh;
    width: 100vw;
    box-sizing: border-box;
    padding-top: 100px;
    align-items: center;
    padding-left: 0px;
}

.slideshow-swiper .swiper-slide {
    display: flex;
    justify-content: center; /* Center horizontally */
    align-items: center; /* Center vertically */
    height: calc(100vh - 100px); /* Adjust height as needed */
    width: 100vw; /* Ensure slide takes full viewport width */
    padding: 0;
    border: 0px solid orange;
}

/* Card - size to fit content, not container */
.slideshow-swiper .card {
    border: none;
    background: none;
    display: flex;

    padding: 0;
    margin: 0;
    width: auto; /* Let width adjust to image */
    height: auto; /* Let height adjust to image */
    max-height: calc(100vh - 160px); /* Don't exceed available space */
    max-width: 90vw; /* Don't exceed 90% of viewport width */

}

/* Content wrapper - size to image */
.slideshow-card-text {
    width: auto;
    height: auto;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    margin: 0;

}

/* Reset paragraphs */
.slideshow-card-text p {
    margin: 0 !important;
    padding: 0 !important;
    line-height: 0 !important;
    font-size: 0 !important;
    width: auto !important;
    height: auto !important;
    display: inline !important;
}

/* Image - respect natural size but limit to container */
.slideshow-card-text img {
    width: auto !important;
    height: auto !important;
    max-width: 85vw !important; /* Don't exceed viewport */
    max-height: calc(100vh - 160px) !important; /* Don't exceed available height */
    object-fit: contain !important;
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
}


/* === NAVIGATION ARROWS === */
.slideshow-swiper .swiper-button-prev,
.slideshow-swiper .swiper-button-next {
    width: 20px;
    height: 20px;
    visibility: visible !important;
    display: block !important;
    z-index: 10;
    background-size: contain;
    background-repeat: no-repeat;
    color: #000;
    top: 50%;
    transform: translateY(-50%);
    position: absolute;
}

.slideshow-swiper .swiper-button-prev {
    left: 15px;
}

.slideshow-swiper .swiper-button-next {
    right: 15px;
}