/* =====================================================================
   CE Widget — Widget « Pré-header défilant » (marquee)
   Boucle sans couture : deux groupes identiques, la piste est animée de
   translateX(0) à -50%. Les couleurs/typo/espacements viennent des contrôles
   de Style (CSS inline scopé au widget).
   ===================================================================== */

.cew-marquee {
  width: 100%;
  overflow: hidden;
  white-space: nowrap;
  background: #0f0f14;
  color: #fff;
  font-weight: 700;
  line-height: 1.2;
}

/* --- Défilement --- */
.cew-marquee__viewport { overflow: hidden; }
.cew-marquee__track {
  display: inline-flex;
  width: max-content;
  will-change: transform;
  animation: cewMarqueeScroll var(--cew-mq-dur, 26s) linear infinite;
}
.cew-marquee__group { display: inline-flex; align-items: center; }

@keyframes cewMarqueeScroll {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}

/* Pause au survol (classe posée par le widget). */
.cew-marquee--anim.is-pausable:hover .cew-marquee__track { animation-play-state: paused; }

/* --- Mode statique (barre de réassurance) --- */
.cew-marquee--static .cew-marquee__static {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
}

/* --- Item (icône + texte) --- */
.cew-marquee__item {
  display: inline-flex;
  align-items: center;
  gap: 7px;
}
.cew-marquee--static .cew-marquee__item { margin: 2px 13px; }

.cew-marquee__item a {
  color: inherit;
  text-decoration: none;
}
.cew-marquee__item a:hover { text-decoration: underline; }

.cew-marquee__emoji { display: inline-block; line-height: 1; }
.cew-marquee__icon { display: inline-flex; align-items: center; }
.cew-marquee__icon svg { display: block; width: 16px; height: 16px; }

/* Séparateur */
.cew-marquee__sep {
  display: inline-block;
  margin: 0 26px;
  opacity: .55;
}
/* En mode statique, l'espacement est porté par les items → on masque le
   séparateur défilant s'il gêne (on le garde tout de même visible). */

@media (prefers-reduced-motion: reduce) {
  .cew-marquee__track { animation: none; }
}