/* ═══════════════════════════════════════════════════════════════════════════════
   60-aquecimento.css — PEÇA 60: A ABA 🔥 AQUECIMENTO NO CELULAR (F3, 26/09/2026)
   Carrega DEPOIS de styles.css e das peças 00–50. Mesma origem de autor: em empate de
   especificidade vence quem vem depois, e por isso nada aqui usa !important.

   ⚠️ POR QUE UMA PEÇA PRÓPRIA [rev D15 do desenho]: "pelo celular" era promessa. A aba nasceu
   depois das seis peças, e na camada mobile a 375 px o que nasce fora de uma peça nasce fora
   da tela. A metade da BARRA (a aba mora na folha "Mais", não num slot a mais) é da peça 10, que
   é a única dona de `nav.tabs` por contrato; esta peça cuida do CORPO da aba.

   COBRE (e é a ÚNICA peça que declara estes seletores, por contrato)
     #view-aquecimento e tudo com prefixo `.aqc-` dentro dele; e [F5 parte 3, 27/09/2026] as peças do
     aquecimento FORA da aba, na tela da equipe: `.aqc-vsp*` (a véspera no cartão do Meu Dia e na ficha) e
     `.aqc-ficha*` (a linha do follow-up na ficha). A geometria do `.qcard` continua da peça 50, e a da folha
     (`.dbody`) da peça 20: aqui só o miolo que é nosso.
   NÃO COBRE: `.panel`, `.chip-btn`, `input.f` (o piso de 16px/44px dos campos é da peça 00),
     `.agt-avisos`/`.agt-nota` (os estilos da 🤖 que a aba reaproveita, iguais nas duas).

   A CONTA DA LARGURA, em 375 px (o mais estreito em uso): 375 − 2×16 do `main` = 343 px de
   conteúdo. Nada aqui tem largura fixa; o que tinha `minmax` passa a uma coluna, e todo texto
   quebra (`overflow-wrap:anywhere`, de styles.css) — nome de template e data colada inclusive.
   O `teste-aquecimento-tela` confere a condição da @media, a barra e estas larguras.
   ═══════════════════════════════════════════════════════════════════════════════ */

/* ⚠️ A CONDICAO DA CAMADA MOBILE, identica nas 7 folhas e em mobile.js (MQ). */
@media (max-width:780px), (max-height:520px) and (pointer:coarse){

  /* os freios em UMA coluna: em 343 px o auto-fit de 240 px já daria uma, mas escrever evita
     que um ajuste de desktop (240 → 160) vire duas colunas de 160 espremidas no celular */
  #view-aquecimento .aqc-freios{grid-template-columns:1fr}

  /* a manchete encolhe um degrau: "✋ Parado:" em 22 px com a frase ao lado quebrava em três */
  #view-aquecimento .aqc-manchete{font-size:15px}
  #view-aquecimento .aqc-manchete .aqc-status{font-size:19px}

  /* o balão do template ocupa a largura toda (o 560 px do desktop é teto, não piso) */
  #view-aquecimento .aqc-balao{max-width:100%}

  /* título do fluxo e selos quebram linha em vez de empurrar a borda */
  #view-aquecimento .aqc-fluxo-tit{font-size:13px}
  #view-aquecimento .aqc-passos{padding-left:16px}

  /* ── O EDITOR (F4 parte 3, 27/09/2026) ──────────────────────────────────────────────
     Em 343 px a grade de campos vira UMA coluna, cada campo ocupa a largura toda (o piso de
     16 px/44 px dos campos é da peça 00: o iOS não dá zoom em campo de 16 px), as quatro telas do
     editor viram botões que quebram linha, e a barra Salvar/Ver em sombra/Publicar/Ligar também. */
  #view-aquecimento .aqc-campos{grid-template-columns:1fr}
  #view-aquecimento .aqc-campo input.f,#view-aquecimento .aqc-campo select.f,#view-aquecimento .aqc-campo textarea.f{width:100%}
  #view-aquecimento .aqc-campo input.aqc-num{width:100%}
  /* ⚠️ [conserto TM-06, 27/09] O PISO DE 16 PX TEM DE GANHAR NA CASCATA. `.aqc-campo input.f{font-size:12.5px}` de
     styles.css tem especificidade (0,2,1) e vencia o `input.f{font-size:16px}` (0,1,1) da peça 00: a 375 px, 17 dos
     18 campos do editor ficavam com 12,5 px (medido no navegador), e o iPhone amplia a página a cada toque e não
     desfaz — o defeito que a peça 00 existe para impedir. Aqui (1,2,1) vence, com a mesma altura e o mesmo
     preenchimento do piso da 00 (o textarea nem estava no piso dela). */
  #view-aquecimento .aqc-campo input.f,#view-aquecimento .aqc-campo select.f,#view-aquecimento .aqc-campo textarea.f{font-size:16px;min-height:44px;padding:11px 12px}
  #view-aquecimento .aqc-abas .chip-btn,#view-aquecimento .aqc-barra .chip-btn{flex:1 1 140px;min-height:44px}
  #view-aquecimento .aqc-mais{min-width:44px;min-height:44px}
  #view-aquecimento .aqc-marca{min-height:32px}
  #view-aquecimento .aqc-revisao{font-size:13px}

  /* ── A VÉSPERA NO MEU DIA E A LINHA DO FOLLOW-UP NA FICHA (F5 parte 3, 27/09/2026) ─────────────────────
     Em 343 px a véspera já tem a fileira inteira do cartão (styles.css: a última peça, `flex:1 1 100%`); aqui os
     botões dividem a largura, dois por fileira (Não mandar · Já fechou / Ver a mensagem · Pode mandar), cada um
     com os 44 px da peça 00, e o texto que vai sair ganha fonte de leitura. Nada com largura fixa. */
  .aqc-vsp{padding:10px 11px}
  .aqc-vsp-botoes .chip-btn{flex:1 1 130px}
  .aqc-vsp-tit,.aqc-vsp-msg,.aqc-ficha-tit,.aqc-ficha-msg{font-size:13.5px}
  .aqc-ficha{padding:11px 12px}
}
