Bootstrap carousel not sliding and even the buttons are not working

I HAVE COPIED THIS CAROUSEL CODE FROM BOOTSTRAP THE CODE ITSELF WAS NOT WORKING ON CODEPLY AS WELL AND WHEN I USED IT INSIDE MY CODE THE BUTTONS ARE VISIBLE BUT THEY ARE NOT WORKING AS WE PRESS ON THEM.IF I KEEP THE THE SECOND CAROUSEL ITEM ACTIVE THEN ONLY SECOND ITEM SHOWS UP .

<!-- bootstrap links used for carousel -->
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.1/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-iYQeCzEYFbKjA/T2uDLTpkwGzCiq6soy8tYaI1GyVh/UjpbCx/TYkiZhlZB6+fzT" crossorigin="anonymous" />
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.1/dist/js/bootstrap.bundle.min.js" integrity="sha384-u1OknCvxWvY5kfmNBILK2hRnQC3Pr17a+RTT6rIHI7NnikvbZlHgTPOOmMi466C8" crossorigin="anonymous"></script>
enter code here

<!--code of index.html file -->

<section id="testimonials">
  <div id="testimonial-carousel" class="carousel slide" data-ride="false">
    <div class="carousel-inner">
      <div class="carousel-item active">
        <h2>I no longer have to sniff other dogs for love. I've found the hottest Corgi on TinDog. Woof.</h2>
        <img class="testimonial-image" src="images/dog-img.jpg" alt="dog-profile" />
        <em>Pebbles, New York</em>
      </div>
      <div class="carousel-item">
        <h2 id="testimonial-text">My dog used to be so lonely, but with TinDog's help, they've found the love of their life. I think.</h2>
        <img class="testimonial-image" src="images/lady-img.jpg" alt="lady-profile" />
        <em>Beverly, Illinois</em>
      </div>
    </div>
    <a class="carousel-control-prev" href="#testimonial-carousel" role="button" data-slide="prev">
      <span class="carousel-control-prev-icon"></span>
    </a>
    <a class="carousel-control-next" href="#testimonial-carousel" role="button" data-slide="next">
      <span class="carousel-control-next-icon"></span>
    </a>
  </div>
</section>

    
<!-- stylesheet code used for the carousel (styles.css) -->

#testimonials{
    text-align: center;
    background-color: #ef8172;
    color: #fff;
}

.testimonial-image{
    width: 10%;
    border-radius: 100%;
    margin: 20px;
}

.carousel-item{
    padding: 7% 15%;
}