Как добавить и центрировать текст в карусели bootstrap 5?

Пробовал для класса carousel-item добавить display: block; в CSS. А к самому классу добавил text-center. Не помогло. Вот пустая версия карусели, которую я использую.

        <div id="carouselExampleControls" class="carousel slide" data-bs-ride="carousel">
            <div class="carousel-inner">
                <div class="carousel-item active">
                    <img src="/assets/images/slider-1.png" class="d-block w-100" alt="...">
                </div>
                <div class="carousel-item">
                    <img src="/assets/images/slider-2.jpg" class="d-block w-100" alt="...">
                </div>
            </div>
            <button class="carousel-control-prev" type="button" data-bs-target="#carouselExampleControls"
                data-bs-slide="prev">
                <span class="carousel-control-prev-icon" aria-hidden="true"></span>
                <span class="visually-hidden">Предыдущий</span>
            </button>
            <button class="carousel-control-next" type="button" data-bs-target="#carouselExampleControls"
                data-bs-slide="next">
                <span class="carousel-control-next-icon" aria-hidden="true"></span>
                <span class="visually-hidden">Следующий</span>
            </button>
        </div>
    </section>```