/* ==========================================================================
   A TELA "PERGUNTAR" COMO UM CHAT DE VERDADE (11/10/2026; perguntar-tela.js)
   Pedido do dono, com print do celular: "achei muito apertado e sem livre responsividade".
   Só com a aba Perguntar aberta (body.pt-ativa) e fora da janela 💬 flutuante (que já é tela cheia).
   ========================================================================== */

/* Computador e celular: o cartão ocupa o que sobra da tela e a conversa usa todo o espaço */
body.pt-ativa .main-wrapper { margin-bottom: 0.5rem; }
body.pt-ativa #tab-assistente-ia { animation: none; }
body.pt-ativa #tab-assistente-ia .perg-capsula {
  display: flex;
  flex-direction: column;
  height: var(--pt-altura, calc(100dvh - 12rem));
  max-width: 1100px;
  margin-inline: auto;
  overflow: hidden;
}
body.pt-ativa #tab-assistente-ia .perg-capsula > * { flex: 0 0 auto; }
body.pt-ativa #tab-assistente-ia .ia-chat-historico {
  flex: 1 1 auto;
  min-height: 0;
  max-height: none;
  overscroll-behavior: contain;
  scroll-padding-bottom: 1rem;
}
/* Sem conversa ainda: as boas-vindas ocupam o meio e rolam por dentro */
body.pt-ativa #tab-assistente-ia .perg-boas-vindas { flex: 1 1 auto; min-height: 0; overflow-y: auto; }
body.pt-ativa #tab-assistente-ia .perg-painel:not([hidden]) { flex: 1 1 auto; min-height: 0; overflow-y: auto; }
body.pt-ativa #tab-assistente-ia .perg-form { margin-top: auto; }

/* Com conversa na tela, o texto de apresentação sai (a conversa ganha o espaço) e o rodapé fica compacto:
   o caminho do pedido (Você → Fecha Chef → IA → Resultado) e a frase de situação numa linha cada, sem quebrar */
body.pt-ativa #tab-assistente-ia .perg-capsula:not(.perg-vazio) .perg-intro { display: none; }
body.pt-ativa #tab-assistente-ia .perg-rodape { row-gap: 0.15rem; }
body.pt-ativa #tab-assistente-ia .perg-rodape .ia-status-linha { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2; overflow: hidden; margin: 0; }

/* O botão ⚙️ "Período e modo" só aparece no celular */
.perg-ajustes { display: none; }

/* ---------- celular ---------- */
@media (max-width: 700px) {
  /* A barra de progresso do topo some só nesta aba (o espaço vai para a conversa) */
  body.pt-ativa .header-progress-bar { display: none; }
  body.pt-ativa .main-wrapper { margin-top: 0.5rem; padding-inline: 0.5rem; }

  body.pt-ativa #tab-assistente-ia .perg-capsula {
    gap: 0.45rem;
    padding: 0.55rem 0.55rem 0.45rem;
    border-radius: 16px;
  }

  /* Topo numa linha só: bolinha, título + situação, ⚙️ e ＋ */
  body.pt-ativa #tab-assistente-ia .perg-cab { gap: 0.45rem; align-items: center; }
  body.pt-ativa #tab-assistente-ia .perg-cab .perg-orbita { width: 24px; height: 24px; }
  body.pt-ativa #tab-assistente-ia .perg-cab-texto { min-width: 0; flex: 1 1 auto; display: flex; flex-direction: column; gap: 0; }
  body.pt-ativa #tab-assistente-ia .perg-titulo { font-size: 1rem; }
  body.pt-ativa #tab-assistente-ia .perg-estado { font-size: 0.74rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
  body.pt-ativa #tab-assistente-ia .perg-nova { width: 40px; min-width: 40px; height: 40px; min-height: 40px; padding: 0; justify-content: center; }
  body.pt-ativa #tab-assistente-ia .perg-nova .perg-nova-rot { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

  body.pt-ativa #tab-assistente-ia .perg-ajustes {
    display: inline-flex; align-items: center; gap: 0.3rem; flex: 0 1 auto; min-width: 0; max-width: 46%;
    min-height: 40px; padding: 0 0.7rem; border-radius: 999px; border: 1px solid var(--border-color);
    background: transparent; color: var(--text-secondary); font-size: 0.78rem; font-weight: 600; cursor: pointer;
  }
  body.pt-ativa #tab-assistente-ia .perg-ajustes-rot { min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  body.pt-ativa #tab-assistente-ia .perg-ajustes[aria-expanded="true"] { border-color: rgba(16, 185, 129, 0.6); color: var(--text-primary); }
  /* Período e Rápido/Conselho/Debate: escondidos até tocar no ⚙️ */
  body.pt-ativa #tab-assistente-ia .perg-capsula:not(.pt-ajustes-abertos) .perg-barra { display: none; }
  body.pt-ativa #tab-assistente-ia .perg-modos { flex: 1 1 100%; justify-content: space-between; }
  body.pt-ativa #tab-assistente-ia .perg-modos button { flex: 1 1 0; }

  /* A conversa usa a largura toda */
  body.pt-ativa #tab-assistente-ia .ia-chat-historico { padding: 0.4rem 0.15rem; gap: 0.7rem; background: transparent; border: 0; }
  body.pt-ativa #tab-assistente-ia .ia-msg { max-width: 100%; }
  body.pt-ativa #tab-assistente-ia .ia-msg-usuario { max-width: 88%; }
  body.pt-ativa #tab-assistente-ia .ia-acoes-grupo { margin-inline: 0; }

  /* Campo de escrever: em linha (📎 campo 🎤 Enviar), sempre embaixo */
  body.pt-ativa #tab-assistente-ia .ia-chat-form.perg-form { flex-direction: row; align-items: flex-end; }
  body.pt-ativa #tab-assistente-ia .ia-chat-form.perg-form .btn-vincular-confirmar { width: auto; }
  body.pt-ativa #tab-assistente-ia .perg-rodape { gap: 0.3rem; }
  body.pt-ativa #tab-assistente-ia .perg-rodape #iaChatStatus:empty { display: none; }

  /* Rodapé: o caminho do pedido some (a resposta já diz quem respondeu); a situação fica em até 2 linhas */
  body.pt-ativa #tab-assistente-ia .perg-caminho, body.pt-ativa #tab-assistente-ia .perg-rota-ias { display: none !important; }
  body.pt-ativa #tab-assistente-ia .perg-rodape { font-size: 0.78rem; }
  /* A bolinha da voz (canto de baixo) cobria o rodapé: nesta aba ela só aparece quando está falando ou ouvindo */
  body.pt-ativa .voz-orbe[data-estado="pronta"], body.pt-ativa .voz-orbe:not([data-estado]), body.pt-ativa .voz-orbe-chaves { display: none; }

  /* Teclado aberto: só a conversa e o campo (o topo encolhe) */
  body.pt-ativa.perg-teclado #tab-assistente-ia .perg-cab { display: none; }
  body.pt-ativa.perg-teclado #tab-assistente-ia .perg-rodape { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  body.pt-ativa #tab-assistente-ia .ia-chat-historico { scroll-behavior: auto; }
}

/* ==========================================================================
   NENHUMA IA RESPONDEU (redundância, 11/10/2026; ia-ui.js _bolhaSemIA)
   Em vez do erro vermelho: bolha calma com as perguntas que o app responde sozinho, "Tentar a IA de novo" e os
   detalhes técnicos fechados.
   ========================================================================== */
.ia-msg-sem-ia .ia-msg-texto { border: 1px solid rgba(16, 185, 129, 0.35); background: rgba(16, 185, 129, 0.06); }
.ia-msg-sem-ia .ia-msg-texto p { margin: 0 0 0.55rem; }
.ia-sem-ia-chips { display: flex; flex-wrap: wrap; gap: 0.4rem; }
.ia-sem-ia-chip { min-height: 36px; font-size: 0.82rem; }
.ia-sem-ia-rodape { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem; margin-top: 0.35rem; }
.ia-sem-ia-detalhe { font-size: 0.75rem; color: var(--text-muted); }
.ia-sem-ia-detalhe summary { cursor: pointer; padding: 0.25rem 0.35rem; }
.ia-sem-ia-detalhe small { display: block; max-width: 60ch; padding: 0.2rem 0.35rem 0.35rem; line-height: 1.45; }
body.theme-light .ia-msg-sem-ia .ia-msg-texto { background: #ecfdf5; }
@media (max-width: 700px) { .ia-sem-ia-chip { min-height: 44px; } }