/* AURA · visual do sistema (abas, tabelas, formulários, janelas) */

.cofre-scope{
  /* 28/10/2026: fundo BRANCO (antes preto). Dourado mais escuro pra ler bem no branco. */
  --bg:#ffffff;
  --surface:#ffffff;
  --surface-2:#f4f3ef;
  --border:#dcd9d1;
  --border-soft:#e9e7e1;
  --text:#1d1b18;
  --text-dim:#5c5852;
  --text-faint:#8a867e;
  --accent:#a8792b;
  --accent-soft:rgba(168,121,43,.13);
  --danger:#c2453a;
  --danger-soft:rgba(194,69,58,.10);
  --good:#3d8a37;
  --good-soft:rgba(61,138,55,.12);
  --zebra:#f6f5f1;
  /* gráficos (Resumo/Controle): mudam com o tema — ver o bloco TEMA ESCURO no fim */
  --viz-1:#2a78d6;
  --viz-trilho:#dbe7f7;
  --viz-grade:#e1e0d9;
  --viz-eixo:#c3c2b7;
  color-scheme:light;
  --radius:10px;
  --mono:'IBM Plex Mono', ui-monospace, 'SF Mono', Menlo, monospace;
  --sans:'Manrope', ui-sans-serif, system-ui, -apple-system, sans-serif;

  min-height:100%; font-family:var(--sans); color:var(--text); background:var(--bg);}






/* ---------- App shell ---------- */
#app{ display:flex; flex-direction:column; }
.online-bar{
  position:sticky; top:env(safe-area-inset-top, 0px); z-index:12;
  display:flex; align-items:center; gap:10px; height:32px; padding:0 20px;
  background:var(--surface-2); border-bottom:1px solid var(--border);
  font-family:var(--mono); font-size:11px; letter-spacing:.02em;
  overflow-x:auto; white-space:nowrap;
}
.online-bar-label{ color:var(--good); font-weight:700; flex:0 0 auto; }
.online-bar-label.online-bar-label-botao{ cursor:pointer; text-decoration:underline dotted; text-underline-offset:3px; }
.online-bar-label.online-bar-label-botao:hover{ color:var(--accent); }
.online-bar-label.online-bar-label-botao:focus-visible{ outline:2px solid var(--accent); outline-offset:2px; }
/* painel "Quem está no sistema" */
.modal.painel-online{ max-width:820px; }
.painel-online-aviso{ color:var(--accent); margin:0 0 8px; }
.painel-online-aviso:empty{ display:none; }
.painel-online-tabela{ width:100%; border-collapse:collapse; font-size:13px; }
.painel-online-tabela th{ text-align:left; font-size:10.5px; text-transform:uppercase; letter-spacing:.04em; color:var(--text-faint); font-weight:600; padding:6px 8px; border-bottom:1px solid var(--border); }
.painel-online-tabela td{ padding:8px; border-bottom:1px solid var(--border-soft); white-space:nowrap; }
.painel-online-fraco{ color:var(--text-faint); }
.painel-online-sit{ display:inline-flex; align-items:center; gap:6px; }
.painel-online-ativo .online-dot{ background:var(--good); }
.painel-online-parado .online-dot{ background:#b7860b; box-shadow:0 0 0 2px rgba(224,178,58,.16); }
.painel-online-parado{ color:#b7860b; }
.painel-online-inativo .online-dot{ background:var(--danger); box-shadow:0 0 0 2px var(--danger-soft); }
.painel-online-inativo{ color:var(--danger); }
.painel-online-fora .online-dot{ background:var(--text-faint); box-shadow:none; }
.painel-online-fora{ color:var(--text-faint); }
.online-bar-list{ display:flex; align-items:center; gap:8px; flex-wrap:nowrap; }
.online-pill{
  display:inline-flex; align-items:center; gap:5px; background:var(--surface);
  border:1px solid var(--good); border-radius:999px; padding:2px 10px 2px 8px;
  color:var(--text); font-size:11px; white-space:nowrap;
}
.online-dot{ width:6px; height:6px; border-radius:50%; background:var(--good); flex:0 0 auto; box-shadow:0 0 0 2px var(--good-soft); }
.online-pill-you{ border-color:var(--accent); background:var(--accent-soft, var(--surface)); font-weight:700; }
.online-you-tag{ color:var(--accent); font-weight:700; }

.sync-status{
  margin-left:auto; flex:0 0 auto; display:inline-flex; align-items:center; gap:6px;
  font-family:var(--mono); font-size:11px; letter-spacing:.02em; white-space:nowrap;
}
.sync-dot{ width:6px; height:6px; border-radius:50%; flex:0 0 auto; transition:background .2s ease, box-shadow .2s ease; }
.sync-status.sync-ok .sync-dot{ background:var(--good); box-shadow:0 0 0 2px var(--good-soft); }
.sync-status.sync-ok #sync-status-text{ color:var(--text-dim); }
.sync-status.sync-warn .sync-dot{ background:#b7860b; box-shadow:0 0 0 2px rgba(224,178,58,.16); animation:sync-pulse 1s ease-in-out infinite; }
.sync-status.sync-warn #sync-status-text{ color:#b7860b; }
.sync-status.sync-error .sync-dot{ background:var(--danger); box-shadow:0 0 0 2px var(--danger-soft); }
.sync-status.sync-error #sync-status-text{ color:var(--danger); font-weight:700; }
.sync-status.sync-paused .sync-dot{ background:var(--text-faint); box-shadow:0 0 0 2px rgba(0,0,0,.05); }
.sync-status.sync-paused #sync-status-text{ color:var(--text-faint); }
@keyframes sync-pulse{ 0%,100%{ opacity:1; } 50%{ opacity:.35; } }
/* à direita: ● Sincronizado há 5s · gabriel editou Pedidos #12 · Alteração nº 1.234 */
.ultima-alteracao, .contador-alteracoes{ flex:0 1 auto; min-width:0; font-family:var(--mono); font-size:11px; color:var(--text-dim); letter-spacing:.02em; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.contador-alteracoes{ flex:0 0 auto; }
.ultima-alteracao::before, .contador-alteracoes::before{ content:'·'; margin:0 8px 0 2px; color:var(--text-faint); }
.ultima-alteracao b{ color:var(--text); font-weight:600; }
.online-bar.conexao-erro .contador-alteracoes{ color:#fff; }
.sync-status{ cursor:pointer; border-radius:4px; padding:2px 4px; }
.sync-status:hover #sync-status-text{ text-decoration:underline; }
.sync-status:focus-visible{ outline:2px solid var(--accent); outline-offset:2px; }

/* bolinha amarela: usuário sem sinal de vida há mais de 30s */
.online-pill-amarelo{ border-color:#b7860b; }
.online-pill-amarelo .online-dot{ background:#b7860b; box-shadow:0 0 0 2px rgba(224,178,58,.16); }

/* tarja "Problema de conexão": a barra de cima fica vermelha */
.conexao-tarja{ color:#fff; font-weight:700; flex:0 0 auto; }
.online-bar.conexao-erro{ background:var(--danger); border-bottom-color:var(--danger); }
.online-bar.conexao-erro .online-bar-label, .online-bar.conexao-erro .online-bar-list{ display:none; }
.online-bar.conexao-erro .sync-status #sync-status-text{ color:#fff; }
.online-bar.conexao-erro .sync-status .sync-dot{ background:#fff; box-shadow:0 0 0 2px rgba(255,255,255,.25); }

/* avisos (salvo / não salvou / conexão) */
.aura-aviso{
  position:fixed; bottom:calc(20px + env(safe-area-inset-bottom, 0px)); left:50%; transform:translateX(-50%); z-index:400;
  display:flex; align-items:center; gap:12px; max-width:min(560px, calc(100vw - 32px));
  padding:10px 12px 10px 14px; border-radius:8px; border:1px solid var(--border);
  background:var(--surface-2); color:var(--text); font-size:13px; line-height:1.4;
  box-shadow:0 8px 24px rgba(0,0,0,.12);
}
.aura-aviso[hidden]{ display:none; }
.aura-aviso-ok{ border-color:var(--good); }
.aura-aviso-ok .aura-aviso-texto::before{ content:'✓ '; color:var(--good); font-weight:700; }
.aura-aviso-info{ border-color:var(--accent); }
.aura-aviso-erro{ border-color:var(--danger); background:#fdecea; }
.aura-aviso-erro .aura-aviso-texto{ color:#8f2a20; font-weight:600; }
.aura-aviso-fechar{ margin-left:auto; flex:0 0 auto; background:none; border:0; color:var(--text-dim); font-size:14px; cursor:pointer; padding:2px 4px; }
.aura-aviso-fechar:hover{ color:var(--text); }

.topbar{
  position:sticky; top:env(safe-area-inset-top, 0px); z-index:10;
  display:flex; align-items:center; gap:18px; height:56px; padding:0 20px;
  background:var(--bg); border-bottom:1px solid var(--border);
  transition:top .15s ease;
}
#app.online-bar-active .topbar{ top:calc(32px + env(safe-area-inset-top, 0px)); }
.brand{ display:flex; align-items:center; gap:8px; flex:0 0 auto; }
.brand-dot{ width:7px; height:7px; border-radius:50%; background:var(--accent); }
.brand-name{ font-family:var(--mono); font-size:13px; letter-spacing:.03em; color:var(--text-dim); }

.tabs{
  display:flex; gap:2px; overflow-x:auto; flex:1 1 auto;
  scrollbar-width:none; -ms-overflow-style:none;
}
.tabs::-webkit-scrollbar{ display:none; }
.tab{
  flex:0 0 auto; position:relative; background:none; border:none; cursor:pointer;
  font-family:var(--sans); font-size:13px; font-weight:600; color:var(--text-dim);
  padding:8px 12px; white-space:nowrap; transition:color .15s;
}
.tab:hover{ color:var(--text); }
.tab:focus-visible{ outline:2px solid var(--accent); outline-offset:2px; border-radius:4px; }
.tab[aria-selected="true"]{ color:var(--text); }
.tab[aria-selected="true"]::after{
  content:""; position:absolute; left:12px; right:12px; bottom:-1px; height:2px;
  background:var(--accent); border-radius:2px;
}

.lock-btn{
  flex:0 0 auto; width:32px; height:32px; display:grid; place-items:center;
  border:1px solid var(--border); border-radius:8px; background:var(--surface);
  color:var(--text-dim); cursor:pointer; transition:color .15s, border-color .15s;
}
.lock-btn:hover{ color:var(--accent); border-color:var(--accent); }
.lock-btn:focus-visible{ outline:2px solid var(--accent); outline-offset:2px; }

.content{ padding:14px 20px 64px; width:100%; box-sizing:border-box; }
.panel-head{
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  flex-wrap:wrap; margin-bottom:14px;
}
.panel-head-titles{ display:flex; flex-direction:column; gap:2px; }
.panel-head h2{ margin:0; font-size:19px; font-weight:800; letter-spacing:-.01em; }
.panel-caption{
  font-family:var(--mono); font-size:11px; letter-spacing:.05em; text-transform:uppercase;
  color:var(--text-faint);
}
.panel-actions{ display:flex; gap:8px; flex-wrap:wrap; }

.btn{
  font-family:var(--sans); font-size:12.5px; font-weight:700; padding:7px 12px; border-radius:8px;
  cursor:pointer; border:1px solid var(--border); background:var(--surface); color:var(--text);
  transition:border-color .15s, color .15s, background .15s;
}
.btn:hover{ border-color:var(--accent); color:var(--accent); }
.btn:focus-visible{ outline:2px solid var(--accent); outline-offset:2px; }
.btn:disabled, .btn:disabled:hover{ opacity:.45; cursor:not-allowed; background:transparent; color:var(--text-dim); border-color:var(--border); }
.btn-accent{ background:var(--accent-soft); border-color:var(--accent); color:var(--accent); }
.btn-accent:hover{ background:var(--accent); color:#ffffff; }
.btn[aria-pressed="true"]{ background:var(--accent); border-color:var(--accent); color:#ffffff; }
.btn-danger{ background:var(--danger-soft); border-color:var(--danger); color:var(--danger); }
.btn-danger:hover{ background:var(--danger); color:#ffffff; }
[data-toggle-delete][aria-pressed="true"]{ background:var(--danger-soft); border-color:var(--danger); color:var(--danger); }

.stat-grid{
  display:grid; grid-template-columns:repeat(auto-fit, minmax(150px, 1fr)); gap:12px;
  margin-bottom:26px;
}
.stat-tile{ background:var(--surface); border:1px solid var(--border); border-radius:var(--radius); padding:16px; }
.stat-label{ font-size:11px; text-transform:uppercase; letter-spacing:.06em; color:var(--text-faint); margin-bottom:10px; }
.stat-value{ font-family:var(--mono); font-variant-numeric:tabular-nums; font-size:22px; font-weight:600; }
.stat-value.good{ color:var(--good); }
.stat-value.bad{ color:var(--danger); }

h3.sub-head{ font-size:13px; font-weight:700; margin:0 0 10px; color:var(--text-dim); text-transform:uppercase; letter-spacing:.04em; }

/* ---------- Spreadsheet-style tables: single line, centered headers,
   table spans the full available width, short columns shrink to content ---------- */
.table-wrap{ overflow-x:auto; border:1px solid var(--border); border-radius:8px; }
table{ width:100%; border-collapse:collapse; table-layout:auto; font-size:11px; }
thead th{
  position:sticky; top:0; text-align:center; padding:5px 4px; font-size:9.5px;
  text-transform:uppercase; letter-spacing:.03em; color:var(--text-faint); font-weight:700;
  background:var(--surface-2); border-bottom:1px solid var(--border);
  border-right:1px solid var(--border-soft); white-space:nowrap;
}
thead th:last-child{ border-right:none; }
.th-inner{ display:flex; align-items:center; justify-content:center; gap:2px; }
.th-caret{
  background:none; border:1px solid var(--border-soft); color:var(--text-faint); font-size:11px; line-height:1;
  padding:4px 5px; min-width:20px; min-height:20px; display:inline-flex; align-items:center;
  justify-content:center; cursor:pointer; border-radius:5px;
}
.th-caret:hover, .th-caret.active{ color:var(--accent); background:var(--accent-soft); border-color:var(--accent); }
tbody td{
  padding:5px 7px; color:var(--text); border-bottom:1px solid var(--border-soft);
  border-right:1px solid var(--border-soft); white-space:nowrap;
}
tbody td:last-child{ border-right:none; }
tbody tr:last-child td{ border-bottom:none; }
tbody tr:nth-child(even) td{ background:var(--zebra); }
tbody tr:hover td{ background:var(--accent-soft); }
tfoot td{
  position:sticky; bottom:0; padding:6px 7px; background:var(--surface-2); color:var(--text); font-weight:700;
  border-top:2px solid var(--border); border-right:1px solid var(--border-soft); white-space:nowrap;
}
tfoot td:last-child{ border-right:none; }
tfoot td:first-child{ font-family:var(--mono); font-size:10px; text-transform:uppercase; letter-spacing:.04em; color:var(--text-dim); }
td.num{ text-align:right; font-family:var(--mono); font-variant-numeric:tabular-nums; }
td.num.center{ text-align:center; }
th.col-narrow{ width:1%; }
.cell-id{ font-family:var(--mono); color:var(--text-dim); }

.tag{ display:inline-block; padding:2px 8px; border-radius:999px; font-size:10.5px; font-weight:600; white-space:nowrap; }
.tag-good{ background:var(--good-soft); color:var(--good); }
.tag-pending{ background:var(--accent-soft); color:var(--accent); }
.tag-bad{ background:var(--danger-soft); color:var(--danger); }
.tag-info{ background:rgba(74,127,212,.14); color:#4a7fd4; }
.tag-revisar{ background:#e8c23a; color:#3a2d00; font-weight:600; }
/* "Revisar" em qualquer coluna: a linha inteira fica amarela (padrão da planilha) */
tr.linha-revisar td{ background:rgba(232,194,58,.20) !important; }
tr.linha-revisar td:first-child{ box-shadow:inset 3px 0 0 #e8c23a; }
tr.linha-revisar:hover td{ background:rgba(232,194,58,.30) !important; }
/* Cobrança: atalhos "marcar todos do filtro" em cima da coluna Cobrança */
.cob-massa{ display:flex; gap:4px; justify-content:center; margin-bottom:4px; }
.cob-massa button{ font:inherit; font-size:11px; line-height:1; padding:4px 7px; border-radius:5px; border:1px solid currentColor; background:transparent; color:var(--accent); cursor:pointer; white-space:nowrap; }
.cob-massa button[data-cob-massa="5"]{ color:var(--good); }
.cob-massa button[data-cob-massa="2"], .cob-massa button[data-cob-massa="3"]{ color:#4a7fd4; }
.cob-massa button:disabled{ opacity:.35; cursor:not-allowed; }
.cob-massa button:not(:disabled):hover{ background:var(--accent-soft); }
th:has(> .cob-massa) .th-inner{ justify-content:center; }
.cob-massa-lista{ max-height:180px; overflow:auto; font-size:12px; margin:8px 0 0; padding:8px 10px; border-radius:6px; background:var(--accent-soft); }

/* ---------- Row inline editing ---------- */
.edit-armed tr:not(.row-editing){ cursor:pointer; }
.edit-armed tr:not(.row-editing):hover td{ outline:1px dashed var(--accent); outline-offset:-2px; }
/* linha inativa (excluída), só aparece com o botão "Inativos" ligado */
tr.linha-inativa td{ position:relative; color:var(--danger) !important; text-decoration:line-through; text-decoration-color:var(--danger); background:var(--danger-soft) !important; cursor:pointer; }
tr.linha-inativa td *{ color:var(--danger) !important; text-decoration:line-through; text-decoration-color:var(--danger); }
tr.linha-inativa td .tag{ background:transparent !important; }
/* risco vermelho contínuo de ponta a ponta, passando por todas as colunas (inclusive as vazias e as etiquetas) */
tr.linha-inativa td::after{ content:''; position:absolute; left:0; right:0; top:50%; border-top:1px solid var(--danger); pointer-events:none; }
tr.row-editing td{ background:var(--accent-soft) !important; }
.row-edit-input{
  width:100%; box-sizing:border-box; background:transparent; border:1px solid transparent;
  border-radius:3px; color:var(--text); font-family:var(--sans); font-size:11px; padding:0;
  margin:0; line-height:inherit; vertical-align:baseline;
}
select.row-edit-input{ -webkit-appearance:menulist; appearance:auto; }
.row-edit-input:focus-visible{ outline:1.5px solid var(--accent); outline-offset:1px; background:var(--bg); }
.row-edit-toolbar{
  position:fixed; z-index:260; display:flex; gap:6px; background:var(--surface-2); border:1px solid var(--border);
  border-radius:8px; padding:6px; box-shadow:0 10px 26px rgba(0,0,0,.12);
}

/* ---------- Column filter / sort popover (Excel-style) ---------- */
.col-filter-popover{
  position:fixed; z-index:300; background:var(--surface-2); border:1px solid var(--border);
  border-radius:8px; padding:10px; width:206px; max-height:300px; overflow-y:auto;
  box-shadow:0 14px 32px rgba(0,0,0,.14); font-family:var(--sans);
}
.cfp-sort-btn{
  display:block; width:100%; text-align:left; background:none; border:1px solid var(--border);
  color:var(--text); font-size:12px; font-family:var(--sans); padding:6px 8px; border-radius:6px;
  cursor:pointer; margin-bottom:5px;
}
.cfp-sort-btn:hover{ border-color:var(--accent); color:var(--accent); }
.cfp-divider{ height:1px; background:var(--border); margin:8px 0; }
.cfp-select-all{ display:flex; align-items:center; gap:6px; font-size:11.5px; color:var(--text-dim); font-weight:700; margin-bottom:6px; text-transform:uppercase; letter-spacing:.03em; }
.cfp-values{ max-height:140px; overflow-y:auto; }
.cfp-busca{
  display:block; width:100%; box-sizing:border-box; margin-bottom:8px; background:var(--bg); border:1px solid var(--border);
  color:var(--text); font-family:var(--sans); font-size:12.5px; padding:6px 8px; border-radius:6px;
}
.cfp-busca:focus-visible{ outline:2px solid var(--accent); outline-offset:1px; }
.cfp-nada{ font-size:12px; color:var(--text-faint); padding:3px 0; }
.cfp-value{ display:flex; align-items:center; gap:6px; font-size:12.5px; padding:3px 0; color:var(--text); }
.cfp-footer{ margin-top:8px; padding-top:8px; border-top:1px solid var(--border); }
.cfp-clear-col{ background:none; border:none; color:var(--text-faint); font-size:11px; text-decoration:underline; cursor:pointer; padding:0; }
.cfp-clear-col:hover{ color:var(--accent); }

/* ---------- Cobrança filter ---------- */
.filter-bar{ display:flex; align-items:end; gap:14px; flex-wrap:wrap; margin-bottom:16px; }
.filter-field{ display:flex; flex-direction:column; gap:5px; }
.filter-field label{ font-family:var(--mono); font-size:10.5px; letter-spacing:.05em; text-transform:uppercase; color:var(--text-faint); }
.filter-field input{
  background:var(--surface); border:1px solid var(--border); color:var(--text);
  font-family:var(--sans); font-size:13px; padding:8px 10px; border-radius:8px; min-width:220px;
}
.filter-field input::placeholder{ color:var(--text-faint); }
.filter-field input:focus-visible{ outline:2px solid var(--accent); outline-offset:1px; }
.filter-clear{
  background:none; border:1px solid var(--border); color:var(--text-dim); font-family:var(--sans);
  font-size:12px; font-weight:600; padding:8px 12px; border-radius:8px; cursor:pointer; transition:color .15s, border-color .15s;
}
.filter-clear:hover{ color:var(--accent); border-color:var(--accent); }
.filter-summary{
  font-family:var(--mono); font-size:11.5px; color:var(--text-dim); margin-bottom:10px;
}

/* ---------- Modals (cadastro / confirmar edição) ---------- */
.modal-backdrop{
  position:fixed; inset:0; background:rgba(25,22,18,.38); display:flex; align-items:center;
  justify-content:center; z-index:250; padding:20px;
}
.modal{
  background:var(--surface); border:1px solid var(--border); border-radius:14px; width:100%;
  max-width:460px; max-height:86vh; overflow-y:auto; padding:22px; box-shadow:0 20px 60px rgba(0,0,0,.16);
}
.modal-head{ display:flex; align-items:center; justify-content:space-between; margin-bottom:16px; }
.modal-head h3{ margin:0; font-size:17px; font-weight:800; }
.modal-close{ background:none; border:none; color:var(--text-dim); font-size:16px; cursor:pointer; line-height:1; padding:4px; }
.modal-close:hover{ color:var(--accent); }
.modal-field{ display:flex; flex-direction:column; gap:5px; margin-bottom:12px; }
.modal-field label{ font-family:var(--mono); font-size:10.5px; letter-spacing:.04em; text-transform:uppercase; color:var(--text-faint); }
.modal-field input, .modal-field select{
  background:var(--bg); border:1px solid var(--border); color:var(--text); font-family:var(--sans);
  font-size:13.5px; padding:8px 10px; border-radius:8px; width:100%; box-sizing:border-box;
}
.modal-field input:disabled{ color:var(--text-dim); }
.modal-field input:focus-visible, .modal-field select:focus-visible{ outline:2px solid var(--accent); outline-offset:1px; }
.modal-actions{ display:flex; justify-content:flex-end; gap:10px; margin-top:6px; padding-top:12px; border-top:1px solid var(--border); }
.modal-title-id{ font-family:var(--mono); font-size:13px; font-weight:600; color:var(--text-dim); margin-left:8px; }
.modal-field-topo{ display:flex; align-items:center; justify-content:space-between; gap:10px; min-height:22px; }
.modal-atalhos{ display:flex; align-items:center; justify-content:flex-end; gap:5px; min-width:0; }
.modal-atalho{
  flex:0 0 auto; background:var(--bg); border:1px solid var(--border); color:var(--text-dim);
  font-family:var(--mono); font-size:11px; font-weight:600; padding:2px 9px; border-radius:6px; cursor:pointer; line-height:1.5;
}
.modal-atalho:hover{ color:var(--text); border-color:var(--text-faint); }
.modal-atalho.ativo{ border-color:var(--accent); color:var(--accent); }
.modal-atalho-texto{ flex:0 1 auto; max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-family:var(--sans); }
.modal-field.modal-field-erro input, .modal-field.modal-field-erro select{ border-color:var(--danger); }
.campo-obrig{ color:var(--danger); font-weight:700; }
.modal-obrig-nota{ margin-top:6px; font-size:11.5px; color:var(--text-faint); }
.modal-previa{ margin-top:4px; padding:8px 10px; border:1px dashed var(--border); border-radius:8px; font-size:12.5px; color:var(--text-dim); }
.modal-erro-msg{ font-size:12px; color:var(--danger); font-weight:600; }
/* Inativar/Reativar: caixa do motivo */
.motivo-label{ display:block; margin-top:12px; font-family:var(--mono); font-size:10.5px; letter-spacing:.04em; text-transform:uppercase; color:var(--text-faint); }
.motivo-texto{ width:100%; box-sizing:border-box; margin-top:6px; padding:8px 10px; font:inherit; font-size:13px; color:var(--text); background:var(--bg); border:1px solid var(--border); border-radius:8px; resize:vertical; }
.motivo-texto:focus{ outline:none; border-color:var(--accent); }
.motivo-texto.motivo-erro{ border-color:var(--danger); }
/* campos numéricos sem as setinhas de aumentar/diminuir */
input[type=number]::-webkit-outer-spin-button, input[type=number]::-webkit-inner-spin-button{ -webkit-appearance:none; margin:0; }
input[type=number]{ -moz-appearance:textfield; appearance:textfield; }

.edit-diff{ display:flex; flex-direction:column; gap:8px; margin-bottom:6px; }
.edit-diff-row{ border:1px solid var(--border); border-radius:8px; padding:8px 10px; }
.edit-diff-label{ font-family:var(--mono); font-size:10.5px; text-transform:uppercase; letter-spacing:.04em; color:var(--text-faint); margin-bottom:4px; }
.edit-diff-values{ display:flex; align-items:center; gap:8px; font-size:13px; flex-wrap:wrap; }
.edit-diff-old{ color:var(--text-faint); text-decoration:line-through; }
.edit-diff-arrow{ color:var(--text-dim); }
.edit-diff-new{ color:var(--accent); font-weight:700; }
.edit-diff-empty{ font-size:13px; color:var(--text-dim); margin-bottom:6px; }

@media (max-width: 460px){
  .content{ padding:10px 14px 56px; }
  .filter-field input{ min-width:160px; }
}

/* ---------- Dev tab: exportar / modo manutenção ---------- */
.maint-banner{
  background:var(--danger-soft); color:var(--danger); border-bottom:1px solid var(--danger);
  font-family:var(--sans); font-size:12.5px; font-weight:700; text-align:center; padding:8px 12px;
}
.dev-block{
  border:1px solid var(--border); border-radius:var(--radius); padding:16px; margin-bottom:16px; background:var(--surface);
}
.dev-block:last-child{ margin-bottom:0; }
.dev-desc{ font-size:12.5px; color:var(--text-dim); margin:2px 0 12px; max-width:560px; line-height:1.5; }
.dev-export-formatos{ display:flex; flex-wrap:wrap; gap:6px; margin:0 0 8px; }
.dev-export-opcao{ position:relative; }
.dev-export-opcao input{ position:absolute; opacity:0; width:1px; height:1px; pointer-events:none; }
.dev-export-opcao span{ display:inline-block; padding:6px 12px; border:1px solid var(--border); border-radius:8px; font-size:12.5px; font-weight:600; color:var(--text-dim); background:var(--bg); cursor:pointer; transition:border-color .15s, color .15s, background .15s; }
.dev-export-opcao span:hover{ color:var(--text); }
.dev-export-opcao input:checked + span{ border-color:var(--accent); color:var(--accent); background:var(--accent-soft); }
.dev-export-opcao input:focus-visible + span{ outline:2px solid var(--accent); outline-offset:2px; }
.dev-export-dica{ font-size:12px; color:var(--text-faint); margin:0 0 12px; max-width:560px; line-height:1.5; }
.dev-export-acoes{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.dev-em-construcao{ margin-left:8px; font-family:var(--mono); font-size:10px; font-weight:600; text-transform:uppercase; letter-spacing:.06em; color:var(--accent); border:1px dashed var(--accent); border-radius:4px; padding:1px 6px; vertical-align:middle; }
.dev-export-status{ font-size:12px; color:var(--text-dim); }
.dev-export-status.erro{ color:var(--danger); }
#dev-backup-btn:disabled{ opacity:.55; cursor:progress; }
.dev-toggle-row{ display:flex; align-items:center; gap:10px; cursor:pointer; font-size:13px; font-weight:600; }
.dev-toggle{
  position:relative; width:40px; height:22px; border-radius:999px; background:var(--border);
  border:1px solid var(--border); flex:0 0 auto; transition:background .15s, border-color .15s;
}
.dev-toggle-knob{
  position:absolute; top:2px; left:2px; width:16px; height:16px; border-radius:50%; background:var(--text-dim);
  transition:transform .15s, background .15s;
}
.dev-toggle[aria-checked="true"]{ background:var(--danger-soft); border-color:var(--danger); }
.dev-toggle[aria-checked="true"] .dev-toggle-knob{ transform:translateX(18px); background:var(--danger); }
.dev-toggle:focus-visible{ outline:2px solid var(--accent); outline-offset:2px; }
/* listas simples (lixeira) */
.dev-changelog-list{ display:flex; flex-direction:column; gap:8px; }
.dev-changelog-item{
  border:1px solid var(--border-soft); border-radius:8px; padding:8px 10px; font-size:13px;
}
.dev-changelog-empty{ font-size:13px; color:var(--text-dim); }

/* modo manutenção: botões que alteram algo ficam apagados */
#app.maint-active [data-open-modal],
#app.maint-active [data-toggle-edit],
#app.maint-active [data-toggle-delete],
#app.maint-active [data-carga],
#app.maint-active #restore-ok,
#app.maint-active [data-user-toggle],
#app.maint-active [data-user-edit],
#app.maint-active [data-user-reset],
#app.maint-active #user-new-btn{
  opacity:.4; pointer-events:none;
}

.lixeira-item{ display:flex; align-items:center; justify-content:space-between; gap:10px; }
.lixeira-item-info{ min-width:0; }
.lixeira-item-title{ font-weight:700; font-size:13px; margin-bottom:2px; }
.lixeira-item-meta{ font-family:var(--mono); font-size:10.5px; color:var(--text-faint); text-transform:uppercase; letter-spacing:.03em; }
.delete-armed tr:not(.row-editing){ cursor:pointer; }
.delete-armed tr:not(.row-editing):hover td{ outline:1px dashed var(--danger); outline-offset:-2px; }
.delete-blocked-list{ margin:10px 0 0; padding-left:18px; font-size:13px; }
.delete-blocked-list li{ margin-bottom:4px; }

.valor-masked{ color:var(--danger); font-weight:700; }

.user-list{ display:flex; flex-direction:column; gap:8px; margin-top:14px; }
.user-row{
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  flex-wrap:wrap; padding:10px 12px; border:1px solid var(--border); border-radius:8px;
  background:var(--surface);
}
.user-row-main{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.user-row-name{ font-weight:700; font-size:13.5px; }
.user-row-criador{ font-weight:400; font-size:12px; color:var(--text-faint); }
.user-row-actions{ display:flex; gap:6px; flex-wrap:wrap; }
.user-flags-row{ display:flex; gap:18px; flex-wrap:wrap; margin-bottom:2px; }
.user-flag{
  display:inline-flex; align-items:center; gap:6px; font-family:var(--sans); font-size:13px;
  font-weight:500; text-transform:none; letter-spacing:normal; color:var(--text); cursor:pointer;
}
.user-flag input{ width:auto; flex:0 0 auto; margin:0; padding:0; accent-color:var(--accent); cursor:pointer; }
.perm-templates{ display:flex; gap:6px; flex-wrap:wrap; margin:10px 0 8px; }
.perm-table{ width:100%; border-collapse:collapse; font-size:12.5px; margin-bottom:4px; }
.perm-table th, .perm-table td{ padding:6px 8px; border-bottom:1px solid var(--border-soft); text-align:center; }
.perm-table th:first-child, .perm-table td:first-child{ text-align:left; }
.perm-table td.perm-na{ color:var(--text-faint); }
.perm-table th{ color:var(--text-faint); font-weight:600; text-transform:uppercase; font-size:10.5px; letter-spacing:.04em; }


/* ---------- + Novo pedido em lote (abas/pedido-lote.js) — layout enxuto ---------- */
.modal.modal-lote{ max-width:860px; max-height:92vh; }
.lote-comum{ display:grid; grid-template-columns:minmax(240px, 300px) 1fr; gap:16px; }
.lote-comum > *, .lote-item > *{ min-width:0; }
.lote-comum .modal-field-topo{ flex-wrap:nowrap; min-height:24px; }
.lote-comum .modal-field-topo label{ flex:0 0 auto; }
.lote-comum .modal-atalhos{ flex-wrap:nowrap; min-width:0; overflow:hidden; }
.lote-comum .modal-atalho-texto{ min-width:0; }
.lote-comum input{ background:var(--bg); border:1px solid var(--border); color:var(--text); font-family:var(--sans); font-size:13.5px; padding:8px 10px; border-radius:8px; width:100%; box-sizing:border-box; }
.lote-comum input:focus-visible{ outline:2px solid var(--accent); outline-offset:1px; }
.lote-erro-campo{ font-size:12px; color:var(--danger); font-weight:600; }
.modal-lote .modal-head{ gap:12px; }
.lote-contador{ margin-left:auto; margin-right:18px; font-family:var(--mono); font-size:13.5px; color:var(--text-dim); white-space:nowrap; }
.lote-contador b{ color:var(--text); font-weight:600; font-size:15px; }
.lote-cont-sep{ margin:0 6px; color:var(--text-faint); }
.lote-cont-item.lote-cont-passou, .lote-cont-item.lote-cont-passou b{ color:var(--danger); }
.lote-cont-item.lote-cont-cheio b{ color:var(--good); }
.lote-lista{ border:1px solid var(--border); border-radius:10px; overflow:hidden; margin-top:2px; }
.lote-cab, .lote-item{ display:grid; grid-template-columns:86px minmax(150px,1fr) 148px 104px 86px 22px; gap:8px; align-items:center; padding:4px 10px; }
.lote-cab{ background:var(--surface-2); font-family:var(--mono); font-size:10px; letter-spacing:.04em; text-transform:uppercase; color:var(--text-faint); padding-top:6px; padding-bottom:6px; }
.lote-dir{ text-align:right; }
.lote-item{ border-top:1px solid var(--border-soft); }
.lote-com-existentes > .lote-item:first-child{ border-top:1px dashed var(--accent); }
.lote-item input{ background:var(--bg); border:1px solid var(--border); color:var(--text); font-family:var(--sans); font-size:12.5px; padding:5px 8px; border-radius:6px; width:100%; box-sizing:border-box; }
.lote-item input:focus-visible{ outline:2px solid var(--accent); outline-offset:1px; }
.lote-item input.lote-campo-erro{ border-color:var(--danger); }
.lote-q{ display:flex; align-items:center; gap:3px; }
.lote-q input.lote-num{ flex:0 0 44px; width:44px; font-family:var(--mono); text-align:right; padding:5px 6px; }
.lote-chip{ flex:0 0 auto; font-family:var(--mono); font-size:10.5px; line-height:1.4; padding:2px 5px; border-radius:4px; border:1px solid var(--border); background:transparent; color:var(--text-faint); cursor:pointer; }
.lote-chip:hover{ color:var(--text); border-color:var(--text-faint); }
.lote-chip.ativo{ border-color:var(--accent); color:var(--accent); background:var(--accent-soft); }
.lote-id{ font-family:var(--mono); font-size:12px; color:var(--text-dim); white-space:nowrap; }
.lote-id small{ font-size:10.5px; color:var(--text-faint); }
.lote-novo .lote-id{ color:var(--accent); }
.lote-vazio .lote-id{ color:var(--text-faint); }
.lote-valor{ font-family:var(--mono); font-size:12px; text-align:right; white-space:nowrap; }
.lote-tirar, .lote-desfazer{ background:none; border:0; color:var(--text-faint); cursor:pointer; font-size:13px; padding:0; }
.lote-tirar:hover{ color:var(--danger); }
.lote-desfazer{ color:var(--accent); font-size:15px; }
.lote-msg{ grid-column:2 / -1; font-size:11.5px; font-weight:600; color:var(--danger); margin-top:-2px; }
.lote-msg:empty{ display:none; }
.lote-existente.lote-alterado{ box-shadow:inset 3px 0 0 var(--accent); background:var(--accent-soft); }
.lote-existente.lote-alterado .lote-id::after{ content:' ✎'; color:var(--accent); }
.lote-add{ display:flex; align-items:center; gap:10px; padding:7px 10px; border-top:1px solid var(--border-soft); }
.lote-add button{ background:none; border:1px dashed var(--border); color:var(--accent); font-family:var(--sans); font-weight:700; font-size:12px; border-radius:7px; padding:5px 10px; cursor:pointer; }
.lote-add span{ font-size:11px; color:var(--text-faint); }
.lote-alerta{ margin-top:12px; padding:9px 12px; border:1px solid rgba(217,105,95,.5); background:var(--danger-soft); color:var(--danger); border-radius:8px; font-size:12.5px; font-weight:700; }
.lote-rodape{ align-items:center; margin-top:14px; }
.lote-resumo{ margin-right:auto; font-family:var(--mono); font-size:12.5px; color:var(--text-dim); }
.lote-resumo b{ color:var(--text); }
@media (max-width:720px){
  .lote-comum{ grid-template-columns:1fr; }
  .lote-comum .modal-field-topo, .lote-comum .modal-atalhos{ flex-wrap:wrap; }
  .lote-contador{ margin-right:6px; font-size:12px; }
  .lote-contador b{ font-size:13px; }
  .lote-cab{ display:none; }
  .lote-item{ grid-template-columns:64px 1fr 1fr 22px; row-gap:5px; padding:6px 10px; }
  .lote-item .lote-id{ grid-row:1; grid-column:1; }
  .lote-item .lote-cli{ grid-row:1; grid-column:2 / 4; }
  .lote-item .lote-tirar, .lote-item .lote-desfazer{ grid-row:1; grid-column:4; }
  .lote-item > .lote-q:nth-of-type(2){ grid-row:2; grid-column:1 / 3; }
  .lote-item > .lote-q:nth-of-type(3){ grid-row:2; grid-column:3; }
  .lote-item .lote-valor{ grid-row:3; grid-column:2 / -1; text-align:left; }
  .lote-item .lote-msg{ grid-row:4; grid-column:1 / -1; }
  .lote-rodape{ flex-wrap:wrap; }
  .lote-resumo{ width:100%; }
}

/* ---------- 📦 Carga (abas/carga.js) ---------- */
.carga-filtro{ color:var(--text-dim); font-size:12px; }
.carga-lista{ max-height:200px; overflow:auto; font-size:12.5px; padding:8px 10px; border:1px solid var(--border); border-radius:8px; background:var(--bg); line-height:1.7; }
.carga-id{ font-family:var(--mono); color:var(--text-dim); }
.carga-atual{ font-family:var(--mono); font-size:10.5px; color:var(--accent); border:1px solid var(--accent); border-radius:4px; padding:0 5px; margin-left:4px; }
.carga-opcoes{ display:flex; flex-direction:column; gap:8px; margin:14px 0 6px; font-size:13px; }
.carga-opcoes label{ display:flex; align-items:center; gap:8px; cursor:pointer; }
.carga-num{ width:70px; background:var(--bg); border:1px solid var(--border); color:var(--text); font-family:var(--mono); font-size:13px; padding:4px 8px; border-radius:6px; }
.carga-aviso{ font-size:12px; color:var(--accent); margin:8px 0 0; }

/* coluna Perfume (aba Pedidos): "27/100  2/3" */
.perfume-parte{ font-family:var(--mono); font-variant-numeric:tabular-nums; }
.perfume-parte + .perfume-parte{ margin-left:1.4em; }
.perfume-passou{ color:var(--danger); font-weight:700; }

/* ---------- Nota do cliente (abas/notas.js) ---------- */
.nota-cel{ display:inline-block; max-width:260px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; vertical-align:middle; }
.nota-clicavel, .nota-vazia{ cursor:pointer; }
.nota-clicavel:hover{ color:var(--accent); }
.nota-vazia{ color:var(--text-faint); font-size:10.5px; border:1px dashed var(--border); border-radius:5px; padding:0 6px; }
.nota-vazia:hover{ color:var(--accent); border-color:var(--accent); }
.nota-quem{ font-family:var(--mono); font-size:12px; color:var(--text-dim); margin:-6px 0 8px; }
.nota-texto{ margin-top:0; min-height:120px; }

/* ---------- 1 clique (nucleo/rapido.js) ---------- */
.cel-rapida{ cursor:pointer; display:inline-block; border-radius:6px; }
.cel-rapida:hover .tag{ outline:1px solid var(--accent); }
.cel-rapida-vazia{ font-size:10.5px; color:var(--text-faint); border:1px dashed var(--border); border-radius:5px; padding:0 6px; }
.rapido-select{ background:var(--bg); border:1px solid var(--accent); color:var(--text); font-family:var(--sans); font-size:11.5px; padding:3px 6px; border-radius:6px; }

/* ---------- CONFIG > Listas: cartões por aba, lado a lado ---------- */
.listas-grupos{ display:grid; grid-template-columns:repeat(auto-fill, minmax(280px, 1fr)); gap:14px; align-items:start; }
.lista-grupo{ border:1px solid var(--border); border-radius:10px; background:var(--surface-2); padding:12px 14px; }
.lista-grupo-titulo{ margin:0 0 10px; font-family:var(--mono); font-size:11px; letter-spacing:.06em; text-transform:uppercase; color:var(--accent); }
.lista-bloco + .lista-bloco{ margin-top:14px; padding-top:12px; border-top:1px solid var(--border); }
.lista-bloco-topo{ display:flex; align-items:center; justify-content:space-between; margin-bottom:6px; font-size:13px; }
.lista-mais{ padding:3px 9px; font-size:11.5px; }
.lista-mini{ width:100%; border-collapse:collapse; font-size:12.5px; }
.lista-mini td{ padding:4px 6px; border-bottom:1px solid var(--border-soft); }
.lista-mini tr:last-child td{ border-bottom:none; }
.lista-cod{ width:28px; font-family:var(--mono); color:var(--text-dim); text-align:right; }
.lista-acoes{ width:56px; text-align:right; white-space:nowrap; }
.lista-acoes button{ background:none; border:1px solid transparent; color:var(--text-faint); cursor:pointer; font-size:13px; padding:1px 5px; border-radius:5px; }
.lista-acoes button:hover{ color:var(--accent); border-color:var(--border); }
.lista-inativa td{ color:var(--danger); text-decoration:line-through; }
.lista-inativa .lista-acoes button{ color:var(--accent); text-decoration:none; }
.lista-vazia{ color:var(--text-faint); font-style:italic; }

/* ---------- Aba CONTROLE (gerência) ---------- */
.ctl-filtros{ display:flex; flex-direction:column; gap:10px; padding:12px 14px; margin-bottom:14px; background:var(--surface); border:1px solid var(--border); border-radius:var(--radius); }
.ctl-grupo{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.ctl-rot{ font-family:var(--mono); font-size:10.5px; letter-spacing:.06em; text-transform:uppercase; color:var(--text-faint); min-width:68px; }
.ctl-seg{ display:inline-flex; border:1px solid var(--border); border-radius:8px; overflow:hidden; flex-wrap:wrap; }
.ctl-seg button{ font-family:var(--sans); font-size:12px; font-weight:700; padding:6px 11px; border:0; border-right:1px solid var(--border); background:transparent; color:var(--text-dim); cursor:pointer; }
.ctl-seg button:last-child{ border-right:0; }
.ctl-seg button:hover{ color:var(--accent); }
.ctl-seg button[aria-pressed="true"]{ background:var(--accent-soft); color:var(--accent); }
.ctl-seg button:focus-visible{ outline:2px solid var(--accent); outline-offset:-2px; }
.ctl-seg-peq button{ padding:4px 9px; font-size:11px; }
.ctl-data{ display:inline-flex; align-items:center; gap:6px; font-size:12px; color:var(--text-dim); }
.ctl-data input{ font-family:var(--mono); font-size:12px; padding:5px 8px; border-radius:8px; border:1px solid var(--border); background:var(--surface-2); color:var(--text); color-scheme:light; }
.ctl-chips{ display:flex; gap:6px; flex-wrap:wrap; }
.ctl-chip{ display:inline-flex; align-items:center; gap:6px; font-family:var(--sans); font-size:12px; font-weight:700; padding:5px 10px; border-radius:999px; border:1px solid var(--border); background:transparent; color:var(--text-dim); cursor:pointer; }
.ctl-chip:hover{ border-color:var(--accent); color:var(--text); }
.ctl-chip[aria-pressed="true"]{ border-color:var(--text-dim); background:var(--surface-2); color:var(--text); }
.ctl-chip-todos[aria-pressed="true"]{ border-color:var(--accent); background:var(--accent-soft); color:var(--accent); }
.ctl-chip-inativo{ opacity:.6; font-style:italic; }
.ctl-chip:focus-visible{ outline:2px solid var(--accent); outline-offset:2px; }
.ctl-ponto{ display:inline-block; width:9px; height:9px; border-radius:50%; flex:0 0 auto; margin-right:6px; vertical-align:middle; }
.ctl-chip .ctl-ponto{ margin-right:0; }
.ctl-cartoes{ display:grid; grid-template-columns:repeat(auto-fit, minmax(140px, 1fr)); gap:10px; margin-bottom:14px; }
.ctl-tile{ padding:12px 14px; }
.ctl-tile .stat-label{ margin-bottom:6px; }
.ctl-tile-valor{ font-size:22px; font-weight:700; letter-spacing:-.01em; }
.ctl-tile-nota{ font-size:10.5px; color:var(--text-faint); margin-top:4px; line-height:1.3; }
.ctl-card{ background:var(--surface); border:1px solid var(--border); border-radius:var(--radius); padding:14px 16px; margin-bottom:14px; min-width:0; }
.ctl-card-topo{ display:flex; justify-content:space-between; align-items:flex-start; gap:10px; flex-wrap:wrap; }
.ctl-card-acoes{ display:flex; gap:8px; align-items:center; flex-wrap:wrap; }
.ctl-btn-peq{ padding:4px 9px; font-size:11px; }
.ctl-tit{ margin:0; font-size:14px; font-weight:800; color:var(--text); }
.ctl-sub{ font-size:11.5px; color:var(--text-faint); margin:3px 0 8px; }
.ctl-grade2{ display:grid; grid-template-columns:repeat(auto-fit, minmax(min(380px, 100%), 1fr)); gap:14px; }
.ctl-grade2 > .ctl-card{ margin-bottom:14px; }
.ctl-graf{ width:100%; }
.ctl-svg{ display:block; overflow:visible; }
.ctl-grade{ stroke:var(--viz-grade); stroke-width:1; }
.ctl-eixo{ fill:#898781; font-family:var(--mono); font-size:10px; font-variant-numeric:tabular-nums; }
.ctl-mira{ stroke:#8a867e; stroke-width:1; }
.ctl-legenda{ display:flex; gap:14px; flex-wrap:wrap; margin:2px 0 6px; font-size:12px; color:var(--text-dim); }
.ctl-legenda:empty{ display:none; }
.ctl-leg{ display:inline-flex; align-items:center; gap:6px; }
.ctl-chave-linha{ display:inline-block; width:14px; height:2px; border-radius:1px; flex:0 0 auto; }
.ctl-dica{ position:fixed; z-index:60; pointer-events:none; background:#ffffff; border:1px solid var(--border); border-radius:8px; padding:8px 10px; font-size:12px; color:var(--text); box-shadow:0 6px 18px rgba(0,0,0,.12); max-width:280px; }
.ctl-dica-tit{ color:var(--text-faint); font-size:11px; margin-bottom:4px; }
.ctl-dica-linha{ display:flex; align-items:center; gap:8px; line-height:1.7; }
.ctl-dica-linha strong{ font-variant-numeric:tabular-nums; min-width:28px; }
.ctl-dica-linha span:last-child{ color:var(--text-dim); }
.ctl-mapa{ display:flex; flex-direction:column; gap:2px; }
.ctl-mapa-linha{ display:grid; grid-template-columns:34px repeat(24, minmax(0, 1fr)); gap:2px; align-items:center; }
.ctl-mapa-rot{ font-family:var(--mono); font-size:10px; color:#898781; }
.ctl-mapa-h{ font-family:var(--mono); font-size:9.5px; color:#898781; }
.ctl-cel{ display:block; height:18px; border-radius:3px; cursor:default; }
.ctl-cel:hover, .ctl-cel:focus-visible{ outline:2px solid var(--text-dim); outline-offset:0; }
.ctl-escala{ display:flex; align-items:center; gap:3px; margin-top:10px; font-size:11px; color:var(--text-faint); flex-wrap:wrap; }
.ctl-escala-cor{ display:inline-block; width:16px; height:10px; border-radius:2px; }
.ctl-escala-max{ margin-left:6px; }
.ctl-tabela-wrap{ overflow-x:auto; }
.ctl-rolagem{ max-height:340px; overflow-y:auto; }
.ctl-tabela{ width:100%; border-collapse:collapse; font-size:12px; }
.ctl-tabela th{ text-align:left; font-size:10.5px; text-transform:uppercase; letter-spacing:.04em; color:var(--text-faint); font-weight:600; padding:6px 8px; border-bottom:1px solid var(--border); white-space:nowrap; position:sticky; top:0; background:var(--surface); }
.ctl-tabela td{ padding:6px 8px; border-bottom:1px solid var(--border-soft); white-space:nowrap; }
.ctl-num{ font-family:var(--mono); font-variant-numeric:tabular-nums; text-align:right; }
.ctl-col-barra{ width:40%; min-width:80px; }
.ctl-barra{ display:block; height:8px; border-radius:0 4px 4px 0; background:var(--viz-1); }
.ctl-fraco{ color:var(--text-faint); }
.ctl-atualizado{ font-size:11px; font-family:var(--mono); align-self:center; }
.ctl-carregando .ctl-graf, .ctl-carregando .ctl-tabela-wrap, .ctl-carregando .ctl-cartoes, .ctl-carregando #ctl-mapa{ opacity:.55; transition:opacity .15s; }
@media (max-width:520px){ .ctl-grade2{ grid-template-columns:1fr; } .ctl-rot{ min-width:0; width:100%; } }

/* ---------- Número de cada aba (28/10/2026) ---------- */
.tab-num{ font-family:var(--mono); font-size:.86em; font-weight:500; color:var(--text-faint); letter-spacing:0; }
.tab[aria-selected="true"] .tab-num{ color:var(--accent); }

/* ---------- 99: Config — subabas ---------- */
.cfg-subabas{ display:flex; gap:0; flex-wrap:wrap; border:1px solid var(--border); border-radius:8px; overflow:hidden; width:max-content; max-width:100%; margin-bottom:16px; }
.cfg-subabas button{ font-family:var(--sans); font-size:12.5px; font-weight:700; padding:8px 14px; border:0; border-right:1px solid var(--border); background:var(--surface); color:var(--text-dim); cursor:pointer; }
.cfg-subabas button:last-child{ border-right:0; }
.cfg-subabas button:hover{ color:var(--accent); }
.cfg-subabas button[aria-selected="true"]{ background:var(--accent-soft); color:var(--accent); }
.cfg-subabas button:focus-visible{ outline:2px solid var(--accent); outline-offset:-2px; }
.cfg-subabas button[hidden]{ display:none; }

/* ---------- Controle: usuário marcado com o mesmo destaque do "Todos" (28/10/2026) ---------- */
.ctl-chip[aria-pressed="true"]{ border-color:var(--accent); background:var(--accent-soft); color:var(--accent); }

/* ---------- 10: Relatório (28/10/2026) ---------- */
.rel-select{ font-family:var(--sans); font-size:12px; padding:5px 8px; border-radius:8px; border:1px solid var(--border); background:var(--surface-2); color:var(--text); max-width:240px; color-scheme:light; }
.rel-resumo-filtro{ font-size:11.5px; color:var(--text-faint); }
.rel-resumo-filtro:empty{ display:none; }
.ctl-grade3{ display:grid; grid-template-columns:repeat(auto-fit, minmax(min(260px, 100%), 1fr)); gap:14px; }
.ctl-grade3 > .ctl-card{ margin-bottom:14px; }
.rel-barras{ display:flex; flex-direction:column; gap:7px; }
.rel-barra-linha{ display:grid; grid-template-columns:minmax(90px, 40%) 1fr 34px; gap:8px; align-items:center; font-size:12px; }
.rel-barra-nome{ white-space:nowrap; overflow:hidden; text-overflow:ellipsis; color:var(--text-dim); }
.rel-barra-trilho{ height:10px; }
.rel-barra-fill{ display:block; height:10px; border-radius:0 4px 4px 0; background:var(--viz-1); min-width:2px; }
.rel-barra-num{ font-family:var(--mono); font-variant-numeric:tabular-nums; text-align:right; color:var(--text); }
.rel-frasco{ display:inline-flex; align-items:center; gap:6px; }
.rel-frasco-trilho{ display:inline-block; width:54px; height:6px; border-radius:3px; background:var(--viz-trilho); overflow:hidden; vertical-align:middle; }
.rel-frasco-fill{ display:block; height:6px; background:var(--viz-1); }
.rel-frasco-cheio .rel-frasco-fill{ background:var(--danger); }
.rel-cad-grid{ display:grid; grid-template-columns:repeat(auto-fit, minmax(110px, 1fr)); gap:8px; margin-bottom:10px; }
.rel-cad-num{ background:var(--surface-2); border:1px solid var(--border-soft); border-radius:8px; padding:8px 10px; }
.rel-cad-num strong{ display:block; font-size:18px; }
.rel-cad-num span{ font-size:11px; color:var(--text-faint); }
.rel-vazio{ font-size:12px; color:var(--text-faint); padding:6px 0; }
.rel-coluna{ cursor:default; }
.rel-coluna:hover, .rel-coluna:focus{ opacity:.8; outline:none; }
.rel-lista .tag{ font-size:10px; }

/* ---------- Config › Usuários: tabela de permissões (28/10/2026) ---------- */
.usr-dica{ margin:12px 0 8px; }
.usr-tabela-wrap{ overflow-x:auto; border:1px solid var(--border); border-radius:8px; }
.usr-tabela{ border-collapse:separate; border-spacing:0; font-size:12px; width:max-content; min-width:100%; }
.usr-tabela th{ font-size:10px; text-transform:uppercase; letter-spacing:.04em; color:var(--text-faint); font-weight:600; padding:6px 8px; border-bottom:1px solid var(--border); white-space:nowrap; text-align:center; background:var(--surface); }
.usr-tabela th.usr-sub{ font-size:9.5px; padding:4px 6px; }
.usr-tabela td{ padding:5px 8px; border-bottom:1px solid var(--border-soft); white-space:nowrap; background:var(--bg); }
.usr-tabela tbody tr:nth-child(even) td{ background:var(--zebra); }
.usr-tabela tbody tr:hover td{ background:var(--surface-2); }
.usr-tabela .usr-grupo{ border-left:1px solid var(--border); }
.usr-fixa{ position:sticky; z-index:2; text-align:left !important; }
.usr-fixa-1{ left:0; min-width:38px; }
.usr-fixa-2{ left:38px; min-width:110px; border-right:1px solid var(--border); }
.usr-tabela thead .usr-fixa{ z-index:3; }
.usr-cel{ text-align:center; padding:3px 4px !important; }
.usr-check{ display:inline-grid; place-items:center; width:22px; height:22px; border-radius:6px; border:1px solid var(--border); background:transparent; color:var(--accent); font-size:13px; font-weight:800; line-height:1; padding:0; }
.usr-check.usr-on{ background:var(--accent-soft); border-color:var(--accent); }
.usr-clicavel{ cursor:pointer; }
.usr-clicavel:hover{ border-color:var(--accent); }
.usr-clicavel:focus-visible{ outline:2px solid var(--accent); outline-offset:1px; }
span.usr-check{ opacity:.55; }
.usr-acoes{ position:sticky; right:0; z-index:2; border-left:1px solid var(--border); }
.usr-acoes .btn{ margin-left:4px; }
.usr-acoes-th{ position:sticky; right:0; z-index:3; border-left:1px solid var(--border); }
.usr-inativo td{ color:var(--text-faint); }
.usr-inativo .usr-check{ opacity:.45; }

/* ---------- Relatório: calendário pequeno no filtro (28/10/2026) ---------- */
.rel-filtros{ flex-direction:row; align-items:flex-start; justify-content:space-between; gap:16px; flex-wrap:wrap; }
.rel-filtros-esq{ display:flex; flex-direction:column; gap:10px; flex:1 1 420px; min-width:0; }
.rel-cal{ flex:0 0 auto; margin-left:auto; width:178px; font-size:10.5px; }
.rel-cal-topo{ display:flex; align-items:center; justify-content:space-between; margin-bottom:4px; color:var(--text-dim); font-weight:700; text-transform:capitalize; }
.rel-cal-nav{ border:0; background:transparent; color:var(--text-dim); cursor:pointer; font-size:14px; line-height:1; padding:0 4px; }
.rel-cal-nav:hover{ color:var(--accent); }
.rel-cal-grade{ display:grid; grid-template-columns:repeat(7, 1fr); gap:2px; }
.rel-cal-sem{ text-align:center; color:var(--text-faint); font-family:var(--mono); font-size:9px; padding-bottom:2px; }
.rel-cal-dia{ position:relative; height:22px; border:1px solid transparent; border-radius:5px; background:transparent; color:var(--text-dim); font-family:var(--mono); font-size:10.5px; cursor:pointer; padding:0; }
.rel-cal-dia:hover{ border-color:var(--accent); color:var(--text); }
.rel-cal-dia:focus-visible{ outline:2px solid var(--accent); outline-offset:0; }
.rel-cal-tem{ color:var(--text); font-weight:700; }
.rel-cal-tem::after{ content:""; position:absolute; left:50%; bottom:2px; width:3px; height:3px; margin-left:-1.5px; border-radius:50%; background:var(--accent); }
.rel-cal-hoje{ border-color:var(--border); }
.rel-cal-sel{ background:var(--accent); border-color:var(--accent); color:#ffffff; }
.rel-cal-sel::after{ background:#ffffff; }
.rel-cal-futuro{ opacity:.45; }
@media (max-width:520px){ .rel-cal{ margin-left:0; } }
/* colunas fixas (ID, Usuário, Ações) com fundo sólido: o que rola por baixo não aparece */
.usr-tabela tbody td.usr-fixa, .usr-tabela tbody td.usr-acoes{ background:#ffffff !important; }
.usr-tabela tbody tr:nth-child(even) td.usr-fixa, .usr-tabela tbody tr:nth-child(even) td.usr-acoes{ background:var(--zebra) !important; }
.usr-tabela tbody tr:hover td.usr-fixa, .usr-tabela tbody tr:hover td.usr-acoes{ background:#efeee9 !important; }

/* ---------- Cobrança: Limpar ao lado do título, faixas de dívida e rankings (28/10/2026) ---------- */
.cob-head-esq{ display:flex; align-items:center; gap:12px; flex-wrap:wrap; }
.cob-head-esq .filter-clear{ padding:6px 11px; }
.cob-faixas{ display:inline-flex; border:1px solid var(--border); border-radius:8px; overflow:hidden; flex-wrap:wrap; }
.cob-faixas button{ font-family:var(--sans); font-size:12px; font-weight:700; padding:8px 10px; border:0; border-right:1px solid var(--border); background:var(--surface); color:var(--text-dim); cursor:pointer; white-space:nowrap; }
.cob-faixas button:last-child{ border-right:0; }
.cob-faixas button:hover{ color:var(--accent); }
.cob-faixas button[aria-pressed="true"]{ background:var(--accent-soft); color:var(--accent); }
.cob-faixas button:focus-visible{ outline:2px solid var(--accent); outline-offset:-2px; }
.cob-faixas-campo[hidden]{ display:none; }
.cob-rank-toggle{ margin-left:auto; }
.cob-rankings{ display:grid; grid-template-columns:repeat(auto-fit, minmax(min(230px, 100%), 1fr)); gap:10px; margin:-4px 0 14px; }
.cob-rankings[hidden]{ display:none; }
.cob-rank{ background:var(--surface); border:1px solid var(--border); border-radius:8px; padding:8px 10px; min-width:0; }
.cob-rank-tit{ font-size:11px; font-weight:800; text-transform:uppercase; letter-spacing:.04em; color:var(--text-dim); margin-bottom:4px; }
.cob-rank table{ width:100%; border-collapse:collapse; font-size:11px; table-layout:fixed; }
.cob-rank td{ padding:2px 0; border:0; background:transparent !important; white-space:nowrap; }
.cob-rank tr{ cursor:pointer; }
.cob-rank tr:hover td{ color:var(--accent); }
.cob-rank-pos{ width:18px; color:var(--text-faint); font-family:var(--mono); }
.cob-rank-nome{ overflow:hidden; text-overflow:ellipsis; padding-right:6px !important; }
.cob-rank-val{ width:84px; text-align:right; font-family:var(--mono); font-variant-numeric:tabular-nums; }
.cob-rank-vazio{ font-size:11px; color:var(--text-faint); padding:4px 0; }

/* rankings: linha separando as linhas; aparecem 5 e o resto (até 15) na rolagem (28/10/2026) */
.cob-rank-rolagem{ max-height:calc(5 * 22px); overflow-y:auto; scrollbar-width:thin; }
.cob-rank td{ height:21px; border-bottom:1px solid var(--border-soft) !important; }
.cob-rank tr:last-child td{ border-bottom:0 !important; }
.cob-massa-espera{ opacity:.6; }
.cob-massa button.cob-massa-espera:hover{ opacity:1; }
.usr-online{ font-size:10.5px; color:var(--good); margin-left:4px; white-space:nowrap; }


/* ---------- 28/10/2026: fundo branco, tabelas zebradas e cabeçalhos em negrito ---------- */
/* a página toda fica branca quando o sistema está aberto (o menu inicial continua como era) */
body.app-open{ background:#ffffff; }
/* cabeçalhos das tabelas: negrito e mais escuros */
thead th, .ctl-tabela th, .usr-tabela th, .painel-online-tabela th{ font-weight:800; color:var(--text-dim); }
thead th{ background:#efeee9; }
/* zebrado em todas as tabelas (linha sim, linha não) e destaque ao passar o mouse */
.ctl-tabela tbody tr:nth-child(even) td, .painel-online-tabela tbody tr:nth-child(even) td{ background:var(--zebra); }
.ctl-tabela tbody tr:hover td, .painel-online-tabela tbody tr:hover td{ background:var(--accent-soft); }
tbody tr:hover td{ background:#f1ead9; }
/* a linha "Revisar" continua amarela por cima do zebrado */
tr.linha-revisar td{ background:rgba(232,194,58,.28) !important; }


/* =====================================================================
   TEMA ESCURO (29/10/2026) — botão ☾/☀ ao lado da engrenagem.
   Padrão = escuro. O tema claro é o de cima; aqui só o que muda no escuro.
   O <html> recebe data-tema="escuro" ou "claro" (sistema/preferencias.js).
   ===================================================================== */
html[data-tema="escuro"] .cofre-scope{
  --bg:#000000;
  --surface:#0c0c0c;
  --surface-2:#141311;
  --border:#2a2826;
  --border-soft:#1c1b19;
  --text:#f2efe9;
  --text-dim:#a39e94;
  --text-faint:#6f6a62;
  --accent:#c9a15a;
  --accent-soft:rgba(201,161,90,.15);
  --danger:#e0756b;
  --danger-soft:rgba(217,105,95,.15);
  --good:#86b780;
  --good-soft:rgba(127,174,122,.15);
  --zebra:#121110;
  --viz-1:#3987e5;
  --viz-trilho:#1c2d45;
  --viz-grade:#262422;
  --viz-eixo:#4a4742;
  color-scheme:dark;
}
html[data-tema="escuro"] body.app-open{ background:#000000; }
html[data-tema="escuro"] thead th{ background:#171614; }
html[data-tema="escuro"] tbody tr:hover td{ background:#211d15; }
html[data-tema="escuro"] .painel-online-parado .online-dot,
html[data-tema="escuro"] .sync-status.sync-warn .sync-dot,
html[data-tema="escuro"] .online-pill-amarelo .online-dot{ background:#e0b23a; }
html[data-tema="escuro"] .painel-online-parado,
html[data-tema="escuro"] .sync-status.sync-warn #sync-status-text{ color:#e0b23a; }
html[data-tema="escuro"] .online-pill-amarelo{ border-color:#e0b23a; }
html[data-tema="escuro"] .sync-status.sync-paused .sync-dot{ box-shadow:0 0 0 2px rgba(255,255,255,.05); }
html[data-tema="escuro"] .aura-aviso,
html[data-tema="escuro"] .ctl-dica{ box-shadow:0 8px 24px rgba(0,0,0,.55); }
html[data-tema="escuro"] .aura-aviso-erro{ background:#2a1412; }
html[data-tema="escuro"] .aura-aviso-erro .aura-aviso-texto{ color:#ffd9d4; }
html[data-tema="escuro"] .btn-accent:hover,
html[data-tema="escuro"] .btn[aria-pressed="true"],
html[data-tema="escuro"] .rel-cal-sel{ color:#141310; }
html[data-tema="escuro"] .rel-cal-sel::after{ background:#141310; }
html[data-tema="escuro"] .btn-danger:hover{ color:#1a0f0d; }
html[data-tema="escuro"] .modal-backdrop{ background:rgba(0,0,0,.65); }
html[data-tema="escuro"] .modal{ box-shadow:0 20px 60px rgba(0,0,0,.6); }
html[data-tema="escuro"] .ctl-data input,
html[data-tema="escuro"] .rel-select{ color-scheme:dark; }
html[data-tema="escuro"] .ctl-dica{ background:#1a1917; }
html[data-tema="escuro"] .usr-tabela tbody td.usr-fixa,
html[data-tema="escuro"] .usr-tabela tbody td.usr-acoes{ background:#0c0c0c !important; }
html[data-tema="escuro"] .usr-tabela tbody tr:nth-child(even) td.usr-fixa,
html[data-tema="escuro"] .usr-tabela tbody tr:nth-child(even) td.usr-acoes{ background:var(--zebra) !important; }
html[data-tema="escuro"] .usr-tabela tbody tr:hover td.usr-fixa,
html[data-tema="escuro"] .usr-tabela tbody tr:hover td.usr-acoes{ background:#211d15 !important; }
html[data-tema="escuro"] tr.linha-revisar td{ background:rgba(232,194,58,.16) !important; }


/* ---------- 29/10/2026: ◐ tema e ⚙ Minhas configurações (sistema/preferencias.js) ---------- */
#tema-btn, #cfg-usuario-btn{ margin-left:6px; }
#lock-btn{ margin-left:6px; }
.pref-modal{ max-width:560px; }
.pref-secao{ padding:4px 0 10px; }
.pref-secao + .pref-secao{ border-top:1px solid var(--border); padding-top:12px; }
.pref-secao h4{ margin:10px 0 8px; font-size:12px; font-weight:800; letter-spacing:.04em; text-transform:uppercase; color:var(--text-dim); }
.pref-temas{ display:flex; gap:8px; }
.pref-dica{ margin:0 0 8px; font-size:12px; color:var(--text-dim); line-height:1.45; }
.pref-aviso-sql{ margin:0 0 10px; padding:8px 10px; border:1px solid var(--danger); border-radius:8px; color:var(--danger); font-size:12.5px; font-weight:600; }
.pref-colunas, .pref-salvas{ list-style:none; margin:0 0 8px; padding:0; border:1px solid var(--border); border-radius:8px; max-height:240px; overflow-y:auto; }
.pref-col, .pref-salva{ display:flex; align-items:center; gap:6px; padding:5px 8px; border-top:1px solid var(--border-soft); }
.pref-col:first-child, .pref-salva:first-child{ border-top:0; }
.pref-col:nth-child(even), .pref-salva:nth-child(even){ background:var(--zebra); }
.pref-col label{ flex:1; display:flex; align-items:center; gap:8px; cursor:pointer; font-size:13px; min-width:0; }
.pref-col label span{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.pref-col input[type=checkbox], .pref-fav-label input{ accent-color:var(--accent); width:15px; height:15px; margin:0; }
.pref-col-oculta label span{ color:var(--text-faint); text-decoration:line-through; }
.pref-mini{ flex:none; width:26px; height:24px; padding:0; border:1px solid var(--border); border-radius:6px; background:transparent; color:var(--text-dim); cursor:pointer; font-size:12px; }
.pref-mini:hover:not(:disabled){ color:var(--accent); border-color:var(--accent); }
.pref-mini:disabled{ opacity:.3; cursor:default; }
.pref-linha{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin-bottom:6px; }
.pref-input{ flex:1 1 180px; min-width:0; background:var(--bg); border:1px solid var(--border); color:var(--text); font:inherit; font-size:13px; padding:7px 10px; border-radius:8px; }
.pref-input:focus-visible{ outline:2px solid var(--accent); outline-offset:1px; }
.pref-fav-label{ display:flex; align-items:center; gap:6px; font-size:12.5px; color:var(--text-dim); cursor:pointer; white-space:nowrap; }
.pref-btn-p{ padding:4px 9px; font-size:12px; }
.pref-salva-nome{ flex:1; min-width:0; font-size:13px; font-weight:600; overflow:hidden; text-overflow:ellipsis; }
.pref-salva-nome small{ display:block; font-weight:400; font-size:11px; color:var(--text-faint); }
.pref-salva-fav .pref-salva-nome{ color:var(--accent); }
.pref-estrela{ flex:none; width:28px; height:28px; border:none; background:none; cursor:pointer; font-size:18px; line-height:1; color:var(--text-faint); padding:0; }
.pref-estrela[aria-pressed="true"]{ color:var(--accent); }
.pref-estrela:hover{ color:var(--accent); }
.pref-vazio{ padding:10px; font-size:12.5px; color:var(--text-faint); }
@media (max-width:560px){
  .pref-salva{ flex-wrap:wrap; }
  .pref-salva-nome{ flex-basis:calc(100% - 40px); }
}


/* ---------- 29/10/2026: Cobrança — "Mudar todos os filtrados" (lista) e 🖨 Relatório ao lado de Rankings ---------- */
.cob-massa-campo[hidden]{ display:none; }
.cob-massa-wrap{ position:relative; }
.cob-massa-btn{ white-space:nowrap; }
.cob-massa-btn.cob-massa-espera{ opacity:.6; }
.cob-massa-btn.cob-massa-espera:hover{ opacity:1; }
.cob-massa-menu{ position:absolute; z-index:40; top:calc(100% + 4px); left:0; min-width:220px; max-height:320px; overflow-y:auto;
  background:var(--surface); border:1px solid var(--border); border-radius:8px; padding:4px; box-shadow:0 10px 26px rgba(0,0,0,.18); }
html[data-tema="escuro"] .cob-massa-menu{ box-shadow:0 10px 26px rgba(0,0,0,.55); }
.cob-massa-menu-tit{ font-size:11px; color:var(--text-faint); padding:6px 8px 4px; }
.cob-massa-menu button{ display:flex; width:100%; align-items:baseline; justify-content:space-between; gap:10px; text-align:left; font:inherit; font-size:13px;
  padding:7px 8px; border:0; border-radius:6px; background:none; color:var(--text); cursor:pointer; }
.cob-massa-menu button:hover, .cob-massa-menu button:focus-visible{ background:var(--accent-soft); color:var(--accent); outline:none; }
.cob-massa-menu button small{ font-size:11px; color:var(--text-faint); }
.cob-direita{ margin-left:auto; display:flex; gap:8px; align-items:center; }
.cob-direita .cob-rank-toggle{ margin-left:0; }
#desfazer-btn{ margin-left:6px; }
#desfazer-btn:disabled{ opacity:.35; cursor:default; }
#desfazer-btn:disabled:hover{ color:var(--text-dim); border-color:var(--border); }
#desfazer-btn:not(:disabled){ color:var(--accent); border-color:var(--accent); }
.usr-acesso{ font-size:12px; white-space:nowrap; }
.usr-acesso small{ display:block; font-size:11px; color:var(--text-faint); }
.usr-acesso-vazio{ color:var(--text-faint); }
/* Cobrança: cabe tudo numa linha em telas de ~1500px (Cliente/Produto um pouco mais estreitos; faixas mais compactas) */
[data-panel="cobranca"] .filter-bar{ gap:10px; }
#filtro-cliente, #filtro-produto{ min-width:170px; width:170px; }
.cob-faixas button{ padding:8px 8px; }

/* (29/10/2026) ambiente de TESTE: tarja no topo (só aparece fora do aqnx.com.br, com banco de teste separado) */
.aura-tarja-teste{
  position:sticky; top:0; z-index:300; text-align:center; padding:4px 8px;
  background:#b3261e; color:#fff; font:600 12px/1.4 system-ui, sans-serif; letter-spacing:.04em;
}