/* =============================================
   E-FYP Portal — Motion & Animation Library
   Pure CSS keyframes. No JS. No dependencies.
   ============================================= */

/* ── Page-level entrance ─────────────────────── */
@keyframes pa-fade-in-up {
  from { opacity: 0; transform: translateY(18px); }
  to   { opacity: 1; transform: translateY(0);    }
}

@keyframes pa-fade-in {
  from { opacity: 0; }
  to   { opacity: 1; }
}

/* ── Login background orbs ───────────────────── */
@keyframes pa-orb-drift-1 {
  0%   { transform: translate(0px,    0px)   scale(1);    }
  25%  { transform: translate(40px,  -60px)  scale(1.06); }
  50%  { transform: translate(-30px, -90px)  scale(0.96); }
  75%  { transform: translate(-60px, -20px)  scale(1.04); }
  100% { transform: translate(0px,    0px)   scale(1);    }
}

@keyframes pa-orb-drift-2 {
  0%   { transform: translate(0px,   0px)   scale(1);    }
  30%  { transform: translate(-50px, 30px)  scale(1.08); }
  60%  { transform: translate(70px,  60px)  scale(0.94); }
  100% { transform: translate(0px,   0px)   scale(1);    }
}

@keyframes pa-orb-drift-3 {
  0%   { transform: translate(0px,  0px)   scale(1);    }
  20%  { transform: translate(30px, 50px)  scale(1.05); }
  55%  { transform: translate(-40px,80px)  scale(0.97); }
  80%  { transform: translate(20px, 20px)  scale(1.03); }
  100% { transform: translate(0px,  0px)   scale(1);    }
}

@keyframes pa-orb-drift-4 {
  0%   { transform: translate(0px,   0px)   scale(1);    }
  40%  { transform: translate(80px, -40px)  scale(0.92); }
  70%  { transform: translate(-20px,-70px)  scale(1.07); }
  100% { transform: translate(0px,   0px)   scale(1);    }
}

/* ── Particle shimmer ────────────────────────── */
@keyframes pa-particle-shimmer {
  0%,  100% { opacity: 0.10; }
  50%       { opacity: 0.45; }
}

/* ── Login card entrance ─────────────────────── */
@keyframes pa-card-rise {
  from { opacity: 0; transform: translateY(32px) scale(0.97); }
  to   { opacity: 1; transform: translateY(0)    scale(1);    }
}

/* ── Staggered form field entrance ──────────── */
@keyframes pa-field-slide-in {
  from { opacity: 0; transform: translateX(-14px); }
  to   { opacity: 1; transform: translateX(0);     }
}

/* ── Login button idle glow pulse ────────────── */
@keyframes pa-btn-glow {
  0%,  100% { box-shadow: 0 4px 14px rgba(37, 99, 235, 0.35); }
  50%       { box-shadow: 0 6px 24px rgba(37, 99, 235, 0.60); }
}

/* ── Navbar shimmer line ─────────────────────── */
@keyframes pa-nav-shimmer {
  0%   { background-position: -400px 0; }
  100% { background-position:  400px 0; }
}

/* ── Dashboard card pop-in ───────────────────── */
@keyframes pa-card-pop {
  from { opacity: 0; transform: translateY(22px) scale(0.96); }
  to   { opacity: 1; transform: translateY(0)    scale(1);    }
}

/* ── Hero text reveal ────────────────────────── */
@keyframes pa-text-reveal {
  from { opacity: 0; letter-spacing: 0.12em; }
  to   { opacity: 1; letter-spacing: -0.02em; }
}

/* ── Rotating conic ring ─────────────────────── */
@keyframes pa-ring-spin {
  from { transform: rotate(0deg);   }
  to   { transform: rotate(360deg); }
}

/* ── Morphing blob ───────────────────────────── */
@keyframes pa-blob-morph {
  0%,100% { border-radius: 60% 40% 55% 45% / 50% 60% 40% 50%; }
  25%     { border-radius: 45% 55% 40% 60% / 60% 40% 55% 45%; }
  50%     { border-radius: 50% 50% 60% 40% / 40% 55% 45% 60%; }
  75%     { border-radius: 55% 45% 45% 55% / 55% 45% 60% 40%; }
}

/* ── Aurora background shift ─────────────────── */
@keyframes pa-aurora {
  0%   { background-position: 0%   50%; }
  50%  { background-position: 100% 50%; }
  100% { background-position: 0%   50%; }
}

/* ── Glow pulse on text ──────────────────────── */
@keyframes pa-text-glow {
  0%,100% { text-shadow: 0 0 20px rgba(99,179,237,0.30), 0 0 40px rgba(37,99,235,0.15); }
  50%     { text-shadow: 0 0 40px rgba(99,179,237,0.65), 0 0 80px rgba(37,99,235,0.35); }
}

/* ── Float up-down ───────────────────────────── */
@keyframes pa-float {
  0%,100% { transform: translateY(0px);   }
  50%     { transform: translateY(-12px); }
}

/* ── Feature card slide-up ───────────────────── */
@keyframes pa-slide-up {
  from { opacity: 0; transform: translateY(36px); }
  to   { opacity: 1; transform: translateY(0);    }
}

/* ── Horizontal scan line ────────────────────── */
@keyframes pa-scan {
  0%   { transform: translateY(-100%); opacity: 0;    }
  10%  { opacity: 0.6; }
  90%  { opacity: 0.6; }
  100% { transform: translateY(1200%); opacity: 0;    }
}

/* ── Counter number tick ─────────────────────── */
@keyframes pa-count-in {
  from { opacity: 0; transform: scale(0.6) translateY(10px); }
  to   { opacity: 1; transform: scale(1)   translateY(0);    }
}

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