/*
 Theme Name:  Smooth Chilly
 Theme URI:   https://chillypills.com/
 Description: Child theme para Hello Elementor con Swup + GSAP integrados.
 Author:      Pablo / Chillypills
 Template:    hello-elementor
 Version:     1.0.2
*/

/* --- Transición entre páginas (Swup v4 aplica .is-animating en animationSelector) --- */
#swup,
[data-elementor-type="wp-page"] {
  transition: opacity .28s ease;
}

#swup.is-animating,
[data-elementor-type="wp-page"].is-animating {
  opacity: 0.001;
}

/* --- GSAP: evita FOUC de elementos animables (solo cuando GSAP está listo) --- */
html.js.gsap-ready [data-gsap] {
  opacity: 0;
  will-change: transform, opacity;
}

/* Respeto a reduce-motion: si el usuario lo tiene activo, no ocultes nada */
@media (prefers-reduced-motion: reduce) {
  [data-gsap] { opacity: 1 !important; transition: none !important; }
}

/* Opcional: micro-fade global del documento (no afecta a Swup) */
html.transition-fade { transition: opacity .2s ease; }
html.transition-fade.is-animating { opacity: 1; } /* mantenemos 1 para no interferir con los contenedores */

html.hello-initial-fade {
  opacity: 0.001;
  transition: opacity .28s ease;
}
html.hello-initial-fade.hello-shown {
  opacity: 1;
}

/* Transición de color en el body */
body {
  transition: background-color .35s ease, color .35s ease;
}

/* Temas */
body.theme-light { background-color: #ffffff; color: #111; }
body.theme-dark  { background-color: #000000; color: #eee; }

/* Asegura que el contenido no tape el body */
#swup, [data-elementor-type="wp-page"] { background: transparent !important; }