/* =====================================================================
   Painel Seller Pulse — estilo (cores, tamanhos e layout, inclusive celular)
   ===================================================================== */
:root{
  color-scheme:dark;
  --bg:#0a1020;--superficie:#111a2e;--superficie-2:#0d1527;--ink:#f3f6fc;--muted:#9aa8c2;--line:#22304a;
  --accent:#ff7a1a;--good:#22c55e;--warn:#f5b73b;--bad:#f43f5e;--ads:#a855f7;
  --azul:#3b82f6;--verde:#22c55e;--laranja:#ff8a1f;--roxo:#a855f7;--vermelho:#f43f5e;--ciano:#06b6d4;--ambar:#f59e0b;--rosa:#ec4899;--teal:#14b8a6;
  --raio:16px;
}
[hidden]{display:none!important}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:radial-gradient(1200px 600px at 10% -10%,#16213d 0,transparent 60%),var(--bg);color:var(--ink);font:14px/1.5 Inter,system-ui,-apple-system,"Segoe UI",sans-serif}
button,a,input,select{font:inherit}
button{cursor:pointer}
a{color:inherit}
svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:0 0 auto}
input,select{background:var(--superficie-2);border:1px solid #2b3a57;border-radius:10px;padding:9px 11px;color:var(--ink);max-width:100%}
input:focus,select:focus,button:focus-visible,a:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.msg{color:var(--muted);margin:0}
.ok{color:var(--good)}.neg,.critico{color:var(--bad)}.atencao{color:var(--warn)}
.linha{display:flex;gap:8px;align-items:center;flex-wrap:wrap}

/* ---------- botões ---------- */
.btn{display:inline-flex;align-items:center;gap:8px;border:1px solid #33435f;background:#18233b;color:var(--ink);border-radius:10px;padding:9px 14px;font-weight:600;text-decoration:none;white-space:nowrap}
.btn:hover{border-color:var(--accent);background:#1e2b47}
.btn:disabled{opacity:.55;cursor:not-allowed}
.btn.primary{background:linear-gradient(135deg,#ff9a3c,#ff6a00);border-color:transparent;color:#1a0e02}
.btn.primary:hover{filter:brightness(1.06)}
.icone{display:grid;place-items:center;width:42px;height:42px;border-radius:50%;border:1px solid #2b3a57;background:var(--superficie);color:var(--ink)}
.icone:hover{border-color:var(--accent)}
.link{color:var(--accent);text-decoration:none;font-weight:600}
.link-alerta{background:none;border:0;color:var(--warn);font-weight:700;cursor:pointer;padding:0;text-decoration:underline}
.link-alerta:disabled{color:var(--muted);text-decoration:none;cursor:default}

/* ---------- barra do topo ---------- */
.barra-topo{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:18px;padding:12px 28px;background:rgba(10,16,32,.88);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.brand{display:flex;gap:10px;align-items:center;flex:0 0 auto}
.mark{display:grid;place-items:center;width:42px;height:42px;border-radius:12px;background:linear-gradient(135deg,#ff9a3c,#ff5e00);color:#1a0e02;font-weight:800;font-size:16px;overflow:hidden}
.brand strong{display:block;font-size:20px;font-weight:800;letter-spacing:-.4px;line-height:1.1}
.brand small{display:block;color:var(--muted);font-size:11px}
.nav{display:flex;gap:4px;flex:1 1 auto;min-width:0;overflow-x:auto;scrollbar-width:none}
.nav::-webkit-scrollbar{display:none}
.nav a{display:flex;align-items:center;gap:8px;flex:0 0 auto;text-decoration:none;padding:9px 13px;border-radius:10px;color:#b9c5db;font-weight:600}
.nav a:hover{background:#18233b;color:var(--ink)}
.nav a.active{background:linear-gradient(135deg,#ff9a3c,#ff6a00);color:#1a0e02}
.topo-direita{display:flex;align-items:center;gap:10px;flex:0 0 auto}
.status-loja{display:flex;align-items:center;gap:10px;border:1px solid var(--line);border-radius:12px;padding:6px 12px;background:var(--superficie);max-width:270px}
.status-loja b{display:block;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.status-loja small{display:block;color:var(--muted);font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.status-loja .ponto{width:10px;height:10px;border-radius:50%;background:var(--muted);flex:0 0 auto}
.status-loja.ativa .ponto{background:var(--good);box-shadow:0 0 0 4px #22c55e22}
.status-loja.reconectar,.status-loja.desconectada{border-color:var(--warn);cursor:pointer}
.status-loja.reconectar .ponto,.status-loja.desconectada .ponto{background:var(--warn)}
.conta{position:relative}
.conta-botao{display:flex;align-items:center;gap:8px;background:none;border:0;color:var(--ink);font-weight:600;padding:4px}
.avatar{display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:linear-gradient(135deg,#ffb366,#ff6a00);color:#1a0e02;font-weight:800;font-size:13px}
.conta-menu{position:absolute;right:0;top:calc(100% + 8px);min-width:240px;background:var(--superficie);border:1px solid var(--line);border-radius:12px;padding:8px;display:flex;flex-direction:column;box-shadow:0 18px 40px #0008}
.conta-menu small{color:var(--muted);padding:6px 10px;overflow-wrap:anywhere}
.conta-menu a{padding:9px 10px;border-radius:8px;text-decoration:none;font-weight:600}
.conta-menu a:hover{background:#1b2742}

/* ---------- conteúdo ---------- */
.main{padding:22px 28px 48px}
.wrap{max-width:1680px;margin:0 auto;display:flex;flex-direction:column;gap:18px}
.cabecalho{display:flex;gap:16px;flex-wrap:wrap;align-items:flex-end;justify-content:space-between}
.cabecalho h1{margin:0;font-size:30px;font-weight:800;letter-spacing:-.6px}
.cabecalho p{margin:2px 0 0;color:var(--muted)}
.header-controls{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.periodo{display:flex;gap:14px;align-items:center;flex-wrap:wrap;justify-content:space-between}
.period-bar{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.chip{border:1px solid var(--line);background:var(--superficie);border-radius:999px;padding:7px 14px;color:#d6dff0;font-weight:600}
.chip:hover{border-color:#3b4d6e}
.chip.on{background:linear-gradient(135deg,#ff9a3c,#ff6a00);border-color:transparent;color:#1a0e02}
.panel{background:linear-gradient(180deg,#131d33,#0f182b);border:1px solid var(--line);border-radius:var(--raio);padding:20px;display:flex;flex-direction:column;gap:12px;min-width:0;box-shadow:0 10px 30px #0003}
.panel h2{margin:0;display:flex;align-items:center;gap:10px;font-size:18px;font-weight:700}
.panel h2 svg{color:var(--accent);width:20px;height:20px}
.titulo-painel{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}
.caixa{border:1px solid var(--line);border-radius:12px;padding:14px;background:var(--superficie-2)}
.aviso{margin:0;padding:12px 14px;border:1px solid var(--warn);border-radius:12px;color:var(--warn);background:#2a2412;transition:opacity .6s}
.aviso.sucesso{border-color:var(--good);color:var(--good);background:#0f2a20}
.aviso.sumindo{opacity:0}
.progresso{display:flex;flex-direction:column;gap:8px}
.barra{height:10px;background:var(--superficie-2);border:1px solid var(--line);border-radius:99px;overflow:hidden}
.barra>div{height:100%;width:0;background:var(--accent);transition:width .4s}

/* ---------- cards ---------- */
.kpis{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:14px}
.kpi{--c:var(--azul);position:relative;border-radius:var(--raio);padding:16px 16px 14px;min-width:0;border:1px solid color-mix(in srgb,var(--c) 55%,transparent);
  background:linear-gradient(150deg,color-mix(in srgb,var(--c) 26%,#0f172a),color-mix(in srgb,var(--c) 9%,#0d1426) 70%);box-shadow:0 10px 28px #0003}
.kpi .topo-kpi{display:flex;align-items:center;gap:10px;font-weight:600;font-size:13.5px;color:#e6ecf8}
.kpi .icone-kpi{display:grid;place-items:center;width:32px;height:32px;border-radius:9px;background:var(--c);color:#fff;flex:0 0 auto}
.kpi .icone-kpi svg{width:17px;height:17px;stroke-width:2}
.kpi b{display:block;font-size:clamp(20px,1.7vw,27px);font-weight:800;letter-spacing:-.5px;margin:12px 0 6px;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.kpi small{display:block;color:#b8c4da;font-size:12px;line-height:1.45}
.kpi .sobe{color:#4ade80;font-weight:700}.kpi .desce{color:#fb7185;font-weight:700}
.kpi.destaque{box-shadow:0 0 0 2px var(--c),0 14px 34px #0005}
.kpi.verde{--c:var(--verde)}.kpi.azul{--c:var(--azul)}.kpi.laranja{--c:var(--laranja)}.kpi.roxo{--c:var(--roxo)}.kpi.vermelho{--c:var(--vermelho)}
.kpi.ciano{--c:var(--ciano)}.kpi.ambar{--c:var(--ambar)}.kpi.rosa{--c:var(--rosa)}.kpi.teal{--c:var(--teal)}

/* ---------- gráfico + rosca ---------- */
.grade-2{display:grid;grid-template-columns:minmax(0,1.75fr) minmax(320px,1fr);gap:18px}
.legenda{display:flex;gap:14px;flex-wrap:wrap;color:#c8d3e8;font-size:13px}
.legenda span{display:flex;align-items:center;gap:6px}
.legenda i{width:10px;height:10px;border-radius:50%;display:inline-block}
.grafico-area{position:relative;min-height:260px}
.grafico-area svg{width:100%;height:auto;display:block;stroke:none}
.grafico-area svg text{fill:var(--muted);font:11px Inter,system-ui,sans-serif}
.dica{position:absolute;pointer-events:none;background:#0b1325;border:1px solid #2f3f5f;border-radius:10px;padding:8px 10px;font-size:12px;box-shadow:0 10px 24px #0007;white-space:nowrap;transform:translate(-50%,-110%)}
.dica b{display:block;margin-bottom:2px}
.rosca{display:flex;align-items:center;gap:18px;flex-wrap:wrap;justify-content:center}
.rosca svg{width:210px;height:210px;stroke:none}
.rosca .centro{font-weight:800;font-size:17px;fill:var(--ink)}
.rosca .centro-sub{fill:var(--muted);font-size:11px}
.lista-rosca{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:9px;min-width:230px;flex:1}
.lista-rosca li{display:grid;grid-template-columns:12px 1fr auto auto;gap:10px;align-items:center;font-size:13px}
.lista-rosca i{width:12px;height:12px;border-radius:4px}
.lista-rosca .pct{color:var(--muted);font-variant-numeric:tabular-nums}
.lista-rosca .val{font-weight:600;font-variant-numeric:tabular-nums;text-align:right}

/* ---------- tabelas ---------- */
.scroll{overflow-x:auto;max-width:100%}
.tabela{border-collapse:collapse;width:100%;font-size:12.5px}
.tabela th,.tabela td{padding:9px 6px;border-bottom:1px solid var(--line);text-align:right;white-space:nowrap}
.tabela th{font-size:11.5px;color:#9fb0cc;font-weight:600;cursor:pointer;position:sticky;top:0;background:#111a2e}
.tabela td{font-variant-numeric:tabular-nums}
.tabela td:first-child,.tabela th:first-child{text-align:left;white-space:normal}
.tabela tr:hover td{background:#ffffff05}
.filtros{margin:-2px 0 2px}
#tb td:first-child{min-width:230px;max-width:320px}
.anuncio{display:flex;gap:10px;align-items:center}
.anuncio img,.anuncio .sem-foto{width:40px;height:40px;border-radius:8px;object-fit:cover;background:#fff;flex:0 0 auto}
.anuncio .sem-foto{display:grid;place-items:center;background:#1b2742;color:var(--muted);font-weight:700;font-size:11px}
.anuncio span{display:block;line-height:1.3}
.anuncio small{color:var(--muted);font-size:11px}
.selo{display:inline-block;min-width:54px;text-align:center;padding:3px 8px;border-radius:999px;font-weight:700;font-size:12px}
.selo.verde{background:#14532d;color:#86efac}.selo.amarelo{background:#4d3b0a;color:#fde68a}.selo.laranja{background:#4a2508;color:#fdba74}
.selo.vermelho{background:#4c0f1d;color:#fda4af}.selo.sem_dados{background:#1e293b;color:#94a3b8}
.lucro-final{font-weight:700}
.tabela td input{width:78px;text-align:right;padding:6px 7px}
td input.sem-custo{border-color:var(--warn);background:#2a2412}
td input.salvo{border-color:var(--good)}
.mini{display:block;color:var(--muted);font-size:10.5px}
.rolagem-topo{overflow-x:auto;overflow-y:hidden;height:14px;margin-bottom:2px;scrollbar-color:var(--accent) var(--superficie-2)}
.rolagem-topo>div{height:1px}
.rolagem-topo::-webkit-scrollbar{height:12px}
.rolagem-topo::-webkit-scrollbar-track{background:var(--superficie-2);border-radius:99px}
.rolagem-topo::-webkit-scrollbar-thumb{background:var(--accent);border-radius:99px}

/* ---------- configurações ---------- */
.grade-config{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:18px;scroll-margin-top:90px}
.grade-config .panel{gap:10px}
.grade-config .panel>.btn{align-self:flex-start}
.campo-nf{display:flex;gap:8px;align-items:center}
.campo-nf input{flex:1;font-size:18px;font-weight:700;padding:10px 12px}
.campo-nf span{color:var(--muted);font-weight:700}
.form-seg{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.form-seg #seg-descricao{grid-column:1/-1}
.form-seg .btn{grid-column:1/-1;justify-content:center}
.lista-simples{display:flex;flex-direction:column;gap:6px;margin:0;padding:0;list-style:none}
.lista-simples li{display:flex;justify-content:space-between;gap:8px;align-items:center;border-bottom:1px solid var(--line);padding:6px 0}
.fiscal-controls{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
section[id],div.panel[id]{scroll-margin-top:90px}

/* ---------- telas menores ---------- */
@media(max-width:1300px){.kpis{grid-template-columns:repeat(4,minmax(0,1fr))}.status-loja{max-width:200px}}
@media(max-width:1100px){.grade-2{grid-template-columns:1fr}.kpis{grid-template-columns:repeat(3,minmax(0,1fr))}#conta-nome{display:none}}
@media(max-width:850px){
  .barra-topo{position:static;flex-wrap:wrap;padding:12px 14px;gap:10px}
  .nav{order:3;flex-basis:100%}
  .topo-direita{margin-left:auto}
  .status-loja{max-width:170px}
  .main{padding:16px 14px 40px}
  .kpis{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .cabecalho h1{font-size:25px}
  .header-controls{width:100%}.header-controls select{flex:1 1 100%;min-width:0}
}
@media(max-width:480px){
  .brand small{display:none}
  .status-loja{display:none}
  .kpi{padding:12px}.kpi b{font-size:19px}
  .panel{padding:14px}
  .rosca svg{width:180px;height:180px}
}

/* ajustes finos de largura (notebook 1366px) */
.grade-2{align-items:start}
.rosca{flex-wrap:nowrap;justify-content:flex-start}
.rosca svg{width:180px;height:180px;flex:0 0 auto}
.lista-rosca{min-width:0}
.lista-rosca li{grid-template-columns:12px minmax(0,1fr) auto auto;gap:8px}
#conta-nome{max-width:150px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
@media(max-width:1500px){.brand small{display:none}.status-loja{max-width:215px}.nav a{padding:8px 10px;gap:6px}.barra-topo{gap:12px;padding:12px 20px}}
@media(max-width:1400px){.nav a svg{display:none}}
@media(max-width:1100px){.rosca{flex-wrap:wrap;justify-content:center}}
@media(max-width:480px){.rosca svg{width:170px;height:170px}}
.form-seg input{width:100%;min-width:0}
/* 13 cards: 7 por linha em telas bem largas, para caber em 2 linhas */
@media(min-width:1700px){.kpis{grid-template-columns:repeat(6,minmax(0,1fr))}}
#fatura-lista{overflow-x:auto}#fatura-lista .tabela{width:100%;min-width:0;table-layout:fixed;font-size:12.5px}
#fatura-lista .tabela td,#fatura-lista .tabela th{text-align:right;padding:8px 4px;white-space:normal;word-break:break-word}
#fatura-lista .tabela td:first-child,#fatura-lista .tabela th:first-child{text-align:left}
/* ---------- área do proprietário ---------- */
.tabela-dono td,.tabela-dono th{text-align:left;white-space:normal;vertical-align:top}
.tabela-dono td div+div{margin-top:4px}
.selo-dono{display:inline-block;margin-left:6px;padding:1px 8px;border-radius:99px;background:#ff7a1a22;color:var(--accent);font-size:11px;font-weight:700}
@media(min-width:1101px){.wrap>.kpis#totais{grid-template-columns:repeat(6,minmax(0,1fr))}}
@media(max-width:700px){
 .tabela-dono,.tabela-dono tbody,.tabela-dono tr,.tabela-dono td{display:block;width:100%}
 .tabela-dono tr.cab{display:none}
 .tabela-dono tr{border:1px solid var(--line);border-radius:12px;padding:10px 12px;margin-bottom:10px;background:var(--superficie-2)}
 .tabela-dono td{border:0;padding:4px 0}
 .tabela-dono td[data-rotulo]::before{content:attr(data-rotulo);display:block;font-size:11px;color:var(--muted);font-weight:600}
 .tabela-dono td:first-child::before{display:none}
}

.fatura-linhas{font-size:12.5px;color:var(--muted)}.fatura-linhas ul{margin:6px 0 0;padding-left:18px}

/* ---------- topo em DUAS linhas (pedido do lojista): marca + loja + conta em cima; abas embaixo,
   na largura toda, com espaço para as abas que vierem (Financeiro e futuras) ---------- */
.barra-topo{flex-wrap:wrap;row-gap:10px;padding-bottom:0}
.barra-topo .topo-direita{margin-left:auto}
.barra-topo .nav{order:3;flex:1 0 100%;padding:6px 0 8px;border-top:1px solid var(--line);margin:0 -4px}
.barra-topo .nav a{padding:8px 12px;gap:7px}
@media(max-width:1400px){.nav a svg{display:inline-block}}   /* agora cabe: ícones voltam */
@media(max-width:1500px){.brand small{display:block}}
@media(max-width:850px){.barra-topo{padding-bottom:0}.barra-topo .nav{margin:0}}

/* ---------- Financeiro → Contas a pagar ---------- */
body.modo-financeiro .wrap > :not(.cabecalho):not(#financeiro):not(#sync-status-panel):not(dialog){display:none!important}
body.modo-curva .wrap > :not(.cabecalho):not(.periodo):not(#curva):not(#sync-status-panel):not(dialog){display:none!important}
body.modo-promocoes .wrap > :not(.cabecalho):not(.periodo):not(#promocoes):not(#sync-status-panel):not(dialog){display:none!important}
body.modo-ads .wrap > :not(.cabecalho):not(.periodo):not(#ads-controle):not(#sync-status-panel):not(dialog){display:none!important}
#financeiro{display:flex;flex-direction:column;gap:16px}
#financeiro[hidden]{display:none!important}
.fin-topo{display:flex;justify-content:space-between;align-items:flex-end;gap:14px;flex-wrap:wrap}
.fin-topo h2{margin:0;font-size:22px}
.fin-acoes{display:flex;gap:8px;flex-wrap:wrap}
.btn.primary{background:linear-gradient(135deg,#ff9a3c,#ff6a00);color:#1a0e02;border-color:transparent}
.fin-mes{display:flex;align-items:center;gap:10px}
.fin-mes label{color:var(--muted);font-weight:600}
.fin-cards{grid-template-columns:repeat(4,minmax(0,1fr))!important}
.fin-filtros{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.fin-filtros input[type=search]{flex:1 1 280px}
.fin-filtros label{display:flex;gap:6px;align-items:center;color:var(--muted);font-size:13px}
.fin-abas{display:flex;gap:6px;flex-wrap:wrap;border-bottom:1px solid var(--line);padding-bottom:8px}
.fin-abas button{display:flex;align-items:center;gap:7px;background:none;border:1px solid transparent;color:#b9c5db;padding:7px 12px;border-radius:10px;font-weight:600;cursor:pointer}
.fin-abas button span{background:#1b2742;border-radius:99px;padding:0 8px;font-size:12px;color:var(--ink)}
.fin-abas button i{width:8px;height:8px;border-radius:50%;display:inline-block}
.fin-abas button.on{border-color:var(--accent);color:var(--ink);background:#1b2742}
.tabela-fin td,.tabela-fin th{text-align:left;white-space:normal;vertical-align:top}
.tabela-fin td:nth-child(6),.tabela-fin td:nth-child(7),.tabela-fin td:nth-child(8),
.tabela-fin th:nth-child(6),.tabela-fin th:nth-child(7),.tabela-fin th:nth-child(8){text-align:right;white-space:nowrap}
.fin-sit{display:inline-block;padding:2px 9px;border-radius:99px;font-size:12px;font-weight:700;color:var(--c);background:color-mix(in srgb,var(--c) 18%,transparent)}
.fin-chip{display:inline-block;padding:1px 8px;border-radius:99px;background:#1b2742;font-size:11.5px;margin:1px 0}
.fin-botoes{display:flex;flex-wrap:wrap;gap:4px;min-width:150px;max-width:220px}
.fin-sit{white-space:nowrap}
.btn.mini{padding:4px 9px;font-size:12px;border-radius:8px}
.btn.perigo{color:#fb7185}
.fin-rodape{display:flex;gap:22px;justify-content:flex-end;flex-wrap:wrap;color:var(--muted);font-size:13px}
.fin-rodape b{color:var(--ink);font-size:15px;margin-right:4px}
/* janelas (incluir conta, fornecedor, pagamento) */
.dialogo{width:min(860px,96vw);max-height:92vh;overflow:auto;background:var(--superficie);color:var(--ink);border:1px solid var(--line);border-radius:16px;padding:0;box-shadow:0 30px 80px #000a}
.dialogo::backdrop{background:#0009}
.dialogo-pequeno{width:min(460px,96vw)}
.dialogo form{padding:18px 20px;display:flex;flex-direction:column;gap:14px}
.dialogo-topo{display:flex;justify-content:space-between;align-items:center}
.dialogo-topo h3{margin:0;font-size:19px}
.dialogo-rodape{display:flex;gap:10px;border-top:1px solid var(--line);padding-top:14px}
.fin-form-abas{display:flex;gap:4px;border-bottom:1px solid var(--line);flex-wrap:wrap}
.fin-form-abas button{background:none;border:0;border-bottom:2px solid transparent;color:var(--muted);padding:8px 12px;font-weight:600;cursor:pointer}
.fin-form-abas button.on{color:var(--ink);border-bottom-color:var(--accent)}
.fin-grade{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.fin-grade label,.fin-aba > label{display:flex;flex-direction:column;gap:5px;font-size:13px;color:var(--muted);font-weight:600}
.fin-grade input,.fin-grade select,.fin-grade textarea,.fin-aba input{width:100%;min-width:0;font:inherit;color:var(--ink)}
.fin-grade textarea{background:var(--superficie-2);border:1px solid #2b3a57;border-radius:10px;padding:9px 11px;resize:vertical}
.fin-grade .col-2{grid-column:span 2}.fin-grade .col-3{grid-column:1/-1}
.com-botao{display:flex;gap:6px}.com-botao input{flex:1}
.fin-anexos{list-style:none;padding:0;margin:8px 0 0;display:flex;flex-direction:column;gap:6px}
.fin-anexos li{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.fin-anexos a{color:var(--accent);font-weight:600}
@media(max-width:850px){
  .fin-cards{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .fin-grade{grid-template-columns:1fr}.fin-grade .col-2,.fin-grade .col-3{grid-column:auto}
  .tabela-fin,.tabela-fin tbody,.tabela-fin tr,.tabela-fin td{display:block;width:100%}
  .tabela-fin tr:first-child{display:none}
  .tabela-fin tr{border:1px solid var(--line);border-radius:12px;padding:10px 12px;margin-bottom:10px;background:var(--superficie-2)}
  .tabela-fin td{border:0;padding:3px 0;text-align:left!important}
  .tabela-fin td[data-rotulo]::before{content:attr(data-rotulo);display:block;font-size:11px;color:var(--muted);font-weight:600}
  .fin-acoes-linha{white-space:normal}
}
/* imprimir: só a lista de contas, em fundo branco */
@media print{
  body.modo-financeiro .barra-topo,body.modo-financeiro .cabecalho,body.modo-financeiro .fin-acoes,
  body.modo-financeiro .fin-filtros,body.modo-financeiro .fin-abas,body.modo-financeiro .fin-acoes-linha,
  body.modo-financeiro .tabela-fin th:last-child,body.modo-financeiro dialog{display:none!important}
  body{background:#fff!important;color:#000!important}
  .panel,.kpi{background:#fff!important;border-color:#ccc!important;box-shadow:none!important;color:#000!important}
  .kpi small,.msg{color:#333!important}
}

/* ===== Curva ABC ===== */
.curva-cards{grid-template-columns:repeat(4,minmax(0,1fr))}
.curva-card{position:relative;text-align:left;cursor:pointer;font:inherit;color:inherit;border-left:5px solid var(--cc,#94a3b8)}
.curva-card.marcado{outline:2px solid var(--cc);outline-offset:1px}
.curva-card small{display:block;color:var(--muted,#64748b);font-size:.8rem}
.curva-card strong{display:block;font-size:1.25rem;margin:.15rem 0}
.curva-card em{font-style:normal;font-size:.82rem;color:var(--muted,#64748b)}
.curva-letra{position:absolute;right:.7rem;top:.4rem;font-size:1.9rem;font-weight:800;color:var(--cc);opacity:.85}
.curva-A{--cc:#16a34a}.curva-B{--cc:#d97706}.curva-C{--cc:#64748b}.curva-D{--cc:#e11d48}
.curva-selo{display:inline-grid;place-items:center;width:1.7rem;height:1.7rem;border-radius:50%;font-weight:800;color:#fff;background:var(--cc);text-decoration:none;font-size:.85rem}
.curva-grafico svg{width:100%;height:auto;max-height:240px;display:block}
.curva-grafico rect{stroke:none}
.curva-grafico .curva-linha{fill:none;stroke:#2563eb;stroke-width:2}
.curva-grafico .curva-ref{stroke:#94a3b8;stroke-dasharray:4 4}
.curva-eixo{font-size:11px;fill:#64748b;stroke:none}
.curva-legenda{display:flex;gap:1rem;font-size:.8rem;color:#64748b;margin:.3rem 0 .6rem}
.curva-legenda i{display:inline-block;width:.8rem;height:.8rem;border-radius:2px;margin-right:.3rem;vertical-align:-1px}
.curva-legenda i.linha{height:2px;background:#2563eb;vertical-align:3px}
.curva-tabela .curva-linha-prod{cursor:pointer}
.curva-tabela .curva-linha-prod.aberto{background:rgba(37,99,235,.06)}
.curva-tabela .curva-filho td{font-size:.82rem;background:rgba(148,163,184,.08)}
.curva-abrir{border:1px solid #cbd5e1;background:transparent;border-radius:6px;padding:.1rem .45rem;cursor:pointer;font:inherit}
@media (max-width:760px){.curva-cards{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* Resumo analítico (Curva ABC) */
.dialogo-largo{width:min(1000px,96vw)}
.cr-topo{display:flex;gap:.8rem;align-items:center;min-width:0}
.cr-topo img,.cr-topo .sem-foto{width:52px;height:52px;border-radius:10px;object-fit:cover;flex:none;background:#fff}
.cr-topo .sem-foto{display:grid;place-items:center;background:#1b2742;color:var(--muted);font-weight:700;font-size:13px}
#curva-resumo .dialogo-topo,#promo-detalhe .dialogo-topo{padding:1rem 1.2rem .6rem;gap:.8rem;align-items:flex-start}
.cr-topo h3{margin:0;font-size:1.05rem;display:flex;gap:.5rem;align-items:center}
.cr-topo small{color:var(--muted,#94a3b8)}
.cr-corpo{padding:0 1.2rem 1.2rem}
.cr-corpo h4{margin:1.2rem 0 .5rem}
.cr-kpis{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.6rem}
.cr-kpi{border:1px solid var(--line);border-radius:12px;padding:.7rem .85rem}
.cr-kpi small{display:block;color:var(--muted,#94a3b8);font-size:.78rem}
.cr-kpi strong{display:block;font-size:1.2rem;margin:.15rem 0}
.cr-kpi em{font-style:normal;font-size:.78rem;color:var(--muted,#94a3b8)}
.cr-linha{display:grid;grid-template-columns:170px 1fr 110px 64px 90px;gap:.6rem;align-items:center;padding:.28rem 0;font-size:.88rem}
.cr-cab{font-size:.75rem;color:var(--muted,#94a3b8)}
.cr-trilho{position:relative;height:18px;background:rgba(148,163,184,.12);border-radius:5px}
.cr-trilho i{position:absolute;top:0;bottom:0;border-radius:5px;min-width:2px}
.cr-val,.cr-pct,.cr-un{text-align:right;font-variant-numeric:tabular-nums}
.cr-pct,.cr-un{color:var(--muted,#94a3b8)}
.cr-pilha{display:flex;height:22px;border-radius:7px;overflow:hidden}
.cr-pilha i{display:block;height:100%}
.cr-leg{display:flex;flex-wrap:wrap;gap:.4rem 1rem;font-size:.8rem;margin-top:.45rem;color:var(--muted,#94a3b8)}
.cr-leg b{display:inline-block;width:.75rem;height:.75rem;border-radius:2px;margin-right:.3rem;vertical-align:-1px}
@media (max-width:760px){.cr-topo h3{font-size:.95rem}.cr-topo img,.cr-topo .sem-foto{width:40px;height:40px}.cr-corpo{padding:0 .8rem 1rem}.cr-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.cr-linha{grid-template-columns:96px 1fr 84px 52px;font-size:.78rem}.cr-un{display:none}}
.curva-paginacao{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem;margin:.4rem 0 .6rem;scroll-margin-top:140px}
.curva-paginacao select{width:auto}
.curva-paginacao .btn{padding:.35rem .75rem}
.curva-paginacao .msg{margin:0 0 0 .4rem}
.curva-tabela .curva-pos{color:var(--muted,#94a3b8);font-variant-numeric:tabular-nums;text-align:center}

/* ===== Promoções ===== */
.promo-topo{display:flex;justify-content:space-between;align-items:center;gap:1rem;margin-bottom:.5rem}
.promo-topo .msg{margin:0}
.promo-cards{grid-template-columns:repeat(6,minmax(0,1fr))}
.promo-cards .kpi small{display:block;color:var(--muted,#94a3b8);font-size:.8rem}
.promo-cards .kpi strong{display:block;font-size:1.2rem;margin:.15rem 0}
.promo-cards .kpi em{font-style:normal;font-size:.78rem;color:var(--muted,#94a3b8)}
.promo-cards .kpi.alerta strong{color:#f59e0b}
.promo-tipos{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:.4rem}
.promo-chip{border:1px solid var(--line);border-left:4px solid var(--pc);border-radius:8px;padding:.3rem .6rem;font-size:.82rem}
.promo-tipo{display:inline-block;border-radius:999px;padding:.12rem .55rem;font-size:.75rem;font-weight:700;color:#fff;background:var(--pc);white-space:nowrap}
.promo-tabela .promo-linha{cursor:pointer}
.promo-tabela .promo-linha:hover{background:rgba(249,115,22,.06)}
.promo-veredito{display:inline-block;border-radius:8px;padding:.15rem .5rem;font-size:.78rem;font-weight:600;white-space:nowrap}
.promo-veredito.ok{background:rgba(34,197,94,.15);color:#22c55e}
.promo-veredito.ruim{background:rgba(244,63,94,.15);color:#f43f5e}
.promo-veredito.proposta{background:rgba(59,130,246,.15);color:#60a5fa}
.promo-veredito.neutro{background:rgba(148,163,184,.15);color:#94a3b8}
.promo-veredito.grande{font-size:1rem;padding:.4rem .8rem;margin:.2rem 0 .8rem}
.promo-tabela small.ok{color:#22c55e}
@media (max-width:1100px){.promo-cards{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:760px){.promo-cards{grid-template-columns:repeat(2,minmax(0,1fr))}.promo-topo{flex-direction:column;align-items:flex-start}}
.promo-tabela td:nth-child(2),.promo-tabela th:nth-child(2){text-align:left}
#pr-topo h3{flex-wrap:wrap}

/* Proprietário → Calculadora */
.linha-calc{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center}
.linha-calc input{flex:1 1 320px}
.calc-cel{display:flex;flex-wrap:wrap;gap:.35rem;align-items:center}
.calc-cel select,.calc-cel input{width:auto}
.calc-cel .btn{padding:.3rem .6rem}

#atualizar.girando svg{animation:girar .8s linear infinite}
@keyframes girar{to{transform:rotate(360deg)}}
#curva-qtd{width:90px}

/* Promoções: cards por tipo (filtro) */
.promo-grupos{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:.7rem;margin:.2rem 0 .9rem}
.promo-grupo{position:relative;text-align:left;font:inherit;color:inherit;cursor:pointer;border:1px solid var(--line);border-top:4px solid var(--pc);
  border-radius:14px;padding:.75rem .85rem;background:linear-gradient(160deg,color-mix(in srgb,var(--pc) 16%,transparent),transparent 70%),var(--superficie,#111a2e);
  display:flex;flex-direction:column;gap:.1rem;transition:transform .12s,box-shadow .12s}
.promo-grupo:hover{transform:translateY(-2px);box-shadow:0 8px 20px #0006}
.promo-grupo.marcado{outline:2px solid var(--pc);outline-offset:1px;box-shadow:0 0 0 4px color-mix(in srgb,var(--pc) 25%,transparent)}
.promo-grupo.vazio{opacity:.55}
.promo-grupo small{color:var(--muted,#94a3b8);font-size:.8rem;padding-right:2rem}
.promo-grupo strong{font-size:1.1rem}
.promo-grupo em{font-style:normal;font-size:.78rem;color:var(--muted,#94a3b8)}
.pg-icone{position:absolute;right:.6rem;top:.55rem;width:28px;height:28px;border-radius:8px;display:grid;place-items:center;background:color-mix(in srgb,var(--pc) 22%,transparent)}
.pg-icone svg{width:17px;height:17px;fill:none;stroke:var(--pc);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
@media (max-width:1100px){.promo-grupos{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:760px){.promo-grupos{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* Promoções: período só pelo filtro do topo (o de baixo fica escondido) */
#promo-de, #promo-ate, #promo-aplicar, label[for="promo-de"], label[for="promo-ate"] { display: none !important; }

/* Trocar senha */
.dialogo-senha{width:min(460px,94vw)}
.dialogo-senha .dialogo-topo{padding:1rem 1.2rem .4rem}
.senha-corpo{padding:0 1.2rem}
.senha-corpo label{display:block;margin:.6rem 0;font-size:.9rem}
.senha-corpo input{display:block;width:100%;margin-top:.25rem}
.aviso-senha{background:rgba(249,115,22,.12);border:1px solid rgba(249,115,22,.4);border-radius:10px;padding:.6rem .8rem;color:var(--ink)}
.dialogo-senha .dialogo-rodape{padding:.6rem 1.2rem 1.1rem}
.senha-provisoria{display:flex;gap:.5rem;align-items:center;flex-wrap:wrap;margin-top:.5rem;padding:.6rem .8rem;border:1px dashed #f97316;border-radius:10px}
.senha-provisoria code{font-size:1.15rem;letter-spacing:.06em;user-select:all}

/* =====================================================================
   MODO CLARO (botão ☀/☾ no topo; escolha guardada no navegador)
   ===================================================================== */
:root{--grade:#22304a;--trilho:#1b2742}
html.claro{
  color-scheme:light;
  --bg:#f3f5f9;--superficie:#ffffff;--superficie-2:#f6f8fb;--ink:#141a26;--muted:#5b6678;--line:#e1e6ee;
  --good:#15803d;--warn:#b45309;--bad:#dc2626;--grade:#e5e9f0;--trilho:#eef1f5;
}
html.claro body{background:var(--bg)}
html.claro input,html.claro select,html.claro .fin-grade textarea{border-color:#cfd6e2;background:#fff}
html.claro .btn{background:#fff;border-color:#cfd6e2;color:var(--ink)}
html.claro .btn:hover{background:#fff7ef;border-color:var(--accent)}
html.claro .btn.primary{color:#1a0e02}
html.claro .icone{border-color:#cfd6e2;background:#fff}
html.claro .barra-topo{background:rgba(255,255,255,.92);box-shadow:0 1px 0 var(--line)}
html.claro .nav a{color:#3d4757}
html.claro .nav a:hover{background:#f1f4f8;color:var(--ink)}
html.claro .nav a.active,html.claro .chip.on{color:#1a0e02}
html.claro .chip{color:#3d4757;background:#fff}
html.claro .chip:hover{border-color:#b9c3d3}
html.claro .conta-menu{box-shadow:0 18px 40px #0f172a22}
html.claro .conta-menu a:hover{background:#f1f4f8}
html.claro .panel{background:#fff;box-shadow:0 4px 16px #0f172a0d}
html.claro .kpi{background:linear-gradient(150deg,color-mix(in srgb,var(--c) 14%,#fff),#fff 75%);border-color:color-mix(in srgb,var(--c) 40%,#fff);box-shadow:0 4px 14px #0f172a0f}
html.claro .kpi .topo-kpi{color:#273042}
html.claro .kpi small{color:#5b6678}
html.claro .kpi .sobe{color:#15803d}html.claro .kpi .desce{color:#dc2626}
html.claro .kpi.destaque{box-shadow:0 0 0 2px var(--c),0 6px 18px #0f172a1a}
html.claro .legenda{color:#3d4757}
html.claro .dica{background:#fff;border-color:#d5dce7;box-shadow:0 10px 24px #0f172a22}
html.claro .tabela th{background:#f6f8fb;color:#5b6678}
html.claro .tabela tr:hover td{background:#f8fafc}
html.claro .anuncio .sem-foto,html.claro .cr-topo .sem-foto{background:#eef1f5}
html.claro .selo.verde{background:#dcfce7;color:#166534}html.claro .selo.amarelo{background:#fef3c7;color:#92400e}
html.claro .selo.laranja{background:#ffedd5;color:#9a3412}html.claro .selo.vermelho{background:#ffe4e6;color:#9f1239}
html.claro .selo.sem_dados{background:#f1f5f9;color:#64748b}
html.claro .aviso{background:#fff8eb}html.claro .aviso.sucesso{background:#ecfdf3}
html.claro td input.sem-custo{background:#fff8eb}
html.claro .fin-abas button{color:#3d4757}
html.claro .fin-abas button span,html.claro .fin-abas button.on,html.claro .fin-chip{background:#eef1f5}
html.claro .btn.perigo{color:#dc2626}
html.claro .dialogo{box-shadow:0 30px 80px #0f172a33}
html.claro .dialogo::backdrop{background:#0f172a66}
html.claro .promo-grupo:hover{box-shadow:0 8px 20px #0f172a1f}
html.claro .promo-veredito.ok,html.claro .promo-tabela small.ok{color:#15803d}
html.claro .promo-veredito.ruim{color:#dc2626}html.claro .promo-veredito.proposta{color:#2563eb}
.tema-botao .lua{display:none}
html.claro .tema-botao .sol{display:none}html.claro .tema-botao .lua{display:block}

/* ---------- Controle de Ads ---------- */
#ads-controle{display:flex;flex-direction:column;gap:16px}
#ads-controle .fin-topo{align-items:center}
.ads-dias td:first-child{white-space:nowrap}
.ads-dias tr.ads-total td{background:#facc15;color:#1a1300;font-weight:800}
.ads-dias tr.ads-taxa td{color:var(--muted)}
.ads-dias tr.ads-taxa input{width:120px;text-align:right;padding:5px 8px}
.ads-dias tr.ads-taxa td:nth-child(3){text-align:left}
.ads-taxas-acoes{gap:12px;align-items:center;margin-top:10px}
.ads-filtros{flex-wrap:wrap;gap:8px;margin-bottom:10px}
.ads-produtos td.ads-ind{text-align:left;white-space:normal;min-width:190px}
.ads-produtos td.ads-ind small{display:block;color:var(--muted);font-size:11px;margin-top:3px;line-height:1.3}
.ads-selo{display:inline-block;padding:3px 9px;border-radius:999px;font-weight:700;font-size:12px;white-space:nowrap}
.ads-selo.ruim{background:#4c0f1d;color:#fda4af}.ads-selo.atencao{background:#4d3b0a;color:#fde68a}
.ads-selo.ok,.ads-selo.investir{background:#14532d;color:#86efac}.ads-selo.neutro{background:#1e293b;color:#94a3b8}
html.claro .ads-selo.ruim{background:#ffe4e6;color:#9f1239}html.claro .ads-selo.atencao{background:#fef3c7;color:#92400e}
html.claro .ads-selo.ok,html.claro .ads-selo.investir{background:#dcfce7;color:#166534}html.claro .ads-selo.neutro{background:#eef2f7;color:#475569}

/* ---------- Modo apresentação: esconde fotos e o que identifica a loja (os textos são trocados pelo JS) ---------- */
.apresentacao-botao{white-space:nowrap}
html.apresentacao .apresentacao-botao{background:var(--accent);border-color:var(--accent);color:#fff}
html.apresentacao .anuncio img,html.apresentacao .anuncio .sem-foto,html.apresentacao .cr-topo img,html.apresentacao .cr-topo .sem-foto,
html.apresentacao #conta-email{display:none!important}
@media(max-width:850px){.apresentacao-texto{display:none}}
/* Usuários ativos agora (só o proprietário) */
.online-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}.online-kpis div{background:#ffffff0d;border:1px solid var(--line);border-radius:10px;padding:8px 10px}.online-kpis small{display:block;color:var(--muted);font-size:11px}.online-kpis strong{font-size:22px}
.online-kpis div:first-child strong{color:#4ade80}
.online-lista{display:flex;flex-direction:column;gap:4px;max-height:260px;overflow:auto}.online-lista>div{display:flex;align-items:center;gap:8px;font-size:13px;padding:6px 8px;border-radius:8px;background:#ffffff08}
.online-lista small{display:block;color:var(--muted);font-size:11px}.online-lista em{margin-left:auto;font-style:normal;color:var(--muted);font-size:12px;white-space:nowrap}
.online-lista .ponto{width:9px;height:9px;border-radius:50%;background:#64748b;flex:none}.online-lista .on .ponto{background:#4ade80;box-shadow:0 0 0 3px #4ade8033}
@media(max-width:560px){.online-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}}
html.apresentacao .online-lista span:not(.ponto){filter:blur(5px)}
/* Aviso do teste grátis (14 dias) */
.aviso-teste{margin:0 0 14px;padding:11px 14px;border-radius:12px;border:1px solid #f59e0b55;background:linear-gradient(90deg,#3a2c1c,#1a2133);color:#ffe2b0;font-size:14px}
.aviso-teste.fim{border-color:#ef444466;background:linear-gradient(90deg,#4a1d24,#1a2133);color:#ffc2c8}
html.claro .aviso-teste{background:#fff4e0;color:#7a4b0c}html.claro .aviso-teste.fim{background:#ffe4e8;color:#a42032}
