/* Tela de notas emitidas (lista, filtro, detalhe e formularios). */

/* Barra da lista: botao Filtrar com contagem de filtros ativos. */
.notas-botao-filtro { position: relative; }
.notas-contagem {
  display: inline-flex; align-items: center; justify-content: center; min-width: 20px; height: 20px; padding: 0 6px;
  border-radius: 999px; background: var(--cor); color: var(--grafite); font-size: 11px; font-weight: 800; line-height: 1;
}
.notas-filtros-ativos { display: flex; flex-wrap: wrap; gap: var(--e1); padding: 0 var(--e4); }
.notas-filtros-ativos:not(:empty) { padding: var(--e2) var(--e4); border-bottom: 1px solid var(--borda); }
.notas-simulada { margin-left: var(--e2); font-size: 10px; padding: 1px 7px; font-weight: 700; }

/* Detalhe */
.notas-detalhe .caixa-info { margin-bottom: var(--e3); }
.notas-resumo { display: flex; align-items: center; flex-wrap: wrap; gap: var(--e2) var(--e3); margin-bottom: var(--e4); }
.notas-numero { color: var(--suave); font-weight: 600; }
.notas-valor { margin-left: auto; font-size: 24px; font-weight: 800; white-space: nowrap; }
.notas-acoes { display: flex; flex-wrap: wrap; gap: var(--e2); align-items: center; padding: var(--e3) 0 var(--e4); border-bottom: 1px solid var(--borda); margin-bottom: var(--e4); }

.notas-dados { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: var(--e3) var(--e4); margin: 0 0 var(--e4); }
.notas-dados > div { min-width: 0; }
.notas-dados > div.largo { grid-column: 1 / -1; }
.notas-dados dt { color: var(--suave); font-size: var(--f12); margin-bottom: 2px; }
.notas-dados dd { margin: 0; display: flex; align-items: center; gap: var(--e1); flex-wrap: wrap; word-break: break-word; }
.notas-dados dd > div { width: 100%; }
.notas-chave { font-family: ui-monospace, Consolas, monospace; font-size: 13px; word-break: break-all; letter-spacing: 0.02em; }

.notas-bloco { margin-top: var(--e4); }
.notas-bloco h3 { margin: 0 0 var(--e2); font-size: 15px; }
.notas-itens { list-style: none; margin: 0; padding: 0; }
.notas-itens li { display: flex; align-items: center; gap: var(--e3); padding: var(--e2) 2px; border-bottom: 1px solid var(--borda); }
.notas-itens li:last-child { border-bottom: 0; }
.notas-itens .info { flex: 1; min-width: 0; }
.notas-itens .valor { font-weight: 700; white-space: nowrap; }
.notas-carta { white-space: normal; }
.notas-links { gap: var(--e1); flex-shrink: 0; }

/* Rejeicao explicada */
.caixa-info .notas-codigo { margin-top: var(--e1) !important; font-size: var(--f12); color: var(--suave); word-break: break-word; }
.caixa-info .notas-dica { margin-top: var(--e1) !important; font-weight: 600; }

/* Formularios (justificativas com contador) */
.notas-intro { margin: 0 0 var(--e3); }
.notas-obrigatorio { color: var(--erro); }
.notas-ajuda { display: flex; justify-content: space-between; gap: var(--e2); }
.notas-contador { white-space: nowrap; color: var(--aviso); font-weight: 600; }
.notas-contador.ok { color: var(--suave); font-weight: 400; }

@media (max-width: 760px) {
  .notas-valor { width: 100%; margin-left: 0; font-size: 22px; }
  .notas-acoes > button, .notas-acoes > .botao { flex: 1 1 calc(50% - var(--e2)); }
  .notas-filtros-ativos:not(:empty) { padding: var(--e2) var(--e3); }
}