/**
 * Comm360 — Lien souligné animé (Underline Link, reprise fidèle d'Osmo).
 *
 * 100 % CSS, aucune dépendance. Deux variantes :
 *   • Défaut : au survol, le trait pousse depuis la gauche ; en sortie il se retire vers la droite.
 *   • Alt    : un trait visible au repos se retire vers la droite au survol, puis un nouveau réapparaît depuis la gauche.
 *
 * Deux façons de l'activer (au choix) :
 *   - par CLASSE CSS (champ « Classes CSS » d'Elementor, onglet Avancé) :
 *       .comm360-underline           (défaut)
 *       .comm360-underline-alt       (variante alt)
 *       .comm360-hover               (sur un PARENT : déclenche l'effet du lien enfant au survol du parent)
 *   - par ATTRIBUT (version Osmo d'origine, ex. attributs personnalisés Elementor Pro) :
 *       data-underline-link
 *       data-underline-link="alt"
 *       data-hover                   (sur un parent)
 *
 * Le trait reprend la couleur du texte (currentColor).
 */

[data-underline-link],
.comm360-underline,
.comm360-underline-alt {
  text-decoration: none;
  position: relative;
}

[data-underline-link]::before,
.comm360-underline::before,
[data-underline-link="alt"]::before,
[data-underline-link="alt"]::after,
.comm360-underline-alt::before,
.comm360-underline-alt::after {
  content: "";
  position: absolute;
  bottom: -0.0625em;
  left: 0;
  width: 100%;
  height: 0.0625em;
  background-color: currentColor;
  transition: transform 0.735s cubic-bezier(0.625, 0.05, 0, 1);
  transform-origin: right;
  transform: scaleX(0) rotate(0.001deg);
}

[data-underline-link="alt"]::before,
.comm360-underline-alt::before {
  transform-origin: left;
  transform: scaleX(1) rotate(0.001deg);
  transition-delay: 0.3s;
}

[data-underline-link="alt"]::after,
.comm360-underline-alt::after {
  transform-origin: right;
  transform: scaleX(0) rotate(0.001deg);
  transition-delay: 0s;
}

@media (hover: hover) and (pointer: fine) {
  [data-hover]:hover [data-underline-link]::before,
  [data-underline-link]:hover::before,
  .comm360-hover:hover .comm360-underline::before,
  .comm360-underline:hover::before {
    transform-origin: left;
    transform: scaleX(1) rotate(0.001deg);
  }

  [data-hover]:hover [data-underline-link="alt"]::before,
  [data-underline-link="alt"]:hover::before,
  .comm360-hover:hover .comm360-underline-alt::before,
  .comm360-underline-alt:hover::before {
    transform-origin: right;
    transform: scaleX(0) rotate(0.001deg);
    transition-delay: 0s;
  }

  [data-hover]:hover [data-underline-link="alt"]::after,
  [data-underline-link="alt"]:hover::after,
  .comm360-hover:hover .comm360-underline-alt::after,
  .comm360-underline-alt:hover::after {
    transform-origin: left;
    transform: scaleX(1) rotate(0.001deg);
    transition-delay: 0.3s;
  }
}