/* Catálogo do escritório. Mesmos tokens do sistema: off-white, branco, grafite,
   bordas neutras e laranja pontual. Sem hero, sem sombra pesada, sem área
   decorativa: a tela é de trabalho. */

.cat-pagina{min-width:0}
.cat-cabecalho h1{font-size:27px;margin-bottom:8px}
.cat-cabecalho p:last-child{font-size:14px}
.cat-acoes-topo{display:flex;gap:var(--s3);flex-shrink:0}

.cat-indicadores{margin:var(--s4) 0 var(--s2)}
.cat-indicadores article{padding:18px 20px}
.cat-indicadores strong{font-size:26px;margin:8px 0 6px}
.cat-indicadores small{font-size:11px;line-height:1.5}
.cat-indicador-clicavel{cursor:pointer;transition:border-color .15s}
.cat-indicador-clicavel:hover,.cat-indicador-clicavel:focus-visible{border-color:var(--accent)}
.cat-aviso{margin:0 0 var(--s4)}

.cat-ferramentas{padding:18px 20px}
.cat-ferramentas-linha{display:flex;gap:var(--s3);align-items:flex-end;flex-wrap:wrap}
.cat-ferramentas-linha input[type=search]{margin-top:0;flex:1 1 280px;min-width:0}
.cat-seletor{display:block;font-size:11px;color:#596459;margin:0;flex:0 1 190px;min-width:0}
.cat-seletor select{margin-top:4px}
.cat-mais-filtros{margin-top:var(--s3);border-top:1px solid var(--line);padding-top:var(--s3)}
.cat-mais-filtros summary{cursor:pointer;min-height:44px;display:flex;align-items:center;font-size:13px;color:var(--accent-ink)}
.cat-mais-filtros .cat-ferramentas-linha{margin-top:var(--s3)}
.cat-ferramentas .chips{margin-top:var(--s3)}

.cat-resultados{padding:0;overflow:hidden}
/* ⚠️ t87: o teto de `100vh - 470px` deixava 298px em 1366x768, e a linha do
   catálogo tem 87px: cabiam 3 linhas onde a meta é 6. O desconto de 470px
   supunha um cabeçalho que já encolheu. Medido depois: 6 linhas completas. */
.cat-tabela-rolagem{max-height:calc(100vh - 330px);min-height:min(520px,calc(100vh - 330px));overflow:auto}
.cat-tabela{font-size:13px;min-width:940px}
.cat-tabela thead th{position:sticky;top:0;background:var(--surface);z-index:1}
.cat-tabela td{padding:14px 12px;vertical-align:top}
.cat-tabela td small{margin-top:3px;font-size:11px}
.cat-numero{font-variant-numeric:tabular-nums;white-space:nowrap}
.cat-acoes{white-space:nowrap}
.cat-acoes button{padding:8px 12px}
.cat-produto{display:flex;gap:var(--s3);align-items:flex-start;min-width:0}
.cat-produto>div{min-width:0}
.cat-nome{color:var(--ink);font-weight:600;text-decoration:none;overflow-wrap:anywhere;display:block;max-width:100%}
.cat-nome:hover{color:var(--accent-ink);text-decoration:underline}
.cat-codigo{font-variant-numeric:tabular-nums;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.cat-copiar{border:0;background:none;color:var(--accent);font-size:11px;padding:2px 4px;border-radius:4px}
.cat-foto{width:44px;height:44px;object-fit:cover;border-radius:6px;flex-shrink:0;background:#f1f0ea}
.cat-foto-vazia{display:inline-flex;align-items:center;justify-content:center;color:#9aa398;font-weight:700;font-size:13px;letter-spacing:.5px;background:#f1f0ea}
.badge.cat-ok{background:#e9f0e7;color:#4f6a45}
.badge.cat-parcial{background:#fff0d5;color:#8b5e16}
.badge.cat-pendente{background:#f1f2ec;color:#6b7568}
.badge.cat-substituida{background:#eef1f6;color:#5a6a86;text-decoration:line-through}
.cat-linha-substituida td{opacity:.72}

.cat-galeria{list-style:none;display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:var(--s4);margin:0;padding:20px}
.cat-cartao{border:1px solid var(--line);border-radius:9px;overflow:hidden;display:flex;flex-direction:column;min-width:0}
.cat-cartao-foto{display:block;aspect-ratio:4/3;background:#f4f5f0;overflow:hidden}
.cat-cartao-foto .cat-foto{width:100%;height:100%;border-radius:0}
.cat-cartao-texto{padding:14px;flex:1;min-width:0}
.cat-cartao-texto small{display:block;margin-top:4px;overflow-wrap:anywhere}
.cat-cartao-selos{margin-top:10px}
.cat-cartao-acoes{display:grid;grid-template-columns:1fr 1fr;gap:var(--s2);padding:0 14px 14px}
.cat-cartao-acoes button{min-height:44px}

/* Ficha lateral: começa FECHADA e é SOBREPOSTA. Deslocar o conteúdo espremeria a
   tabela, que é o que a tela existe para mostrar. Quem precisa dos botões do topo
   fecha a ficha, que sai por Esc, pelo ✕ e por clique fora. */
.cat-ficha{position:fixed;top:0;right:0;bottom:0;width:min(560px,100vw);background:var(--surface);border-left:1px solid var(--line);box-shadow:-18px 0 40px #0000001a;z-index:70;display:flex;flex-direction:column;padding:20px}
.cat-ficha-topo{display:flex;justify-content:space-between;align-items:flex-start;gap:var(--s3);border-bottom:1px solid var(--line);padding-bottom:var(--s3)}
.cat-ficha-topo>div:first-child{display:flex;gap:var(--s3);align-items:flex-start;min-width:0}
.cat-ficha-topo h2{font-size:19px;margin:0 0 4px;overflow-wrap:anywhere}
.cat-ficha-topo .eyebrow{margin-bottom:6px}
.cat-abas{margin:var(--s3) 0 0}
.cat-ficha-conteudo{overflow-y:auto;flex:1;padding:var(--s4) 0;min-width:0}
.cat-ficha-acoes{display:flex;gap:var(--s2);border-top:1px solid var(--line);padding-top:var(--s3);flex-wrap:wrap}
.cat-ficha-acoes button{flex:1;min-height:44px;min-width:160px}
.cat-ficha-rodape{border-top:1px solid var(--line);padding-top:var(--s3);margin:0}
.cat-ficha-produto{display:flex;gap:var(--s4);align-items:flex-start;flex-wrap:wrap}
.cat-ficha-produto .cat-foto{width:120px;height:120px}
.cat-dados{flex:1;min-width:200px;margin:0;display:grid;gap:var(--s3)}
.cat-dados dt{font-size:11px;color:var(--muted)}
.cat-dados dd{margin:4px 0 0;font-size:14px;overflow-wrap:anywhere}
.cat-uso-bloco{margin-top:var(--s5);border-top:1px solid var(--line);padding-top:var(--s4)}
.cat-uso-bloco h3,.cat-ficha-conteudo h3{font-size:13px;letter-spacing:.4px;text-transform:uppercase;color:var(--muted)}
.cat-uso{list-style:none;margin:0;padding:0;font-size:13px}
.cat-uso li{border-top:1px solid var(--line);padding:10px 0;overflow-wrap:anywhere}
.cat-imagens{list-style:none;display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:var(--s4);margin:0;padding:0}
.cat-imagens img{width:100%;height:auto;aspect-ratio:1;object-fit:cover;border-radius:8px;background:#f4f5f0}
.cat-imagens strong{display:block;margin-top:8px;font-size:13px;overflow-wrap:anywhere}
.cat-historico{list-style:none;margin:0;padding:0}
.cat-historico li{border-top:1px solid var(--line);padding:var(--s4) 0}
.cat-historico h4{margin:0 0 4px;font-size:14px}
.cat-diferenca{margin:var(--s3) 0 0;display:grid;gap:var(--s2);font-size:13px}
.cat-diferenca dt{font-size:11px;color:var(--muted)}
.cat-diferenca dd{margin:2px 0 0;overflow-wrap:anywhere}
.cat-diferenca del{color:#8c3025;text-decoration:line-through}
.cat-diferenca ins{color:#4f6a45;text-decoration:none}
.cat-explicacao{margin:0;padding-left:var(--s4);font-size:14px;line-height:1.7}
.cat-explicacao li{margin-bottom:8px}

@media(max-width:1100px){
 .cat-tabela-rolagem{max-height:none}
}

/* Celular: ficha em tela cheia, tabela em cartão, filtros em painel próprio. */
@media(max-width:760px){
 .cat-cabecalho{flex-direction:column;align-items:stretch}
 .cat-cabecalho h1{font-size:24px}
 .cat-acoes-topo{display:grid;grid-template-columns:1fr 1fr;gap:var(--s2)}
 .cat-acoes-topo button{min-height:44px;white-space:normal}
 .cat-indicadores{grid-template-columns:1fr 1fr;gap:10px}
 .cat-indicadores article{padding:14px}
 .cat-indicadores strong{font-size:22px}
 .cat-ferramentas-linha{flex-direction:column;align-items:stretch}
 .cat-seletor{flex:1 1 auto}
 .schedule-modes{display:grid;grid-template-columns:1fr 1fr;gap:4px}
 .schedule-modes button{min-height:44px}
 /* style.css impõe .table-wrap table{min-width:570px} abaixo de 760, que tem
    especificidade maior que .cat-tabela e faria o cartão de 390 cortar calado. */
 .table-wrap.cat-tabela-rolagem table.cat-tabela{min-width:0}
 .cat-tabela thead{display:none}
 .cat-tabela,.cat-tabela tbody,.cat-tabela tr,.cat-tabela td{display:block;width:auto}
 .cat-tabela tr{border:1px solid var(--line);border-radius:8px;padding:12px;margin:0 12px 12px}
 .cat-tabela td{border:0;padding:8px 0;display:grid;grid-template-columns:minmax(96px,38%) minmax(0,1fr);gap:10px;align-items:start}
 .cat-tabela td::before{content:attr(data-label);font-size:11px;color:var(--muted)}
 .cat-tabela td.cat-numero{white-space:normal}
 .cat-acoes{display:grid!important;grid-template-columns:1fr 1fr;gap:var(--s2)}
 .cat-acoes button{width:100%;min-height:44px}
 .table-wrap.cat-tabela-rolagem{margin:0;overflow:visible}
 .cat-resultados{padding-top:12px}
 .cat-galeria{grid-template-columns:1fr;padding:12px}
 .cat-ficha{width:100vw;border-left:0;padding:16px;padding-bottom:calc(16px + env(safe-area-inset-bottom))}
 .cat-ficha-acoes{flex-direction:column}
 .cat-ficha-acoes button{width:100%}
 .cat-ficha-produto .cat-foto{width:84px;height:84px}
 .cat-abas{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}
 .cat-abas button{padding:12px 6px;font-size:12px;white-space:normal}
}