/**
 * CSS específico para garantir que aikit-message-content tenha exatamente o mesmo estilo que guardian-message-bubble
 * Usa seletores de alta especificidade e !important em todas as propriedades
 */

/* Seletores extremamente específicos para aikit-message-content */
html body .aikit-chat .aikit-chat-messages .aikit-message-bot .aikit-message-content,
html body .aikit-chat .aikit-message-bot .aikit-message-content,
html body .aikit-message-bot .aikit-message-content,
.aikit-message-bot .aikit-message-content,
.aikit-message-bot > .aikit-message-content,
.aikit-message-bot > div > .aikit-message-content,
.aikit-message-bot > div > div > .aikit-message-content,
.aikit-message-bot span.aikit-message-content,
.aikit-message-bot div.aikit-message-content {
    background-color: #1D1D1D !important;
    color: #F0A030 !important;
    border: none !important;
    border-radius: 12px !important;
    padding: 12px 16px !important;
    font-family: 'Playfair Display', serif !important;
    font-size: 15px !important;
    line-height: 1.5 !important;
    position: relative !important;
    display: inline-block !important;
    max-width: 85% !important;
    margin-left: 15px !important;
    box-sizing: border-box !important;
    box-shadow: none !important;
    text-align: left !important;
    float: none !important;
    width: auto !important;
}

/* Cauda para mensagens do bot - seletores extremamente específicos */
html body .aikit-chat .aikit-chat-messages .aikit-message-bot .aikit-message-content::before,
html body .aikit-chat .aikit-message-bot .aikit-message-content::before,
html body .aikit-message-bot .aikit-message-content::before,
.aikit-message-bot .aikit-message-content::before,
.aikit-message-bot > .aikit-message-content::before,
.aikit-message-bot > div > .aikit-message-content::before,
.aikit-message-bot > div > div > .aikit-message-content::before,
.aikit-message-bot span.aikit-message-content::before,
.aikit-message-bot div.aikit-message-content::before {
    content: "" !important;
    position: absolute !important;
    top: 10px !important;
    left: -10px !important;
    width: 0 !important;
    height: 0 !important;
    border-style: solid !important;
    border-width: 8px 10px 8px 0 !important;
    border-color: transparent #1D1D1D transparent transparent !important;
    z-index: 1 !important;
}

/* Remover qualquer elemento que possa estar interferindo */
.aikit-message-bot > div:not(.aikit-message-content):not(.guardian-message-container):not(.guardian-message-bubble) {
    display: none !important;
}

/* Garantir que o contentor da mensagem do bot não tem fundo */
html body .aikit-chat .aikit-message-bot,
html body .aikit-message-bot,
.aikit-message-bot {
    background-color: transparent !important;
    background: none !important;
    padding: 0 !important;
    margin-bottom: 10px !important;
    border: none !important;
    box-shadow: none !important;
}

/* Remover qualquer fundo branco adicional */
.aikit-chat {
    --aikit-message-bot-bg: transparent !important;
    --aikit-message-bot-color: #F0A030 !important;
}

/* Garantir que guardian-message-bubble e aikit-message-content tenham o mesmo estilo */
.guardian-message-bubble,
.aikit-message-content {
    background-color: #1D1D1D !important;
    color: #F0A030 !important;
    border-radius: 12px !important;
    padding: 12px 16px !important;
    font-family: 'Playfair Display', serif !important;
    font-size: 15px !important;
    line-height: 1.5 !important;
    position: relative !important;
    display: inline-block !important;
    max-width: 85% !important;
    margin-left: 15px !important;
    box-sizing: border-box !important;
    border: none !important;
    box-shadow: none !important;
}