/* T-0698 (APP-6): aba Fabrica, so leitura. Cores do chip pela secao 5 do contrato fabrica-status/1; classes do HUB (card, pill, tag). */
.fab{max-width:960px}
.fab-cols{display:grid;grid-template-columns:minmax(0,1fr);gap:20px}
.fab-col{display:grid;gap:20px;align-content:start;min-width:0}
@media(min-width:1100px){.fab-cols{grid-template-columns:minmax(0,1.25fr) minmax(0,1fr)}}
.fab-bloco .ch{margin-bottom:10px}

/* faixa de idade do retrato (secao 9) */
.fab-faixa{display:flex;gap:10px;align-items:center;padding:12px 16px;margin-bottom:20px;border-radius:12px;background:var(--ok-bg);color:var(--fab-ok-t,#0f5f2e);font-size:14px;border:1px solid var(--fab-ok-b,#bfe3cb)}
.fab-faixa svg{flex:none}
.fab-faixa.fab-velha{background:var(--off-bg);color:var(--txt2);border-color:var(--line2)}
.fab-cinza .card{filter:grayscale(1)}
.fab-cinza .fab-col{opacity:.82}

/* listas */
.fab-lista{list-style:none;margin:0;padding:0}
.fab-lista>li{border-bottom:1px solid var(--line);min-width:0}
.fab-lista>li:last-child{border-bottom:0}
.fab-grupo{font-size:11.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--gold2);margin:14px 0 2px;display:flex;gap:8px;align-items:center}
.fab-grupo:first-of-type{margin-top:0}
.fab-grupo .num{color:var(--mut);letter-spacing:0}
.fab-nome{font-weight:650;min-width:0;overflow-wrap:anywhere}
.fab-meta{display:flex;flex-wrap:wrap;gap:4px 10px;font-size:13px;align-items:center;min-width:0}
.fab-ver{white-space:nowrap}
.fab-falha{display:block;margin-top:2px;font-weight:600}

/* agente: nome, chip, ticket e ha quanto tempo; sem botao */
.fab-ag{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,11rem);gap:6px 12px;align-items:center;min-height:48px;padding:8px 0}
.fab-ag .fab-meta{justify-content:flex-end}
.fab-chip{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;font-weight:650;padding:3px 10px;border-radius:99px;white-space:nowrap;border:1px solid transparent}
.fab-chip:before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor;flex:none}
.fab-ok{background:var(--ok-bg);color:var(--ok)}
.fab-warn{background:var(--warn-bg);color:var(--warn)}
.fab-semcota{background:var(--fab-sc-bg,#e6e7eb);color:var(--fab-sc-t,#3f4552)}
.fab-parado{background:var(--fab-pa-bg,#f3f4f6);color:var(--fab-pa-t,#565c68)}
.fab-desligado{background:var(--fab-de-bg,#4b515c);color:var(--fab-de-t,#fff)}
.fab-tracejado{background:transparent;color:var(--fab-tr,#565c68);border:1px dashed var(--fab-tr-b,#8a909b)}

/* cotas: uma barra por conta */
.fab-cota{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px 12px;align-items:center;padding:10px 0}
.fab-barra{grid-column:1/-1;height:8px;border-radius:99px;background:var(--bg2);overflow:hidden}
.fab-barra i{display:block;height:100%;width:0;border-radius:99px;background:var(--ink2)}
.fab-barra i.cheia{background:var(--bad)}
.fab-esgotada{color:var(--bad);font-weight:650}
.fab-volta{grid-column:1/-1}

/* tickets */
.fab-contagem{list-style:none;margin:0 0 12px;padding:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}
.fab-contagem li{background:var(--bg);border-radius:10px;padding:8px 10px;min-width:0}
.fab-contagem b{display:block;font:700 20px/1.2 var(--font-d)}
.fab-contagem span{display:block;font-size:11.5px;color:var(--mut);line-height:1.3}
.fab-tk{display:grid;grid-template-columns:auto minmax(0,1fr);gap:4px 10px;align-items:center;padding:10px 0}
.fab-tk-id{font-weight:700}
.fab-tk>.pill{justify-self:start}
.fab-tk-tt,.fab-tk>.fab-meta{grid-column:1/-1;overflow-wrap:anywhere}
.fab-vig,.fab-perg{display:flex;gap:10px;align-items:center;flex-wrap:wrap;min-height:44px;padding:6px 0;font-size:14px}

.fab-rodape{display:flex;gap:10px;align-items:center;margin:22px 0 0;padding:12px 16px;border-radius:12px;background:var(--bg2);color:var(--txt2);font-size:13.5px}
.fab-rodape svg{color:var(--gold2)}

/* aba cinza quando o PC esta sem noticias (secao 9): gaveta e barra do celular, com ponto cinza */
.fab-sem-noticias .nb[data-k=fabrica]{opacity:.6}
.fab-sem-noticias .ab[data-k=fabrica]{color:#8a909b}
.fab-sem-noticias .ab[data-k=fabrica]:after{content:"";position:absolute;top:8px;left:calc(50% + 8px);width:9px;height:9px;border-radius:50%;background:#8a909b;border:2px solid var(--surf)}

@media(max-width:700px){
  .fab-ag{grid-template-columns:minmax(0,1fr) auto}
  .fab-ag .fab-meta{grid-column:1/-1;justify-content:flex-start}
  .fab-contagem{grid-template-columns:repeat(3,minmax(0,1fr))}
  .fab-faixa,.fab-rodape{align-items:flex-start}
}

/* T-0703 (CTL-6): botoes de comando, folha (F2 a F7) e historico (F6). Estrutura e alvos de toque; o visual grande e da Afrodite. */
.fab-ag-cmd{grid-template-columns:minmax(0,1fr) auto minmax(0,11rem)}
.fab-abrir{all:unset;box-sizing:border-box;cursor:pointer;display:flex;align-items:center;min-height:48px;min-width:0;border-radius:8px}
.fab-abrir:hover .fab-nome{text-decoration:underline}
.fab-abrir:focus-visible{outline:2px solid #142e4f;outline-offset:2px} /* volta 1 (A1): o marinho do foco do T-0650 */
.fab-atalhos{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.fab-atalhos .btn{min-height:44px}
.fab-sopc{display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:650;color:var(--txt2)}
.fab-sopc svg{width:15px;height:15px;color:var(--gold2)}
.fab-sopc-linha{display:flex;margin:12px 0 0;padding:10px 12px;border-radius:10px;background:var(--bg2)}
.fab-todos{display:flex;justify-content:flex-end;margin:0} /* T-0734 (N5): dentro do .ch da caixa Agentes, a direita do titulo */
.fab-todos .btn{min-height:48px}
.fab-antigo{margin-bottom:12px}

/* comandos recentes na F1 (o eco do T-0651 abre a F1) */
.fab-rec{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 10px;width:100%;padding:8px 0}
.fab-rec .fab-meta{grid-column:1/-1}
.fab-est{display:inline-flex;align-items:center;font-size:12.5px;font-weight:650;padding:3px 10px;border-radius:99px;white-space:nowrap}
.fab-est-ok,.fab-passos li.fab-est-ok{background:var(--ok-bg);color:var(--ok)}
.fab-est-bad,.fab-passos li.fab-est-bad{background:var(--bad-bg);color:var(--bad)}
.fab-est-warn,.fab-passos li.fab-est-warn{background:var(--warn-bg);color:var(--warn)}
.fab-est-info,.fab-passos li.fab-est-info{background:var(--info-bg);color:var(--info)}
.fab-est-off,.fab-passos li.fab-est-off{background:var(--off-bg);color:var(--off)}

/* folha: computador, janela no meio de ate 480 px; celular, tela cheia com a barra de acoes no pe */
dialog.fab-folha{width:min(480px,92vw);max-height:min(720px,92vh);margin:auto;padding:24px;overflow-y:auto}
dialog.fab-folha::backdrop{background:rgba(10,12,16,.5)}
.fab-folha[hidden]{display:none!important}
.fab-folha h3{margin:0;font:650 18px/1.3 var(--font-d)}
.fab-folha h3:focus{outline:none}
.fab-folha p{overflow-wrap:anywhere}
.fab-f-cab{display:flex;gap:12px;align-items:flex-start;justify-content:space-between;margin-bottom:12px}
.fab-f-cab .small{margin:2px 0 0}
.fab-f-x{flex:none}
.fab-f-linha{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin:0 0 10px}
.fab-f-tipos .btn,.fab-folha .btns .btn,.fab-f-acoes .btn{min-height:48px}
.fab-f-acoes{display:flex;gap:8px;justify-content:flex-end;flex-wrap:wrap;margin-top:18px}
.fab-f-acoes .btn{white-space:normal;line-height:1.2;text-align:center} /* T-0734 (N6): rotulo maior quebra a linha, sem transbordar */
.fab-f-idade{margin:0 0 6px} /* T-0734 (O5): "Atualizado ha N s" no topo da folha */
.fab-folha .fab-grupo{margin-top:22px}
.fab-f-hist{display:flex;flex-wrap:wrap;gap:4px 12px;align-items:center;padding:8px 0;font-size:14px}
.fab-dl{display:grid;grid-template-columns:auto minmax(0,1fr);gap:6px 14px;margin:6px 0 10px;font-size:15px}
.fab-dl dt{color:var(--mut);font-weight:600}
.fab-dl dd{margin:0;font-weight:650;overflow-wrap:anywhere}
.fab-q{font-weight:650;font-size:16px;margin:4px 0 12px}
.fab-opcoes{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.fab-opcoes .btn{width:100%;min-height:48px;justify-content:flex-start;text-align:left;font-size:15px;white-space:normal;padding:10px 14px}
.fab-opcoes span{display:block;padding:10px 14px;border:1px dashed var(--line2);border-radius:9px;color:var(--txt2)}

/* F7: passos Registrado, No PC, Feito / Nao feito */
.fab-envios{list-style:none;margin:0;padding:0}
.fab-env{padding:10px 0;border-bottom:1px solid var(--line)}
.fab-env:last-child{border-bottom:0}
.fab-env-tx{margin:6px 0 0;font-weight:600}
.fab-env-erro{color:var(--bad)}
.fab-passos{list-style:none;margin:8px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:6px}
/* volta 1 (A2): pendente tracejado; feito com borda cheia e o sinal de concluido desenhado (sem texto): distintos sem depender da cor */
.fab-passos li{display:inline-flex;align-items:center;min-height:32px;padding:4px 12px;border-radius:99px;font-size:13px;font-weight:600;background:var(--bg);color:var(--mut);border:1px dashed var(--line2)}
.fab-passos li.feito{color:var(--txt2);background:var(--surf);border:1px solid var(--line2)}
.fab-passos li.feito::before{content:'';flex:none;width:4px;height:8px;margin:0 8px 2px 0;border:solid currentColor;border-width:0 2px 2px 0;transform:rotate(45deg)}
.fab-passos li.agora{border-style:solid;border-color:transparent;font-weight:700}

/* F6 historico: tabela na largura de leitura; no celular, cartoes (table.rsp do app) */
.fab-hist{max-width:960px}
.fab-h-volta{margin:0 0 16px}
.fab-filtros{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 16px;margin-bottom:20px;padding-top:8px}
.fab-filtros label.f{margin-top:8px}
.fab-h-tab td{font-size:14px}

/* volta 1 (A3): em 768 (casca de computador com toque) os alvos da folha, da F1 e da F6 com 44 px, os filtros com 16 px e a
   tabela da F6 em cartoes, como a table.rsp do app abaixo de 700 px. So de 701 a 900 px: abaixo disso valem os 48 px do celular */
@media(min-width:701px) and (max-width:900px){
  .fab-folha .fab-f-x,.fab-folha .btn,.fab-bloco .btn,.fab-hist .btn{min-height:44px}
  .fab-filtros select{font-size:16px;min-height:44px}
  .fab-h-tab table.rsp thead{display:none}
  .fab-h-tab table.rsp,.fab-h-tab table.rsp tbody,.fab-h-tab table.rsp tr,.fab-h-tab table.rsp td{display:block;width:100%}
  .fab-h-tab table.rsp tr{padding:10px 14px;border-bottom:1px solid var(--line)}
  .fab-h-tab table.rsp tr:last-child{border:0}
  .fab-h-tab table.rsp td{border:0;padding:5px 0;display:flex;justify-content:space-between;align-items:center;gap:12px;text-align:right}
  .fab-h-tab table.rsp td:before{content:attr(data-l);font-size:12px;font-weight:650;color:var(--mut);text-align:left;flex:none;max-width:45%}
}

@media(max-width:700px){
  .fab-ag-cmd{grid-template-columns:minmax(0,1fr) auto}
  .fab-todos{justify-content:stretch;flex:1 1 100%}
  .fab-todos .btn{width:100%}
  .fab-atalhos .btn{min-height:48px;flex:1 1 auto}
  .folha.fab-folha{top:0;max-height:none;border-radius:0;padding-top:calc(16px + env(safe-area-inset-top,0px));display:flex;flex-direction:column}
  .folha.fab-folha .fab-f-acoes{position:sticky;bottom:calc(-20px - env(safe-area-inset-bottom,0px));margin:auto -16px calc(-20px - env(safe-area-inset-bottom,0px));padding:12px 16px calc(12px + env(safe-area-inset-bottom,0px));background:var(--surf);border-top:1px solid var(--line)}
  .fab-f-acoes .btn{flex:1 1 0;min-width:0;padding:6px 8px}
  .fab-f-acoes .btn.pri{flex-grow:1.6}
  .fab-filtros{grid-template-columns:minmax(0,1fr)}
  .fab-filtros select{font-size:16px;min-height:48px}
}