/* Animation Definitions */

/* Message pop-in animation */
@keyframes msgPopIn {
  0% {
    opacity: 0;
    transform: translateY(14px) scale(0.96);
  }
  60% {
    opacity: 1;
    transform: translateY(-2px) scale(1.01);
  }
  100% {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

/* Fade in animation */
@keyframes msgFadeIn {
  from { opacity: 0; transform: scale(0.98); }
  to   { opacity: 1; transform: scale(1); }
}

/* Cursor blink animation */
@keyframes cursorBlink {
  0%, 100% { opacity: 1; }
  50%      { opacity: 0; }
}

/* Dot wave animation (typing indicator) */
@keyframes dotWave {
  0%, 60%, 100% {
    transform: translateY(0);
    background: var(--text-muted);
    box-shadow: 0 0 0 0 rgba(108,92,231,0);
  }
  30% {
    transform: translateY(-12px);
    background: var(--primary-light);
    box-shadow: 0 4px 12px rgba(108,92,231,0.35);
  }
}

/* Dot ripple animation (status indicator) */
@keyframes dotRipple {
  0%, 100% {
    box-shadow: 0 0 0 0 rgba(0,230,118,0.6);
  }
  50% {
    box-shadow: 0 0 0 10px rgba(0,230,118,0);
  }
}

/* Header shimmer animation */
@keyframes headerShimmer {
  0%, 100% { transform: translateX(-100%) translateY(0); }
  50%      { transform: translateX(100%) translateY(0); }
}

/* Input glow animation */
@keyframes inputGlow {
  0%, 100% { background-position: 200% 0; opacity: 0.6; }
  50%      { background-position: 0% 0; opacity: 1; }
}

/* Config reveal animation */
@keyframes configReveal {
  from { opacity: 0; max-height: 0; padding-top: 0; padding-bottom: 0; }
  to   { opacity: 1; max-height: 200px; padding-top: 14px; padding-bottom: 14px; }
}

/* Result expand animation */
@keyframes resultExpand {
  from { max-height: 0; opacity: 0; padding-top: 0; padding-bottom: 0; }
  to   { max-height: 300px; opacity: 1; padding-top: 14px; padding-bottom: 14px; }
}

/* Error shake animation */
@keyframes errorShake {
  0%, 100% { transform: translateX(0); }
  15%      { transform: translateX(-5px); }
  30%      { transform: translateX(5px); }
  45%      { transform: translateX(-4px); }
  60%      { transform: translateX(3px); }
  75%      { transform: translateX(-2px); }
  90%      { transform: translateX(1px); }
}

/* Thinking appear animation */
@keyframes thinkAppear {
  from { opacity: 0; max-height: 0; margin-bottom: 0; }
  to   { opacity: 1; max-height: 800px; margin-bottom: 8px; }
}

/* Thinking pulse animation */
@keyframes thinkPulse {
  0%, 100% { opacity: 0.5; transform: scale(1); }
  50%      { opacity: 1; transform: scale(1.15); }
}

/* Stop pulse animation */
@keyframes stopPulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(255,82,82,0.2); }
  50%      { box-shadow: 0 0 0 8px rgba(255,82,82,0); }
}

/* Modal fade in */
@keyframes fadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}

/* Modal slide up */
@keyframes modalSlideUp {
  from { opacity: 0; transform: translateY(20px) scale(0.95); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}

/* Welcome reveal animation */
@keyframes welcomeReveal {
  0%   { opacity: 0; transform: translateY(30px) scale(0.94); }
  100% { opacity: 1; transform: translateY(0) scale(1); }
}

/* Welcome bounce animation */
@keyframes welcomeBounce {
  0%   { opacity: 0; transform: scale(0.3) rotate(-10deg); }
  60%  { opacity: 1; transform: scale(1.08) rotate(2deg); }
  100% { opacity: 1; transform: scale(1) rotate(0deg); }
}

/* Welcome fade up animation */
@keyframes welcomeFadeUp {
  from { opacity: 0; transform: translateY(14px); }
  to   { opacity: 1; transform: translateY(0); }
}