{% include 'partials/header.html.twig' %}



  <div class="body-wrapper">
    <div class="container-fluid">

      <div class="card card-body py-3">
        <div class="row align-items-center">
          <div class="col-12">
            <div class="d-sm-flex align-items-center justify-space-between">
              <h4 class="fs-7 fw-bolder mb-4 mb-sm-0 card-title">Marketplace</h4>
            </div>
          </div>
        </div>
      </div>

    <section class="pt-5 pt-md-14 pb-4 pb-md-5">
      <div class="container-fluid">
        <button class="btn bg-danger-subtle text-danger mb-4" type="button" data-bs-toggle="offcanvas" data-bs-target="#filterOffcanvas" aria-controls="filterOffcanvas">
          Filtres
        </button>
        <div class="row" id="marketplace">

          
          
          
        </div>
      </div>
    </section>

  </div>

<style>
/* Étendre les colonnes à la même hauteur */
.el-element-overlay > .col-lg-3,
.el-element-overlay > .col-md-6 {
  display: flex;
  flex-direction: column;
}

/* S'assurer que la carte prend toute la hauteur */
.card.overflow-hidden {
  flex: 1;
  display: flex;
  flex-direction: column;
}

/* Étendre la hauteur de .el-card-item */
.el-card-item {
  flex: 1;
  display: flex;
  flex-direction: column;
}

/* Étendre la div contenant l'image */
.el-card-avatar {
  display: flex;
  justify-content: center;   /* centre horizontalement */
  align-items: center;       /* centre verticalement */
  height: 120px;              /* nécessaire pour que l’alignement vertical fonctionne */
}

/* Uniformiser la hauteur des images + overlay */
.el-overlay {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: flex-end; /* ou center selon le design souhaité */
}

</style>

{% include '/partials/offcanvas/ajax_offcanvas.html.twig' %}
{% include '/partials/modal/ajax_modal_xl.html.twig' %}
{% include '@Projet/marketplace/filtres_offcanvas.html.twig' %}
<script src="{{ asset('assets/js/app/marketplace.js') }}"></script>

{% include 'partials/footer.html.twig' %}