/* =========================================================
   GEOTEST · Transiciones de página (View Transitions API)

   Objetivo: que al iniciar sesión el login se deslice a la izquierda y
   descubra el dashboard, en lugar de un cambio de página en seco.

   CÓMO FUNCIONA (y por qué no hace falta una SPA):
   Una transición cross-document exige que AMBOS documentos —el que sale y el
   que entra— declaren `@view-transition`. Por eso este archivo se carga en
   layout/login.phtml y en layout/layout.phtml. El navegador toma una foto del
   documento saliente, carga el entrante con normalidad (mismo POST, mismo
   302, mismo Laminas) y anima entre las dos. Donde no hay soporte —hoy
   Firefox— la navegación ocurre como siempre: no hay fallback que mantener.

   ALCANCE — esto NO cambia el aspecto del resto del ERP:
   El par `root` se deja SIN animación a propósito, así que cualquier
   navegación entre pantallas del ERP se ve exactamente igual que hoy. Lo
   único que se anima es el grupo `escena-login`, un nombre que solo existe
   en la pantalla de login (lo declara css/modulos/login/login.css). Es decir:
   la animación solo puede dispararse al salir del login.

   Las pseudo-clases de la transición las estiliza el documento ENTRANTE, por
   eso las reglas viven aquí (archivo compartido) y no en login.css.
   ========================================================= */

@view-transition { navigation: auto; }

/* Navegación ordinaria del ERP: sin animación. El documento entrante se pinta
   sobre el saliente igual que en una navegación normal. */
::view-transition-old(root),
::view-transition-new(root) {
  animation: none;
}

/* Salida del login.
   `:only-child` distingue que el elemento SE VA (no tiene contraparte en el
   documento entrante). Es lo que separa el caso "login → dashboard" del caso
   "login → login" cuando las credenciales fallan: ahí `escena-login` existe en
   los dos documentos, no se cumple :only-child y el aviso de error entra con
   el fundido discreto que pone el navegador, no con un deslizamiento. */
::view-transition-old(escena-login):only-child {
  animation: gt-salir-izquierda var(--duration-page, 480ms) var(--ease-inout, cubic-bezier(0.65, 0, 0.35, 1)) both;
  /* El navegador aplica `plus-lighter` para fundir cruzado; aquí la escena es
     opaca y se desplaza por encima del dashboard, así que ese modo la haría
     brillar donde se superponen. */
  mix-blend-mode: normal;
}

@keyframes gt-salir-izquierda {
  to { transform: translateX(-100%); }
}

/* Entrada del login (cerrar sesión).
   El movimiento inverso del anterior: la escena entra desde la izquierda y se
   asienta sobre el tablero que se está abandonando. Mismo `:only-child`, ahora
   del lado `new`: solo se cumple cuando el login ENTRA sin venir de sí mismo,
   es decir al cerrar sesión desde cualquier pantalla del ERP. Un arranque en
   frío del login (URL escrita, enlace externo) no genera transición alguna:
   no hay documento saliente que participe.

   Dura --duration-exit (220ms) y no --duration-page (480ms) como su contraparte,
   a propósito y por asimetría deliberada: entrar al ERP es el momento que la
   animación busca acompañar, pero al cerrar sesión el usuario ya decidió irse y
   cada milisegundo es espera pura. Encima se acumula sobre lo que tarda el 302
   de /login/cerrar más el pintado del login (~530ms medidos), y ahí la
   animación era la mitad del tiempo total. Es además la regla del sistema de
   diseño para movimiento: «exit más rápido que entrance» (motion.tokens). */
::view-transition-new(escena-login):only-child {
  animation: gt-entrar-izquierda var(--duration-exit, 220ms) var(--ease-inout, cubic-bezier(0.65, 0, 0.35, 1)) both;
  mix-blend-mode: normal;
}

@keyframes gt-entrar-izquierda {
  from { transform: translateX(-100%); }
}

/* motion.reduced_motion del sistema de diseño: --duration-page ya colapsa a
   0ms en tokens.css; se anula además la animación para no depender de eso. */
@media (prefers-reduced-motion: reduce) {
  ::view-transition-old(escena-login):only-child,
  ::view-transition-new(escena-login):only-child { animation: none; }
}