/* Convênios — listas, filtros, selos e tabelas.
   A lista dos atendimentos, os cartões de convênio e de profissional do
   fechamento, entradas e despesas, os cadastros e a tabela do ano. */

/* ---------- filtros em cima da lista ---------- */
.filtros{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:10px}
.filtros select,.filtros input{width:100%;border:1px solid var(--linha);border-radius:11px;
padding:9px 11px;background:var(--cartao);font-size:14.5px;outline:none;min-width:0}
.filtros input{grid-column:1/-1}
.filtros select{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2352636B' stroke-width='2.2' stroke-linecap='round'%3E%3Cpath d='m7 10 5 5 5-5'/%3E%3C/svg%3E");
background-repeat:no-repeat;background-position:right 8px center;background-size:16px;padding-right:28px}
.filtros select:focus,.filtros input:focus{border-color:var(--cor);box-shadow:0 0 0 3px var(--cor-claro)}
.chips{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:12px}
.chip{border:1px solid var(--linha);border-radius:999px;padding:6px 12px;font-size:13px;font-weight:600;
background:var(--cartao);color:var(--tinta-2)}
.chip[aria-pressed="true"]{background:var(--cor);border-color:var(--cor);color:#fff}
.chip.atencao{border-color:#F1DDB4;color:var(--ambar);background:var(--ambar-claro)}
.chip.atencao[aria-pressed="true"]{background:var(--ambar);border-color:var(--ambar);color:#fff}

/* ---------- grupo (um convênio, um lote) ---------- */
.grupo{margin-top:16px}
.grupo:first-child{margin-top:0}
.grupo-cab{display:flex;align-items:baseline;gap:10px;padding:0 2px 7px}
.grupo-nome{font-size:13px;font-weight:700;text-transform:uppercase;letter-spacing:.6px;color:var(--tinta-2)}
.grupo-tot{margin-left:auto;font-size:13px;font-weight:700;color:var(--tinta);font-variant-numeric:tabular-nums}

/* ---------- linha da lista ---------- */
.linhas{background:var(--cartao);border:1px solid var(--linha);border-radius:14px;box-shadow:var(--sombra);
overflow:hidden}
.linha{display:flex;gap:12px;align-items:center;width:100%;text-align:left;padding:11px 13px}
.linha+.linha{border-top:1px solid var(--grade)}
.linha:active{background:var(--papel)}
.linha-meio{flex:1;min-width:0}
.linha-nome{display:block;font-size:15px;font-weight:700;letter-spacing:-.2px;white-space:nowrap;
overflow:hidden;text-overflow:ellipsis}
.linha-sub{display:block;font-size:12.5px;color:var(--tinta-2);margin-top:1px;white-space:nowrap;
overflow:hidden;text-overflow:ellipsis}
.linha-dir{text-align:right;flex:none}
.linha-val{display:block;font-size:15px;font-weight:700;letter-spacing:-.3px;font-variant-numeric:tabular-nums}
.linha-val.pos{color:var(--pos)}
.linha-val.neg{color:var(--neg)}
.linha-rot{display:block;font-size:11.5px;color:var(--tinta-3);font-weight:600;font-variant-numeric:tabular-nums}
.linha-seta{width:18px;height:18px;color:var(--tinta-3)}
.linha-seta svg{width:100%;height:100%}
.linha.inativa .linha-nome{color:var(--tinta-3)}

/* ---------- selos ---------- */
.selo{display:inline-block;border-radius:999px;padding:2px 8px;font-size:11.5px;font-weight:700;
background:var(--grade);color:var(--tinta-2);white-space:nowrap;vertical-align:1px}
.selo.ok{background:var(--pos-claro);color:var(--pos)}
.selo.atencao{background:var(--ambar-claro);color:var(--ambar)}
.selo.ruim{background:var(--neg-claro);color:var(--neg)}
.selo.info{background:var(--cor-claro);color:var(--cor)}
.selos{display:flex;flex-wrap:wrap;gap:5px;margin-top:5px}

/* ---------- cartão de fechamento (um convênio, um profissional) ---------- */
.fech{display:block;width:100%;text-align:left;background:var(--cartao);border:1px solid var(--linha);
border-radius:14px;box-shadow:var(--sombra);padding:13px 14px;margin-bottom:10px}
.fech:active{transform:scale(.995)}
.fech-cab{display:flex;align-items:center;gap:10px}
.fech-nome{font-size:16px;font-weight:700;letter-spacing:-.2px;flex:1;min-width:0;overflow:hidden;
text-overflow:ellipsis;white-space:nowrap}
.fech-val{font-size:17px;font-weight:700;font-variant-numeric:tabular-nums}
.fech-sub{font-size:12.5px;color:var(--tinta-2);margin-top:3px}
.fech-lotes{display:flex;flex-wrap:wrap;gap:6px;margin-top:9px}
.fech-pe{display:flex;align-items:center;gap:8px;margin-top:10px;padding-top:9px;border-top:1px solid var(--grade);
font-size:13px;color:var(--tinta-2)}
.fech-pe b{color:var(--tinta);font-variant-numeric:tabular-nums}
.fech-pe .selo{margin-left:auto}
.totais{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-bottom:14px}
.total{background:var(--cartao);border:1px solid var(--linha);border-radius:12px;padding:9px 10px;min-width:0}
.total span{display:block;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.3px;color:var(--tinta-2)}
.total b{display:block;font-size:15px;font-variant-numeric:tabular-nums;white-space:nowrap;overflow:hidden;
text-overflow:ellipsis}

/* ---------- tabelas (atendimentos no computador, ano, documentos) ---------- */
.tabela-caixa{padding:0;overflow:hidden}
.rolar{overflow-x:auto;-webkit-overflow-scrolling:touch}
.tabela{width:100%;border-collapse:collapse;font-size:13px;font-variant-numeric:tabular-nums}
.tabela th,.tabela td{padding:8px 10px;text-align:right;white-space:nowrap}
.tabela th{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.4px;
color:var(--tinta-2);background:var(--papel);border-bottom:1px solid var(--linha)}
.tabela th.esq,.tabela td.esq{text-align:left}
.tabela td.esq{white-space:normal;min-width:120px}
.tabela tbody tr+tr td{border-top:1px solid var(--grade)}
.tabela tbody tr[data-acao]{cursor:pointer}
.tabela tbody tr[data-acao]:hover td{background:#F7FAFB}
.tabela td.fraco{color:var(--tinta-3)}
.tabela td.neg{color:var(--neg)}
.tabela td.pos{color:var(--pos)}
.tabela tfoot td{font-weight:700;border-top:1px solid var(--linha);background:var(--papel)}
.tabela .mes-atual td{background:#F1F8F8}
.tabela-nota{font-size:12px;color:var(--tinta-3);padding:10px 12px;border-top:1px solid var(--linha)}
/* A primeira coluna fica parada quando a tabela rola para o lado (o ano). */
.tabela.fixa th:first-child,.tabela.fixa td:first-child{position:sticky;left:0;z-index:1;background:var(--cartao)}
.tabela.fixa th:first-child,.tabela.fixa tfoot td:first-child{background:var(--papel)}
.tabela.fixa .mes-atual td:first-child{background:#F1F8F8}
/* A tabela dos atendimentos só aparece no computador (estilo-largo.css). */
.so-largo{display:none}

/* ---------- menu dos cadastros ---------- */
.menu{background:var(--cartao);border:1px solid var(--linha);border-radius:14px;box-shadow:var(--sombra);
overflow:hidden}
.menu-item{display:flex;align-items:center;gap:12px;width:100%;text-align:left;padding:13px 14px;
text-decoration:none;color:inherit}
.menu-item+.menu-item{border-top:1px solid var(--grade)}
.menu-ico{width:38px;height:38px;border-radius:11px;background:var(--cor-claro);color:var(--cor);
display:grid;place-items:center;flex:none}
.menu-ico svg{width:20px;height:20px}
.menu-meio{flex:1;min-width:0}
.menu-tit{display:block;font-weight:700;font-size:15px}
.menu-sub{display:block;font-size:12.5px;color:var(--tinta-2)}
.passos{margin:4px 0 0 18px;font-size:13.5px;color:var(--tinta-2);line-height:1.6}
.passos b{color:var(--tinta)}