/* Fundo animado genérico da tela de login (igual em CHT/Suzano/Archroma —
   mantenha as três cópias idênticas). Só CSS: luzes difusas à deriva e ondas
   suaves, sem nenhuma informação da planta. Cores vêm das variáveis do tema
   daisyUI (--p, --a), então acompanha tema claro/escuro e cada cliente.
   Uso: <div class="login-bg" aria-hidden="true"><i></i><i></i><i></i><b></b><b></b></div>
   logo após <body>. */
.login-bg {
  position: fixed;
  inset: 0;
  z-index: -1;
  overflow: hidden;
  pointer-events: none;
  /* a camada pinta o fundo do tema (herda --b2 do data-theme do body) */
  background: oklch(var(--b2));
}
/* sem isso o fundo sólido do body cobriria a camada (z-index negativo) */
body:has(> .login-bg) { background: transparent; }

.login-bg i {
  position: absolute;
  border-radius: 50%;
  filter: blur(70px);
  will-change: transform;
}
.login-bg i:nth-child(1) {
  width: 46vmax; height: 46vmax; left: -12vmax; top: -14vmax;
  background: oklch(var(--p) / 0.22);
  animation: login-bg-drift-a 38s ease-in-out infinite alternate;
}
.login-bg i:nth-child(2) {
  width: 38vmax; height: 38vmax; right: -10vmax; top: 18vh;
  background: oklch(var(--a) / 0.13);
  animation: login-bg-drift-b 46s ease-in-out infinite alternate;
}
.login-bg i:nth-child(3) {
  width: 34vmax; height: 34vmax; left: 24vw; bottom: -18vmax;
  background: oklch(var(--p) / 0.16);
  animation: login-bg-drift-c 52s ease-in-out infinite alternate;
}

/* Ondas: a forma é máscara (período de 1200px, emenda contínua) pintada com a
   cor do tema; a animação só desliza a máscara. */
.login-bg b {
  position: absolute;
  left: 0; right: 0; bottom: 0;
  height: 22vh;
  min-height: 110px;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 120' preserveAspectRatio='none'%3E%3Cpath d='M0 60Q300 0 600 60T1200 60V120H0Z'/%3E%3C/svg%3E") repeat-x 0 100% / 1200px 100%;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 120' preserveAspectRatio='none'%3E%3Cpath d='M0 60Q300 0 600 60T1200 60V120H0Z'/%3E%3C/svg%3E") repeat-x 0 100% / 1200px 100%;
}
.login-bg b:nth-of-type(1) {
  background: oklch(var(--p) / 0.10);
  animation: login-bg-wave 38s linear infinite;
}
.login-bg b:nth-of-type(2) {
  height: 16vh;
  background: oklch(var(--p) / 0.07);
  animation: login-bg-wave 58s linear infinite reverse;
}

@keyframes login-bg-wave {
  from { -webkit-mask-position: 0 100%; mask-position: 0 100%; }
  to   { -webkit-mask-position: -1200px 100%; mask-position: -1200px 100%; }
}
@keyframes login-bg-drift-a { to { transform: translate(14vmax, 10vmax) scale(1.12); } }
@keyframes login-bg-drift-b { to { transform: translate(-12vmax, 8vmax) scale(0.9); } }
@keyframes login-bg-drift-c { to { transform: translate(10vmax, -8vmax) scale(1.1); } }

@media (prefers-reduced-motion: reduce) {
  .login-bg i, .login-bg b { animation: none; }
}
