.carousel-control-prev-icon {
    background-image: none;
    width: 40px;
    height: 40px;
    background-color: #007bff;
    mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" fill="white" viewBox="0 0 8 8"><path d="M4.5 0L3.5 1 6 4 3.5 7 4.5 8 8 4z"/></svg>') no-repeat center;
    -webkit-mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" fill="white" viewBox="0 0 8 8"><path d="M4.5 0L3.5 1 6 4 3.5 7 4.5 8 8 4z"/></svg>') no-repeat center;
    mask-size: contain;
    -webkit-mask-size: contain;
    transform: rotate(180deg); /* flip for left arrow */
}

.carousel-control-next-icon {
    background-image: none;
    width: 40px;
    height: 40px;
    background-color: #007bff;
    mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" fill="white" viewBox="0 0 8 8"><path d="M4.5 0L3.5 1 6 4 3.5 7 4.5 8 8 4z"/></svg>') no-repeat center;
    -webkit-mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" fill="white" viewBox="0 0 8 8"><path d="M4.5 0L3.5 1 6 4 3.5 7 4.5 8 8 4z"/></svg>') no-repeat center;
    mask-size: contain;
    -webkit-mask-size: contain;
}

/* Target the wrapper and any paragraph/div tags generated inside it */
.text-lg-justify,
.text-lg-justify p,
.text-lg-justify div {
    text-align: justify;
    text-justify: inter-word; /* Helps browsers distribute spacing better */
}

@media (min-width: 992px) {
    .text-lg-justify, .text-lg-justify * {
        text-align: justify !important;
    }
    .custom-justify, .custom-justify p, .custom-justify div {
        text-align: justify !important;
        text-justify: inter-word;
    }
}

@media (max-width: 991px) {
    .text-lg-justify, .text-lg-justify * {
        text-align: center !important;
    }
     .custom-justify, .custom-justify p {
        text-align: center !important;
    }
    /* Hide side buttons on very small screens if they crowd the image */
    .carousel-nav-btn {
        transform: scale(0.8);
    }
}

/* Make the image smaller and centered */
.cta-img-small {
    max-width: 100%; /* Adjust this percentage to make it smaller */
    height: auto;
    box-shadow: 0 10px 30px rgba(0,0,0,0.1);
}

/* Fix the button positioning so they don't overlap */
.carousel-nav-btn {
    background: transparent;
    border: none;
    z-index: 10;
    cursor: pointer;
    transition: transform 0.2s;
}

.carousel-nav-btn:hover {
    transform: scale(1.1);
}

/* Fix carousel trembling - consistent height across slides */
#ctaCarousel .carousel-item .row {
    min-height: 220px;
}
#ctaCarousel .carousel-inner {
    overflow: hidden;
}

/* Ensure short_description content is always justified */
.cta-content,
.cta-content p,
.cta-content div,
.cta-content span,
.cta-content li {
    text-align: justify !important;
    text-justify: inter-word;
}
.cta-content h1, .cta-content h2, .cta-content h3,
.cta-content h4, .cta-content h5, .cta-content h6 {
    text-align: left !important;
}

@media (max-width: 991px) {
    #ctaCarousel .carousel-item .row {
        min-height: 280px;
    }
    .cta-content,
    .cta-content p,
    .cta-content div,
    .cta-content span {
        text-align: justify !important;
    }
}
