/* NOTA: as regras valem para telas estreitas E para celular deitado (tela baixa). */
/* =========================================================
   Armac Fotos & Vídeos — ajustes para celular (v131, 12/09/2026)
   Carregado depois do style.css em todas as páginas.
   Só vale para telas até 640px; o computador não muda.
   ========================================================= */
@media (max-width: 640px), (pointer: coarse) and (max-height: 600px) {
  /* ---- base: dedo e teclado ---- */
  input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file]), select, textarea { font-size: 16px !important; min-height: 44px; box-sizing: border-box; }
  input[type=file] { max-width: 100%; font-size: 14px; }
  button, .btn-primario, .btn-verde, .btn-azul, .btn-vermelho, .btn-verde-solido, .mk-zap, .btn-limpar { min-height: 44px; }
  .btn-mini, .mk-item-acoes button, .lb-nav button { min-height: 36px; }
  img, canvas, video { max-width: 100%; }

  /* ---- topbar: uma linha de menu que rola de lado ---- */
  .topbar { padding: 8px 12px; gap: 6px 8px; }
  .topbar .marca img { height: 24px; }
  .topbar .usuario-info { flex-wrap: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch; gap: 14px; padding-bottom: 4px; scrollbar-width: none; align-items: center; }
  .topbar .usuario-info::-webkit-scrollbar { display: none; }
  .topbar .usuario-info a, .topbar .usuario-info .nome, .topbar .usuario-info button.sair { flex: 0 0 auto; white-space: nowrap; }
  .topbar .usuario-info .nome { flex: 0 0 auto; max-width: 140px; }

  /* ---- containers ---- */
  .admin-wrap, .detalhe-wrap, .stats-wrap, .eq-wrap, .cc-wrap, .sd-wrap { padding: 10px !important; }
  .bk-card, .stats-card, .eq-box, .upload-box { padding: 14px 12px; border-radius: 12px; }
  .bk-card h3 { font-size: 17px; }
  .admin-tabs { flex-wrap: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch; padding-bottom: 4px; }
  .admin-tabs a { flex: 0 0 auto; white-space: nowrap; }

  /* ---- tabelas: rolam de lado em vez de estourar ---- */
  .tabela-admin, .tabela-stats, table.tab-stats, table.eq-tab, table.fp, .mh-tab { display: block; width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; white-space: nowrap; }
  .tabela-admin td, .tabela-admin th { padding: 8px 8px; font-size: 13px; }
  .tab-scroll { max-height: none; }

  /* ---- formulários genéricos ---- */
  .campo-form { margin-bottom: 12px; }
  .form-group { margin-bottom: 12px; }
  .filtros { gap: 8px; }
  .kpi-grid { grid-template-columns: 1fr 1fr; gap: 8px; }
  .kpi { padding: 12px; }
  .kpi-valor { font-size: 20px; }
  .fp-info { flex-direction: column; gap: 8px; }
  .fp-info div { min-width: 0; display: flex; justify-content: space-between; align-items: center; }

  /* ---- Marketing (gerador de anúncio) ---- */
  .mk-filtros { grid-template-columns: 1fr; gap: 8px; }
  .mk-config { grid-template-columns: 1fr; gap: 10px; }
  .mk-config > * { min-width: 0; }
  .mk-config label { font-size: 13px; }
  .mk-check { background: var(--cinza-100, #f4f6fb); border-radius: 10px; padding: 10px 12px; font-size: 14px !important; }
  .mk-check input { width: 22px; height: 22px; min-height: 0; }
  .mk-grid-res { grid-template-columns: 1fr 1fr; gap: 8px; }
  .mk-card-info { font-size: 12px; }
  .mk-acoes { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
  .mk-acoes > * { width: 100%; box-sizing: border-box; padding: 13px 8px; font-size: 14px; }
  .mk-acoes > *:first-child { grid-column: 1 / -1; }
  .mk-acoes small, .mk-acoes span { grid-column: 1 / -1; text-align: center; }
  .mk-item { padding: 8px; gap: 8px; }
  .mk-item img { width: 64px; height: 64px; }
  .mk-item-info { font-size: 13px; }
  .mk-preview-wrap { padding: 8px; }
  #mkCanvas { max-height: none; }

  /* ---- Painel de fotos / vídeos ---- */
  .mf-filtros { flex-direction: column; align-items: stretch; gap: 8px; }
  .mf-filtros label, .mf-filtros select { width: 100%; }
  .mf-grid { grid-template-columns: 1fr 1fr; gap: 8px; }

  /* ---- Local do estoque ---- */
  .lc-linha { grid-template-columns: 1fr auto; gap: 6px 10px; }
  .lc-linha > :nth-child(2) { grid-column: 1 / -1; }

  /* ---- Estatísticas / histórico ---- */
  .stats-2col { grid-template-columns: 1fr; }
  .mh-kpis { grid-template-columns: 1fr 1fr; }
  .mh-caixa { padding: 14px 12px; }

  /* ---- Equivalências ---- */
  .eq-h1 { font-size: 22px; }
  .eq-grid { grid-template-columns: 1fr; gap: 8px; }
  .eq-pesos { grid-template-columns: 1fr; gap: 8px; }
  .eq-ref { gap: 8px; }
  .eq-ref h2 { width: 100%; font-size: 19px; }
  .eq-ref .eq-kpi { flex: 1 1 40%; padding: 8px 10px; }
  .eq-tabs { flex-wrap: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch; padding-bottom: 4px; }
  .eq-tabs button { flex: 0 0 auto; white-space: nowrap; }
  .eq-lista { max-height: 50vh; }

  /* ---- Tela do card / documentação ---- */
  .detalhe-header h1 { font-size: 20px; }
  .abas { overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .abas button { flex: 0 0 auto; white-space: nowrap; padding: 10px 12px; font-size: 13px; }

  /* ---- Backup / importação ---- */
  .btn-parte { width: 100%; box-sizing: border-box; }
  .ii-item { flex-wrap: wrap; }

  /* ---- Login / cadastro ---- */
  .auth-box { padding: 24px 18px; }
}

/* =========================================================
   v132 — modo "app": menu inferior fixo, abas e ações fixas
   ========================================================= */
.nav-cel, .nav-cel-sheet { display: none; }
@media (max-width: 640px), (pointer: coarse) and (max-height: 600px) {
  body { padding-bottom: 76px; }
  /* topo enxuto: marca + nome + sair; os links ficam no menu de baixo */
  .topbar .usuario-info a { display: none; }
  .topbar .usuario-info { justify-content: flex-end; overflow: visible; padding-bottom: 0; }
  .topbar .usuario-info .nome { flex: 1; max-width: none; text-align: right; }
  .topbar .marca { width: auto; flex: 1; }
  .topbar { flex-wrap: nowrap; align-items: center; position: static; }
  .busca-rapida { display: none !important; }

  .nav-cel { display: flex; position: fixed; left: 0; right: 0; bottom: 0; z-index: 900; background: #fff; border-top: 1px solid #e3e7f2;
    box-shadow: 0 -6px 20px rgba(0,42,154,.08); padding: 6px 4px calc(6px + env(safe-area-inset-bottom)); }
  .nav-cel a, .nav-cel button { flex: 1; display: flex; flex-direction: column; align-items: center; gap: 3px; text-decoration: none; color: #5a6480;
    font: 700 10.5px/1 var(--fonte, inherit); background: none; border: 0; padding: 4px 0; min-height: 0; border-radius: 10px; }
  .nav-cel svg { width: 24px; height: 24px; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
  .nav-cel a.on { color: #002A9A; }
  .nav-cel a.on svg { stroke: #00A844; }
  .nav-cel a:active, .nav-cel button:active { background: #f4f6fb; }

  .nav-cel-sheet.aberto { display: flex; position: fixed; inset: 0; z-index: 950; background: rgba(0,26,97,.45); align-items: flex-end; }
  .nav-cel-caixa { background: #fff; width: 100%; border-radius: 18px 18px 0 0; padding: 14px 14px calc(16px + env(safe-area-inset-bottom)); display: flex; flex-direction: column; gap: 6px; max-height: 80vh; overflow: auto; }
  .nav-cel-titulo { font-weight: 800; color: #002A9A; font-size: 16px; padding: 4px 6px 10px; }
  .nav-cel-titulo small { display: block; font-weight: 600; color: #5a6480; font-size: 12px; margin-top: 2px; }
  .nav-cel-caixa a { display: block; padding: 13px 14px; border-radius: 12px; background: #f4f6fb; color: #002A9A; font-weight: 700; text-decoration: none; font-size: 15px; }
  .nav-cel-caixa button { margin-top: 4px; padding: 13px; border-radius: 12px; font-weight: 800; font-size: 15px; border: 0; }
  .nav-cel-caixa .sair { background: #FBE9EA; color: #b3261e; }
  .nav-cel-caixa .fechar { background: #fff; color: #5a6480; border: 1px solid #e3e7f2; }

  /* abas fixas no topo enquanto rola */
  .cc-tabs, .sd-tabs, .abas, .admin-tabs, .eq-tabs { position: sticky; top: 0; z-index: 50; background: var(--fundo, #f4f6fb); padding-top: 6px; padding-bottom: 6px; margin-bottom: 8px; }
  .abas { background: #fff; }

  /* botão principal sempre visível acima do menu */
  #sd-form .sd-acoes, #cc-form .cc-acoes, .mk-acoes { position: sticky; bottom: 76px; z-index: 40; background: rgba(244,246,251,.96); backdrop-filter: blur(6px); padding: 8px 0 6px; margin-top: 8px; border-top: 1px solid #e3e7f2; }
  .mk-acoes { background: rgba(255,255,255,.96); }

  /* painel: colunas de largura de tela com "encaixe" ao rolar */
  .kanban { scroll-snap-type: x mandatory; padding: 8px 10px; gap: 10px; }
  .coluna { min-width: calc(100vw - 20px); max-width: calc(100vw - 20px); scroll-snap-align: start; }
  .coluna-body { max-height: none; padding: 10px; }
  .coluna-header { position: sticky; top: 0; background: #fff; z-index: 2; }
  .card-item { padding: 12px; }
  .card-item .modelo { font-size: 15px; }
  .card-item .meta span { font-size: 12px; padding: 4px 9px; }
  .selo-nivel { padding: 8px; font-size: 12px; }

  /* tela do card: 2 fotos por linha, botões de câmera maiores */
  .grid-slots { grid-template-columns: 1fr 1fr !important; gap: 8px; }
  .slot-box .acoes label, .slot-box .acoes button { font-size: 12px !important; padding: 9px 6px; min-height: 40px; }
  .detalhe-header .voltar { display: inline-block; padding: 8px 0; }

  /* marketing: prévia em largura total, resultados maiores */
  .mk-grid-res { grid-template-columns: 1fr 1fr; }
  .mk-card-res img, .mk-noimg { aspect-ratio: 1; }
  .mk-add { padding: 9px; font-size: 13px; }

  /* modais viram "folha" de baixo */
  .modal-qualidade { align-items: flex-end !important; }
  .mq-caixa { width: 100%; max-width: none !important; border-radius: 18px 18px 0 0 !important; max-height: 88vh; overflow: auto; }
  .mh-caixa { max-height: 90vh; overflow: auto; }
}

/* =========================================================
   v134 — campos sem estourar, topo limpo, cabeçalho do card
   ========================================================= */
.pagina-atual { display: none; }
@media (max-width: 640px), (pointer: coarse) and (max-height: 600px) {
  /* nada pode empurrar a página para o lado */
  html, body { overflow-x: clip; max-width: 100vw; }
  .admin-wrap, .detalhe-wrap, .stats-wrap, .eq-wrap, .cc-wrap, .sd-wrap, .bk-card, .stats-card, .eq-box, .sd-box, .cc-box, .detalhe-header, .filtros { min-width: 0; max-width: 100%; box-sizing: border-box; }
  input:not([type=checkbox]):not([type=radio]):not([type=range]), select, textarea { width: 100%; max-width: 100%; box-sizing: border-box; min-width: 0; }
  label { min-width: 0; }
  .sd-grid, .cc-form { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .sd-grid > *, .cc-form > *, .mk-config > *, .mk-filtros > * { min-width: 0; }
  .sd-acoes, .cc-acoes, .mk-acoes { width: 100%; box-sizing: border-box; }
  .tabela-admin, .tabela-stats, table.tab-stats, table.eq-tab, table.fp { max-width: 100%; }
  .mk-grid-res > span, .mk-grid-res > p { grid-column: 1 / -1; }

  /* topo: logo + nome da página; usuário fica no "Mais" */
  .topbar { padding: 8px 12px; }
  .topbar .marca { align-items: center; gap: 10px; }
  .topbar .marca .badge { display: none; }
  .pagina-atual { display: inline-block; font-weight: 800; color: #002A9A; font-size: 15px; padding-left: 10px; border-left: 2px solid #e3e7f2; line-height: 1; }
  .topbar .usuario-info .nome { display: none; }
  .topbar button.sair { display: none; }

  /* cabeçalho do ativo */
  .detalhe-header { padding: 14px 12px; }
  .detalhe-header h1 { font-size: 21px; margin-top: 4px; }
  .detalhe-header .metaline { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; margin-top: 10px; }
  .detalhe-header .metaline span { text-align: center; padding: 8px 6px; font-size: 12.5px; }
  .detalhe-header .metaline .sel-local, .detalhe-header .metaline select { grid-column: 1 / -1; margin: 0 !important; min-height: 42px; }
  .detalhe-header .linha-acoes-card .selo-nivel { grid-column: 1 / -1; width: 100% !important; box-sizing: border-box; justify-content: center; padding: 8px !important; }
  .detalhe-header .linha-acoes-card, .detalhe-header .metaline + div { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 10px; }
  .detalhe-header .btn-equiv-lg { margin: 0 !important; justify-content: center; width: 100%; box-sizing: border-box; padding: 11px 8px; font-size: 13px; border-radius: 10px; }
  .detalhe-header .btn-zip { width: 100%; box-sizing: border-box; grid-column: 1 / -1; margin: 0 !important; padding: 12px; border-radius: 10px; text-align: center; }
  .detalhe-header .acoes-fotos { grid-column: 1 / -1; display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-top: 4px; }
  .detalhe-header .af-botoes { display: flex; gap: 8px; }
  .detalhe-header .af-btn { min-width: 52px; min-height: 48px; }
  .abas button { padding: 11px 8px; font-size: 13.5px; }

  /* administração: abas + cartão de filtro cabem na tela */
  .admin-tabs { margin-bottom: 10px; }
  .admin-tabs a { padding: 9px 12px; font-size: 12.5px; }
  .tabela-admin td select { min-width: 140px; }
}

/* =========================================================
   v135 — correções: faixa verde solta, botões flutuando, seletor do painel
   ========================================================= */
@media (max-width: 640px), (pointer: coarse) and (max-height: 600px) {
  /* a linha decorativa do topo (::after absoluta) precisa de um pai posicionado */
  .topbar { position: relative; }
  /* botões dos formulários voltam para o lugar natural (no fim de cada formulário) */
  #sd-form .sd-acoes, #cc-form .cc-acoes, .mk-acoes { position: static; background: none; backdrop-filter: none; border-top: 0; padding: 0; margin-top: 12px; }
  /* painel: seletor de local ocupa a largura do card */
  .card-item .sel-local { width: 100%; box-sizing: border-box; }
  .card-item .btn-equiv { padding: 8px 12px; }
  /* abas presas: um respiro embaixo para não colar no conteúdo */
  .cc-tabs, .sd-tabs { box-shadow: 0 6px 10px -8px rgba(0,42,154,.25); }
}

/* =========================================================
   v136 — tabelas da administração viram cartões (usuários, lojas, refazer…)
   ========================================================= */
@media (max-width: 640px), (pointer: coarse) and (max-height: 600px) {
  table.tabela-admin { display: block; overflow: visible; white-space: normal; background: none; box-shadow: none; border-radius: 0; }
  table.tabela-admin thead { display: none; }
  table.tabela-admin tbody { display: block; }
  table.tabela-admin tr { display: grid; grid-template-columns: 1fr 1fr; gap: 8px 10px; background: #fff; border-radius: 12px; box-shadow: var(--sombra, 0 2px 8px rgba(0,42,154,.06)); padding: 12px; margin-bottom: 10px; }
  table.tabela-admin td { display: block; border: 0; padding: 0; font-size: 13.5px; min-width: 0; white-space: normal !important; }
  table.tabela-admin td::before { content: attr(data-label); display: block; font-size: 10px; text-transform: uppercase; letter-spacing: .5px; color: var(--cinza-400, #8a93ad); font-weight: 800; margin-bottom: 2px; }
  table.tabela-admin td:first-child { grid-column: 1 / -1; font-size: 15px; padding-bottom: 6px; border-bottom: 1px dashed var(--cinza-200, #e3e7f2); }
  table.tabela-admin td:first-child::before { display: none; }
  table.tabela-admin td:last-child { grid-column: 1 / -1; padding-top: 4px; }
  table.tabela-admin td:last-child::before { display: none; }
  table.tabela-admin td:last-child button, table.tabela-admin td:last-child a { margin: 0 6px 6px 0; min-height: 38px; padding: 8px 12px; }
  table.tabela-admin td select { width: 100%; min-width: 0; }
  table.tabela-admin td.num-cel { text-align: left; }
  .cel-sub { font-size: 11px; }
}

/* v137 — cabeçalho do ativo: nada passa da borda */
@media (max-width: 640px), (pointer: coarse) and (max-height: 600px) {
  .detalhe-header .linha-acoes-card, .detalhe-header .metaline { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .detalhe-header .linha-acoes-card > *, .detalhe-header .metaline > * { min-width: 0; max-width: 100%; box-sizing: border-box; }
  .detalhe-header .btn-equiv-lg { white-space: normal; line-height: 1.2; text-align: center; font-size: 12.5px; }
  .detalhe-header .btn-equiv-lg svg { flex: none; }
  .detalhe-header .acoes-fotos { min-width: 0; }
  .detalhe-header .af-rotulo { flex: 1; min-width: 0; }
}

/* =========================================================
   v138 — Administração inteira sem rolagem lateral
   ========================================================= */
@media (max-width: 640px), (pointer: coarse) and (max-height: 600px) {
  /* abas da administração: grade de 2 colunas, todas visíveis */
  .admin-tabs { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; overflow: visible; position: static; padding: 0; margin-bottom: 12px; }
  .admin-tabs a { text-align: center; padding: 11px 6px; font-size: 13px; white-space: normal; border-radius: 10px; background: #fff; box-shadow: var(--sombra, 0 2px 8px rgba(0,42,154,.06)); }
  .admin-tabs a.ativa { box-shadow: none; }

  /* qualquer tabela rotulada da administração vira cartões (usuários, lojas, fora do pricing, histórico) */
  table.fp.tab-rotulada, table.mh-tab.tab-rotulada { display: block; overflow: visible; white-space: normal; background: none; box-shadow: none; border-radius: 0; }
  table.fp.tab-rotulada thead, table.mh-tab.tab-rotulada thead { display: none; }
  table.fp.tab-rotulada tbody, table.mh-tab.tab-rotulada tbody { display: block; }
  table.fp.tab-rotulada tr, table.mh-tab.tab-rotulada tr { display: grid; grid-template-columns: 1fr 1fr; gap: 6px 10px; background: #fff; border-radius: 12px; box-shadow: var(--sombra, 0 2px 8px rgba(0,42,154,.06)); padding: 12px; margin-bottom: 10px; }
  table.fp.tab-rotulada td, table.mh-tab.tab-rotulada td { display: block; border: 0; padding: 0; font-size: 13.5px; min-width: 0; white-space: normal !important; }
  table.fp.tab-rotulada td::before, table.mh-tab.tab-rotulada td::before { content: attr(data-label); display: block; font-size: 10px; text-transform: uppercase; letter-spacing: .5px; color: var(--cinza-400, #8a93ad); font-weight: 800; margin-bottom: 2px; }
  table.tab-rotulada td:not([data-label])::before, table.tab-rotulada td[data-label=""]::before { display: none; }
  table.fp.tab-rotulada td:first-child { grid-column: 1 / -1; font-size: 15px; font-weight: 800; color: var(--azul, #002A9A); }
  table.fp.tab-rotulada td:first-child::before { display: none; }
  table.fp.tab-rotulada td:last-child { grid-column: 1 / -1; }
  table.mh-tab.tab-rotulada { max-height: none; }
  table.mh-tab.tab-rotulada tr { grid-template-columns: 1fr 1fr 1fr; padding: 8px 10px; gap: 4px 8px; }
  table.mh-tab.tab-rotulada td { font-size: 12.5px; }

  /* usuários: cartão com ações em grade */
  table.tabela-admin td:last-child { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
  table.tabela-admin td:last-child .btn-mini { margin: 0; width: 100%; box-sizing: border-box; font-size: 12.5px; }
  table.tabela-admin td .sel-loja, table.tabela-admin td .sel-tipo { width: 100%; }

  /* lojas: formulário de nova loja empilhado */
  .upload-box { padding: 14px 12px; }
  .upload-box > div[style*="display:flex"] { flex-direction: column; align-items: stretch !important; }
  .upload-box .campo-form { min-width: 0 !important; width: 100%; }
  .upload-box .btn-primario, .upload-box .btn-verde { width: 100% !important; box-sizing: border-box; }
  .upload-box input[type=file] { width: 100%; box-sizing: border-box; }

  /* fotos / vídeos: barra de seleção fica acima do menu inferior, em largura total */
  .mf-barra { left: 8px; right: 8px; transform: none; bottom: 84px; width: auto; box-sizing: border-box; display: flex; flex-wrap: wrap; gap: 6px; padding: 10px; border-radius: 12px; justify-content: center; }
  .mf-barra b { width: 100%; text-align: center; }
  .mf-barra button { flex: 1 1 45%; padding: 10px 6px; font-size: 12.5px; }
  .mf-filtros span { width: 100%; }

  /* refazer: lista sem altura fixa, item mais alto */
  .rf-lista { max-height: none; overflow: visible; }
  .rf-item { padding: 10px; }
  .rf-item img { width: 64px; height: 64px; }
  .rs-lista { display: block; }
  .rs-item { display: flex; justify-content: space-between; padding: 8px 0; border-bottom: 1px dashed var(--cinza-200, #e3e7f2); }

  /* importar excel / backup: cartões e botões em largura total */
  .info-importacao { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
  .ii-item { min-width: 0; padding: 10px 12px; }
  .ii-item b { font-size: 14px; }
  .bk-card .btn-verde, .bk-card .btn-vermelho, .bk-card .btn-primario, .bk-card .btn-parte { display: block; width: 100%; box-sizing: border-box; text-align: center; margin: 8px 0 0; }
  .bk-card input[type=file] { display: block; width: 100%; box-sizing: border-box; margin: 8px 0; }
  .bk-card p { font-size: 13.5px; }

  /* histórico de acessos: gráfico rola só dentro da própria caixa */
  .graf-horas { overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .mh-topo { flex-direction: column; }
  .mh-fechar { width: 100%; }
}

/* =========================================================
   v141 — Equivalências (regras reforçadas para vencer o CSS da página) no celular: 3 abas visíveis, tabelas em cartões, botões fixos
   ========================================================= */
@media (max-width: 640px), (pointer: coarse) and (max-height: 600px) {
  .eq-wrap .eq-tabs { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 6px; overflow: visible; position: static; padding: 0; margin-bottom: 10px; }
  .eq-wrap .eq-tabs button { white-space: normal; padding: 9px 4px; font-size: 12.5px; line-height: 1.2; }
  .eq-wrap .eq-tabs .eq-tag { display: block; margin: 4px auto 0; width: max-content; }
  .eq-wrap .eq-box { padding: 12px; }
  .eq-wrap .eq-box label { font-size: 13px; }
  .eq-wrap .eq-box input, .eq-wrap .eq-box select { width: 100%; box-sizing: border-box; }
  .eq-wrap .eq-box label > span[style*="display:flex"] { flex-wrap: wrap; }
  .eq-wrap .eq-box .btn-mini, .eq-wrap .eq-box .btn-primario { width: 100%; box-sizing: border-box; min-height: 42px; margin: 0; padding: 10px; font-size: 13.5px; }
  .eq-wrap .eq-box > div[style*="display:flex"] { flex-direction: column; align-items: stretch !important; }
  .eq-wrap .eq-toggle { flex-direction: column; align-items: flex-start; }
  .eq-wrap .eq-ref .eq-kpi { flex: 1 1 45%; }

  /* os wrappers com overflow:auto que o JS coloca em volta das tabelas */
  .eq-wrap .eq-box > div[style*="overflow"] { overflow: visible !important; }
  .eq-wrap table.eq-tab { display: block; overflow: visible; white-space: normal; }
  .eq-wrap table.eq-tab thead { display: none; }
  .eq-wrap table.eq-tab tbody { display: block; }
  .eq-wrap table.eq-tab tr { display: grid; grid-template-columns: 1fr 1fr; gap: 6px 10px; background: #fff; border: 1px solid #E2E8F0; border-radius: 12px; padding: 10px 12px; margin-bottom: 8px; }
  .eq-wrap table.eq-tab tr.estoque { background: #F0FDF4; border-color: #BBF7D0; }
  .eq-wrap table.eq-tab tr.ref { background: #EFF6FF; border-color: #BFDBFE; }
  .eq-wrap table.eq-tab td { display: block; border: 0 !important; padding: 0; font-size: 13.5px; min-width: 0; white-space: normal !important; }
  .eq-wrap table.eq-tab td::before { content: attr(data-label); display: block; font-size: 10px; text-transform: uppercase; letter-spacing: .5px; color: #64748B; font-weight: 800; margin-bottom: 2px; }
  .eq-wrap table.eq-tab td:not([data-label])::before, .eq-wrap table.eq-tab td[data-label=""]::before { display: none; }
  /* marca + modelo lado a lado em destaque; última célula (botões/estoque) em largura total */
  .eq-wrap table.eq-tab td[data-label="Marca"], .eq-wrap table.eq-tab td[data-label="Modelo"] { font-weight: 800; color: #0F172A; font-size: 14.5px; }
  .eq-wrap table.eq-tab td:last-child { grid-column: 1 / -1; }
  .eq-wrap table.eq-tab td:last-child .btn-mini { width: 100%; box-sizing: border-box; margin: 4px 0 0; min-height: 40px; }
  .eq-wrap table.eq-tab .eq-bar { min-width: 0; width: 100%; }
  .eq-wrap table.eq-tab .eq-cods { white-space: normal; }
}

/* =========================================================
   v142 — celular deitado: aproveita a largura extra
   ========================================================= */
@media (pointer: coarse) and (max-height: 600px) and (min-width: 641px) {
  body { padding-bottom: 66px; }
  .nav-cel { padding: 2px 4px calc(2px + env(safe-area-inset-bottom)); }
  .nav-cel svg { width: 20px; height: 20px; }
  .nav-cel a, .nav-cel button { font-size: 10px; }
  .admin-tabs { grid-template-columns: repeat(5, 1fr); }
  .eq-wrap .eq-tabs { grid-template-columns: repeat(3, 1fr); }
  /* cartões das tabelas em 2 por linha, com os campos em 3 colunas */
  table.tabela-admin tbody, .eq-wrap table.eq-tab tbody, table.fp.tab-rotulada tbody { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
  table.tabela-admin tr, .eq-wrap table.eq-tab tr, table.fp.tab-rotulada tr { margin: 0; grid-template-columns: 1fr 1fr 1fr; }
  table.tabela-admin td:last-child { grid-template-columns: repeat(3, 1fr); }
  .sd-grid, .cc-form, .mk-config, .mk-filtros { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .sd-grid label.w, .cc-form label.w { grid-column: 1 / -1; }
  .mf-grid { grid-template-columns: repeat(4, 1fr); }
  .mk-grid-res { grid-template-columns: repeat(4, 1fr); }
  .kanban .coluna { min-width: calc(50vw - 16px); max-width: calc(50vw - 16px); }
  .grid-slots { grid-template-columns: repeat(4, 1fr) !important; }
  .info-importacao, .kpi-grid, .mh-kpis { grid-template-columns: repeat(4, 1fr); }
  .detalhe-header .metaline, .detalhe-header .linha-acoes-card { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .detalhe-header .btn-zip { grid-column: auto; }
}

/* =========================================================
   v143 — Administração: cartões mesmo sem o JS, com rótulos de reserva
   ========================================================= */
@media (max-width: 640px), (pointer: coarse) and (max-height: 600px) {
  /* rótulos quando o JS não etiquetou a célula (data-label ausente) */
  .pag-usuarios table.tabela-admin td:not([data-label])::before { color: var(--cinza-400, #8a93ad); }
  .pag-usuarios table.tabela-admin td:nth-child(2):not([data-label])::before { content: 'Loja'; }
  .pag-usuarios table.tabela-admin td:nth-child(3):not([data-label])::before { content: 'Perfil'; }
  .pag-usuarios table.tabela-admin td:nth-child(4):not([data-label])::before { content: 'Status'; }
  .pag-usuarios table.tabela-admin td:nth-child(5):not([data-label])::before { content: 'Acessos'; }
  .pag-usuarios table.tabela-admin td:nth-child(6):not([data-label])::before { content: 'Tempo logado'; }
  .pag-usuarios table.tabela-admin td:nth-child(7):not([data-label])::before { content: 'Fotos'; }
  .pag-usuarios table.tabela-admin td:nth-child(8):not([data-label])::before { content: 'Último acesso'; }
  .pag-lojas table.tabela-admin td:nth-child(2):not([data-label])::before { content: 'Regional'; }
  /* nada da administração pode empurrar a página para o lado */
  .admin-wrap { overflow-x: clip; }
  .admin-wrap table { max-width: 100%; }
}

/* v146 — Compactar vídeos: miniaturas em 2 colunas no celular */
@media (max-width: 640px), (pointer: coarse) and (max-height: 600px) {
  .pag-compactar .vc-lista { grid-template-columns: 1fr 1fr; gap: 8px; }
  .pag-compactar .vc-acoes { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
  .pag-compactar .vc-acoes > * { width: 100%; box-sizing: border-box; }
  .pag-compactar .vc-acoes #btnComecar, .pag-compactar .vc-acoes #contagem { grid-column: 1 / -1; }
  .pag-compactar .vc-topo { grid-template-columns: 1fr 1fr; }
}

/* v148 — painel de progresso da compactação no celular */
@media (max-width: 640px), (pointer: coarse) and (max-height: 600px) {
  .pag-compactar .vc-progresso { padding: 10px; }
  .pag-compactar .vc-linha b { font-size: 13px; }
  .pag-compactar .vc-linha #pPct { font-size: 18px; }
  .pag-compactar .vc-sub { font-size: 11.5px; }
}