.chatbot-body {

    height: 58vh;

    overflow-y: auto;

    padding: 1.5rem;

    background:
        linear-gradient(
            to bottom,
            #f8f9fa,
            #ffffff
        );

    display: flex;

    flex-direction: column;

    gap: 1rem;
}

/* MENSAJES */

.mensaje-user,
.mensaje-bot {

    display: flex;

    width: 100%;
}

.mensaje-user {

    justify-content: flex-end;
}

.mensaje-bot {

    justify-content: flex-start;
}

/* BURBUJAS */

.mensaje-contenido {

    max-width: 80%;

    padding: 0.85rem 1rem;

    border-radius: 16px;

    font-size: 0.95rem;

    line-height: 1.5;

    word-break: break-word;

    box-shadow:
        0 2px 10px rgba(0,0,0,0.06);
}

/* USER */

.mensaje-user .mensaje-contenido {

    background: #198754;

    color: white;

    border-bottom-right-radius: 4px;
}

/* BOT */

.mensaje-bot .mensaje-contenido {

    background: #f1f3f5;

    color: #212529;

    border-bottom-left-radius: 4px;
}

/* FOOTER */

.chatbot-footer {

    background: white;
}

/* INPUT */

.chatbot-footer .form-control {

    border-radius: 12px 0 0 12px;

    padding: 0.8rem 1rem;
}

.chatbot-footer .btn {

    border-radius: 0 12px 12px 0;

    width: 60px;
}

/* SCROLL */

.chatbot-body::-webkit-scrollbar {

    width: 8px;
}

.chatbot-body::-webkit-scrollbar-thumb {

    background: rgba(0,0,0,0.15);

    border-radius: 20px;
}