.table td{color:#000}input.form-control[type=text],select.form-select,textarea{color:#000!important}.alert{display:flex;align-items:center;padding:15px;margin-bottom:20px;border-radius:5px;font-size:16px}.alert.success{padding:10px;background-color:#4caf50;color:#fff;border-radius:5px}.alert.error{background-color:#f8d7da;border-color:#f5c6cb;color:#721c24}.circle-icon{width:30px;height:30px;border-radius:50%;display:inline-flex;justify-content:center;align-items:center;font-size:16px;margin-right:10px}.circle-icon.success{background-color:#fff;color:#4caf50}.circle-icon.error{background-color:#dc3545;color:#fff}.alert span{flex-grow:1}.alert.error span,.alert.success span{font-size:14px}
/* Fixed height for every slide (adjust as needed) */
#heroCarousel .carousel-item {
    height: 420px;
    background: #f8f9fa; /* light bg for visibility */
}

/* Make inner row fill the slide height */
#heroCarousel .slide-row {
    height: 100%;
}

/* Keep image fully visible without crop; center it vertically */
#heroCarousel .slide-img {
    max-height: 100%;
    width: 100%;
    object-fit: contain;
    display: block;
}

/* Readable text box */
#heroCarousel .text-box {
    background: rgba(255,255,255,.9);
    padding: 16px 20px;
    border-radius: 10px;
}

/* Dot indicators, not numbers */
#heroCarousel .carousel-indicators [data-bs-target] {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: #666;
}

#heroCarousel .carousel-indicators .active {
    background: #000;
}
#heroCarousel .carousel-indicators {
    position: absolute;
    bottom: 15px; /* move up a bit */
    left: 50%;
    transform: translateX(-50%);
    margin: 0;
    display: flex;
    gap: 8px; /* spacing between dots */
}

    #heroCarousel .carousel-indicators [data-bs-target] {
        flex: 0 0 auto; /* prevent stretching */
        width: 12px;
        height: 12px;
        border-radius: 50%;
        background-color: #aaa;
        border: none;
    }

    #heroCarousel .carousel-indicators .active {
        background-color: #000;
    }
.first-letter {
    font-size: 2.5rem; /* make first letter bigger if you want */
}