/* =====================================================================
   CE Widget — Widget « Description Split »
   Styles scopés au widget (préfixe .cew-dsplit). Le clamp précis (en px) est
   posé par views/js/dsplit.js, calé sur la fin d'une ligne réelle ; la règle
   CSS ci-dessous fournit un clamp approximatif AVANT le JS (anti-flash).
   ===================================================================== */

/* Clamp pré-JS basé sur une hauteur de ligne approximative (~1.6em).
   Le JS recalcule ensuite la hauteur exacte (mesure des line-boxes). */
.cew-dsplit__content.is-clamped {
  overflow: hidden;
  max-height: calc(var(--cew-lines, 4) * 1.6em);
}

/* Marges internes à plat : la 1re ligne démarre au ras du bloc et la dernière
   ne laisse pas de marge fantôme — indispensable pour une coupe nette. */
.cew-dsplit__content > :first-child { margin-top: 0; }
.cew-dsplit__content > :last-child { margin-bottom: 0; }

/* Dépliement / repliement fluide : la transition n'est active QUE pendant
   l'animation (classe posée/retirée par le JS), pour ne pas animer le clamp
   initial au chargement. */
.cew-dsplit__content.is-animating {
  overflow: hidden;
  transition: max-height .34s cubic-bezier(.4, 0, .2, 1);
  will-change: max-height;
}
@media (prefers-reduced-motion: reduce) {
  .cew-dsplit__content.is-animating { transition: none; }
}

/* Bouton / lien « Lire plus » — neutre par défaut, surchargeable via les
   contrôles de Style du widget dans l'éditeur Creative Elements. */
.cew-dsplit__more {
  display: inline-block;
  margin-top: 10px;
  padding: 0;
  background: none;
  border: 0;
  cursor: pointer;
  font: inherit;
  font-weight: 600;
  line-height: 1.2;
  color: currentColor;
  text-decoration: underline;
  text-underline-offset: 3px;
  transition: color .15s ease, opacity .15s ease;
}

.cew-dsplit__more:hover,
.cew-dsplit__more:focus {
  text-decoration: none;
}

/* Bouton bascule (déplier/replier) : masqué par défaut. Le JS ajoute la classe
   « is-clampable » sur le widget seulement quand le texte dépasse le nombre de
   lignes max — donc sur une description courte, aucun bouton n'apparaît (ni
   flash au chargement). Le lien « Lire plus » du haut en mode « défiler » n'est
   PAS concerné : il reste toujours visible. */
.cew-dsplit__more--toggle {
  display: none;
}
.cew-dsplit.is-clampable .cew-dsplit__more--toggle {
  display: inline-block;
}

/* Lien (haut) : neutralise l'apparence par défaut des <a>. */
a.cew-dsplit__more {
  -webkit-appearance: none;
}

/* La cible de défilement (bloc du bas) reçoit tabindex="-1" : on masque le
   contour de focus programmatique pour ne pas surprendre l'utilisateur. */
.cew-dsplit[tabindex]:focus {
  outline: none;
}
