/* ========================================
   ANIMATIONS.CSS - Doctor's & Doctor's
   ======================================== */

/* Fade Animations */
@keyframes fadeIn { from{opacity:0} to{opacity:1} }
@keyframes fadeInUp { from{opacity:0;transform:translateY(40px)} to{opacity:1;transform:translateY(0)} }
@keyframes fadeInDown { from{opacity:0;transform:translateY(-40px)} to{opacity:1;transform:translateY(0)} }
@keyframes fadeInLeft { from{opacity:0;transform:translateX(-40px)} to{opacity:1;transform:translateX(0)} }
@keyframes fadeInRight { from{opacity:0;transform:translateX(40px)} to{opacity:1;transform:translateX(0)} }

/* Pulse & Glow */
@keyframes pulse { 0%,100%{transform:scale(1)} 50%{transform:scale(1.05)} }
@keyframes pulseGlow { 0%,100%{box-shadow:0 0 5px rgba(0,150,255,.4)} 50%{box-shadow:0 0 25px rgba(0,150,255,.8)} }
@keyframes glowBtn { 0%,100%{box-shadow:0 0 10px rgba(0,180,255,.3)} 50%{box-shadow:0 0 30px rgba(0,180,255,.6),0 0 60px rgba(0,180,255,.3)} }

/* Float */
@keyframes float { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-15px)} }
@keyframes floatSlow { 0%,100%{transform:translateY(0) rotate(0deg)} 50%{transform:translateY(-10px) rotate(3deg)} }
@keyframes floatIcon { 0%,100%{transform:translateY(0) scale(1)} 50%{transform:translateY(-20px) scale(1.1)} }

/* Rotate & Spin */
@keyframes rotate { from{transform:rotate(0deg)} to{transform:rotate(360deg)} }
@keyframes spinSlow { from{transform:rotate(0deg)} to{transform:rotate(360deg)} }

/* Scale */
@keyframes scaleIn { from{opacity:0;transform:scale(.8)} to{opacity:1;transform:scale(1)} }
@keyframes bounceIn { 0%{opacity:0;transform:scale(.3)} 50%{transform:scale(1.05)} 70%{transform:scale(.95)} 100%{opacity:1;transform:scale(1)} }

/* Slide */
@keyframes slideInLeft { from{transform:translateX(-100%);opacity:0} to{transform:translateX(0);opacity:1} }
@keyframes slideInRight { from{transform:translateX(100%);opacity:0} to{transform:translateX(0);opacity:1} }
@keyframes slideUp { from{transform:translateY(100px);opacity:0} to{transform:translateY(0);opacity:1} }

/* Typing Cursor */
@keyframes blink { 0%,100%{border-color:transparent} 50%{border-color:#0096ff} }
@keyframes typing { from{width:0} to{width:100%} }

/* Wave Separator */
@keyframes waveMove { 0%{transform:translateX(0)} 100%{transform:translateX(-50%)} }

/* Ripple */
@keyframes ripple { to{transform:scale(4);opacity:0} }

/* Gradient Animation */
@keyframes gradientShift { 0%{background-position:0% 50%} 50%{background-position:100% 50%} 100%{background-position:0% 50%} }

/* Marquee */
@keyframes marquee { 0%{transform:translateX(0)} 100%{transform:translateX(-50%)} }

/* Skeleton Loading */
@keyframes skeleton { 0%{background-position:-200px 0} 100%{background-position:calc(200px + 100%) 0} }

/* Particle Float */
@keyframes particleFloat {
  0%{transform:translate(0,0) rotate(0deg);opacity:1}
  25%{transform:translate(100px,-100px) rotate(90deg);opacity:.7}
  50%{transform:translate(50px,-200px) rotate(180deg);opacity:.4}
  75%{transform:translate(-50px,-300px) rotate(270deg);opacity:.2}
  100%{transform:translate(0,-400px) rotate(360deg);opacity:0}
}

/* Counter Pop */
@keyframes counterPop { 0%{transform:scale(1)} 50%{transform:scale(1.2)} 100%{transform:scale(1)} }

/* Shake */
@keyframes shake { 0%,100%{transform:translateX(0)} 25%{transform:translateX(-5px)} 75%{transform:translateX(5px)} }

/* Border Glow */
@keyframes borderGlow {
  0%,100%{border-color:rgba(0,150,255,.3)}
  50%{border-color:rgba(0,200,255,.8)}
}

/* Page Transition */
@keyframes pageIn { from{opacity:0;transform:translateY(20px)} to{opacity:1;transform:translateY(0)} }

/* Heartbeat for emergency */
@keyframes heartbeat { 0%,100%{transform:scale(1)} 14%{transform:scale(1.1)} 28%{transform:scale(1)} 42%{transform:scale(1.1)} 70%{transform:scale(1)} }

/* Utility Classes */
.anim-fade-in { animation: fadeIn .6s ease forwards }
.anim-fade-up { animation: fadeInUp .6s ease forwards }
.anim-fade-down { animation: fadeInDown .6s ease forwards }
.anim-fade-left { animation: fadeInLeft .6s ease forwards }
.anim-fade-right { animation: fadeInRight .6s ease forwards }
.anim-float { animation: float 3s ease-in-out infinite }
.anim-float-slow { animation: floatSlow 4s ease-in-out infinite }
.anim-pulse { animation: pulse 2s ease-in-out infinite }
.anim-glow { animation: glowBtn 2s ease-in-out infinite }
.anim-rotate { animation: spinSlow 20s linear infinite }
.anim-bounce-in { animation: bounceIn .8s ease forwards }
.anim-scale-in { animation: scaleIn .5s ease forwards }
.anim-heartbeat { animation: heartbeat 1.5s ease-in-out infinite }

.delay-1 { animation-delay: .1s }
.delay-2 { animation-delay: .2s }
.delay-3 { animation-delay: .3s }
.delay-4 { animation-delay: .4s }
.delay-5 { animation-delay: .5s }
