/* Container */
.makeawish-carousel {
    width: 500px;
/*    height: 350px; */
    overflow: hidden; /* hide extra slides */
    border-radius: 6px;
}

/* Slide layout */
.makeawish-carousel .swiper-wrapper {
    display: flex;
    transition: transform 0.3s ease-in-out;
}

/* Slide */
.makeawish-carousel .swiper-slide {
    width: 500px;
    height: auto;
    display: block;
    text-align: center;
    flex-shrink: 0;  
}

/* Image */
.makeawish-carousel img {
    width: 500px;
    height: 375px;
    object-fit: cover;
    border-radius: 6px;
    display: block;
    margin: 0 auto;
}

/* Caption below image */
.makeawish-caption {
    color: #115e67;
    margin-top: 8px;
    font-size: 0.95rem;
    text-align: center;
}

/* External caption under carousel */
.makeawish-caption-external {
    text-align: center;
    margin-top: 12px;
    font-size: 1rem;
    color: #115e67;
}

/* Wrapper holds carousel + buttons */
.makeawish-carousel-wrapper {
    position: relative;
    width: 500px;
    margin: 40px auto;
}

/* Buttons container (absolute, vertical centered) */
.makeawish-buttons {
    position: absolute;
    top: 50%;
    left: -50px;              /* move whole button group left */
    width: calc(100% + 100px); /* extend width both sides */
    display: flex;
    justify-content: space-between;
    transform: translateY(-50%);
    z-index: 10;
}


/* Individual buttons */
.makeawish-buttons .swiper-button-prev,
.makeawish-buttons .swiper-button-next {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: rgba(255,255,255,0.8);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    color: var(--atrio-secondary);
    cursor: pointer;
}

.makeawish-buttons .swiper-button-prev:hover,
.makeawish-buttons .swiper-button-next:hover {
    background: rgba(255,255,255,1);
}

.makeawish-pagination {
    position: relative;   /* NOT absolute */
    min-height: 20px;
    margin-top: 15px;
    text-align: center;
}

.makeawish-pagination .swiper-pagination-bullet {
    background-color: var(--atrio-secondary);
    opacity: 0.5;
}

.makeawish-pagination .swiper-pagination-bullet-active {
    background-color: var(--atrio-secondary);
    opacity: 1;
}