/* Homepage Ayodélé — page 1660
   Coller ce fichier en entier dans le custom CSS de la page. */

/* Premier bloc (Content Simple Image 6-6) : titre en style H1 */
#sp-page-builder .sppb-section:first-child [slot="title"] {
  font-size: 36px !important;
  line-height: 120% !important;
}

@media (min-width: 1200px) {
  #sp-page-builder .sppb-section:first-child [slot="title"] {
    font-size: 48px !important;
  }
}

/* Bloc Header Simulator : titre en style H2 */
#sp-page-builder ds-header[hassimulator] [slot="title"] {
  font-size: 32px !important;
  line-height: 120% !important;
}

@media (min-width: 1200px) {
  #sp-page-builder ds-header[hassimulator] [slot="title"] {
    font-size: 40px !important;
  }
}

/* Notes App sous le CTA (le JS passe l’image en slot="link") */
ds-feature picture[slot="link"] img {
  display: block;
  width: auto !important;
  max-width: 220px;
  height: auto;
  margin-top: 16px;
}

ds-feature img[slot="link"] {
  display: block;
  width: auto !important;
  max-width: 220px;
  height: auto;
  margin-top: 16px;
}

/* Content Simple sous le simulateur : paragraphe pleine largeur */
.simulator-legal-notice,
.sppb-section:has(ds-header[hassimulator]) ds-header:not([hassimulator]) {
  width: 100% !important;
  max-width: 100% !important;
  display: block !important;
}

.simulator-legal-notice [slot="text"],
.simulator-legal-notice [slot="text"] p,
.sppb-section:has(ds-header[hassimulator]) ds-header:not([hassimulator]) [slot="text"],
.sppb-section:has(ds-header[hassimulator]) ds-header:not([hassimulator]) [slot="text"] p {
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

/* Suppression des conteneurs de boutons vides dans le Light DOM */
#sp-page-builder .buttons:empty,
#sp-page-builder div[class*="flex"][class*="gap-4"]:empty {
  display: none !important;
}

/* Quote Image : puces de liste ul > li transformées en icône check (style composant ds-advantage) */
ds-quote-content [slot="text"] ul {
  list-style: none !important;
  padding-left: 0 !important;
  margin-left: 0 !important;
}

ds-quote-content [slot="text"] ul li {
  list-style: none !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  margin-bottom: 8px !important;
  padding-left: 0 !important;
}

ds-quote-content [slot="text"] ul li ds-icon {
  color: #007BC7 !important; /* text-brand-800 identique à ds-advantage */
  font-size: 20px !important;
  line-height: 1 !important;
  flex-shrink: 0 !important;
}

/* Fallback avant injection du composant ds-icon par JS */
ds-quote-content [slot="text"] ul li:not(:has(ds-icon)) {
  position: relative !important;
  padding-left: 28px !important;
}

ds-quote-content [slot="text"] ul li:not(:has(ds-icon))::before {
  content: "check" !important;
  font-family: 'Material Icons Round' !important;
  font-weight: normal !important;
  font-style: normal !important;
  font-size: 20px !important;
  line-height: 24px !important;
  letter-spacing: normal !important;
  text-transform: none !important;
  display: inline-block !important;
  white-space: nowrap !important;
  word-wrap: normal !important;
  direction: ltr !important;
  -webkit-font-smoothing: antialiased !important;
  text-rendering: optimizeLegibility !important;
  font-feature-settings: 'liga' !important;
  color: #007BC7 !important; /* text-brand-800 */
  position: absolute;
  left: 0;
  top: 0;
}

/* Chaque ligne a 75px de padding (réglage SPPB) et chaque bloc ~80px en interne.
   Les deux se cumulent (80+75 + 75+80). On retire le padding de ligne. */
#sp-page-builder .sppb-section {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

/* Premier bloc : collé sous le header en mobile */
@media (max-width: 1199px) {
  #sp-page-builder .sppb-section:first-child {
    padding-top: 24px !important;
  }
}

/* Vidéos MP4 locales : conserver le ratio intrinsèque du média.
   Les wrappers .sppb-video-block.sppb-embed-responsive des iframes ne sont pas ciblés. */
#sp-page-builder .sppb-addon-video-local-video-wrap {
  display: block !important;
  position: static !important;
  width: 100% !important;
  height: auto !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  overflow: hidden !important;
  border-radius: 16px !important;
}

#sp-page-builder .sppb-addon-video-local-video-wrap video,
#sp-page-builder .sppb-addon-video-local-video-wrap video.sppb-addon-video-local-source {
  display: block !important;
  position: static !important;
  width: 100% !important;
  height: auto !important;
  object-fit: initial !important;
  transform: scale(1.015) !important;
  transform-origin: initial !important;
  border-radius: 16px !important;
}

/* Images du carrousel de cards : le markup PHP les force à w-[48px] */
#sp-page-builder .carouselcard picture,
#sp-page-builder .carouselcard [slot="first-image"],
#sp-page-builder .splide__slide picture,
#sp-page-builder .splide__slide [slot="first-image"],
.carouselcard picture,
.carouselcard [slot="first-image"] {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
}

#sp-page-builder .carouselcard img,
#sp-page-builder .carouselcard [slot="first-image"] img,
#sp-page-builder .splide__slide img,
#sp-page-builder .splide__slide [slot="first-image"] img,
.carouselcard img,
.carouselcard [slot="first-image"] img,
ds-carousel .splide__slide img {
  display: block !important;
  width: 100% !important;
  min-width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  object-fit: cover !important;
}

/* Avis Vérifiés
   Étoiles RateYo (SVG), filet #fda937, bouton #1e1e1c, fond liste #EEEEEE. */
#sp-page-builder .mod_avisverifies_liste,
#sp-page-builder section.avis,
#sp-page-builder #mod_avisverifies_liste_secondpart,
#sp-page-builder #mod_avisverifies_liste_thirdpart,
#sp-page-builder .global-mark-wrapper {
  font-family: Poppins, sans-serif;
}

#sp-page-builder .jq-ry-rated-group svg,
#sp-page-builder .jq-ry-rated-group svg path,
#sp-page-builder .jq-ry-rated-group svg polygon {
  fill: #007BC7 !important;
}

#sp-page-builder #mod_avisverifies_liste_firstpart {
  border-bottom-color: #007BC7 !important;
}

#sp-page-builder #mod_avisverifies_liste_firstpart:after {
  border-color: #007BC7 transparent transparent transparent !important;
}

#sp-page-builder #mod_avisverifies_liste_secondpart,
#sp-page-builder #mod_avisverifies_liste_secondpart.avis-wrapper {
  background: #fff !important;
}

#sp-page-builder .load-more-avis,
#sp-page-builder a.load-more-avis {
  background: #007BC7 !important;
  background-color: #007BC7 !important;
  color: #fff !important;
  font-family: Poppins, sans-serif !important;
  font-weight: 500 !important;
  font-size: 16px !important;
  line-height: 160% !important;
  text-transform: none !important;
  border-radius: 8px;
}

#sp-page-builder .load-more-avis:hover,
#sp-page-builder .load-more-avis:focus,
#sp-page-builder .load-more-avis:active {
  background: #00619E !important;
  background-color: #00619E !important;
  color: #fff !important;
}

#sp-page-builder #mod_avisverifies_liste_secondpart .name,
#sp-page-builder #mod_avisverifies_liste_secondpart .avis-mark,
#sp-page-builder .mod_avisverifies_liste p.sentence,
#sp-page-builder .global-mark-wrapper .mark-title {
  font-family: Poppins, sans-serif !important;
  font-weight: 500 !important;
  font-size: 16px !important;
  line-height: 160% !important;
  color: rgb(39, 46, 53) !important;
}

#sp-page-builder #mod_avisverifies_liste_secondpart .avis,
#sp-page-builder #mod_avisverifies_liste_commentaire_comment,
#sp-page-builder #mod_avisverifies_liste_commentaire_comment p,
#sp-page-builder .global-mark-wrapper .mark-text,
#sp-page-builder .global-mark-wrapper .legal {
  font-family: Poppins, sans-serif !important;
  font-weight: 400 !important;
  font-size: 16px !important;
  line-height: 160% !important;
  letter-spacing: 0 !important;
  color: rgb(85, 95, 109) !important;
}

#sp-page-builder #mod_avisverifies_liste_secondpart .info,
#sp-page-builder #mod_avisverifies_liste_date span,
#sp-page-builder #mod_avisverifies_listecommentaire_date,
#sp-page-builder #mod_avisverifies_liste_thirdpart span {
  font-family: Poppins, sans-serif !important;
  font-style: normal !important;
  font-weight: 400 !important;
  font-size: 14px !important;
  line-height: 160% !important;
  color: rgb(126, 139, 153) !important;
}

#sp-page-builder .mod_avisverifies_liste p#note,
#sp-page-builder .global-mark-wrapper .global-mark,
#sp-page-builder .global-mark-wrapper .global-mark .big {
  font-family: Poppins, sans-serif !important;
  font-weight: 900 !important;
  line-height: 120% !important;
  color: rgb(39, 46, 53) !important;
}

/* Mentions légales → style ds-disclosure
   Le module est dans le pré-footer, hors #sp-page-builder. */
.mod_mentions_legales {
  background: rgb(240, 243, 245) !important;
  border: none !important;
  border-top: 1px solid rgb(233, 236, 239) !important;
  border-bottom: 1px solid rgb(233, 236, 239) !important;
  padding: 0 16px !important;
  font-family: Poppins, sans-serif;
}

.pre-footer.gris .legal-notice-wrapper,
.mod_mentions_legales .legal-notice-wrapper {
  max-width: 1110px;
  width: 100%;
  margin: 0 auto !important;
  padding: 4px 0 !important;
}

@media (max-width: 1200px) {
  .pre-footer.gris .legal-notice-wrapper,
  .mod_mentions_legales .legal-notice-wrapper {
    margin: 0 auto !important;
  }
}

.mod_mentions_legales .opener {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  gap: 16px;
  color: rgb(85, 95, 109) !important;
  font-family: Poppins, sans-serif !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 1.25rem !important;
  cursor: pointer;
  padding: 4px 0;
}

.mod_mentions_legales .opener:hover {
  color: rgb(39, 46, 53) !important;
  text-decoration: underline;
}

.mod_mentions_legales .more-less {
  order: 2;
  flex: 0 0 24px;
  width: 24px !important;
  height: 24px !important;
  margin: 0 !important;
  background-color: transparent !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23555F6D' d='M7.41 8.59 12 13.17l4.59-4.58L18 10l-6 6-6-6z'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: 24px 24px !important;
  transform: rotate(0deg);
  transition: transform 300ms;
}

.mod_mentions_legales .more-less:before {
  content: none !important;
  display: none !important;
}

.mod_mentions_legales .opener.open .more-less {
  transform: rotate(180deg);
}

.mod_mentions_legales .opener-content,
.mod_mentions_legales #legal-notice,
.mod_mentions_legales #legal-notice p {
  color: rgb(85, 95, 109) !important;
  font-family: Poppins, sans-serif !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 1.25rem !important;
  text-align: left;
}

.mod_mentions_legales .legal-notice-wrapper a {
  color: rgb(85, 95, 109) !important;
  text-decoration: underline;
}

.mod_mentions_legales .opener.open + .opener-content {
  margin-top: 4px;
  transition: height 300ms, opacity 300ms;
}
