﻿.campaign-tile {
    height: 180px; /* your desired tile height */
    overflow: hidden;
    border-radius: 6px;
}

.campaign-img { /* make images smaller*/
    width: 100%;
    height: 100%;
    object-fit: cover; /* ✅ prevents “crunching” */
    display: block;
}

.carousel-inner {
    padding: 0 100px; /* keeps images away from arrows */
}

.carousel-wrap {
    position: relative;
    display: flex;
    align-items: center;
}

.carousel-external-prev,
.carousel-external-next {
    background: none;
    border: none;
    font-size: 2.8rem;
    color: #fff;
    cursor: pointer;
    padding: 0 30px;
    user-select: none;
}

    .carousel-external-prev:hover,
    .carousel-external-next:hover {
        color: #66cc33;
    }

/* Keeps arrows vertically centered */
#carouselCampaign {
    flex: 1;
}

    #carouselCampaign .carousel-item {
        transition: transform .75s ease-in-out !important;
    }

/* Move indicators below carousel */
.carousel-indicators-bottom {
    position: static; /* removes overlay positioning */
    margin-top: 16px;
}

    /* Make them round dots */
    .carousel-indicators-bottom [data-bs-target] {
        width: 10px;
        height: 10px;
        border-radius: 50%;
        background-color: #bdbdbd;
        opacity: 1;
        margin: 0 6px;
        border: 0;
    }

    /* Active = green */
    .carousel-indicators-bottom .active {
        background-color: #66cc33;
    }
