/* ============================================================
 * ESSIKNETWORK — Sliders partagés (image / vidéo / templates /
 * logos). Structure : .essik-slider > .essik-slider-viewport >
 * .essik-slider-track > .essik-slide + nav (flèches) + dots.
 * Variables : essik-design-tokens.css. Dark mode auto.
 * ============================================================ */
.essik-slider { position: relative; }
.essik-slider-viewport { overflow: hidden; border-radius: var(--essik-radius); }
.essik-slider-track {
  display: flex; align-items: stretch;
  gap: var(--essik-slider-gap, 20px);
  transition: transform .45s var(--essik-ease);
  will-change: transform;
}
.essik-slide { min-width: 0; }
.essik-slide img { display: block; width: 100%; height: auto; border-radius: var(--essik-radius-sm); }
/* Nav */
.essik-slider-nav { display: flex; gap: .5rem; align-items: center; }
.essik-slider-nav button {
  display: inline-flex; align-items: center; justify-content: center;
  width: 2.5rem; height: 2.5rem; border-radius: 50%;
  border: 1px solid var(--essik-border); background: var(--essik-bg); color: var(--essik-text);
  cursor: pointer; transition: all var(--essik-speed) var(--essik-ease);
}
.essik-slider-nav button:hover:not([disabled]) { background: var(--essik-primary); border-color: var(--essik-primary); color: #fff; }
.essik-slider-nav button[disabled] { opacity: .35; cursor: not-allowed; }
/* Dots */
.essik-slider-dots { display: flex; gap: .45rem; justify-content: center; margin-top: 1rem; }
.essik-slider-dots button {
  width: .55rem; height: .55rem; border-radius: 50%; border: 0; padding: 0;
  background: var(--essik-border); cursor: pointer; transition: all var(--essik-speed) var(--essik-ease);
}
.essik-slider-dots button.is-active { background: var(--essik-primary); transform: scale(1.25); }
/* Marquee logos (CSS pur, sans JS) */
.essik-marquee { overflow: hidden; position: relative; }
.essik-marquee-track { display: flex; align-items: center; gap: 3rem; width: max-content; animation: essikMarquee var(--essik-marquee-speed, 30s) linear infinite; }
.essik-marquee:hover .essik-marquee-track { animation-play-state: paused; }
@keyframes essikMarquee { to { transform: translateX(-50%); } }
@media (prefers-reduced-motion: reduce) {
  .essik-marquee-track { animation: none; }
  .essik-slider-track { transition: none; }
}
