/* Animasi Muncul */
@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.bot-message, .user-message {
    animation: fadeInUp 0.3s ease-out forwards;
}

/* --- STYLE PESAN USER (Kanan) --- */
.user-message-container {
    display: flex;
    justify-content: flex-end;
    margin-bottom: 1.25rem;
}

.user-message {
    /* UBAH: Warna lebih terang & fresh (Gradient Biru Langit ke Indigo) */
    background: linear-gradient(135deg, #818cf8 0%, #6366f1 100%);
    color: #ffffff;
    padding: 0.85rem 1.25rem;
    border-radius: 1.25rem;
    border-bottom-right-radius: 0.25rem;
    box-shadow: 0 4px 15px rgba(99, 102, 241, 0.4);
    max-width: 85%;
    font-size: 0.95rem;
    line-height: 1.6;
}

/* --- STYLE PESAN BOT (Kiri) --- */
.bot-message-container {
    display: flex;
    justify-content: flex-start;
    margin-bottom: 1.25rem;
}

.bot-message {
    /* UBAH: Background jadi PUTIH TERANG (White Glass) */
    background-color: rgba(255, 255, 255, 0.95); 
    border: 1px solid rgba(255, 255, 255, 0.5);
    
    /* UBAH: Teks jadi GELAP agar terbaca di background terang */
    color: #1e293b; /* Slate-800 (Abu tua) */
    
    padding: 0.85rem 1.25rem;
    border-radius: 1.25rem;
    border-bottom-left-radius: 0.25rem;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    max-width: 85%;
    font-size: 0.95rem;
    line-height: 1.6;
    font-weight: 500; /* Sedikit ditebalkan agar jelas */
}

/* --- INDIKATOR LOADING --- */
.typing-indicator {
    display: inline-flex;
    align-items: center;
    column-gap: 4px;
    padding: 4px 0;
}
/* Warna titik loading disesuaikan jadi gelap karena backgroundnya sekarang terang */
.typing-dot {
    width: 6px;
    height: 6px;
    background-color: #64748b; /* Abu-abu medium */
    border-radius: 50%;
    animation: typing 1.4s infinite ease-in-out both;
}
.typing-dot:nth-child(1) { animation-delay: -0.32s; }
.typing-dot:nth-child(2) { animation-delay: -0.16s; }
@keyframes typing {
    0%, 80%, 100% { transform: scale(0); opacity: 0.5; }
    40% { transform: scale(1); opacity: 1; }
}