@keyframes fadeSlide {
    0% { opacity: 0; transform: translateY(10px); }
    100% { opacity: 1; transform: translateY(0); }
}
.message-animate {
    animation: fadeSlide 0.3s ease forwards;
}
#chat {
  scrollbar-width: none;
  -ms-overflow-style: none;
}
#chat::-webkit-scrollbar {
     display: none;
}
.typing-dots span {
    display: inline-block;
    width: 7px;
    height: 7px;
    margin: 0 2px;
    background-color: #64748b;
    border-radius: 50%;
    animation: blink 1.4s infinite both;
}
.typing-dots span:nth-child(1){ animation-delay: 0s; }
.typing-dots span:nth-child(2){ animation-delay: 0.2s; }
.typing-dots span:nth-child(3){ animation-delay: 0.4s; }
@keyframes blink {
    0%, 80%, 100% { opacity: 0.3; }
    40% { opacity: 1; }
}