/* ==========================================================================
   IA KORTEX — tela convencional (20/10/2026)
   Base clara de SaaS empresarial; a cor indica DE ONDE veio a informacao:
     internet = azul · KORTEX (dados da empresa) = verde · analise = violeta · acao/confirmacao = ambar
   O "espectro" (azul -> verde-agua -> violeta) e a assinatura visual, a mesma do anel do modo imersivo:
   aparece so na barra do campo de pergunta e no botao do modo imersivo.
   Todos os ids e classes usados pelo JavaScript e pelos testes continuam iguais.
   ========================================================================== */
:root {
  --cx-azul: #2563eb;
  --cx-azul-suave: #eff6ff;
  --cx-verde: #059669;
  --cx-verde-suave: #ecfdf5;
  --cx-violeta: #7c3aed;
  --cx-violeta-suave: #f5f3ff;
  --cx-ambar: #d97706;
  --cx-ambar-suave: #fffbeb;
  --cx-rosa: #e11d48;
  --cx-tinta: #0f172a;
  --cx-espectro: linear-gradient(90deg, #2563eb 0%, #14b8a6 50%, #8b5cf6 100%);
  --cx-raio: 16px;
}
.dark {
  --cx-azul: #60a5fa;
  --cx-azul-suave: rgba(37, 99, 235, .14);
  --cx-verde: #34d399;
  --cx-verde-suave: rgba(5, 150, 105, .15);
  --cx-violeta: #a78bfa;
  --cx-violeta-suave: rgba(124, 58, 237, .16);
  --cx-ambar: #fbbf24;
  --cx-ambar-suave: rgba(217, 119, 6, .15);
  --cx-rosa: #fb7185;
}

/* ---------- barra da sessao: conversas anteriores, especialista, estado e acoes numa faixa so ---------- */
#sessionToolbar { gap: .6rem; align-items: stretch; }
#sessionToolbar > .copilot-command-card { border-radius: 14px; box-shadow: none; }
#archivedConversations { display: flex; flex-direction: column; justify-content: center; min-height: 3rem; }
#archivedConversations[open] { flex-basis: 100%; }
#archivedConversations > summary { min-height: 1.9rem; }
#archivedCount { font-variant-numeric: tabular-nums; }
#sessionToolbar p.uppercase { letter-spacing: 0 !important; text-transform: none !important; font-size: .72rem !important; }

/* cartao Especialista + estado da IA: vira uma faixa compacta (antes: 170px fixos ao lado do campo de pergunta) */
.copilot-ctx-strip { display: flex !important; flex-direction: row !important; align-items: center; gap: .6rem !important; padding: .4rem .55rem .4rem .8rem !important; min-height: 3rem; }
.copilot-ctx-strip > label { margin: 0; font-size: .74rem !important; letter-spacing: 0 !important; text-transform: none !important; color: var(--kortex-muted) !important; white-space: nowrap; }
.copilot-ctx-strip > select { height: 2.2rem !important; min-width: 0; max-width: 13rem; border-radius: 10px !important; font-size: .82rem !important; padding: 0 .6rem !important; }
.copilot-ctx-strip > #jarvisStatus { height: 2.2rem; padding: 0 .7rem !important; border-radius: 999px !important; gap: .5rem !important; white-space: nowrap; font-size: .76rem !important; }
.copilot-ctx-strip > #jarvisStatus .copilot-jarvis-core { width: 1.05rem; height: 1.05rem; box-shadow: 0 0 0 .2rem color-mix(in srgb, var(--kortex-mint), transparent 82%), 0 0 14px color-mix(in srgb, var(--kortex-primary), transparent 55%); }
.copilot-ctx-strip > #jarvisStatus #jarvisStatusDot { display: none; }
@media (max-width: 1023px) {
  #sessionToolbar { flex-direction: column; }
  .copilot-ctx-strip { flex-wrap: wrap; }
  .copilot-ctx-strip > select { flex: 1 1 9rem; max-width: none; }
  .copilot-ctx-strip > #jarvisStatus { flex: 1 1 100%; }
}

/* ---------- campo de pergunta (fixo embaixo) ---------- */
.copilot-main-flow > #commandDock { grid-template-columns: minmax(0, 1fr) !important; padding-top: .35rem !important; }
#commandForm { position: relative; overflow: hidden; gap: .55rem !important; padding: .7rem .7rem .7rem .8rem !important; border-radius: 18px !important; border-color: color-mix(in srgb, var(--kortex-line), var(--cx-azul) 12%) !important; box-shadow: 0 18px 40px -18px rgba(15, 23, 42, .28), 0 2px 6px rgba(15, 23, 42, .05) !important; }
#commandForm::before { content: ""; position: absolute; inset: 0 0 auto 0; height: 3px; background: var(--cx-espectro); background-size: 200% 100%; opacity: .9; }
body:has(#jarvisStatus[data-state="processing"]) #commandForm::before,
body:has(#jarvisStatus[data-state="researching"]) #commandForm::before,
body:has(#jarvisStatus[data-state="listening"]) #commandForm::before { animation: cxEspectro 1.4s linear infinite; }
@keyframes cxEspectro { to { background-position: -200% 0; } }
#commandForm:focus-within { border-color: color-mix(in srgb, var(--cx-azul), var(--kortex-line) 45%) !important; }
#commandInput { height: 3rem !important; border-radius: 12px !important; font-size: .95rem !important; font-weight: 600 !important; border-color: transparent !important; background: var(--kortex-soft) !important; }
#commandInput:focus { border-color: color-mix(in srgb, var(--cx-azul), transparent 40%) !important; background: var(--kortex-surface) !important; box-shadow: 0 0 0 4px color-mix(in srgb, var(--cx-azul), transparent 88%) !important; }
#commandInput::placeholder { color: var(--kortex-muted); font-weight: 500; }

/* ferramentas de voz: um grupo so, com divisorias; cada uma com a sua cor quando ativa */
#commandForm > .flex.flex-wrap { gap: 0 !important; border: 1px solid var(--kortex-line); border-radius: 12px; background: var(--kortex-surface); padding: .2rem; }
#commandDock .copilot-voice-btn { height: 2.6rem !important; width: 2.6rem !important; border: 0 !important; border-radius: 9px !important; background: transparent !important; color: var(--kortex-muted) !important; box-shadow: none !important; }
#commandDock .copilot-voice-btn:hover { background: var(--kortex-soft) !important; color: var(--kortex-text) !important; transform: none; }
#commandDock .copilot-voice-btn.is-active, #commandDock .copilot-voice-btn[aria-pressed="true"]:not(#reminderAlertsToggle) { background: var(--cx-verde-suave) !important; color: var(--cx-verde) !important; }
#voiceCommand.is-active { background: var(--cx-verde-suave) !important; color: var(--cx-verde) !important; }
#voiceConversation.is-active { box-shadow: inset 0 0 0 1.5px var(--cx-verde) !important; }
/* entrada do modo imersivo: o unico botao com o espectro */
#commandDock #immersiveOpen { width: auto !important; padding: 0 .75rem !important; gap: .4rem; color: var(--kortex-text) !important; background:
  linear-gradient(var(--kortex-surface), var(--kortex-surface)) padding-box,
  var(--cx-espectro) border-box !important; border: 1.5px solid transparent !important; margin: 0 .15rem; }
#commandDock #immersiveOpen span { display: inline !important; font-size: .8rem; font-weight: 800; }
#commandDock #immersiveOpen:hover { background:
  linear-gradient(color-mix(in srgb, var(--kortex-surface), #8b5cf6 7%), color-mix(in srgb, var(--kortex-surface), #2563eb 7%)) padding-box,
  var(--cx-espectro) border-box !important; }
#sendCommand { height: 3rem !important; border-radius: 12px !important; padding: 0 1.15rem !important; background: linear-gradient(135deg, #0f766e, #1d4ed8) !important; color: #fff !important; font-weight: 800 !important; box-shadow: 0 10px 22px -10px rgba(29, 78, 216, .7) !important; }
#sendCommand:hover { filter: brightness(1.07); }
.dark #sendCommand { background: linear-gradient(135deg, #14b8a6, #3b82f6) !important; color: #04111f !important; }
@media (max-width: 1023px) {
  #commandDock #immersiveOpen span { display: none !important; }
  #commandDock #immersiveOpen { width: 2.6rem !important; padding: 0 !important; }
  #commandForm > .flex.flex-wrap { padding: .15rem; }
}

/* ---------- conversa ---------- */
#conversationSection > div > .kortex-shell-panel { border-radius: 20px !important; padding: 1.1rem 1.1rem .6rem !important; }
#conversationSection .kortex-shell-panel > .mb-4 p:first-child { letter-spacing: 0 !important; text-transform: none !important; font-size: .78rem !important; font-weight: 700 !important; color: var(--kortex-muted) !important; }
#historyCount { font-variant-numeric: tabular-nums; }
#history { padding-right: .35rem; }
#history > article { display: grid; gap: .55rem; }
#history > article + article { margin-top: 1.4rem !important; }

/* pergunta: balao a direita, discreto */
#history .copilot-bubble-user { justify-self: end; max-width: min(46rem, 88%); border: 0 !important; border-radius: 18px 18px 6px 18px !important; background: color-mix(in srgb, var(--cx-tinta), transparent 94%) !important; padding: .6rem .9rem !important; box-shadow: none !important; }
.dark #history .copilot-bubble-user { background: rgba(148, 163, 184, .14) !important; }
#history .copilot-bubble-user > p:first-child { font-size: .7rem !important; letter-spacing: 0 !important; text-transform: none !important; font-weight: 700 !important; color: var(--kortex-muted) !important; }
#history .copilot-bubble-user > p:last-child { margin-top: .1rem !important; font-weight: 600 !important; font-size: .93rem !important; line-height: 1.5; }

/* resposta: sem caixa dentro de caixa; a cor da faixa diz a origem */
#history .copilot-bubble-system { border: 0 !important; background: transparent !important; box-shadow: none !important; padding: 0 !important; }
#history button.copilot-bubble-system { cursor: default; }
#history .copilot-bubble-system > .flex > div > p:first-child { display: none; }
#history .copilot-bubble-system > .flex > div > p.mt-2 { display: inline-flex; align-items: center; gap: .4rem; margin-top: .45rem !important; font-weight: 600 !important; font-size: .72rem !important; color: var(--kortex-muted) !important; }
#history .copilot-bubble-system > .flex > div > p.mt-2::before { content: ""; width: .4rem; height: .4rem; border-radius: 99px; background: var(--cx-verde); }
#history .copilot-bubble-system > .flex > span.shrink-0 { border: 0 !important; background: var(--kortex-soft); font-variant-numeric: tabular-nums; font-weight: 700 !important; }
#history .copilot-bubble-system > .flex > div { min-width: 0; flex: 1; }

.copilot-answer-shell { --cx-tom: var(--cx-verde); --cx-tom-suave: var(--cx-verde-suave); position: relative; gap: .75rem !important; border: 1px solid var(--kortex-line) !important; border-radius: var(--cx-raio) !important; padding: 1rem 1.1rem 1rem 1.25rem !important; box-shadow: 0 1px 2px rgba(15, 23, 42, .04), 0 10px 28px -20px rgba(15, 23, 42, .25) !important; overflow: hidden; }
.copilot-answer-shell::before { content: ""; position: absolute; inset: 0 auto 0 0; width: 4px; background: var(--cx-tom); }
.copilot-answer-shell[data-fonte="internet"] { --cx-tom: var(--cx-azul); --cx-tom-suave: var(--cx-azul-suave); }
.copilot-answer-shell[data-fonte="analise"] { --cx-tom: var(--cx-violeta); --cx-tom-suave: var(--cx-violeta-suave); }
.copilot-answer-shell[data-fonte="acao"] { --cx-tom: var(--cx-ambar); --cx-tom-suave: var(--cx-ambar-suave); }
.copilot-answer-label { display: inline-flex !important; align-items: center; gap: .4rem; background: var(--cx-tom-suave) !important; color: var(--cx-tom) !important; letter-spacing: 0 !important; text-transform: none !important; font-size: .74rem !important; font-weight: 800 !important; padding: .28rem .65rem .28rem .5rem !important; }
.copilot-answer-label::before { content: ""; width: .45rem; height: .45rem; border-radius: 99px; background: currentColor; box-shadow: 0 0 0 3px color-mix(in srgb, currentColor, transparent 80%); }
.copilot-answer-main { font-weight: 500 !important; font-size: .98rem !important; line-height: 1.72 !important; color: var(--kortex-text) !important; max-width: 72ch; }
.copilot-answer-main strong, .copilot-answer-main b { font-weight: 700; }
.copilot-answer-main .kx-md-titulo { font-weight: 800 !important; font-size: 1.02rem; margin-top: .9rem !important; }
.copilot-answer-main a, .copilot-bubble a.kx-fonte { color: var(--cx-azul) !important; }
.copilot-answer-recommendation { border-left: 3px solid var(--cx-violeta); border-radius: 10px !important; background: var(--cx-violeta-suave) !important; font-weight: 600 !important; }
.copilot-answer-recommendation strong { color: var(--cx-violeta) !important; }
.copilot-answer-next { color: var(--cx-ambar) !important; font-weight: 700 !important; }

/* paineis visuais (metricas, fontes) */
.copilot-visual { border-radius: 14px !important; background: color-mix(in srgb, var(--cx-tom-suave, var(--kortex-soft)), transparent 30%) !important; border-color: color-mix(in srgb, var(--cx-tom, var(--kortex-line)), var(--kortex-line) 78%) !important; }
.copilot-visual-title, .copilot-metric span, .copilot-table th { letter-spacing: 0 !important; text-transform: none !important; font-weight: 700 !important; font-size: .74rem !important; }
.copilot-visual-title { color: var(--cx-tom, var(--kortex-muted)) !important; }
.copilot-metric { position: relative; border-radius: 12px !important; overflow: hidden; }
.copilot-metric strong { font-variant-numeric: tabular-nums; font-size: 1.15rem !important; }
.copilot-metric::after { content: ""; position: absolute; inset: 0 0 auto 0; height: 2px; background: var(--cx-tom, var(--cx-verde)); opacity: .55; }
.copilot-metric-success::after { background: var(--cx-verde); opacity: 1; }
.copilot-metric-warning::after { background: var(--cx-ambar); opacity: 1; }
.copilot-metric-danger::after { background: var(--cx-rosa); opacity: 1; }
.copilot-chart-fill { background: var(--cx-tom, var(--kortex-primary)) !important; }
.copilot-chart-fill.success { background: var(--cx-verde) !important; }
.copilot-chart-fill.warning { background: var(--cx-ambar) !important; }
.copilot-chart-fill.danger { background: var(--cx-rosa) !important; }
.copilot-visual details > summary { letter-spacing: 0 !important; text-transform: none !important; }

/* ---------- tela vazia: boas-vindas com sugestoes coloridas pela origem ---------- */
.cx-boas-vindas { display: grid; gap: 1.1rem; padding: 1.4rem .35rem .6rem; }
#history .cx-boas-vindas { border: 0 !important; background: transparent !important; }
.cx-boas-vindas h4 { margin: 0; font-size: 1.45rem; font-weight: 800; letter-spacing: -.01em; line-height: 1.25; color: var(--kortex-text); }
.cx-boas-vindas h4 span { background: var(--cx-espectro); -webkit-background-clip: text; background-clip: text; color: transparent; }
.cx-boas-vindas > p { margin: 0; max-width: 60ch; color: var(--kortex-muted); font-size: .92rem; line-height: 1.55; }
.cx-grupos { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .75rem; }
.cx-grupo { --cx-tom: var(--cx-verde); --cx-tom-suave: var(--cx-verde-suave); display: grid; align-content: start; gap: .4rem; border: 1px solid var(--kortex-line); border-top: 3px solid var(--cx-tom); border-radius: 14px; background: var(--kortex-surface); padding: .8rem; }
.cx-grupo[data-fonte="internet"] { --cx-tom: var(--cx-azul); --cx-tom-suave: var(--cx-azul-suave); }
.cx-grupo[data-fonte="analise"] { --cx-tom: var(--cx-violeta); --cx-tom-suave: var(--cx-violeta-suave); }
#history .cx-grupo-titulo { display: flex; align-items: center; gap: .45rem; margin: 0 0 .15rem; font-size: .8rem; font-weight: 800; color: var(--cx-tom); }
.cx-grupo-titulo i, .cx-grupo-titulo svg { width: 1rem; height: 1rem; }
.cx-sugestao { display: block; width: 100%; text-align: left; border: 0; border-radius: 10px; background: transparent; color: var(--kortex-text); padding: .5rem .6rem; font-size: .86rem; font-weight: 600; line-height: 1.35; cursor: pointer; transition: background .15s ease, color .15s ease; }
.cx-sugestao:hover, .cx-sugestao:focus-visible { background: var(--cx-tom-suave); color: var(--cx-tom); outline: none; }
#history .cx-legenda { display: flex; flex-wrap: wrap; gap: .4rem 1rem; margin: 0; color: var(--kortex-muted); font-size: .76rem; font-weight: 600; }
.cx-legenda span { display: inline-flex; align-items: center; gap: .35rem; }
.cx-legenda span::before { content: ""; width: .5rem; height: .5rem; border-radius: 99px; background: var(--cx-c); }
@media (max-width: 900px) { .cx-grupos { grid-template-columns: minmax(0, 1fr); } .cx-boas-vindas h4 { font-size: 1.2rem; } }

/* ---------- lateral "Bastidores da resposta": linhas compactas com icone colorido ---------- */
.copilot-side { display: grid; align-content: start; gap: .4rem; }
.copilot-side > * + * { margin-top: 0 !important; }
.cx-lateral-titulo { margin: .1rem .2rem .25rem; font-size: .8rem; font-weight: 800; color: var(--kortex-muted); }
.copilot-side > details.kortex-shell-panel { min-height: 0 !important; height: auto !important; padding: .55rem .7rem !important; border-radius: 12px !important; box-shadow: none !important; content-visibility: visible !important; contain: none !important; }
.copilot-side > details.kortex-shell-panel[open] { padding-bottom: .8rem !important; box-shadow: 0 10px 28px -22px rgba(15, 23, 42, .35) !important; }
.copilot-side > details > summary { min-height: 1.9rem; }
.copilot-side > details > summary > span > i:first-child, .copilot-side > details > summary > span > svg:first-child { box-sizing: content-box; width: .95rem; height: .95rem; padding: .32rem; border-radius: 8px; background: var(--cx-tom-suave); color: var(--cx-tom) !important; }
.copilot-side > details { --cx-tom: var(--cx-verde); --cx-tom-suave: var(--cx-verde-suave); }
.copilot-side > details[data-fonte="acao"] { --cx-tom: var(--cx-ambar); --cx-tom-suave: var(--cx-ambar-suave); }
.copilot-side > details[data-fonte="analise"] { --cx-tom: var(--cx-violeta); --cx-tom-suave: var(--cx-violeta-suave); }
.copilot-side > details[data-fonte="internet"] { --cx-tom: var(--cx-azul); --cx-tom-suave: var(--cx-azul-suave); }
.copilot-side > details > summary .text-sm { font-weight: 700 !important; }
.copilot-side > details > summary > i:last-child, .copilot-side > details > summary > svg:last-child { transition: transform .18s ease; }
.copilot-side > details[open] > summary > i:last-child, .copilot-side > details[open] > summary > svg:last-child { transform: rotate(180deg); }

/* avisos proativos */
#proactiveDisclosure { border-radius: 14px !important; box-shadow: none !important; }
#proactiveDisclosure > summary { color: var(--cx-ambar) !important; }
#proactiveDisclosure .copilot-proactive-card { border-left: 3px solid var(--cx-ambar); }

/* avisos (toast) nao ficam por cima do campo de pergunta */
body:has(#commandDock) .kortex-toast-host { top: 5.5rem !important; bottom: auto !important; }

@media (prefers-reduced-motion: reduce) {
  #commandForm::before { animation: none !important; }
}

/* tema escuro: botoes principais escuros sobre fundo escuro ficavam quase invisiveis */
.dark #newConversation, .dark .kortex-shell-actions > a.bg-slate-950 { background: #5eead4 !important; color: #04111f !important; border-color: transparent !important; }

/* ---------- imagens na conversa (20/10/2026) ---------- */
.cx-galeria .copilot-visual-title { display: flex; align-items: center; gap: .4rem; }
.cx-galeria-conta { display: inline-flex; min-width: 1.3rem; justify-content: center; border-radius: 99px; background: var(--cx-azul-suave); color: var(--cx-azul); font-size: .7rem; padding: 0 .35rem; }
.cx-galeria .copilot-gallery { grid-template-columns: repeat(auto-fill, minmax(min(100%, 10.5rem), 1fr)) !important; gap: .6rem !important; }
.cx-imagem { margin: 0; display: flex; flex-direction: column; border-radius: 12px !important; overflow: hidden; background: var(--kortex-surface); }
.cx-imagem-botao { position: relative; display: block; aspect-ratio: 4 / 3; cursor: zoom-in; overflow: hidden;
  background: linear-gradient(90deg, var(--kortex-soft) 0%, color-mix(in srgb, var(--kortex-soft), var(--cx-azul) 8%) 50%, var(--kortex-soft) 100%); background-size: 200% 100%; animation: cxEspectro 1.3s linear infinite; }
.cx-imagem.is-carregada .cx-imagem-botao, .cx-imagem.is-falha .cx-imagem-botao { animation: none; background: var(--kortex-soft); }
.cx-imagem-botao:focus-visible { outline: 2px solid var(--cx-azul); outline-offset: -2px; }
.cx-imagem .cx-img { width: 100%; height: 100%; object-fit: cover; opacity: 0; transition: opacity .3s ease, transform .3s ease; aspect-ratio: auto !important; }
.cx-imagem.is-carregada .cx-img { opacity: 1; }
.cx-imagem-botao:hover .cx-img { transform: scale(1.03); }
.cx-imagem-num { position: absolute; top: .4rem; left: .4rem; z-index: 1; min-width: 1.4rem; height: 1.4rem; display: inline-flex; align-items: center; justify-content: center; border-radius: 99px; background: rgba(15, 23, 42, .72); color: #fff; font-size: .72rem; font-weight: 800; }
.cx-imagem-falha { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; padding: .5rem; text-align: center; color: var(--kortex-muted); font-size: .76rem; font-weight: 700; }
.cx-imagem-falha[hidden] { display: none; }
.cx-imagem figcaption { display: grid; gap: .15rem; padding: .5rem .6rem .6rem; min-width: 0; }
.cx-imagem figcaption strong { font-size: .78rem; font-weight: 700; line-height: 1.3; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.cx-imagem figcaption a { font-size: .72rem; font-weight: 700; color: var(--cx-azul); text-decoration: none; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cx-imagem figcaption a:hover { text-decoration: underline; }
.cx-imagem figcaption small { font-size: .68rem; color: var(--kortex-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cx-imagem-dialog { width: min(56rem, calc(100vw - 1.5rem)); max-height: calc(100dvh - 2rem); padding: 0; border: 1px solid var(--kortex-line); border-radius: 18px; background: var(--kortex-surface); color: var(--kortex-text); box-shadow: 0 40px 100px -30px rgba(2, 8, 23, .6); }
.cx-imagem-dialog::backdrop { background: rgba(2, 8, 23, .6); backdrop-filter: blur(4px); }
.cx-imagem-dialog-caixa { position: relative; display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); }
.cx-imagem-dialog-foto { position: relative; background: #0b1220; display: flex; align-items: center; justify-content: center; min-height: 16rem; }
.cx-imagem-dialog-foto img { max-width: 100%; max-height: 70dvh; object-fit: contain; }
.cx-imagem-dialog-texto { display: grid; align-content: start; gap: .6rem; padding: 1.2rem 1.2rem 1.3rem; }
.cx-imagem-dialog-texto h3 { margin: 0; font-size: 1.05rem; font-weight: 800; }
.cx-imagem-dialog-texto p { margin: 0; font-size: .86rem; line-height: 1.5; color: var(--kortex-muted); }
.cx-imagem-dialog-num { font-size: .74rem !important; font-weight: 700; color: var(--cx-azul) !important; }
.cx-imagem-dialog-meta a { color: var(--cx-azul); }
.cx-imagem-dialog-fechar { position: absolute; top: .5rem; right: .5rem; z-index: 2; width: 2.2rem; height: 2.2rem; border-radius: 99px; border: 0; background: rgba(15, 23, 42, .7); color: #fff; font-size: 1.3rem; line-height: 1; }
@media (max-width: 720px) { .cx-imagem-dialog-caixa { grid-template-columns: 1fr; } .cx-imagem-dialog-foto img { max-height: 50dvh; } }
@media (prefers-reduced-motion: reduce) { .cx-imagem-botao { animation: none; } .cx-imagem .cx-img { transition: none; } }

/* topo numa linha so no computador (20/10/2026: entraram "Meus itens" e o sino de alertas) */
@media (min-width: 1024px) {
  .kortex-shell-topbar .kortex-shell-actions { flex-wrap: nowrap !important; gap: .45rem !important; }
  .kortex-shell-topbar .kortex-shell-actions > a { padding-left: .8rem !important; padding-right: .8rem !important; white-space: nowrap; }
}
@media (min-width: 1024px) and (max-width: 1500px) {
  .kortex-shell-topbar h1 + p { display: none; }
}

/* conversa por voz (24/10/2026): estado "pausada" visivel e distinto de "ouvindo" */
#jarvisStatus[data-state="paused"] { border-color: #94a3b8 !important; background: rgba(148,163,184,.12) !important; color: var(--kortex-muted) !important; }
.copilot-voice-banner[data-state="paused"] { border-color: rgba(148,163,184,.55); background: rgba(148,163,184,.10); }
.copilot-voice-banner[data-state="paused"] .copilot-voice-banner-dot { animation: none; background: #94a3b8; }
.copilot-voice-banner-stop[hidden] { display: none; }

/* 25/10/2026 — Copiloto no CELULAR: conversa primeiro; caixa de digitar/falar sempre visivel, presa acima da navegacao.
   Antes ela ficava no fim da pagina (2.300 px abaixo): quem abria o Copiloto no celular nao via onde escrever ou falar. */
@media (max-width: 768px) {
  .kortex-shell-topbar > div { gap: .55rem !important; padding: .6rem .9rem !important; }
  .kortex-shell-topbar h1 { font-size: 1.25rem !important; margin-top: 0 !important; }
  .kortex-shell-topbar > div > div:first-child > p:last-child { display: none; }
  .kortex-shell-topbar .kortex-shell-actions { flex-wrap: nowrap !important; overflow-x: auto; gap: .4rem !important; scrollbar-width: none; }
  .kortex-shell-topbar .kortex-shell-actions > a[href="kortex_dashboard.html"] { display: none !important; }
  .kortex-shell-topbar .kortex-shell-actions > * { flex: 0 0 auto; }
  /* a animacao de entrada deixava transform no <main>: isso prendia o "fixed" ao main (a caixa ia para o fim da pagina) */
  .copilot-main-flow { transform: none !important; animation: none !important; }
  .copilot-main-flow > #commandDock { position: fixed !important; left: 0; right: 0; bottom: 0; z-index: 45; margin: 0 !important;
    padding: .5rem .75rem calc(.55rem + env(safe-area-inset-bottom)) !important; background: #ffffff !important; background-image: none !important; backdrop-filter: none !important;
    border-top: 1px solid var(--kortex-line, #e5e7eb); box-shadow: 0 -10px 26px rgba(15, 23, 42, .08); }
  body.kx-com-nav-celular .copilot-main-flow > #commandDock { bottom: var(--kx-nav-h, calc(4.3rem + env(safe-area-inset-bottom))); padding-bottom: .55rem !important; }
  .dark .copilot-main-flow > #commandDock { background: #0b1220 !important; }
  #commandDock .copilot-ctx-strip { display: none !important; }
  #commandForm { display: grid !important; grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "banner banner" "texto enviar" "botoes botoes";
    padding: 0 !important; border: 0 !important; box-shadow: none !important; background: none !important; gap: .4rem !important; }
  #commandForm > #voiceConversationBanner { grid-area: banner; }
  #commandForm > .relative { grid-area: texto; }
  #commandForm > #sendCommand { grid-area: enviar; height: 3rem !important; padding: 0 .95rem !important; }
  #commandForm > .flex.flex-wrap { grid-area: botoes; flex-wrap: nowrap !important; overflow-x: auto; gap: .25rem !important; scrollbar-width: none; }
  #commandForm > .flex.flex-wrap > * { flex: 0 0 auto; }
  .copilot-main-flow { padding-bottom: calc(var(--kx-dock-h, 9rem) + 1rem) !important; }
  body.kx-com-nav-celular .copilot-main-flow { padding-bottom: calc(var(--kx-dock-h, 9rem) + 1rem) !important; }
  #sessionToolbar { flex-wrap: nowrap !important; overflow-x: auto; scrollbar-width: none; }
  #sessionToolbar > * { flex: 0 0 auto; }
  #sessionToolbar #archivedConversations[open] { flex-basis: 100%; }
  #sessionToolbar .copilot-command-card > div:first-child { display: none; }
  #conversationSection { margin-top: .6rem !important; }
}

/* 25/10/2026 — celular: o aviso (toast) aparece por cima da barra do topo, nunca sobre a conversa nem sobre o campo de pergunta */
@media (max-width: 768px) {
  body:has(#commandDock) .kortex-toast-host { top: calc(env(safe-area-inset-top) + .35rem) !important; bottom: auto !important; left: .5rem !important; right: .5rem !important; width: auto !important; z-index: 95 !important; }
  body:has(#commandDock) .kortex-toast-host .kortex-toast:nth-child(n+3) { display: none !important; }
}
@media (max-width: 768px) {
  /* barra do topo do Copiloto fica presa (compacta): o titulo e as acoes ficam a mao e o aviso aparece sobre ela */
  .kortex-shell-topbar { position: sticky !important; top: 0 !important; z-index: 40 !important; }
}