:root{
  --ink:#201A17; --ink-soft:#8A7D73; --paper:#FAF6F0; --card:#FFFFFF; --line:#E9E1D4;

  --accent:#C1502E; --accent-deep:#9C3F22; --accent-soft:#F4E2D9;
  --teal:#1E6E63; --teal-deep:#154F47; --teal-soft:#DCEBE7;
  --amber:#A9791F; --amber-soft:#F3E7CE;
  --roxo:#7A4A9C; --roxo-soft:#EBE1F2;
  --danger:#B3261E; --danger-deep:#8F1D17; --danger-soft:#F6DEDA;

  --shadow: 0 1px 2px rgba(32,22,15,0.05), 0 14px 32px rgba(32,22,15,0.08);
  --shadow-sm: 0 1px 2px rgba(32,22,15,0.06);

  --font-display:'Bricolage Grotesque', 'Hanken Grotesk', sans-serif;
  --font-body:'Hanken Grotesk', -apple-system, sans-serif;
  --font-mono:'IBM Plex Mono', monospace;

  font-family: var(--font-body);
}

*{ box-sizing:border-box; }

body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:var(--font-body);
  -webkit-font-smoothing:antialiased;
  min-height:100vh;
}

h1{ font-family:var(--font-display); font-weight:700; letter-spacing:-0.02em; }
h2{ font-family:var(--font-display); font-weight:700; font-size:16px; letter-spacing:-0.01em; margin:0 0 14px; }

.center-screen{
  min-height:100vh; display:flex; align-items:center; justify-content:center;
  background:
    radial-gradient(480px 320px at 18% 12%, rgba(193,80,46,0.10), transparent 65%),
    radial-gradient(420px 300px at 84% 88%, rgba(30,110,99,0.08), transparent 65%),
    var(--paper);
}

.card{ background:var(--card); border:1px solid var(--line); border-radius:14px; padding:26px; box-shadow:var(--shadow); }

.login-card{ width:340px; }
.login-mark{ display:flex; align-items:center; gap:10px; margin-bottom:6px; }
.login-mark svg{ flex:none; }

h1.brand{ font-size:1.5rem; margin:0; }
p.subtitle{ color:var(--ink-soft); margin:0 0 22px; font-size:0.86rem; }

label{ display:block; font-size:0.76rem; color:var(--ink-soft); font-weight:600; margin:13px 0 5px; letter-spacing:0.01em; }

input, select{
  width:100%;
  padding:10px 12px;
  border-radius:9px;
  border:1px solid var(--line);
  background:var(--card);
  color:var(--ink);
  font-size:0.9rem;
  font-family:inherit;
  transition:border-color .15s, box-shadow .15s;
}
input:focus, select:focus{ outline:none; border-color:var(--accent); box-shadow:0 0 0 3px var(--accent-soft); }
input[type=color]{ padding:3px; height:40px; cursor:pointer; }

button{
  cursor:pointer;
  border:none;
  border-radius:9px;
  padding:10px 16px;
  font-size:0.85rem;
  font-weight:700;
  font-family:var(--font-body);
  letter-spacing:0.01em;
  background:var(--accent);
  color:#fff;
  transition:background .15s, transform .1s, box-shadow .15s;
}
button:hover{ background:var(--accent-deep); }
button:active{ transform:translateY(1px); }
button.secondary{ background:var(--card); color:var(--ink); border:1px solid var(--line); }
button.secondary:hover{ background:var(--paper); }
button.danger{ background:var(--danger); }
button.danger:hover{ background:var(--danger-deep); }
button:disabled{ opacity:0.5; cursor:not-allowed; }

.error-msg{ color:var(--danger); font-size:0.8rem; margin-top:10px; min-height:1em; }

header.topbar{
  display:flex; align-items:center; justify-content:space-between;
  padding:16px 28px; background:var(--card); border-bottom:1px solid var(--line);
}
header.topbar h1{ font-size:1.2rem; margin:0; display:flex; align-items:center; gap:10px; }

#updateBanner{
  display:none; position:fixed; top:0; left:0; right:0; z-index:200;
  background:var(--ink); color:#fff; padding:10px 16px;
  text-align:center; font-size:0.82rem; align-items:center; justify-content:center; gap:12px;
}
#updateBanner button{ padding:6px 14px; font-size:0.78rem; }

main{ max-width:1680px; margin:0 auto; padding:26px; }

.app-shell{ display:flex; align-items:flex-start; gap:22px; }
.sidebar{ width:220px; flex-shrink:0; position:sticky; top:26px; }
.sidebar label{ margin-top:0; }
.app-content{ flex:1; min-width:0; }

.sidebar-label{ font-size:11px; font-weight:700; letter-spacing:0.06em; text-transform:uppercase; color:var(--ink-soft); margin:0 0 10px; }
.evento-lista{ display:flex; flex-direction:column; gap:3px; }
.evento-item{
  display:block; width:100%; text-align:left; padding:10px 12px; border-radius:8px; border:none;
  background:none; font-family:var(--font-body); font-size:0.85rem; font-weight:600; color:var(--ink);
  cursor:pointer; line-height:1.3;
}
.evento-item:hover{ background:var(--paper); }
.evento-item.active{ background:var(--ink); color:#fff; }

.sidebar-hr{ border:none; height:1px; background:var(--line); margin:16px 0 14px; }
.sidebar-field{ margin-bottom:12px; }
.sidebar-field:last-child{ margin-bottom:0; }
.sidebar-field .label, .sidebar-field label{ display:block; font-size:0.76rem; color:var(--ink-soft); font-weight:600; margin:0 0 5px; }
.sidebar-field select{ width:100%; }
.sidebar-field .seg-btns{ display:grid; grid-template-columns:1fr 1fr; }
.sidebar-field .seg-btns button{ padding:7px 4px; }

.pend-pill{
  display:flex; align-items:center; justify-content:space-between; gap:8px; width:100%;
  padding:9px 11px; border-radius:8px; border:1px solid var(--line); background:#fff;
  font-family:var(--font-body); font-size:0.8rem; font-weight:600; color:var(--ink); cursor:pointer; text-align:left;
}
.pend-pill b{ font-family:var(--font-mono); font-weight:600; }
.pend-pill--alert{ background:var(--danger-soft); border-color:var(--danger); color:var(--danger-deep); }
.pend-pill--alert b{ color:var(--danger-deep); }

@media(max-width:760px){
  .app-shell{ flex-direction:column; }
  .sidebar{ width:100%; position:static; }
}

.row{ display:flex; gap:12px; align-items:flex-end; flex-wrap:wrap; }
.row > div{ flex:1; min-width:160px; }

section.card{ margin-bottom:20px; }

details.card summary{ cursor:pointer; font-family:var(--font-display); font-weight:700; font-size:16px; }
details[open].card summary{ margin-bottom:8px; }

.view-tabs{ display:flex; gap:22px; margin:4px 0 22px; border-bottom:1px solid var(--line); }
.view-tab{
  display:flex; align-items:center; gap:7px;
  background:transparent; color:var(--ink-soft); font-weight:600;
  padding:10px 2px 12px; border-radius:0; box-shadow:none;
  border-bottom:2px solid transparent; margin-bottom:-1px;
}
.view-tab svg{ opacity:0.75; }
.view-tab:hover{ background:transparent; color:var(--ink); }
.view-tab.active{ background:transparent; color:var(--ink); border-bottom-color:var(--accent); }
.view-tab.active svg{ opacity:1; }
.view-tab.active:hover{ background:transparent; }

.dash-charts{ display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.dash-charts > div{ background:var(--paper); border:1px solid var(--line); border-radius:12px; padding:12px; }
@media(max-width:700px){ .dash-charts{ grid-template-columns:1fr; } }

.link-row{ display:flex; align-items:center; gap:10px; border-bottom:1px solid var(--line); padding:10px 0; }
.link-row .titulo{ flex:1; font-weight:700; font-size:0.85rem; }
.link-row .url{ flex:2; font-family:var(--font-mono); font-size:0.75rem; color:var(--ink-soft); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }

.resumo-card{ background:var(--paper); border:1px solid var(--line); border-radius:12px; padding:14px 18px; flex:1; min-width:140px; }
.resumo-card .valor{ font-family:var(--font-mono); font-size:1.5rem; font-weight:600; color:var(--accent); }
.resumo-card .rotulo{ font-size:0.72rem; text-transform:uppercase; letter-spacing:.06em; color:var(--ink-soft); font-weight:700; margin-top:3px; }

/* Variante mais discreta, usada no Painel — o usuário achou o dashboard
   grande/pesado demais (2026-09-10). Mesma estrutura, só reduz o peso visual. */
.resumo-card-sm{ padding:10px 14px; min-width:120px; }
.resumo-card-sm .valor{ font-size:1.1rem; }
.resumo-card-sm .rotulo{ font-size:0.66rem; margin-top:2px; }

/* Painel geral — cards financeiros com barra/sparkline, listas de barra em
   vez de gráfico (Chart.js saiu de vez: sem canvas, sem risco de esticar a
   altura sozinho quando a largura da tela muda — bug real 2026-09-11). */
.painel-kpis{ display:flex; flex-wrap:wrap; gap:12px; }
.painel-kpi-wide{ flex-basis:100%; }
@media(min-width:640px){ .painel-kpi-wide{ flex:2 1 260px; } }
.painel-kpi-note{ font-size:0.68rem; color:var(--ink-soft); margin-top:6px; }
.painel-bar{ height:6px; border-radius:999px; background:var(--line); overflow:hidden; margin-top:8px; }
.painel-bar > span{ display:block; height:100%; background:var(--accent); }
.painel-spark{ width:100%; height:24px; display:block; margin-top:6px; }

.painel-cols{ display:grid; grid-template-columns:1.5fr 1fr; gap:14px; }
@media(max-width:1000px){ .painel-cols{ grid-template-columns:1fr; } }
.painel-panel{ background:var(--paper); border:1px solid var(--line); border-radius:12px; padding:14px; }

.painel-vbar{ display:grid; grid-template-columns:78px minmax(0,1fr) 128px; align-items:center; gap:10px; margin-bottom:8px; }
.painel-vbar:last-child{ margin-bottom:0; }
.painel-vbar-name{ font-size:0.74rem; font-weight:700; }
.painel-vbar-track{ height:18px; border-radius:5px; background:#fff; overflow:hidden; }
.painel-vbar-fill{ display:block; height:100%; }
.painel-vbar-val{ text-align:right; font-family:var(--font-mono); font-size:0.76rem; font-weight:600; white-space:nowrap; }
.painel-vbar-qtd{ font-weight:500; color:var(--ink-soft); font-size:0.7rem; }

/* ---------- Pendências (painel) ---------- */
.pend-section{ margin-top:22px; display:flex; flex-direction:column; gap:12px; }
#pendOpenBadge b{ font-family:var(--font-mono); }
.pend-card{ background:var(--card); border:1px solid var(--line); border-radius:14px; overflow:hidden; }
.pend-card-head{ padding:18px 20px 4px; }
.pend-eyebrow{ font-size:11px; font-weight:700; letter-spacing:.08em; color:var(--ink-soft); margin-bottom:2px; }
.pend-card-title{ font-family:var(--font-display); font-weight:700; font-size:16px; }

.pend-kpis{ display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:8px; padding:14px 20px 0; }
.pend-kpi{ background:var(--paper); border:1px solid var(--line); border-radius:10px; padding:10px 12px; display:flex; flex-direction:column; gap:4px; }
.pend-kpi span{ font-size:10px; font-weight:700; letter-spacing:.08em; color:var(--ink-soft); }
.pend-kpi b{ font-family:var(--font-mono); font-size:17px; }

.pend-aging{ padding:16px 20px 0; display:flex; flex-direction:column; gap:8px; }
.pend-aging-label{ display:flex; justify-content:space-between; gap:12px; font-size:11px; font-weight:700; letter-spacing:.05em; color:var(--ink-soft); }
.pend-aging-bar{ display:flex; height:12px; border-radius:6px; overflow:hidden; gap:2px; }
.pend-aging-bar > div{ cursor:pointer; transition:opacity .15s; }
.pend-aging-chips{ display:flex; flex-wrap:wrap; gap:6px; }
.pend-chip{ display:flex; align-items:center; gap:7px; height:28px; padding:0 10px; border-radius:8px; border:1px solid var(--line); background:var(--card); font-size:11.5px; font-weight:600; font-family:var(--font-body); cursor:pointer; color:var(--ink); }
.pend-chip.active{ border-color:var(--ink); background:var(--ink); color:#fff; }
.pend-chip.active .pend-chip-count{ color:#fff; }
.pend-chip-dot{ width:7px; height:7px; border-radius:50%; flex:none; }
.pend-chip-count{ font-family:var(--font-mono); color:var(--ink-soft); }

.pend-toolbar{ padding:16px 20px 0; display:flex; gap:10px; flex-wrap:wrap; align-items:center; }
.pend-search{ flex:1 1 220px; max-width:320px; height:36px; border-radius:10px; background:var(--card); border:1px solid var(--line); display:flex; align-items:center; padding:0 12px; gap:8px; }
.pend-search span{ color:var(--ink-soft); }
.pend-search input{ border:0; outline:0; background:transparent; padding:0; flex:1; min-width:0; }
.pend-chips{ display:flex; gap:6px; flex-wrap:wrap; }
.pend-link-btn{ background:none; border:0; color:var(--accent); font-weight:600; font-size:12px; padding:0; text-decoration:underline; }
.pend-link-btn:hover{ background:none; color:var(--accent-deep); }

.pend-table-wrap{ margin-top:16px; border-top:1px solid var(--line); overflow-x:auto; }
.pend-table-head, .pend-row{ display:grid; grid-template-columns:minmax(200px,2.5fr) 130px 200px; align-items:center; gap:8px; padding:0 20px; min-width:560px; }
.pend-table-head{ height:38px; font-size:10.5px; font-weight:700; letter-spacing:.07em; color:var(--ink-soft); border-bottom:1px solid var(--line); background:none; border-radius:0; }
.pend-row{ min-height:56px; border-bottom:1px solid var(--line); }
.pend-row:hover{ background:var(--paper); }
.pend-row-cliente{ display:flex; flex-direction:column; gap:2px; padding-right:10px; min-width:0; }
.pend-row-nome{ font-size:14px; font-weight:600; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:var(--ink); }
.pend-row:hover .pend-row-nome{ color:var(--accent); text-decoration:underline; }
.pend-row-sub{ font-size:11.5px; color:var(--ink-soft); }
.pend-row-tipo{ display:flex; align-items:center; gap:6px; font-size:12px; font-weight:700; letter-spacing:.02em; }
.pend-row-tipo-dot{ width:8px; height:8px; border-radius:50%; flex:none; }
.pend-row-dias{ display:flex; align-items:center; gap:10px; padding-right:10px; }
.pend-row-dias b{ min-width:42px; font-family:var(--font-mono); font-size:13px; }
.pend-row-dias-track{ flex:1; height:4px; border-radius:2px; background:var(--paper); }
.pend-row-dias-fill{ display:block; height:100%; border-radius:2px; }

.pend-footer{ display:flex; align-items:center; justify-content:space-between; gap:12px; padding:12px 20px; border-top:1px solid var(--line); }

@media(max-width:820px){
  .pend-table-head{ display:none; }
  .pend-row{ grid-template-columns:1fr; min-width:0; padding:12px 16px; gap:8px; }
  .pend-row-dias{ padding-right:0; }
}

.painel-callout, .painel-note{ margin-top:10px; padding:9px 11px; border-radius:8px; background:#fff; border:1px solid var(--line); font-size:0.74rem; color:var(--ink-soft); }
.painel-callout b, .painel-note b{ color:var(--ink); }

.painel-rank-item{ margin-bottom:9px; }
.painel-rank-item:last-child{ margin-bottom:0; }
.painel-rank-top{ display:flex; justify-content:space-between; gap:8px; font-size:0.78rem; font-weight:700; margin-bottom:3px; }
.painel-rank-top b{ font-family:var(--font-mono); font-weight:600; color:var(--accent); }
.painel-rank-track{ height:5px; border-radius:999px; background:#fff; }
.painel-rank-track > span{ display:block; height:100%; border-radius:999px; background:var(--teal); }
.painel-rank-meta{ font-size:0.68rem; color:var(--ink-soft); margin-top:3px; }

.seg-btns{ display:flex; gap:4px; }
.seg-btns button{ padding:7px 12px; border-radius:7px; border:1px solid var(--line); background:#fff; font-size:0.76rem; font-weight:700; color:var(--ink-soft); cursor:pointer; }
.seg-btns button.active{ background:var(--ink); border-color:var(--ink); color:#fff; }

.permissoes-grid{ display:grid; grid-template-columns:1fr 1fr; gap:10px 20px; }
@media(max-width:700px){ .permissoes-grid{ grid-template-columns:1fr; } }
.permissao-item{ display:flex; align-items:flex-start; gap:10px; padding:10px 0; border-bottom:1px solid var(--line); cursor:pointer; }
.permissao-item input[type=checkbox]{ width:auto; margin-top:3px; flex:none; }
.permissao-item strong{ font-size:0.85rem; }

table{ width:100%; border-collapse:collapse; font-size:0.83rem; }
th, td{ text-align:left; padding:10px 10px; border-bottom:1px solid var(--line); }
th{ color:var(--ink-soft); font-weight:700; font-size:0.72rem; text-transform:uppercase; letter-spacing:.05em; border-bottom:2px solid var(--line); }
tbody tr:hover{ background:var(--paper); }

.pill{ display:inline-flex; align-items:center; gap:5px; padding:3px 11px; border-radius:20px; font-size:0.7rem; font-weight:700; white-space:nowrap; letter-spacing:0.01em; }
.pill.ativo{ background:var(--teal-soft); color:var(--teal-deep); }
.pill.ativo::before{ background:var(--teal); }
.pill.inativo{ background:var(--line); color:var(--ink-soft); }
.pill.inativo::before{ background:var(--ink-soft); }

.pill-dupla{
  display:inline-flex; align-items:center; padding:2px 9px; border-radius:20px;
  font-size:0.68rem; font-weight:700; white-space:nowrap;
  background:var(--teal-soft); color:var(--teal-deep); cursor:help;
}
tr.linha-venda-dupla{ box-shadow: inset 3px 0 0 var(--teal); }

.pill-migrada{
  display:inline-flex; align-items:center; padding:2px 9px; border-radius:20px;
  font-size:0.68rem; font-weight:700; white-space:nowrap;
  background:var(--amber-soft); color:var(--amber); cursor:help;
}
tr.linha-venda-migrada{ box-shadow: inset 3px 0 0 var(--amber); }
tr.linha-venda-dupla.linha-venda-migrada{ box-shadow: inset 3px 0 0 var(--teal), inset 6px 0 0 var(--amber); }

.pill-bonus{
  display:inline-flex; align-items:center; padding:2px 9px; border-radius:20px;
  font-size:0.68rem; font-weight:700; white-space:nowrap;
  background:var(--roxo-soft); color:var(--roxo); cursor:help;
}
tr.linha-venda-bonus{ box-shadow: inset 3px 0 0 var(--roxo); }
tr.linha-venda-dupla.linha-venda-bonus{ box-shadow: inset 3px 0 0 var(--teal), inset 6px 0 0 var(--roxo); }
tr.linha-venda-migrada.linha-venda-bonus{ box-shadow: inset 3px 0 0 var(--amber), inset 6px 0 0 var(--roxo); }
tr.linha-venda-dupla.linha-venda-migrada.linha-venda-bonus{ box-shadow: inset 3px 0 0 var(--teal), inset 6px 0 0 var(--amber), inset 9px 0 0 var(--roxo); }

/* Tabelas com muitas colunas viram uma pilha de "cartões" por linha (rótulo:
   valor) em vez de precisar de rolagem horizontal. Cada <td> mostra o texto
   do <th> correspondente — ver aplicarLabelsResponsivos() em app.js, que
   preenche data-label depois de montar o tbody. */
table.tabela-cartoes,
table.tabela-responsiva{ border:none; }
table.tabela-cartoes thead,
table.tabela-responsiva thead{ display:none; }
table.tabela-cartoes, table.tabela-cartoes tbody,
table.tabela-responsiva, table.tabela-responsiva tbody{ display:block; width:100%; }
table.tabela-cartoes tr,
table.tabela-responsiva tr{
  display:block; border:1px solid var(--line); border-radius:10px; padding:6px 12px; margin-bottom:10px;
}
table.tabela-cartoes td,
table.tabela-responsiva td{
  display:flex; justify-content:space-between; align-items:center; gap:10px;
  text-align:right; border-bottom:1px solid var(--line); padding:8px 0;
}
table.tabela-cartoes td:last-child, table.tabela-responsiva td:last-child{ border-bottom:none; }
table.tabela-cartoes td:empty, table.tabela-responsiva td:empty{ display:none; }
table.tabela-cartoes td::before, table.tabela-responsiva td::before{
  content:attr(data-label); text-align:left; font-weight:700; font-size:0.72rem;
  text-transform:uppercase; letter-spacing:.05em; color:var(--ink-soft); flex-shrink:0;
}

/* .tabela-responsiva (Clientes, Relatórios): tabela normal em telas largas,
   só vira cartão quando a largura fica apertada. .tabela-cartoes (Vendas,
   Pendentes, Auditoria): tem colunas demais pra caber como tabela em
   qualquer largura razoável de tela, então já nasce em formato de cartão. */
@media(min-width:861px){
  table.tabela-responsiva{ border-collapse:collapse; }
  table.tabela-responsiva thead{ display:table-header-group; }
  table.tabela-responsiva{ display:table; }
  table.tabela-responsiva tbody{ display:table-row-group; }
  table.tabela-responsiva tr{ display:table-row; border:none; border-radius:0; padding:0; margin:0; }
  table.tabela-responsiva td{
    display:table-cell; text-align:left; border-bottom:1px solid var(--line); padding:10px 10px;
  }
  table.tabela-responsiva td::before{ content:none; }
}

.modal-backdrop{
  position:fixed; inset:0; background:rgba(32,22,15,0.5); backdrop-filter:blur(2px);
  display:flex; align-items:center; justify-content:center; z-index:10;
}
.modal{ width:380px; max-height:88vh; overflow-y:auto; }
.modal-wide{ width:min(720px, 92vw); }
.check-row{ display:flex; align-items:center; gap:8px; margin:14px 0 4px; }
.check-row input{ width:auto; }
.check-row label{ margin:0; font-size:0.85rem; color:var(--ink); font-weight:500; }

.busca-cliente-wrap{ position:relative; }
.busca-cliente-dropdown{
  position:absolute; top:calc(100% + 4px); left:0; right:0; z-index:20;
  background:var(--card); border:1px solid var(--line); border-radius:10px;
  box-shadow:var(--shadow); max-height:240px; overflow-y:auto;
}
.busca-cliente-item{ padding:9px 12px; cursor:pointer; border-bottom:1px solid var(--line); display:flex; flex-direction:column; gap:2px; }
.busca-cliente-item:last-child{ border-bottom:none; }
.busca-cliente-item:hover{ background:var(--paper); }
.busca-cliente-item strong{ font-size:0.85rem; }
.busca-cliente-item span{ font-size:0.75rem; color:var(--ink-soft); }
.busca-cliente-vazio{ padding:9px 12px; font-size:0.8rem; color:var(--ink-soft); }

/* Drawer lateral (painel de detalhe do cliente) — desliza da direita, mesmo
   padrão do sistema-alunas: overlay escurece o fundo, o painel fica fixo na
   borda direita com scroll próprio. */
.drawer-overlay{
  position:fixed; inset:0; background:rgba(32,22,15,0.45); backdrop-filter:blur(1px);
  display:flex; justify-content:flex-end; z-index:20;
}
.drawer{
  width:460px; max-width:92vw; height:100%; background:var(--card); overflow-y:auto;
  box-shadow:-8px 0 30px rgba(32,22,15,0.18); padding:26px;
}
.drawer-header{ display:flex; align-items:flex-start; justify-content:space-between; gap:10px; margin-bottom:6px; }
.drawer-header h2{ margin:0 0 4px; }
.drawer-close{ background:none; border:none; color:var(--ink-soft); font-size:1.4rem; line-height:1; cursor:pointer; padding:2px 6px; }
.drawer-close:hover{ color:var(--ink); }
.drawer-section{ border-top:1px solid var(--line); margin-top:18px; padding-top:16px; }
.drawer-section h3{ font-family:var(--font-display); font-size:0.85rem; font-weight:700; margin:0 0 10px; }
.kv{ display:flex; justify-content:space-between; gap:10px; font-size:0.85rem; padding:5px 0; border-bottom:1px solid var(--line); }
.kv:last-child{ border-bottom:none; }
.kv span:first-child{ color:var(--ink-soft); }
.venda-card{ background:var(--paper); border:1px solid var(--line); border-radius:10px; padding:12px 14px; margin-bottom:10px; }
.venda-card .kv{ border-bottom:1px solid var(--line); }
.venda-card .kv:last-of-type{ border-bottom:none; }
.venda-card .row{ margin-top:10px; }

.pill::before{ content:""; width:6px; height:6px; border-radius:50%; flex:none; }
.pill.assinado{ background:rgba(30,110,99,0.14); color:var(--teal-deep); } .pill.assinado::before{ background:var(--teal); }
.pill.enviado{ background:rgba(169,121,31,0.14); color:var(--amber); } .pill.enviado::before{ background:var(--amber); }
.pill.pendente{ background:rgba(179,38,30,0.14); color:var(--danger); } .pill.pendente::before{ background:var(--danger); }

.info-row{ display:flex; justify-content:space-between; font-size:0.85rem; padding:5px 0; border-bottom:1px solid var(--line); }
.info-row:last-child{ border-bottom:none; }

.hidden{ display:none !important; }

/* ---------- Upgrade de ingresso ---------- */
.pill-upgrade{ display:inline-flex; align-items:center; gap:4px; padding:2px 9px; border-radius:20px; font-size:0.66rem; font-weight:700; background:var(--teal-soft); color:var(--teal-deep); white-space:nowrap; }
.upg-atual{ background:var(--paper); border:1px solid var(--line); border-radius:10px; padding:10px 14px; margin:12px 0 4px; font-size:0.86rem; }
.upg-calculo{ display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:8px; margin:6px 0 12px; }
.upg-calculo > div{ background:var(--paper); border:1px solid var(--line); border-radius:10px; padding:9px 12px; display:flex; flex-direction:column; gap:3px; }
.upg-calculo span{ font-size:10px; font-weight:700; letter-spacing:.08em; color:var(--ink-soft); }
.upg-calculo b{ font-family:var(--font-mono); font-size:15px; }
.upg-calculo .upg-destaque{ border-color:var(--teal); background:var(--teal-soft); }
.upg-calculo .upg-erro{ border-color:var(--danger); background:var(--danger-soft); }
.upg-hist{ margin-top:10px; border-top:1px dashed var(--line); padding-top:8px; }
.upg-hist-titulo{ font-size:0.7rem; font-weight:700; letter-spacing:.06em; color:var(--ink-soft); margin-bottom:6px; }
.upg-item{ border:1px solid var(--line); border-radius:9px; padding:8px 10px; margin-bottom:6px; font-size:0.8rem; background:#fff; }
.upg-item.cancelado{ opacity:0.75; background:var(--paper); }
.upg-item-topo{ display:flex; justify-content:space-between; gap:8px; flex-wrap:wrap; align-items:center; }
.upg-item-sub{ color:var(--ink-soft); font-size:0.74rem; margin-top:2px; }
.upg-item-acoes{ display:flex; gap:6px; flex-wrap:wrap; margin-top:6px; }
.upg-item-acoes button{ padding:4px 10px; font-size:0.7rem; }
#upgListaBody tr[data-chave]{ cursor:pointer; }
#upgradeModalBackdrop{ z-index:90; }

/* ---------- Pagamentos pendentes ---------- */
#pagModalBackdrop{ z-index:90; }
.pag-bloco{ border-top:1px solid var(--line); padding-top:12px; margin-top:12px; }
.pag-cond-texto{ font-size:0.86rem; margin:4px 0 8px; }
.pag-item{ border:1px solid var(--line); border-radius:9px; padding:9px 11px; margin-top:8px; font-size:0.82rem; background:#fff; }
.pag-item.cancelado{ opacity:0.7; background:var(--paper); }
.pag-item-topo{ display:flex; justify-content:space-between; gap:8px; flex-wrap:wrap; align-items:center; }
.pag-item-sub{ color:var(--ink-soft); font-size:0.75rem; margin-top:2px; }
.pag-item-acoes{ display:flex; gap:6px; flex-wrap:wrap; align-items:center; margin-top:7px; }
.pag-item-acoes button{ padding:4px 10px; font-size:0.7rem; }
.pag-comprovante{ display:inline-flex; align-items:center; gap:4px; font-size:0.75rem; padding:2px 8px; border-radius:20px; background:var(--teal-soft); color:var(--teal-deep); text-decoration:none; }
.pag-comprovante:hover{ text-decoration:underline; }
.pag-atrasado{ color:var(--danger); font-weight:700; }
#pagTableBody tr[data-venda]{ cursor:pointer; }

.nvm-restante{ background:var(--accent-soft); border:1px solid var(--accent); border-radius:10px; padding:10px 12px; margin:0 0 10px; }