/* Mesmas bolhas e conteúdo tanto no widget quanto na prévia administrativa. */
.webchat-messages { font: 14px/1.45 system-ui, sans-serif; color: #212529; }
.webchat-messages .message { box-sizing: border-box; max-width: 82%; margin: 0 0 12px; padding: 10px 13px; border-radius: 12px; white-space: pre-wrap; overflow-wrap: anywhere; }
.webchat-messages .Cliente { background: #f1f3f5; margin-right: auto; }
.webchat-messages .Chatbot { background: #dbeafe; margin-left: auto; }
.webchat-messages .Atendente { background: #0d6efd; color: white; margin-left: auto; }
.webchat-messages .meta { display: block; font-size: 11px; opacity: .7; margin-bottom: 3px; }
.webchat-messages .message-image { display: block; max-width: 100%; height: auto; border-radius: 8px; }
.webchat-messages .webchat-html { white-space: normal; overflow-x: auto; }
.webchat-html :is(div, p, span, strong, b, em, i, u, s, br, hr, ul, ol, li, h1, h2, h3, h4, blockquote, pre, code, table, thead, tbody, tr, th, td) { all: revert; }