/* Accordéon ACF : <details>/<summary> natif, colonnes, rond plus/moins (ou chevron) en CSS pur,
   hauteur animée via grid-template-rows. Style par défaut = FAQ Géodatis (boîtes grises, rond gris/bordeaux).
   Les variables sont surchargées par les réglages du widget Elementor. */

.acf-accordeon {
  --acf-accordeon-colonnes: 2;
  --acf-accordeon-ecart: 20px;
  --acf-accordeon-duree: 300ms;
  --acf-accordeon-icone-taille: 32px;
  --acf-accordeon-icone-fond: #707070;
  --acf-accordeon-icone-fond-ouvert: #552827;
  --acf-accordeon-icone-couleur: #fff;
  display: grid;
  grid-template-columns: repeat(var(--acf-accordeon-colonnes), minmax(0, 1fr));
  gap: var(--acf-accordeon-ecart);
  align-items: start;
}

/* tablette et mobile : une seule colonne */
@media (max-width: 1024px) {
  .acf-accordeon {
    grid-template-columns: minmax(0, 1fr);
  }
}

.acf-accordeon__colonne {
  display: flex;
  flex-direction: column;
  gap: var(--acf-accordeon-ecart);
  min-width: 0;
}

.acf-accordeon__item {
  background-color: #f2f2f2;
}

/* titre */
.acf-accordeon__titre {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 25px 25px 25px 35px;
  cursor: pointer;
  color: #1f2124;
  list-style: none;
  transition: color .2s, background-color .2s;
}

.acf-accordeon .acf-accordeon__item[open] > .acf-accordeon__titre {
  color: #552827;
}

.acf-accordeon__titre::-webkit-details-marker {
  display: none;
}

/* focus clavier : anneau intérieur, visible même avec un arrondi (overflow hidden) */
.acf-accordeon__titre:focus-visible {
  outline: 2px solid #552827;
  outline-offset: -2px;
}

/* balise du titre (h2-h6, div, span) : hérite de la typo du summary */
.acf-accordeon__titre-texte {
  margin: 0;
  font: inherit;
  color: inherit;
}

/* icône : rond avec deux barres (plus) ; à l'ouverture la barre verticale disparaît (moins) et le rond tourne */
.acf-accordeon__titre::after {
  content: "";
  flex: 0 0 auto;
  width: var(--acf-accordeon-icone-taille);
  height: var(--acf-accordeon-icone-taille);
  margin-left: auto;
  border-radius: 50%;
  background-color: var(--acf-accordeon-icone-fond);
  background-image:
    linear-gradient(var(--acf-accordeon-icone-couleur), var(--acf-accordeon-icone-couleur)),
    linear-gradient(var(--acf-accordeon-icone-couleur), var(--acf-accordeon-icone-couleur));
  background-repeat: no-repeat;
  background-position: center;
  background-size:
    calc(var(--acf-accordeon-icone-taille) * .44) calc(var(--acf-accordeon-icone-taille) * .09),
    calc(var(--acf-accordeon-icone-taille) * .09) calc(var(--acf-accordeon-icone-taille) * .44);
  transition: background-color .2s, background-size var(--acf-accordeon-duree) ease, transform var(--acf-accordeon-duree) ease;
}

.acf-accordeon__item[open] > .acf-accordeon__titre::after {
  background-color: var(--acf-accordeon-icone-fond-ouvert);
  background-size:
    calc(var(--acf-accordeon-icone-taille) * .44) calc(var(--acf-accordeon-icone-taille) * .09),
    0 0;
  transform: rotate(180deg);
}

/* variante chevron (réglage « Icône » du widget, ou icone="chevron" en shortcode) */
.acf-accordeon--icone-chevron {
  --acf-accordeon-icone-couleur: currentColor;
}

.acf-accordeon--icone-chevron .acf-accordeon__titre::after {
  width: calc(var(--acf-accordeon-icone-taille) * .35);
  height: calc(var(--acf-accordeon-icone-taille) * .35);
  border-radius: 0;
  background: none;
  border-right: 2px solid var(--acf-accordeon-icone-couleur);
  border-bottom: 2px solid var(--acf-accordeon-icone-couleur);
  transform: translateY(-25%) rotate(45deg);
  transition: transform var(--acf-accordeon-duree) ease, border-color .2s;
}

.acf-accordeon--icone-chevron .acf-accordeon__item[open] > .acf-accordeon__titre::after {
  background: none;
  transform: translateY(25%) rotate(-135deg);
}

/* contenu : 1fr ouvert, 0fr replié (classe posée par le JS le temps de la transition) */
.acf-accordeon__contenu {
  display: grid;
  grid-template-rows: 1fr;
  transition: grid-template-rows var(--acf-accordeon-duree) ease;
}

.acf-accordeon__item--replie > .acf-accordeon__contenu {
  grid-template-rows: 0fr;
}

.acf-accordeon__clip {
  min-height: 0;
  overflow: hidden;
}

.acf-accordeon__texte {
  padding: 0 35px 30px;
  color: #646464;
}

.acf-accordeon__texte > :first-child {
  margin-top: 0;
}

.acf-accordeon__texte > :last-child {
  margin-bottom: 0;
}

/* repère dans l'éditeur Elementor quand le repeater est vide */
.acf-accordeon-vide {
  padding: 1em;
  border: 1px dashed currentColor;
  opacity: .6;
  font-size: .9em;
}

/* mouvement réduit : pas de transition (le JS lit la durée calculée, donc 0) */
@media (prefers-reduced-motion: reduce) {
  .acf-accordeon__contenu,
  .acf-accordeon__titre::after {
    transition-duration: 0s;
  }
}