/* ===================================================================
   AiTenderChat — Animations (Этап 3, 14.05.2026)
   Только transform + opacity. Уважаем prefers-reduced-motion.
   =================================================================== */

/* 1. Появление сообщения */
@keyframes at-msg-enter {
  from { opacity: 0; transform: translateY(8px); }
  to   { opacity: 1; transform: translateY(0); }
}
.msg-enter {
  animation: at-msg-enter var(--dur-base, 200ms) var(--ease, ease-out) both;
}

/* 2. Bottom sheet */
@keyframes at-bottom-sheet-up {
  from { transform: translateY(100%); }
  to   { transform: translateY(0); }
}
.bottom-sheet-enter {
  animation: at-bottom-sheet-up var(--dur-slow, 300ms) var(--ease, ease-out) both;
  will-change: transform;
}

/* 3. Typing indicator: 3 точки с stagger */
@keyframes at-typing-dot {
  0%, 60%, 100% { opacity: 0.3; transform: scale(0.85); }
  30%           { opacity: 1;   transform: scale(1); }
}
.typing-dot {
  display: inline-block;
  width: 6px; height: 6px;
  border-radius: 50%;
  background: currentColor;
  margin: 0 2px;
  animation: at-typing-dot 1.4s infinite ease-in-out both;
}
.typing-dot:nth-child(1) { animation-delay: 0s; }
.typing-dot:nth-child(2) { animation-delay: 0.2s; }
.typing-dot:nth-child(3) { animation-delay: 0.4s; }

/* 4. Reactions bounce */
@keyframes at-reaction-bounce {
  0%   { transform: scale(1); }
  50%  { transform: scale(1.4); }
  100% { transform: scale(1); }
}
.reaction-bounce {
  animation: at-reaction-bounce 400ms var(--ease-bounce, cubic-bezier(0.34, 1.56, 0.64, 1)) both;
}

/* 5. Pull-to-refresh ring */
@keyframes at-pulse-ring {
  0%   { transform: rotate(0deg);   opacity: 0.6; }
  50%  { opacity: 1; }
  100% { transform: rotate(360deg); opacity: 0.6; }
}
.ptr-ring {
  display: inline-block;
  width: 28px; height: 28px;
  border: 2.5px solid var(--at-primary, #6366f1);
  border-top-color: transparent;
  border-radius: 50%;
  animation: at-pulse-ring 1s infinite linear;
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
  .msg-enter,
  .bottom-sheet-enter,
  .typing-dot,
  .reaction-bounce,
  .ptr-ring {
    animation: none !important;
  }
}