/* ============================================================
   Replyzen — animations (subtle, prefers-reduced-motion aware)
   ============================================================ */

@keyframes rz-rise {
  from { opacity: 0; transform: translate(-50%, 12px); }
  to { opacity: 1; transform: translate(-50%, 0); }
}
.toast { animation: rz-rise 0.25s ease; }

@keyframes rz-fade-up {
  from { opacity: 0; transform: translateY(10px); }
  to { opacity: 1; transform: translateY(0); }
}
.rz-fade-up { animation: rz-fade-up 0.35s ease both; }
.rz-delay-1 { animation-delay: 0.05s; }
.rz-delay-2 { animation-delay: 0.1s; }
.rz-delay-3 { animation-delay: 0.15s; }
.rz-delay-4 { animation-delay: 0.2s; }

@keyframes rz-spin {
  to { transform: rotate(360deg); }
}
.rz-spin { animation: rz-spin 0.8s linear infinite; }

@keyframes rz-pulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.45; }
}
.rz-pulse { animation: rz-pulse 1.2s ease-in-out infinite; }

/* skeleton placeholders while polling */
@keyframes rz-shimmer {
  0% { background-position: -300px 0; }
  100% { background-position: 300px 0; }
}
.skeleton {
  background: var(--card-alt);
  border-radius: var(--radius-sm);
  background-image: linear-gradient(90deg, transparent, rgba(128, 128, 128, 0.08), transparent);
  background-size: 300px 100%;
  animation: rz-shimmer 1.3s infinite linear;
  min-height: 14px;
}
.msg-in { animation: rz-fade-up 0.2s ease both; }

/* typing indicator for the conversation composer */
.typing-dot {
  width: 7px; height: 7px; border-radius: 50%; background: var(--muted);
  display: inline-block; animation: rz-pulse 0.9s ease-in-out infinite;
}
.typing-dot:nth-child(2) { animation-delay: 0.2s; }
.typing-dot:nth-child(3) { animation-delay: 0.4s; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.001s !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001s !important;
  }
}