/* ============================================================
   BéliB — Slider Elementor (4 slides desktop / 2 mobile)
   Scope : sliders avec la classe .belib-elementor-slider OU .belib-multi-slider
   Les autres sliders Elementor (hero, etc.) ne sont PAS affectés.
   ============================================================ */

.belib-elementor-slider,
.belib-multi-slider {
  width: 100% !important;
  max-width: 100% !important;
}

/* Largeur des slides FORCÉE par CSS (slidesPerView:'auto' dans le JS) :
   Mobile <768  : 2 slides (50%)
   Tablette ≥768 : 3 slides (~33.33%)
   Desktop ≥1024 : 4 slides (25%)
   !important pour empêcher Swiper/Elementor d'écraser ces valeurs.   */
.belib-elementor-slider .swiper-slide,
.belib-multi-slider .swiper-slide {
  height: auto;
  flex-shrink: 0;
  width: 50% !important; /* default mobile */
}
@media (min-width: 768px) {
  .belib-elementor-slider .swiper-slide,
  .belib-multi-slider .swiper-slide {
    width: 33.3333% !important;
  }
}
@media (min-width: 1024px) {
  .belib-elementor-slider .swiper-slide,
  .belib-multi-slider .swiper-slide {
    width: 25% !important;
  }
}

/* Wrapper Swiper : force flex en ligne unique.
   Important : .elementor-row a flex-wrap:wrap par défaut, on l'écrase. */
.belib-elementor-slider .swiper-wrapper,
.belib-multi-slider .swiper-wrapper,
.belib-elementor-slider .elementor-row.swiper-wrapper,
.belib-multi-slider .elementor-row.swiper-wrapper {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: stretch;
  height: auto !important;
}

/* Reset des marges/paddings injectés par Elementor sur les colonnes/widgets */
.belib-elementor-slider .swiper-slide .elementor-column,
.belib-elementor-slider .swiper-slide .elementor-column-wrap,
.belib-elementor-slider .swiper-slide .elementor-element-populated,
.belib-elementor-slider .swiper-slide .elementor-widget-wrap,
.belib-elementor-slider .swiper-slide .elementor-widget,
.belib-elementor-slider .swiper-slide .elementor-widget-image,
.belib-elementor-slider .swiper-slide .elementor-widget-container,
.belib-multi-slider .swiper-slide .elementor-column,
.belib-multi-slider .swiper-slide .elementor-column-wrap,
.belib-multi-slider .swiper-slide .elementor-element-populated,
.belib-multi-slider .swiper-slide .elementor-widget-wrap,
.belib-multi-slider .swiper-slide .elementor-widget,
.belib-multi-slider .swiper-slide .elementor-widget-image,
.belib-multi-slider .swiper-slide .elementor-widget-container {
  width: 100% !important;
  max-width: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* Espacement vertical seulement entre l'image et le titre */
.belib-elementor-slider .swiper-slide .elementor-widget-image + .elementor-widget-heading,
.belib-multi-slider .swiper-slide .elementor-widget-image + .elementor-widget-heading {
  margin-top: 8px !important;
}

/* Image : remplit la slide, padding 5px, ratio préservé */
.belib-elementor-slider .swiper-slide .elementor-image,
.belib-multi-slider .swiper-slide .elementor-image {
  padding: 5px;
  box-sizing: border-box;
  width: 100% !important;
}
.belib-elementor-slider .swiper-slide .elementor-image a,
.belib-multi-slider .swiper-slide .elementor-image a {
  display: block;
  width: 100%;
}
.belib-elementor-slider .swiper-slide .elementor-image img,
.belib-multi-slider .swiper-slide .elementor-image img {
  width: 100% !important;
  height: auto !important;
  max-width: 100% !important;
  display: block;
}

/* Titres / liens — centrés sous l'image */
.belib-elementor-slider .elementor-widget-heading,
.belib-multi-slider .elementor-widget-heading {
  text-align: center !important;
  padding: 8px 5px !important;
}
.belib-elementor-slider .elementor-widget-heading .elementor-heading-title,
.belib-elementor-slider .elementor-widget-heading .elementor-heading-title a,
.belib-elementor-slider .elementor-widget-heading .elementor-heading-title span,
.belib-multi-slider .elementor-widget-heading .elementor-heading-title,
.belib-multi-slider .elementor-widget-heading .elementor-heading-title a,
.belib-multi-slider .elementor-widget-heading .elementor-heading-title span {
  font-family: 'GTWalsheimProMedium', sans-serif !important;
  font-size: 16px !important;
  text-transform: uppercase !important;
  color: #293378 !important;
  text-decoration: none !important;
  text-align: center !important;
  display: block;
  margin: 0 !important;
}

/* Flèches : fond transparent, picto BéliB */
.belib-elementor-slider .swiper-button-prev,
.belib-elementor-slider .swiper-button-next,
.belib-elementor-slider .swiper-section-button,
.belib-multi-slider .swiper-button-prev,
.belib-multi-slider .swiper-button-next,
.belib-multi-slider .swiper-section-button {
  background: transparent !important;
  background-color: transparent !important;
  color: #293378 !important;
  box-shadow: none !important;
  border: none !important;
}
.belib-elementor-slider .swiper-button-prev::after,
.belib-elementor-slider .swiper-button-next::after,
.belib-elementor-slider .swiper-section-button::after,
.belib-multi-slider .swiper-button-prev::after,
.belib-multi-slider .swiper-button-next::after,
.belib-multi-slider .swiper-section-button::after {
  color: #293378 !important;
}
.belib-elementor-slider .swiper-button-prev svg,
.belib-elementor-slider .swiper-button-next svg,
.belib-elementor-slider .swiper-section-button svg,
.belib-multi-slider .swiper-button-prev svg,
.belib-multi-slider .swiper-button-next svg,
.belib-multi-slider .swiper-section-button svg {
  fill: #293378 !important;
  color: #293378 !important;
}

/* Pas de pagination */
.belib-elementor-slider .swiper-pagination,
.belib-elementor-slider .swiper-pagination-bullets,
.belib-multi-slider .swiper-pagination,
.belib-multi-slider .swiper-pagination-bullets {
  display: none !important;
}

/* ── Mobile (< 768px) : ajustements ──────────────────────────── */
@media (max-width: 767px) {
  .belib-elementor-slider .elementor-widget-heading .elementor-heading-title,
  .belib-elementor-slider .elementor-widget-heading .elementor-heading-title a,
  .belib-elementor-slider .elementor-widget-heading .elementor-heading-title span,
  .belib-multi-slider .elementor-widget-heading .elementor-heading-title,
  .belib-multi-slider .elementor-widget-heading .elementor-heading-title a,
  .belib-multi-slider .elementor-widget-heading .elementor-heading-title span {
    font-size: 13px !important;
    line-height: 1.3 !important;
  }
  .belib-elementor-slider .swiper-button-prev,
  .belib-elementor-slider .swiper-button-next,
  .belib-multi-slider .swiper-button-prev,
  .belib-multi-slider .swiper-button-next {
    width: 30px !important;
    height: 30px !important;
  }
}
