/**
 * Nova Theme — Bibliothèque d'animations complète
 * Usage : data-animate="fade-up" data-delay="200" data-duration="800"
 */

/* ── Variables d'animation ────────────────────────────── */
:root {
  --nova-anim-delay:    0ms;
  --nova-anim-duration: 650ms;
  --nova-anim-ease:     cubic-bezier(0.22, 1, 0.36, 1);
  --nova-anim-spring:   cubic-bezier(0.34, 1.56, 0.64, 1);
  --nova-anim-distance: 40px;
}

/* ── Base ────────────────────────────────────────────── */
[data-animate] { will-change: transform, opacity; }

/* ── Fade basiques ────────────────────────────────────── */
[data-animate="fade"] {
  opacity: 0;
  transition: opacity var(--nova-anim-duration) var(--nova-anim-ease) var(--nova-anim-delay);
}
[data-animate="fade"].is-visible { opacity: 1; }

[data-animate="fade-up"] {
  opacity: 0; transform: translateY(var(--nova-anim-distance));
  transition:
    opacity  var(--nova-anim-duration) var(--nova-anim-ease) var(--nova-anim-delay),
    transform var(--nova-anim-duration) var(--nova-anim-ease) var(--nova-anim-delay);
}
[data-animate="fade-up"].is-visible { opacity: 1; transform: translateY(0); }

[data-animate="fade-down"] {
  opacity: 0; transform: translateY(calc(var(--nova-anim-distance) * -1));
  transition: opacity var(--nova-anim-duration) var(--nova-anim-ease) var(--nova-anim-delay), transform var(--nova-anim-duration) var(--nova-anim-ease) var(--nova-anim-delay);
}
[data-animate="fade-down"].is-visible { opacity: 1; transform: translateY(0); }

[data-animate="fade-left"] {
  opacity: 0; transform: translateX(var(--nova-anim-distance));
  transition: opacity var(--nova-anim-duration) var(--nova-anim-ease) var(--nova-anim-delay), transform var(--nova-anim-duration) var(--nova-anim-ease) var(--nova-anim-delay);
}
[data-animate="fade-left"].is-visible { opacity: 1; transform: translateX(0); }

[data-animate="fade-right"] {
  opacity: 0; transform: translateX(calc(var(--nova-anim-distance) * -1));
  transition: opacity var(--nova-anim-duration) var(--nova-anim-ease) var(--nova-anim-delay), transform var(--nova-anim-duration) var(--nova-anim-ease) var(--nova-anim-delay);
}
[data-animate="fade-right"].is-visible { opacity: 1; transform: translateX(0); }

/* ── Zoom ─────────────────────────────────────────────── */
[data-animate="zoom-in"] {
  opacity: 0; transform: scale(0.85);
  transition: opacity var(--nova-anim-duration) var(--nova-anim-ease) var(--nova-anim-delay), transform var(--nova-anim-duration) var(--nova-anim-ease) var(--nova-anim-delay);
}
[data-animate="zoom-in"].is-visible { opacity: 1; transform: scale(1); }

[data-animate="zoom-out"] {
  opacity: 0; transform: scale(1.15);
  transition: opacity var(--nova-anim-duration) var(--nova-anim-ease) var(--nova-anim-delay), transform var(--nova-anim-duration) var(--nova-anim-ease) var(--nova-anim-delay);
}
[data-animate="zoom-out"].is-visible { opacity: 1; transform: scale(1); }

/* ── Spring ───────────────────────────────────────────── */
[data-animate="spring-up"] {
  opacity: 0; transform: translateY(60px) scale(0.93);
  transition: opacity .7s var(--nova-anim-spring) var(--nova-anim-delay), transform .7s var(--nova-anim-spring) var(--nova-anim-delay);
}
[data-animate="spring-up"].is-visible { opacity: 1; transform: translateY(0) scale(1); }

[data-animate="bounce-in"] {
  opacity: 0; transform: scale(0.3);
  transition: opacity .6s ease var(--nova-anim-delay), transform .6s var(--nova-anim-spring) var(--nova-anim-delay);
}
[data-animate="bounce-in"].is-visible { opacity: 1; transform: scale(1); }

/* ── Flip ─────────────────────────────────────────────── */
[data-animate="flip-x"] {
  opacity: 0; transform: rotateX(90deg); transform-origin: top center;
  transition: opacity .7s var(--nova-anim-ease) var(--nova-anim-delay), transform .7s var(--nova-anim-ease) var(--nova-anim-delay);
}
[data-animate="flip-x"].is-visible { opacity: 1; transform: rotateX(0); }

[data-animate="flip-y"] {
  opacity: 0; transform: rotateY(90deg); transform-origin: left center;
  transition: opacity .7s var(--nova-anim-ease) var(--nova-anim-delay), transform .7s var(--nova-anim-ease) var(--nova-anim-delay);
}
[data-animate="flip-y"].is-visible { opacity: 1; transform: rotateY(0); }

/* ── Clip ─────────────────────────────────────────────── */
[data-animate="clip-up"] {
  clip-path: inset(100% 0 0 0);
  transition: clip-path var(--nova-anim-duration) var(--nova-anim-ease) var(--nova-anim-delay);
}
[data-animate="clip-up"].is-visible { clip-path: inset(0 0 0 0); }

[data-animate="clip-left"] {
  clip-path: inset(0 100% 0 0);
  transition: clip-path var(--nova-anim-duration) var(--nova-anim-ease) var(--nova-anim-delay);
}
[data-animate="clip-left"].is-visible { clip-path: inset(0 0 0 0); }

/* ── Rotate ───────────────────────────────────────────── */
[data-animate="rotate-in"] {
  opacity: 0; transform: rotate(-12deg) scale(0.85);
  transition: opacity var(--nova-anim-duration) var(--nova-anim-ease) var(--nova-anim-delay), transform var(--nova-anim-duration) var(--nova-anim-ease) var(--nova-anim-delay);
}
[data-animate="rotate-in"].is-visible { opacity: 1; transform: rotate(0) scale(1); }

/* ── Animations CSS en boucle ─────────────────────────── */
.nova-float { animation: nova-float 4s ease-in-out infinite; }
@keyframes nova-float { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-8px); } }

.nova-pulse { animation: nova-pulse 2s ease-in-out infinite; }
@keyframes nova-pulse { 0%,100% { transform: scale(1); } 50% { transform: scale(1.04); } }

.nova-morph { animation: nova-morph 8s ease-in-out infinite; }
@keyframes nova-morph {
  0%,100% { border-radius: 60% 40% 30% 70% / 60% 30% 70% 40%; }
  50%      { border-radius: 30% 60% 70% 40% / 50% 60% 30% 60%; }
}

.nova-gradient-anim { background: linear-gradient(-45deg, #071426, #0B1D3A, #1B8F6B, #16755a); background-size: 400% 400%; animation: nova-gradient 10s ease infinite; }
@keyframes nova-gradient { 0%,100% { background-position: 0% 50%; } 50% { background-position: 100% 50%; } }

.nova-scanline { position: relative; overflow: hidden; }
.nova-scanline::after { content: ''; position: absolute; top: -100%; left: 0; right: 0; height: 40%; background: linear-gradient(to bottom, transparent, rgba(27,143,107,.05), transparent); animation: nova-scanline 3s linear infinite; pointer-events: none; }
@keyframes nova-scanline { from { top: -40%; } to { top: 120%; } }

/* Compteur */
.nova-counter { display: inline-block; font-variant-numeric: tabular-nums; }

/* Barre de progression */
.nova-progress { height: 6px; background: var(--nova-color-primary-bg); border-radius: 9999px; overflow: hidden; }
.nova-progress-fill { height: 100%; width: 0; background: linear-gradient(90deg, var(--nova-color-primary), var(--nova-color-primary-light)); border-radius: 9999px; transition: width 1.2s cubic-bezier(0.22,1,0.36,1); }
.nova-progress-fill::after { content: ''; position: absolute; top: 0; left: -60%; width: 60%; height: 100%; background: linear-gradient(90deg, transparent, rgba(255,255,255,.4), transparent); animation: nova-shimmer 2s infinite; }
@keyframes nova-shimmer { to { left: 120%; } }

/* Skeleton loader */
.nova-skeleton { background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%); background-size: 200% 100%; animation: nova-skeleton 1.5s ease infinite; border-radius: 4px; }
@keyframes nova-skeleton { 0% { background-position: -200% 0; } 100% { background-position: 200% 0; } }

/* Spinner */
.nova-spinner { width: 40px; height: 40px; border: 3px solid var(--nova-color-primary-bg); border-top-color: var(--nova-color-primary); border-radius: 50%; animation: nova-spin .8s linear infinite; }
@keyframes nova-spin { to { transform: rotate(360deg); } }

/* Dot pulsing */
.nova-dot-pulse { animation: nova-dot-pulse 2s ease-in-out infinite; }
@keyframes nova-dot-pulse { 0%,100% { box-shadow: 0 0 0 0 rgba(27,143,107,.6); } 50% { box-shadow: 0 0 0 8px rgba(27,143,107,0); } }

/* Pop in */
@keyframes nova-pop-in { from { transform: scale(0) rotate(-180deg); opacity: 0; } to { transform: scale(1) rotate(0); opacity: 1; } }
.nova-pop-in { animation: nova-pop-in .6s cubic-bezier(0.34,1.56,0.64,1) both; }

/* Slide in from left */
@keyframes nova-slide-in-left { from { transform: translateX(-100%); opacity: 0; } to { transform: translateX(0); opacity: 1; } }
.nova-slide-in-left { animation: nova-slide-in-left .5s var(--nova-anim-ease) both; }

/* Hover lift */
.nova-lift { transition: transform .3s var(--nova-anim-ease), box-shadow .3s var(--nova-anim-ease); }
.nova-lift:hover { transform: translateY(-6px); box-shadow: 0 20px 40px rgba(0,0,0,.12); }

/* Glow hover */
.nova-glow:hover { box-shadow: 0 0 0 4px rgba(27,143,107,.25), 0 10px 25px rgba(27,143,107,.2); }

/* Trust bar scroll */
.nova-trust-track { animation: nova-trust-scroll 35s linear infinite; }
.nova-trust-track:hover { animation-play-state: paused; }
@keyframes nova-trust-scroll { from { transform: translateX(0); } to { transform: translateX(-50%); } }

/* ── Reduced motion override ──────────────────────────── */
@media (prefers-reduced-motion: reduce) {
  [data-animate],
  [data-animate="fade"], [data-animate="fade-up"], [data-animate="fade-down"],
  [data-animate="fade-left"], [data-animate="fade-right"],
  [data-animate="zoom-in"], [data-animate="zoom-out"],
  [data-animate="spring-up"], [data-animate="bounce-in"],
  [data-animate="flip-x"], [data-animate="flip-y"],
  [data-animate="clip-up"], [data-animate="clip-left"],
  [data-animate="rotate-in"],
  .nova-float, .nova-pulse, .nova-morph,
  .nova-gradient-anim, .nova-spinner {
    animation: none !important;
    transition: none !important;
    opacity: 1 !important;
    transform: none !important;
    clip-path: none !important;
  }
}
