/* celular.css — a página oficial no celular (18/10/2026, F4 do esquadrão; o Theus: "tela web é web e tela mobile é mobile, todas as telas
   web precisam ter telas mobile"). Até 760 px a janela do computador vira a tela do app, no mesmo endereço:
   - ela ocupa a área entre a fileira dos apps abertos (logo abaixo da barra de cima) e a conversa de baixo, sem os três pontos: fechar e
     trocar de app ficam na fileira dos apps abertos, que antes ficava por cima da orbe;
   - a cabeça do app fica compacta, com as ações numa fileira que rola de lado;
   - o miolo vira uma coluna: as grades do desenho empilham (o calendário de 7 colunas fica), nada passa da largura, a tabela larga rola
     dentro dela e a caixa de digitar tem 16 px (abaixo disso o iPhone dá zoom ao tocar).
   Vem depois da nova-2.css: vence o CSS do computador só no celular. A prova é a peça "no celular" de cada tela na placa da Prancheta. */
@media (max-width: 760px) {
  /* os apps abertos: a fileira inteira logo abaixo da barra de cima */
  html.n2-com-abas #n2SoAbas { top: 58px; left: 8px; right: 8px; max-width: none; height: 44px; }
  html.nova-2 .n2-so-aba { height: 40px; max-width: 220px; }
  html.nova-2 .n2-so-x { width: 28px; height: 28px; }
  html.nova-2 .n2-so-mais { width: 40px; height: 40px; }
  html.nova-2 #n2SoLado { display: none !important; }

  /* a janela é a tela do app */
  html.nova-2 .nv-janela, html.nova-2 .nv-janela.nv-so, html.nova-2 .nv-janela.nv-cheia, html.nova-2 .nv-janela.nv-max {
    position: fixed !important; top: 104px !important; right: 6px !important; bottom: calc(76px + env(safe-area-inset-bottom, 0px)) !important; left: 6px !important;
    width: auto !important; height: auto !important; min-width: 0 !important; min-height: 0 !important; max-width: none !important; max-height: none !important;
    border-radius: var(--r-lg) !important; transform: none !important; padding-bottom: 0 !important; }
  html.nova-2 .nv-janela > .nv-j-cab, html.nova-2 .nv-janela .nv-alca, html.nova-2 .nv-janela .nv-so-hora { display: none !important; }
  html.nova-2 .nv-janela.nv-so :is(.nv-abas, .nv-j-corpo, .n2-cab-app) { padding-left: 14px !important; }
  html.nova-2 .nv-janela.nv-so[data-app="navegador"] > .nv-j-corpo { padding: 12px !important; }

  /* a cabeça do app: o ícone e o nome numa linha, as ações embaixo, numa fileira que rola de lado */
  html.nova-2 .n2-cab-app { flex-wrap: wrap; gap: 8px 10px; min-height: 0; padding: 12px 14px 6px; }
  html.nova-2 .n2-cab-icone { width: 32px; height: 32px; border-radius: var(--r-sm); }
  html.nova-2 .n2-cab-icone img { width: 18px; height: 18px; }
  html.nova-2 .n2-cab-nome { font-size: 19px; flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; }
  html.nova-2 .n2-cab-acoes { order: 3; flex: 1 0 100%; margin-left: 0; justify-content: flex-start; flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; padding-bottom: 2px; }
  html.nova-2 .n2-cab-acoes::-webkit-scrollbar { display: none; }
  html.nova-2 .n2-cab-acoes > * { flex: 0 0 auto; white-space: nowrap; min-height: 44px; }   /* a mesma altura de dedo: o de 34 ficava 5 px fora da fileira */

  /* as abas do app: começam na margem e rolam de lado */
  html.nova-2 .nv-janela .nv-abas:not([hidden]) { gap: 18px; padding: 4px 14px 0; justify-content: flex-start; }
  html.nova-2 .nv-janela .nv-aba { padding: 12px 0; }

  /* o miolo numa coluna */
  html.nova-2 .nv-janela .nv-j-corpo { padding-left: 12px; padding-right: 12px; overflow-x: hidden; }
  html.nova-2 .nv-janela .nv-j-corpo :is(div, section, article, aside, header, footer, nav, form, ul, ol, li, p, img, svg, canvas, video, iframe, figure, pre, label) { max-width: 100% !important; box-sizing: border-box; }
  /* 19/10, 01:0x: o Conserto (respiro-curto, 19:5x de 18/10) tinha posto "padding: 8px 12px" nesta regra, que pega todo div, p, svg e img do
     miolo: em Clientes eram 471 elementos com respiro que ninguém pediu e 343 ícones sem lugar (svg com 0 px de conteúdo). A guarda do
     conserto.mjs agora recusa regra com parte geral; o respiro de uma peça se dá na classe dela */
  html.nova-2 .nv-janela .nv-j-corpo [style*="grid-template-columns"]:not([style*="repeat(7"]):not([style*="repeat(2,minmax(0,1fr))"]):not([style*="repeat(2, minmax(0px, 1fr))"]) { grid-template-columns: minmax(0, 1fr) !important; grid-template-areas: none !important; }
  html.nova-2 .nv-janela .nv-j-corpo :is([style*="grid-column"], [style*="grid-area"]) { grid-column: auto !important; grid-area: auto !important; }
  /* a tabela larga rola dentro dela, de lado e para baixo: a de 20 linhas não empurra a tela inteira */
  html.nova-2 .nv-janela .nv-j-corpo table { display: block; overflow: auto; max-width: 100%; max-height: 60vh; overscroll-behavior: contain; }
  /* o que se toca tem o tamanho do dedo: o nome que abre a análise (Conversas) e o link da casa (Criar, Agenda, Produtos) */
  html.nova-2 .nv-janela :is(.cv-link-nome, .nv-link) { display: inline-flex; align-items: center; min-height: 44px; }
  html.nova-2 .nv-janela :is(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]), textarea, select) { font-size: 16px !important; }

  /* as Conversas: no computador as colunas cabem na janela; no celular a grade presa à altura dava 119 px à conversa e as mensagens sumiam
     embaixo. Aqui a janela rola: as filas, a lista (rola dentro dela, até 40% da tela) e a conversa com altura de tela */
  html.nova-2 .nv-janela[data-app="conversas"] > .nv-j-corpo:has(> .nv-aba-corpo > .cv) { overflow-y: auto; }
  html.nova-2 .nv-janela[data-app="conversas"] > .nv-j-corpo > .nv-aba-corpo:has(> .cv), html.nova-2 .nv-janela[data-app="conversas"] .nv-aba-corpo > .cv { flex: none; height: auto; overflow: visible; }
  html.nova-2 .nv-janela .cv-grade { flex: none; grid-template-rows: auto auto auto; }
  html.nova-2 .nv-janela .cv-itens { max-height: 40vh; }
  html.nova-2 .nv-janela .cv-conversa { height: 70vh; min-height: 420px; }
  input, select { font-size: 16px; }   /* conserto do Olheiro na peça de celular (cel:admin:admin.evolucao) */
  form.acoes > :is(input:not([type="checkbox"], [type="radio"]), select, .adm-bt) { font-size: 16px; }   /* conserto do Olheiro na peça de celular (cel:admin:app.admin-saude) */
  html.nova-2 .n2-extra-linha { padding: 12px 24px 0px 24px; }   /* conserto do Olheiro na peça de celular (cel:nova:campanhas:0) */
  html.nova-2[data-janela] .nv-janela [style*="background:#110e26"], html.nova-2[data-janela] .nv-janela [style*="background: rgb(17, 14, 38)"] { padding: 8px 12px 8px 12px; }   /* conserto do Olheiro na peça de celular (cel:nova:clientes:0) */
  .nv-barra-rotulo { white-space: normal; }   /* conserto do Olheiro na peça de celular (cel:nova:clientes:5) */
  .cv-item-frase { white-space: normal; }   /* conserto do Olheiro na peça de celular (cel:nova:conversas:0) */
  .cv-item-topo b { white-space: normal; }   /* conserto do Olheiro na peça de celular (cel:nova:conversas:0) */
  th { text-transform: none; }   /* conserto do Olheiro na peça de celular (cel:admin:admin.fluxo) */
  .n2b-num { text-transform: none; }   /* conserto do Olheiro na peça de celular (cel:nova:base:0) */
  .cx-rotulo { text-transform: none; }   /* conserto do Olheiro na peça de celular (cel:nova:navegador:2) */
}