/* =================================================================
   Background Particules — tsParticles
   Le canvas tsParticles REMPLACE le fond gris (#f2f2f2) du body.
   Les sections qui utilisaient var(--bg-alt) deviennent transparentes,
   laissant apparaître les particules en dessous.
   ================================================================= */

/* Écrase --bg-alt en transparent : toutes les sections grises
   laisseront passer les particules sans toucher à chaque fichier CSS */
:root {
  --bg-alt: transparent;
}

body {
  background-color: transparent;
}

/* Canvas des particules — devient le fond de page de référence */
#tsparticles {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: var(--bg-alt-solid);
  z-index: -1;
  pointer-events: none;
}

#tsparticles canvas {
  pointer-events: none !important;
}

/* Restaurer le fond gris pour les petits composants UI qui en ont besoin */
.si-consent-cat,
.civility-option,
.address-clear {
  background: var(--bg-alt-solid) !important;
}

/* Correction du dégradé de transition bas-de-section :
   le système "smart sections" utilise désormais section:has(+ section.bg-alt)::after.
   Comme --bg-alt devient transparent sur desktop, on force ici la destination
   visuelle vers la vraie couleur du canvas particules. */
section:has(+ section.bg-alt)::after {
  background: linear-gradient(to bottom, transparent, var(--bg-alt-solid)) !important;
}

/* ── Mobile : particules cachées → on restaure les fonds normaux ── */
@media (max-width: 768px) {
  #tsparticles {
    display: none !important;
  }

  :root {
    --bg-alt: var(--bg-alt-solid);
  }

  body {
    background-color: var(--bg-alt-solid);
  }
}
