/* motion.css — micro-animazioni CSS (leggere: solo transform/opacity).
   Tutto sotto prefers-reduced-motion: no-preference; guardia di reset per chi
   preferisce meno movimento. */

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}

@media (prefers-reduced-motion: no-preference) {
  @keyframes rise {
    from { opacity: 0; transform: translateY(8px); }
    to   { opacity: 1; transform: none; }
  }

  /* Entrata pagina */
  .page, .portal-main { animation: rise 0.45s var(--ease) both; }
  .auth-card { animation: rise 0.5s var(--ease) both; }

  /* Card: profondità morbida + lift all'hover */
  .card {
    box-shadow: var(--shadow-sm);
    transition: box-shadow 0.25s var(--ease), transform 0.25s var(--ease), border-color 0.25s var(--ease);
  }
  .card:hover {
    box-shadow: var(--shadow-md);
    transform: translateY(-2px);
    border-color: var(--hairline-strong);
  }
  /* Le card non-interattive (senza link/azione) non si sollevano */
  .card.card-static:hover { box-shadow: var(--shadow-sm); transform: none; border-color: var(--hairline); }

  /* Bottoni: micro press */
  .btn-primary, .btn-ghost, .btn-destructive {
    transition: background 0.15s var(--ease), border-color 0.15s var(--ease),
                color 0.15s var(--ease), transform 0.08s var(--ease);
  }
  .btn-primary:active, .btn-ghost:active, .btn-destructive:active {
    transform: translateY(1px) scale(0.99);
  }

  /* Stagger d'entrata per griglie/liste (aggiungere .stagger al contenitore) */
  .stagger > * { animation: rise 0.4s var(--ease) both; }
  .stagger > *:nth-child(2) { animation-delay: 0.04s; }
  .stagger > *:nth-child(3) { animation-delay: 0.08s; }
  .stagger > *:nth-child(4) { animation-delay: 0.12s; }
  .stagger > *:nth-child(5) { animation-delay: 0.16s; }
  .stagger > *:nth-child(6) { animation-delay: 0.20s; }
  .stagger > *:nth-child(7) { animation-delay: 0.24s; }
  .stagger > *:nth-child(8) { animation-delay: 0.28s; }

  /* Transizioni swap htmx */
  .htmx-added { animation: rise 0.35s var(--ease) both; }
  .htmx-swapping { opacity: 0; transition: opacity 0.12s var(--ease); }
  .htmx-settling { opacity: 1; transition: opacity 0.18s var(--ease); }
}