/* Styles personnalisés VDA */

/* Empêche le flash des éléments Alpine.js avant initialisation */
[x-cloak] { display: none !important; }

/* Tailwind force `img { display: block }` (Preflight) — dans l'éditeur Quill,
   ça empêche plusieurs images de se placer côte à côte sur une même ligne. */
.ql-editor img { display: inline-block; vertical-align: top; }

/* Défilement horizontal continu (bandeau témoignages) */
@keyframes marquee-x {
  from { transform: translateX(0); }
  to { transform: translateX(calc(-50% - 0.5rem)); }
}

.marquee-track-x {
  animation: marquee-x 55s linear infinite reverse;
}

.marquee-track-x:hover {
  animation-play-state: paused;
}

@media (prefers-reduced-motion: reduce) {
  .marquee-track-x {
    animation-duration: 1ms;
    animation-iteration-count: 1;
  }
}

/* Zones de texte qui s'agrandissent au fur et à mesure de la saisie (JS) —
   défilement discret une fois la hauteur max atteinte, au lieu de la barre native. */
.zone-texte-auto,
.defilement-fin {
  scrollbar-width: thin;
  scrollbar-color: #e5e7eb transparent;
}

.zone-texte-auto::-webkit-scrollbar,
.defilement-fin::-webkit-scrollbar {
  width: 3px !important;
  height: 3px !important;
}

.zone-texte-auto::-webkit-scrollbar-button,
.defilement-fin::-webkit-scrollbar-button {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
}

.zone-texte-auto::-webkit-scrollbar-track,
.defilement-fin::-webkit-scrollbar-track {
  background: transparent !important;
}

.zone-texte-auto::-webkit-scrollbar-thumb,
.defilement-fin::-webkit-scrollbar-thumb {
  background-color: #e5e7eb !important;
  border-radius: 9999px !important;
}

.zone-texte-auto::-webkit-scrollbar-thumb:hover,
.defilement-fin::-webkit-scrollbar-thumb:hover {
  background-color: #d1d5db !important;
}