/* NOTAS FISCAIS (20/10/2026) — template/fiscal/notas.html.
   Tabela densa (linhas de ~27px, texto de 12px) para caber muita informação
   sem rolar; cabeçalho com grupos que dizem a pergunta (padrão 24.1);
   paginação no rodapé da caixa (padrão 35, .paginacao do style.css). */

.nf-pagina { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.nf-barra { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin: 4px 0 0; }
.nf-barra .nf-visoes { margin: 0; }
.nf-barra-dir { display: flex; align-items: center; gap: 10px; margin: 0; }
.nf-busca { width: min(560px, 60vw); }
.nf-busca .cm-busca, .nf-busca .cm-busca:focus { width: 100%; background: #fff; }
.nf-busca .cm-busca { border-color: rgba(120,130,128,.45); }

.nf-chips { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; min-height: 22px; }
.nf-chip { display: inline-flex; align-items: center; gap: 6px; padding: 2px 8px 2px 10px; border-radius: 999px;
  background: #eef1fb; color: #24357a; border: 1px solid #d5dcf3; font-size: 11.5px; line-height: 1.5; text-decoration: none; }
.nf-chip span { font-size: 13px; line-height: 1; opacity: .55; }
.nf-chip:hover { border-color: #9fb0e6; }
.nf-chip:hover span { opacity: 1; color: #b3261e; }
.nf-dica { font-size: 11.5px; color: var(--text-2, var(--text-secondary)); }
.nf-dica b { font-weight: 600; color: var(--text-primary, var(--ink)); font-family: var(--font-mono, monospace); font-size: 11px; }

.nf-acoes { margin-left: auto; display: flex; gap: 6px; align-items: center; flex-wrap: wrap; }
.nf-acao { height: 26px; padding: 0 10px; border-radius: 6px; border: 1px solid var(--border); background: var(--surface, #fff);
  font-size: 11.5px; color: var(--text-primary, var(--ink)); cursor: pointer; text-decoration: none; display: inline-flex; align-items: center; }
.nf-acao:hover { border-color: var(--text-2, #999); }

.nf-caixa { border: 1px solid var(--border); border-radius: 10px; background: var(--surface, #fff); overflow: hidden; }
.nf-caixa .paginacao { border-top: 1px solid var(--border); padding: 8px 12px; }
.nf-rolo { overflow: auto; max-height: calc(100vh - 230px); }
.nf-mais { padding: 10px; text-align: center; font-size: 11.5px; color: var(--text-2, #777); }
#nfLista.is-carregando .nf-rolo { opacity: .55; transition: opacity .15s; }

.nf-tab { width: 100%; border-collapse: separate; border-spacing: 0; font-size: 12px; font-variant-numeric: tabular-nums;
  font-family: var(--font-body, system-ui, sans-serif); }
.nf-tab th, .nf-tab td { padding: 5px 8px; border-bottom: 1px solid var(--border); text-align: left; white-space: nowrap; vertical-align: middle; }
/* the whole header (groups · totals · names) stays on top while scrolling */
.nf-tab thead { position: sticky; top: 0; z-index: 2; }
.nf-tab thead th { background: var(--surface-2, #f4f4ef); font-size: 10.5px; font-weight: 650;
  color: var(--text-2, var(--text-secondary)); letter-spacing: .02em; }
.nf-tab .nf-totais th { background: #fff; color: var(--text-primary, var(--ink)); font-size: 11.5px; font-weight: 700;
  border-bottom: 1px solid var(--border); padding: 4px 8px; }
.nf-tab .nf-totais th a.nf-badge { text-decoration: none; }
.nf-tab .nf-grupos th { font-family: var(--font-mono, monospace); font-size: 9px; letter-spacing: .1em; text-transform: uppercase;
  padding: 4px 8px; height: 22px; box-sizing: border-box; border-left: 1px solid var(--border); color: var(--text-2, #777); }
.nf-tab .nf-grupos th:first-child { border-left: 0; }
.nf-tab thead th a { color: inherit; text-decoration: none; }
.nf-tab thead th.is-on, .nf-tab thead th.is-on a { color: #1d3b8b; }
.nf-seta { opacity: .35; font-size: 9px; }
.nf-tab thead th.is-on .nf-seta { opacity: 1; }
.nf-num { text-align: right !important; }
.nf-linha { cursor: pointer; }
.nf-linha:hover td { background: #f7f8fc; }
.nf-linha.is-aberta td { background: #eef1fb; }
.nf-linha--parada { cursor: default; }
.nf-tab--produto td.nf-cod { max-width: 210px; overflow: hidden; text-overflow: ellipsis; }
.nf-cod { font-family: var(--font-mono, monospace); font-size: 11.5px; font-weight: 600; color: var(--text-primary, var(--ink)); }
.nf-mono { font-family: var(--font-mono, monospace); font-size: 11px; }
.nf-desc { max-width: 300px; overflow: hidden; text-overflow: ellipsis; }
.nf-bus { max-width: 130px; overflow: hidden; text-overflow: ellipsis; }
.nf-cods { max-width: 140px; overflow: hidden; text-overflow: ellipsis; color: var(--text-2, #777); }
.nf-forte { font-weight: 650; }
.nf-neg { color: #a3261c; }
.nf-apagado { color: var(--text-2, var(--text-secondary)); }
.nf-vazio { text-align: center !important; padding: 28px !important; color: var(--text-2, #777); }
.nf-cancelada td { color: #9a9a9a; text-decoration: line-through; text-decoration-color: rgba(0,0,0,.25); }

.nf-elos { white-space: nowrap !important; }
.nf-elo { display: inline-block; white-space: nowrap; margin: 1px 3px 1px 0; padding: 0 6px; border-radius: 4px; font-family: var(--font-mono, monospace);
  font-size: 10.5px; line-height: 17px; text-decoration: none; border: 1px solid transparent; }
.nf-elo--pedido { background: #eef6ef; color: #1f6b3a; border-color: #cfe6d4; }
.nf-elo--proc { background: #f3eefb; color: #5a3696; border-color: #dfd3f3; }
.nf-elo:hover { filter: brightness(.95); text-decoration: underline; }
.nf-elo--mais { background: var(--surface-2, #f1f1ec); color: var(--text-2, #666); cursor: help; }
.nf-elo--mais:hover { text-decoration: none; }
.nf-badge { display: inline-block; padding: 0 7px; border-radius: 999px; background: #fdecea; color: #a3261c; border: 1px solid #f3c4bf;
  font-size: 10.5px; font-weight: 650; line-height: 17px; }
.nf-selo { display: inline-block; padding: 0 6px; border-radius: 4px; background: var(--surface-2, #f1f1ec); color: var(--text-2, #666);
  font-size: 10px; line-height: 16px; text-decoration: none; }
.nf-selo--falta { background: #fdecea; color: #a3261c; }
.nf-tipo { display: inline-block; width: 16px; text-align: center; border-radius: 4px; font-family: var(--font-mono, monospace); font-size: 10px;
  font-weight: 700; line-height: 16px; }
.nf-tipo--S { background: #e7f0fb; color: #1d4f91; }
.nf-tipo--E { background: #fbf1e4; color: #8a5a12; }
.nf-classe { font-size: 10.5px; color: var(--text-2, #777); }
.nf-classe--devolucao { color: #a3261c; }

/* the lines of an opened invoice */
.nf-abre-tr > td { padding: 0 !important; background: #fafbfe; white-space: normal !important; }
.nf-abre { padding: 8px 12px 10px 28px; border-left: 3px solid #9fb0e6; }
.nf-carregando { color: var(--text-2, #777); font-size: 11.5px; }
.nf-sub { border-collapse: collapse; font-size: 11.5px; width: auto; min-width: 70%; font-family: var(--font-body, system-ui, sans-serif); }
.nf-sub th { font-size: 9.5px; font-family: var(--font-mono, monospace); letter-spacing: .06em; text-transform: uppercase; color: var(--text-2, #777);
  padding: 3px 8px; border-bottom: 1px solid var(--border); text-align: left; background: transparent; position: static; }
.nf-sub td { padding: 3px 8px; border-bottom: 1px dashed var(--border); white-space: nowrap; }
.nf-sub .nf-chk { width: 18px; padding-right: 0; }
.nf-sub-acao td { border-bottom: 1px dashed var(--border); padding: 4px 8px 6px; background: #fff8f7; }
.nf-elo-par { display: inline-flex; align-items: center; gap: 2px; margin-right: 6px; }
.nf-elo-par.is-herdado .nf-elo { border-style: dashed; }
.nf-elo-x { border: 0; background: transparent; color: #a3261c; cursor: pointer; font-size: 13px; line-height: 1; padding: 0 2px; opacity: .6; }
.nf-elo-x:hover { opacity: 1; }
.nf-selos { white-space: normal !important; }
.nf-ligar, .nf-ligar-item { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-top: 8px; font-size: 11.5px; }
.nf-ligar-item { margin-top: 0; }
.nf-ligar-rot { font-weight: 600; }
.nf-campo { height: 26px; padding: 0 8px; border: 1px solid var(--border); border-radius: 6px; background: #fff; box-shadow: none; appearance: none;
  font-size: 12px; width: 170px; }
.nf-campo--largo { width: 200px; }
.nf-btn { height: 26px; padding: 0 12px; border-radius: 6px; border: 1px solid #1d3b8b; background: #1d3b8b; color: #fff; font-size: 11.5px;
  font-weight: 600; cursor: pointer; }
.nf-btn:hover { filter: brightness(1.1); }
.nf-aviso { margin: 0 0 6px; padding: 4px 10px; border-radius: 6px; font-size: 11.5px; }
.nf-aviso--er { background: #fdecea; color: #a3261c; }
.nf-aviso--ok { background: #e9f5ec; color: #1f6b3a; }

/* "Operação": the CFOP classifications, a multiselect with search (padrão 19) */
.nf-op { position: relative; }
.nf-op-btn { height: 32px; padding: 0 12px; border-radius: 8px; border: 1px solid rgba(120,130,128,.45); background: #fff;
  font-size: 12.5px; color: var(--text-primary, var(--ink)); cursor: pointer; display: inline-flex; align-items: center; gap: 6px; }
.nf-op-btn b { display: inline-grid; place-items: center; min-width: 18px; height: 18px; padding: 0 5px; border-radius: 999px;
  background: #1d3b8b; color: #fff; font-size: 10.5px; }
.nf-op-btn.is-on { border-color: #1d3b8b; color: #1d3b8b; }
.nf-op-btn span { font-size: 9px; opacity: .6; }
.nf-op-painel { position: absolute; right: 0; top: 36px; z-index: 30; width: 300px; background: #fff; border: 1px solid var(--border);
  border-radius: 10px; box-shadow: 0 12px 32px rgba(6,16,31,.16); padding: 8px; }
.nf-op-busca { width: 100%; box-sizing: border-box; margin-bottom: 6px; }
.nf-op-lista { max-height: 320px; overflow: auto; }
.nf-op-item { display: flex; align-items: center; gap: 8px; padding: 4px 6px; border-radius: 6px; font-size: 12px; cursor: pointer; }
.nf-op-item:hover { background: #f4f6fb; }
.nf-op-item[hidden] { display: none; }
.nf-op-nome { flex: 1; }
.nf-op-nome.is-principal { font-weight: 700; color: var(--text-primary, var(--ink)); }
.nf-op-n { font-size: 10.5px; color: var(--text-2, #888); font-variant-numeric: tabular-nums; }
.nf-op-pe { display: flex; justify-content: space-between; align-items: center; border-top: 1px solid var(--border); margin-top: 6px;
  padding: 6px 4px 0; font-size: 11px; color: var(--text-2, #777); }
.nf-op-limpar { border: 0; background: transparent; color: #1d3b8b; cursor: pointer; font-size: 11px; }