/* =========================================================
   ASSISTENTE VIRTUAL (Mia) — botão, painel de conversa
   Arquivo isolado: só aparece quando o assistente está ativo (src/config/assistente.php).
   Sem amarelo e sem vermelho, como o resto do site. Os textos acompanham o "tamanho do texto" da acessibilidade.
   ========================================================= */

.asst-ui { font-family: var(--font-body, 'Segoe UI', Arial, sans-serif); font-size: calc(16px * var(--a11y-fs, 1)); line-height: 1.4; color: var(--ink, #101830); }
.asst-sr { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }

/* ---------- Botão flutuante (cara da Mia) ---------- */
.asst-fab {
    position: fixed; z-index: 1040; right: 16px; bottom: var(--asst-base, 16px);
    width: 64px; height: 64px; padding: 0; overflow: hidden; cursor: pointer;
    background: var(--blue, #003898); border: 3px solid #fff; border-radius: 50%;
    box-shadow: 0 12px 28px -8px rgba(0, 38, 107, .55);
    transition: transform .15s ease, box-shadow .15s ease;
}
.asst-fab:hover { transform: scale(1.06); box-shadow: 0 16px 32px -8px rgba(0, 38, 107, .6); }
.asst-fab img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: 50% 0; transform: scale(1.85); transform-origin: 50% 13%; }
.asst-fab:focus-visible, .asst-ui button:focus-visible, .asst-ui input:focus-visible { outline: 3px solid var(--blue-mid, #2a62d6); outline-offset: 3px; }
.asst-fab:focus-visible { outline-color: var(--blue-ink, #0a1a45); box-shadow: 0 0 0 6px #fff, 0 12px 28px -8px rgba(0, 38, 107, .55); }

/* ---------- Painel ---------- */
.asst-painel {
    position: fixed; z-index: 1130; right: 16px; bottom: calc(var(--asst-base, 16px) + 80px);
    width: min(392px, calc(100vw - 32px)); height: min(590px, calc(100vh - var(--asst-base, 16px) - 104px));
    display: flex; flex-direction: column; overflow: hidden;
    background: #fff; border: 1px solid var(--line, #e0dbd0); border-radius: var(--r-xl, 16px);
    box-shadow: 0 24px 60px -16px rgba(10, 26, 69, .5), 0 2px 10px rgba(10, 26, 69, .1);
}
.asst-painel[hidden] { display: none; }

.asst-topo { display: flex; align-items: center; gap: 10px; padding: 12px 12px 12px 14px; background: linear-gradient(135deg, var(--blue-dark, #00266b), var(--blue, #003898)); color: #fff; }
.asst-topo-av { flex: none; width: 44px; height: 44px; overflow: hidden; background: var(--blue-100, #d9e4fb); border: 2px solid rgba(255, 255, 255, .8); border-radius: 50%; }
.asst-topo-av img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: 50% 0; transform: scale(1.85); transform-origin: 50% 13%; }
.asst-topo-txt { flex: 1; min-width: 0; }
.asst-topo h2 { margin: 0; font-family: var(--font-display, 'Barlow Condensed', Arial, sans-serif); font-size: calc(23px * var(--a11y-fs, 1)); line-height: 1; color: #fff; }
.asst-topo p { margin: 3px 0 0; font-size: calc(12.5px * var(--a11y-fs, 1)); line-height: 1.25; color: #dbe5ff; }
.asst-icone { flex: none; width: 42px; height: 42px; display: grid; place-items: center; padding: 0; color: #fff; background: rgba(255, 255, 255, .14); border: 0; border-radius: 50%; }
.asst-icone:hover { background: rgba(255, 255, 255, .28); }
.asst-icone svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.asst-topo .asst-icone:focus-visible { outline-color: #fff; }

/* ---------- Conversa ---------- */
.asst-log { position: relative; flex: 1; min-height: 0; display: flex; flex-direction: column; gap: 12px; padding: 14px; overflow-y: auto; overscroll-behavior: contain; background: var(--paper, #f6f4f0); }
.asst-msg { display: flex; align-items: flex-end; gap: 8px; }
.asst-msg-user { justify-content: flex-end; }
.asst-av { flex: none; width: 30px; height: 30px; overflow: hidden; background: var(--blue-100, #d9e4fb); border-radius: 50%; }
.asst-av img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: 50% 0; transform: scale(1.85); transform-origin: 50% 13%; }
.asst-balao { max-width: 86%; padding: 10px 13px; font-size: calc(15px * var(--a11y-fs, 1)); overflow-wrap: anywhere; }
.asst-msg-bot .asst-balao { background: #fff; border: 1px solid var(--line, #e0dbd0); border-radius: 14px 14px 14px 4px; }
.asst-msg-user .asst-balao { color: #fff; background: var(--blue, #003898); border-radius: 14px 14px 4px 14px; }
.asst-balao p { margin: 0; }
.asst-balao p + p { margin-top: 8px; }
.asst-links { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
.asst-link {
    display: inline-flex; align-items: center; min-height: 40px; padding: 7px 14px; cursor: pointer;
    font: inherit; font-size: calc(14px * var(--a11y-fs, 1)); font-weight: 700; line-height: 1.2; text-decoration: none;
    color: var(--blue, #003898); background: #fff; border: 2px solid var(--blue, #003898); border-radius: 999px;
}
.asst-link:hover { color: #fff; background: var(--blue, #003898); }

.asst-chips { display: flex; flex-wrap: wrap; gap: 8px; padding-left: 38px; }
.asst-chip {
    min-height: 40px; padding: 7px 14px; cursor: pointer; font: inherit; font-size: calc(14px * var(--a11y-fs, 1)); font-weight: 600; line-height: 1.2;
    color: var(--blue, #003898); background: #fff; border: 2px solid var(--blue-100, #d9e4fb); border-radius: 999px;
}
.asst-chip:hover { background: var(--blue-50, #eef3fd); border-color: var(--blue-mid, #2a62d6); }

/* Menu de assuntos: grade de duas colunas, com ícone, ocupando a largura toda */
.asst-chips-grade { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; padding-left: 0; }
.asst-chips-grade .asst-chip {
    display: flex; align-items: center; gap: 10px; min-height: 56px; padding: 8px 12px; text-align: left;
    font-weight: 700; line-height: 1.15; border-radius: var(--r-lg, 12px);
}
.asst-chip-icone { flex: none; width: 34px; height: 34px; display: grid; place-items: center; color: var(--blue, #003898); background: var(--blue-50, #eef3fd); border-radius: 50%; font-size: calc(15px * var(--a11y-fs, 1)); }
.asst-chips-grade .asst-chip:hover .asst-chip-icone { background: #fff; }
.asst-chip-texto { min-width: 0; overflow-wrap: anywhere; }
@media (max-width: 340px) { .asst-chips-grade { grid-template-columns: minmax(0, 1fr); } }

/* ---------- Campo de texto ---------- */
.asst-form { display: flex; gap: 8px; padding: 10px 12px; background: #fff; border-top: 1px solid var(--line, #e0dbd0); }
.asst-form input { flex: 1; min-width: 0; min-height: 46px; padding: 0 16px; font-size: 16px; color: var(--ink, #101830); background: #fff; border: 2px solid var(--line, #e0dbd0); border-radius: 999px; }
.asst-form input:focus { border-color: var(--blue, #003898); }
.asst-enviar { flex: none; width: 46px; height: 46px; display: grid; place-items: center; padding: 0; color: #fff; background: var(--blue, #003898); border: 0; border-radius: 50%; }
.asst-enviar:hover { background: var(--blue-dark, #00266b); }
.asst-enviar svg { width: 20px; height: 20px; fill: currentColor; }
.asst-nota { margin: 0; padding: 0 14px 10px; font-size: calc(12px * var(--a11y-fs, 1)); line-height: 1.3; color: var(--muted, #566079); background: #fff; }

/* Celular: os dois botões (assistente e acessibilidade) ficam menores e LADO A LADO, numa faixa só, em vez de uma
   coluna de 136 px que cobria o conteúdo. O texto do topo da home sobe um pouco para não ficar sob eles. */
@media (max-width: 560px) {
    .asst-fab { right: 12px; width: 54px; height: 54px; border-width: 2px; }
    html.tem-assistente .a11y-fab { right: 74px; bottom: calc(var(--a11y-base, 16px) + 7px); width: 40px; height: 40px; }
    html.tem-assistente .a11y-fab svg { width: 22px; height: 22px; }
    .asst-painel { right: 10px; left: 10px; width: auto; bottom: calc(var(--asst-base, 16px) + 68px); height: min(620px, calc(100vh - var(--asst-base, 16px) - 88px)); }
    html.tem-assistente .a11y-painel { bottom: calc(var(--a11y-base, 16px) + 68px); max-height: calc(100vh - var(--a11y-base, 16px) - 88px); }
    html.tem-assistente .hero-video-conteudo { padding-bottom: 88px; }
}
@media print { .asst-ui { display: none !important; } }

/* ---------- Alto contraste: o painel acompanha (as regras gerais já pintam preto e branco) ---------- */
html.a11y-contraste .asst-fab { background-color: #000 !important; border-color: #fff !important; }
html.a11y-contraste .asst-msg-user .asst-balao { background-color: #fff !important; color: #000 !important; }
html.a11y-contraste .asst-link:hover, html.a11y-contraste .asst-chip:hover { background-color: #fff !important; color: #000 !important; }
