/* ─── AEB · Camada mobile organizada ─────────────────────────────────────────
   Carregada APÓS o <style> inline do index.html (vence empates por ordem de
   cascata). SÓ contém regras dentro de @media (max-width: …) — o desktop é
   intocado por construção.

   Breakpoints padronizados: 768 / 640 / 480 / 380.

   Índice dos @media legados que continuam no <style> inline (não mover sem
   auditoria de especificidade): 768px (zoom iOS/touch targets, grids, navbar,
   tabs, actbar, modais bottom-sheet, login; e o bloco Fase 5B de touch/scroll),
   640px (crm-col, hist), 520px (splash), 480px (commission-sidebar, navbar
   compacta), 380px (compactação final), print, prefers-reduced-motion.

   Regra de ouro: nada de seletor genérico `input` com appearance:none —
   checkbox/radio/range usam o desenho nativo + accent-color (bug dos "tics"). */

@media (max-width: 768px) {
  /* Tics: alvo de toque confortável mantendo o check nativo. Tamanhos por
     classe/inline (ex.: .login-check 22px, grades ADM 16-18px) prevalecem. */
  input[type='checkbox'],
  input[type='radio'] {
    width: 20px;
    height: 20px;
    accent-color: var(--orange);
    flex-shrink: 0;
  }
  /* Linhas clicáveis de checklist (acessórios/adicionais) — área de toque
     cheia sem depender do tamanho do checkbox. */
  .acc-item {
    min-height: 44px;
    align-items: center;
  }

  /* Preview da proposta: o documento .prop tem largura fixa de 190mm (A4)
     em src/proposal-doc.css — no mobile vira largura fluida SOMENTE dentro
     do modal de preview (#prev-content). NUNCA generalizar para .prop: os
     wrappers de captura de PDF (#__pdf_render_wrapper__/__aebpdf_flow_wrapper__)
     forçam 794px e não podem ser afetados. */
  #prev-content {
    padding: 10px !important;
    overflow-x: hidden;
  }
  #prev-content .prop {
    width: 100% !important;
    min-width: 0 !important;
    padding: 4mm 4mm !important;
  }
  #prev-content .prop table {
    table-layout: fixed;
    word-break: break-word;
  }

  /* Modais bottom-sheet respeitam a área segura (home indicator do iPhone). */
  .modal {
    padding-bottom: env(safe-area-inset-bottom, 0);
  }

  /* Scroll horizontal suave em qualquer wrapper de tabela. */
  .table-wrap {
    -webkit-overflow-scrolling: touch;
  }
}

@media (max-width: 480px) {
  /* Navbar: prioriza logo + ações; título já some no inline (452-456). */
  .nb-right .btn-outline-white {
    padding: 5px 7px;
  }
}

@media (max-width: 380px) {
  /* Seletor rápido de produto: 1 coluna em telas muito estreitas. */
  .qs-grid {
    grid-template-columns: 1fr;
  }
  /* Ações dos cards de histórico empilhadas, botões de largura cheia. */
  .hcard-acts {
    flex-direction: column;
    align-items: stretch;
  }
  .hcard-acts .btn-sm {
    width: 100%;
  }
}