/* ═══════════════════════════════════════════════════
   Cenection — Formatação visual das respostas da IA
   Usado onde o texto da IA é convertido via
   window.renderMarkdown() (js/site-markdown.js)
   ═══════════════════════════════════════════════════ */

.ia-titulo {
    font-weight: 700;
    color: #4B2E83;
    line-height: 1.3;
    margin: 0.9em 0 0.4em;
}

.ia-titulo:first-child {
    margin-top: 0;
}

.ia-titulo--1 {
    font-size: 1.25em;
}

.ia-titulo--2 {
    font-size: 1.12em;
}

.ia-titulo--3 {
    font-size: 1.03em;
    color: #6a3ea7;
}

.ia-paragrafo {
    margin: 0 0 0.6em;
}

.ia-paragrafo:last-child {
    margin-bottom: 0;
}

.ia-lista {
    margin: 0.2em 0 0.8em;
    padding-left: 1.4em;
    list-style-position: outside;
}

.ia-lista--pontos {
    list-style-type: disc;
}

.ia-lista--numeros {
    list-style-type: decimal;
}

.ia-lista::marker {
    color: #6a3ea7;
}

.ia-lista li {
    margin-bottom: 0.3em;
}

.ia-lista li:last-child {
    margin-bottom: 0;
}

.ia-lista strong,
.ia-paragrafo strong,
.ia-titulo strong {
    font-weight: 700;
    color: inherit;
}

.ia-lista em,
.ia-paragrafo em,
.ia-titulo em {
    font-style: italic;
}

/* Modo escuro — usa o mesmo seletor real do site ([data-theme="dark"])
   e a mesma cor de texto do balão, para nunca coincidir com o fundo */
[data-theme="dark"] .ia-titulo {
    color: var(--dark-text, #e8e8f0);
}

[data-theme="dark"] .ia-titulo--3 {
    color: var(--dark-text, #e8e8f0);
}

[data-theme="dark"] .ia-lista::marker {
    color: var(--dark-text, #e8e8f0);
}