I would like a lil help on this one. I try to make an accordion transition but it seems it doesn't want to work. The transition works very well when I open my accordion but it's missing when I click to close it.

See my code below :

<!-- CSS -->
    <link rel="stylesheet" href="<?php echo $chemin; ?>dist/css/bootstrap.css">
    <link rel="stylesheet" href="<?php echo $chemin; ?>dist/css/bootstrap-grid.css">
    <link rel="stylesheet" href="<?php echo $chemin; ?>dist/css/bootstrap-utilities.css">
    <link rel="stylesheet" href="<?php echo $chemin; ?>dist/css/bootstrap-reboot.css">
    <link rel="stylesheet" href="<?php echo $chemin; ?>dist/css/style.css">

<!-- JavaScript -->
    <script src="<?php echo $chemin; ?>dist/js/bootstrap.bundle.js"></script>

<div class="card p-0 mb-2">
  <button class="btn btn-sm btn-block btn-light pt-2 pb-2 collapsed" id="accordion<?= $i; ?>" type="button" data-bs-toggle="collapse" data-bs-target="#collapseCardExample<?= $i; ?>">
    <h6 class="text-primary mb-0" style="text-align: left">
      <i class="fa fa-home ms-2 mt-1 mb-1 me-4" aria-hidden="true"></i>
      <?= $structure['ets_rattachement'] ?>
      <i class="fas fa-chevron-down float-end"></i>
    </h6>
  </button>
</div>

<!-- Card Content - Collapse -->
<div class="card collapse  mb-2 ps-0 pe-0 accordion-collapse" id="collapseCardExample<?= $i; ?>" data-bs-parent="#accordion<?= $i; ?>">
  <div class="card-body p-0 ">
    <?php
    $mesStructuresFille = get_structuresFille($structure['ets_rattachement']);
    foreach ($mesStructuresFille as $structure_fille) { ?>
      <form action="menuActionStructure.php" class="d-grid gap-2" method="post">
        <button type="submit" name="idStructure" value="<?php echo $structure_fille['id_structureOgirys'] ?>" class="btn btn-warning mt-1 mb-1 text-white rounded-0 ">
          <?php echo $structure_fille['nom']; ?>
        </button>
      </form>
    <?php } ?>
  </div>
</div>

It seems to work perfectly with the same code online so, maybe it comes from my dependencies ?

Thanks !