Canvas card 3 não funciona

Implementei o código para os cards 1 e 2 e eles estão funcionando perfeitamente. O do card 3 não esta sendo exibido na tela, notei que ao clicar no botão a página fica bloqueada para outras ações, então provavelmente esta funcionando, só não aparece na tela:

Código:

    <div class="card m-4" style="width: 20rem;">
         <img src="./assets/buffet-card.png" class="card-img-top" alt="Mesa de buffet com alimentos diversos">
          <div class="card-body">
              <h5 class="card-title fw-bold">Buffet</h5>
              <p class="card-text">Buffet e catering personalizado para eventos, produções e celebrações. Com
                  um menu variado e adaptável às preferências do cliente, atendimento atencioso e
                  profissional.
              </p>
              <a href="#" class="btn botao-padrao w-100 fw-bold mt-3" data-bs-toggle="offcanvas" data-bs-target="#canvas-3" aria-  controls="offcanvasRight">Quero detalhes</a>
    </div>


   <!-- canvas 3-->
    <div class="offcanvas offcanvas-end" tabindex="-1" id="canvas-3" aria-labelledby="offcanvasRightLabel">
      <div class="offcanvas-header">
        <h5 class="offcanvas-title" id="offcanvasRightLabel">Encomendas para eventos</h5>
        <button type="button" class="btn-close" data-bs-dismiss="offcanvas" aria-label="Close"></button>
      </div>
      <div class="offcanvas-body">
        <div class="accordion" id="accordionExample">
          <div class="accordion-item">
            <h2 class="accordion-header">
              <button class="accordion-button botao-padrao" type="button" data-bs-toggle="collapse"
                data-bs-target="#collapseOne" aria-expanded="true" aria-controls="collapseOne">
                Eventos
              </button>
            </h2>
            <div id="collapseOne" class="accordion-collapse collapse show" data-bs-parent="#accordionExample">
              <div class="accordion-body">
                Produzimos e entregamos os itens de café de nosso cardápio em grandes quantidades para seus eventos!
                Basta entrar em contato e fazer a reserva com 72h de antecedência.
              </div>
            </div>
          </div>
          <div class="accordion-item">
            <h2 class="accordion-header">
              <button class="accordion-button collapsed botao-padrao" type="button" data-bs-toggle="collapse"
                data-bs-target="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo">
                Entrega por aplicativo
              </button>
            </h2>
            <div id="collapseTwo" class="accordion-collapse collapse" data-bs-parent="#accordionExample">
              <div class="accordion-body">
                Entregamos pelos aplicativos Ifood e Rappi. Consulte nosso cardápio por lá e faça seu pedido!
              </div>
            </div>
          </div>