/* =========================
   WIDGET FLUTUANTE
========================= */
.chat-fab {
    position: fixed;
    right: 22px;
    bottom: 22px;
    width: 56px;
    height: 56px;
    border-radius: 50%;
    background: #79bb1b;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    box-shadow: 0 10px 30px rgba(0,0,0,.18);
    z-index: 20013;
    user-select: none;
    font-size: 22px;
}

.chat-card {
    position: fixed;
    right: 22px;
    bottom: 90px;
    width: 360px;
    max-width: calc(100vw - 44px);
    height: 520px;
    max-height: calc(100vh - 140px);
    background: #fff;
    border-radius: 10px;
    box-shadow: 0 18px 60px rgba(0,0,0,.22);
    overflow: hidden;
    z-index: 20012;
    display: flex;
    flex-direction: column;
}

.chat-card-header {
    padding: 10px 12px;
    border-bottom: 1px solid #e7eaec;
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: #fff;
}

.chat-close {
    border: none;
    background: transparent;
    font-size: 18px;
    cursor: pointer;
    line-height: 1;
}

.chat-card-body {
    flex: 1;
    overflow: hidden;
}

.chat-card-footer {
    border-top: 1px solid #e7eaec;
    background: #fff;
    padding: 10px;
}

/* =========================
   CHAT: DISCUSSION + INPUT
========================= */

/* Área de conversa (serve para page e widget) */
.chat-discussion {
    background: #eee;
    padding: 15px;
    overflow-y: auto;
}

/* Page: altura fixa */
#chatWindowPage.chat-discussion {
    height: 400px;
}

/* Widget: ocupa o card */
#chatWindowWidget.chat-discussion {
    height: 100%;
}

/* textarea */
.message-input {
    resize: none;
    height: 90px !important;
}

/* widget textarea menor */
.message-input-widget {
    height: 48px !important;
}

/* botão alinhado com textarea */
.chat-send-btn {
    height: 90px;
}

.chat-send-btn-widget {
    height: 48px;
}

/* =========================
   LLM FINAL OVERRIDE (ganha ao style.min.css)
   - 1 msg por linha
   - bot esquerda, user direita
   - avatar sempre FORA do balão
========================= */

.llm-chat-root .chat-message {
    width: 100% !important;
    display: flex !important;
    align-items: flex-start !important;
    justify-content: flex-start !important;
    gap: 10px !important;
    /* mata padding/margens do tema */
    padding: 0 !important;
    margin: 12px 0 !important;
    clear: both !important;
}

    /* alinhamento por lado */
    .llm-chat-root .chat-message.left {
        justify-content: flex-start !important;
        padding-right: 60px !important; /* gutter */
    }

    .llm-chat-root .chat-message.right {
        justify-content: flex-end !important;
        padding-left: 60px !important; /* gutter */
    }

    /* avatar: nunca flutua, nunca ganha margens antigas */
    .llm-chat-root .chat-message .message-avatar {
        float: none !important;
        margin: 0 !important;
        flex: 0 0 auto !important;
        order: 0 !important;
    }

    /* balão: remove margins 55px e floats do tema */
    .llm-chat-root .chat-message .message {
        float: none !important;
        margin: 0 !important;
        max-width: 70% !important;
        flex: 0 1 auto !important;
        order: 1 !important;
        text-align: left !important; /* base */
    }

    /* user: balão à direita com texto à direita + avatar fora à direita */
    .llm-chat-root .chat-message.right .message {
        text-align: right !important;
        order: 1 !important;
    }

    .llm-chat-root .chat-message.right .message-avatar {
        order: 2 !important; /* avatar fica do lado de fora, à direita */
    }

/* data: sem float */
.llm-chat-root .message-date {
    float: none !important;
    display: block !important;
    margin: 0 0 4px 0 !important;
}

/* Justificar texto das mensagens (LLM apenas) */
.llm-chat-root .message-content {
    text-align: justify;
    text-justify: inter-word;
    white-space: pre-wrap; 
    word-break: break-word; 
    line-height: 1.5;
}