/*
 * Système de motion — jeton + primitives réutilisables, style Stripe (poli, product-grade).
 * Contrat : le thème possède les animations (UI_CONTRACT.md §1). Ce fichier ne dépend
 * d'aucune donnée métier : il n'anime que des surfaces déjà rendues par le thème ou le plugin.
 *
 * Respecte la double convention déjà établie par le thème (voir ui-helpers.css) :
 * @media(prefers-reduced-motion:reduce) pour la préférence système, ET
 * html[data-acopad-reduce-motion="1"] pour le réglage explicite du Personnaliseur/plugin.
 * Les deux désactivent la même chose : jamais de contenu caché, seulement l'état final instantané.
 */

:root{
  /* Durées — cf. animation-systems: micro/UI/petites transitions/entrée de section */
  --acopad-dur-micro:150ms;
  --acopad-dur-ui:200ms;
  --acopad-dur-small:260ms;
  --acopad-dur-section:500ms;
  --acopad-dur-slow:700ms;

  /* Easings — accélération douce, pose nette ; pas de rebond/élastique (ton Stripe) */
  --acopad-ease-out:cubic-bezier(.16,1,.3,1);
  --acopad-ease-in:cubic-bezier(.7,0,.84,0);
  --acopad-ease-standard:cubic-bezier(.4,0,.2,1);

  /* Décalages */
  --acopad-motion-rise:16px;
  --acopad-motion-rise-sm:8px;
  --acopad-motion-scale:.98;
  --acopad-motion-lift:-4px;
  --acopad-motion-stagger:60ms;
}

/* ─────────────────────────────────────────────────────────────
   A) Fade + rise — entrée par défaut (cartes, sections, blocs de texte)
   ───────────────────────────────────────────────────────────── */
[data-acopad-reveal]{
  opacity:0;
  transform:translateY(var(--acopad-motion-rise));
  transition:opacity var(--acopad-dur-section) var(--acopad-ease-out),
             transform var(--acopad-dur-section) var(--acopad-ease-out);
}
[data-acopad-reveal].is-revealed{opacity:1;transform:none}

/* Stagger déclaratif : jusqu'à 8 éléments enfants directs d'un conteneur marqué. */
[data-acopad-reveal-group]>[data-acopad-reveal]:nth-child(1){transition-delay:calc(var(--acopad-motion-stagger)*0)}
[data-acopad-reveal-group]>[data-acopad-reveal]:nth-child(2){transition-delay:calc(var(--acopad-motion-stagger)*1)}
[data-acopad-reveal-group]>[data-acopad-reveal]:nth-child(3){transition-delay:calc(var(--acopad-motion-stagger)*2)}
[data-acopad-reveal-group]>[data-acopad-reveal]:nth-child(4){transition-delay:calc(var(--acopad-motion-stagger)*3)}
[data-acopad-reveal-group]>[data-acopad-reveal]:nth-child(5){transition-delay:calc(var(--acopad-motion-stagger)*4)}
[data-acopad-reveal-group]>[data-acopad-reveal]:nth-child(6){transition-delay:calc(var(--acopad-motion-stagger)*5)}
[data-acopad-reveal-group]>[data-acopad-reveal]:nth-child(7){transition-delay:calc(var(--acopad-motion-stagger)*6)}
[data-acopad-reveal-group]>[data-acopad-reveal]:nth-child(8){transition-delay:calc(var(--acopad-motion-stagger)*7)}

/* ─────────────────────────────────────────────────────────────
   B) Scale + fade — emphase discrète (popovers, menus, sélection)
   ───────────────────────────────────────────────────────────── */
.acopad-anim-scale-fade{
  opacity:0;
  transform:scale(var(--acopad-motion-scale));
  transition:opacity var(--acopad-dur-small) var(--acopad-ease-out),
             transform var(--acopad-dur-small) var(--acopad-ease-out);
}
.acopad-anim-scale-fade.is-open,
.acopad-anim-scale-fade[data-open="1"]{opacity:1;transform:none}

/* ─────────────────────────────────────────────────────────────
   C) Slide — panneaux latéraux, étapes (transform uniquement, jamais left/width)
   ───────────────────────────────────────────────────────────── */
.acopad-anim-slide-right{
  transform:translate3d(100%,0,0);
  transition:transform var(--acopad-dur-section) var(--acopad-ease-out);
}
.acopad-anim-slide-right.is-open{transform:none}
.acopad-anim-slide-left{
  transform:translate3d(-100%,0,0);
  transition:transform var(--acopad-dur-section) var(--acopad-ease-out);
}
.acopad-anim-slide-left.is-open{transform:none}

/* ─────────────────────────────────────────────────────────────
   Hover : lever + halo léger (cartes, tuiles d'action, ressources)
   ───────────────────────────────────────────────────────────── */
.acopad-hover-lift{
  transition:transform var(--acopad-dur-ui) var(--acopad-ease-standard),
             box-shadow var(--acopad-dur-ui) var(--acopad-ease-standard),
             border-color var(--acopad-dur-ui) var(--acopad-ease-standard);
}
.acopad-hover-lift:hover,
.acopad-hover-lift:focus-visible{
  transform:translateY(var(--acopad-motion-lift));
  box-shadow:0 8px 20px -12px color-mix(in srgb, var(--acopad-ui-text) 35%, transparent);
  border-color:var(--acopad-ui-accent);
}

/* Focus : anneau net + micro-décalage, jamais de simple suppression d'outline */
.acopad-focus-ring:focus-visible{
  outline:2px solid var(--acopad-ui-focus);
  outline-offset:2px;
  transition:outline-offset var(--acopad-dur-micro) var(--acopad-ease-standard);
}

/* Pression bouton : retour immédiat, pas d'attente de relâchement */
.acopad-press:active{transform:scale(.97);transition-duration:80ms}

/* ─────────────────────────────────────────────────────────────
   Utilitaires de rotation/apparition pour icônes (chevrons, bascules)
   ───────────────────────────────────────────────────────────── */
.acopad-anim-rotate{transition:transform var(--acopad-dur-ui) var(--acopad-ease-standard)}
.acopad-anim-rotate.is-expanded{transform:rotate(180deg)}

/* ─────────────────────────────────────────────────────────────
   Mouvement réduit : préférence système ET réglage explicite du thème.
   Le contenu reste visible, seul le mouvement disparaît (opacité conservée en instantané).
   ───────────────────────────────────────────────────────────── */
@media(prefers-reduced-motion:reduce){
  [data-acopad-reveal],
  [data-acopad-reveal-group]>[data-acopad-reveal],
  .acopad-anim-scale-fade,
  .acopad-anim-slide-right,
  .acopad-anim-slide-left,
  .acopad-hover-lift,
  .acopad-focus-ring,
  .acopad-press,
  .acopad-anim-rotate{transition:none!important;transition-delay:0s!important}
  [data-acopad-reveal]{opacity:1;transform:none}
  .acopad-hover-lift:hover,
  .acopad-hover-lift:focus-visible{transform:none}
  .acopad-press:active{transform:none}
}
html[data-acopad-reduce-motion="1"] [data-acopad-reveal],
html[data-acopad-reduce-motion="1"] [data-acopad-reveal-group]>[data-acopad-reveal],
html[data-acopad-reduce-motion="1"] .acopad-anim-scale-fade,
html[data-acopad-reduce-motion="1"] .acopad-anim-slide-right,
html[data-acopad-reduce-motion="1"] .acopad-anim-slide-left,
html[data-acopad-reduce-motion="1"] .acopad-hover-lift,
html[data-acopad-reduce-motion="1"] .acopad-focus-ring,
html[data-acopad-reduce-motion="1"] .acopad-press,
html[data-acopad-reduce-motion="1"] .acopad-anim-rotate{transition:none!important;transition-delay:0s!important}
html[data-acopad-reduce-motion="1"] [data-acopad-reveal]{opacity:1;transform:none}
html[data-acopad-reduce-motion="1"] .acopad-hover-lift:hover,
html[data-acopad-reduce-motion="1"] .acopad-hover-lift:focus-visible{transform:none}
html[data-acopad-reduce-motion="1"] .acopad-press:active{transform:none}

/* ─────────────────────────────────────────────────────────────
   Transition login → intranet (cross-document View Transitions).
   La moitié du travail vit ici (page d'arrivée) ; l'autre moitié dans
   login.css (page de départ) — les deux documents doivent déclarer
   `@view-transition{navigation:auto}` pour que le navigateur anime le
   passage de l'un à l'autre. Chromium/Edge seulement pour l'instant ;
   Firefox/Safari ignorent silencieusement la règle et naviguent comme
   d'habitude, sans aucune casse.
   ───────────────────────────────────────────────────────────── */
@view-transition {
  navigation: auto;
}
::view-transition-new(root) {
  animation: acopad-vt-fade-in .5s var(--acopad-ease-out, cubic-bezier(.16,1,.3,1)) both;
}
@keyframes acopad-vt-fade-in {
  from { opacity: 0; }
}
html[data-acopad-reduce-motion="1"] ::view-transition-new(root) {
  animation: none;
}

/* R77b — le document change, mais le rail appartient au shell persistant.
   Son snapshot est isolé du fondu de la page pour éviter qu'il disparaisse
   puis réapparaisse à chaque navigation interne. */
@media (min-width:1081px) {
  .acopad-appnav--rail { view-transition-name: acopad-rail; }
}
::view-transition-group(acopad-rail),
::view-transition-old(acopad-rail),
::view-transition-new(acopad-rail) {
  animation: none;
}