/* Tema visual (taste-skill, estilo true-black-flat, 21/10/2026).
   Só aparência: carregado DEPOIS do styles.css e não muda nenhuma conta nem comportamento.
   Para voltar ao visual antigo, basta tirar o <link> deste arquivo no index.html.
   Cara do produto: o dourado dos criativos de tarô é a cor dos dados; lucro verde, prejuízo vermelho. */
:root{
  --bg:#000000; --panel:#111111; --panel-2:#2a2a2a; --line:#1f1f1f;
  --text:#ffffff; --muted:#b4b4b4; --faint:#949494;
  --accent:#d9b25f;          /* dourado: só nos dados (barras, rosca, barra de orçamento) */
  --accent-dim:#d9b25f; --accent-hover:#ffffff;
  --ruim:#8c8c8c;            /* nos gráficos é o investimento: neutro, para o gráfico ter uma cor só */
  --laranja:#e5a93b;         /* status "ruim" continua laranja, aplicado direto nas classes */
  --pessimo:#e5484d; --atencao:#e5a93b; --bom:#3fc07a; --excelente:#e6e6e6;
  --sombra:none;
  --mono:"Inter",system-ui,sans-serif;
  --raio:20px; --raio-in:12px; --gap:14px;
}
html,body{font-family:"Inter",system-ui,-apple-system,sans-serif;font-size:14px;line-height:1.45;font-variant-numeric:tabular-nums;}
body{background:#000;}

/* ---------- casca: sidebar e topo no mesmo chão, separados por 1px ---------- */
.sidebar{background:var(--bg);box-shadow:none;border-right:1px solid var(--line);padding:20px 14px;width:220px;}
.marca{border-bottom:0;padding:0 8px 22px;margin-bottom:6px;}
.marca-icone{background:#000000;color:#ffffff;border:1px solid #3a3a3a;border-radius:10px;font-weight:600;letter-spacing:-.02em;}
.marca-icone img{width:26px;height:26px;display:block;object-fit:contain;}   /* 22/10: V da logo Visionary */
.marca b{font-size:15px;font-weight:600;} .marca small{font-size:12px;color:var(--faint);}
.menu-item{color:#bbbbbb;font-weight:500;font-size:14px;padding:0 10px;height:34px;margin-bottom:2px;border-radius:10px;}
.menu-item:hover{background:transparent;color:#ffffff;}
.menu-item.ativo{background:transparent;box-shadow:none;color:#ffffff;}
.menu-item .mi{width:18px;height:18px;display:inline-grid;place-items:center;opacity:.75;}
.menu-item.ativo .mi{opacity:1;}
.menu-item svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;}
.sidebar-rodape{border-top:1px solid var(--line);padding:14px 8px 0;font-size:12px;color:var(--faint);line-height:1.8;}
.sidebar-rodape a{color:var(--muted);}

.conteudo{padding:0 29px 80px;}
.topo{min-height:64px;align-items:center;margin:0 -29px 22px;padding:12px 29px;border-bottom:1px solid var(--line);}
.topo h1{font-size:20px;font-weight:600;letter-spacing:-.01em;}
.sub{font-size:13px;color:var(--muted);}
.atualizado{font-size:12px;color:var(--faint);}
/* o botão principal é branco (inversão), sem cor nem brilho */
button.primario{background:#ffffff;color:#000000;border-radius:999px;height:36px;padding:0 18px;font-weight:600;font-size:13px;}
button.primario:hover{background:#e6e6e6;}
button.sec,button.copy{background:transparent;border:1px solid #444444;color:#ffffff;border-radius:999px;padding:0 14px;height:32px;font-size:13px;font-weight:500;}
button.sec:hover,button.copy:hover{background:#1a1a1a;border-color:#5a5a5a;color:#ffffff;}
button.copy.mini{height:28px;padding:0 10px;font-size:12px;}

/* ---------- superfícies: só um degrau de claridade, sem sombra e sem borda ---------- */
.panel,.card,.cp-painel,.login-card,.cp-modal{background:var(--panel);box-shadow:none;border:0;border-radius:var(--raio);}
.panel{padding:20px 22px;margin-bottom:var(--gap);}
.panel h2{font-size:16px;font-weight:600;text-transform:none;letter-spacing:0;color:var(--text);}
.card{padding:18px 22px;}
.grade{gap:var(--gap);}
.card .lbl{font-size:13px;font-weight:500;color:var(--muted);}
.card .lbl i{border-color:#444;color:var(--faint);opacity:1;width:18px;height:18px;font-size:11px;}
.card .val{font-family:inherit;font-weight:500;font-size:24px;letter-spacing:-.01em;margin-top:8px;}
.card.grande .val{font-size:32px;font-weight:600;}
.card .det{font-size:13px;color:var(--faint);margin-top:6px;}
.bh,.donut-info,.rr-grade>div,.r2-esp-c,.kv,.linha-r,.int-card p,.custos-bar{font-size:13px;}

/* filtros */
.filtros{padding:16px 22px;gap:16px;}
.filtros label{font-size:12px;color:var(--muted);gap:6px;}
select,input.campo{background:#1a1a1a;border:1px solid #444444;color:var(--text);border-radius:10px;height:36px;padding:0 12px;font-size:14px;font-family:inherit;}
select:focus,input:focus{border-color:#ffffff;}

/* avisos: o tom no texto, o fundo só um degrau acima */
.aviso{border:0;border-radius:var(--raio-in);font-size:13px;padding:12px 16px;}
.aviso.vermelho{background:#2c1a20;color:#f2a7aa;}
.aviso.amarelo{background:#2b2414;color:#f0cf8a;}

/* ---------- texto pequeno: nada abaixo de 11px ---------- */
.legenda-mini,.donut-info,.cp-leg,.cp-atual,.nota,.orc-sub,.fat-nota,.det-buraco,.sangria,.cp-sub,.cp-col-op small,.cp-col-op em{font-size:12px;}
.auto-tag,.sub-n,.strip-escala,.r2-seta,.cp-tag,.inv-ef small,.mapa td.mn small,.mapa th,.cp-i,.horario text,.cp-svg text{font-size:11px;}
#tip{font-size:12px;background:#1a1a1a;border:0;border-radius:10px;}

/* ---------- etiquetas: tom pálido + texto da mesma cor, em minúsculas com a 1ª maiúscula ---------- */
.badge,.pill,.cp-tag,.cp-selo-vendas{font-size:11px;font-weight:500;letter-spacing:0;text-transform:lowercase;border-radius:999px;padding:2px 9px;}
.badge::first-letter,.pill::first-letter,.cp-tag::first-letter{text-transform:uppercase;}
.badge.LUCRO,.badge.BOM,.badge.RET_EXCELENTE,.pill.p-ok{background:#172a1d;color:#3fc07a;}
.badge.PREJUIZO,.badge.PESSIMO,.pill.p-alerta{background:#2c1a20;color:#e5566f;}
.badge.ATENCAO,.badge.RET_BOM,.pill.p-amarelo,.cp-tag-a{background:#2b2414;color:#e5a93b;}
.badge.RUIM,.badge.EMPATADO{background:#2d1f12;color:var(--laranja);}
.badge.EXCELENTE{background:#2b2617;color:#d9b25f;}
.pill.p-off{background:#222222;color:var(--muted);}
.num-ruim{color:var(--laranja);} .num-top{color:#d9b25f;}

/* ---------- tabelas: linhas e alinhamento, cabeçalho cinza em caixa normal ---------- */
table{font-size:13px;}
thead th{font-size:12px;font-weight:500;text-transform:none;letter-spacing:0;color:var(--faint);border-bottom:1px solid var(--line);padding:10px 6px;}
tbody td{border-bottom:1px solid #161616;padding:9px 6px;}
tbody tr:hover td{background:#1a1a1a;}
thead th:first-child,tbody td:first-child,tfoot td:first-child{background:var(--panel);}
tfoot td{border-top:1px solid #2a2a2a;font-family:inherit;font-weight:600;}
.val-num,.inv-ef,.rr-n,.r2-esp-n,.resumo-mini .c .v,.tab-at .num,.cp-tab td.num,.cp-tab tfoot td,input.faixa,.r2-meta,.cfg-fin{font-family:inherit;}
.val-num,.inv-ef{font-weight:600;}
.nome-at{background:#1a1a1a;border:0;border-radius:999px;font-weight:500;padding:6px 12px;}
input.celula,input.nome-livre{background:#1a1a1a;border:1px solid #444;border-radius:8px;font-family:inherit;}
input.celula.editado{border-color:var(--atencao);background:#2b2414;}

/* blocos internos: um degrau acima do cartão, sem borda */
.resumo-mini .c,.custos-bar,.geral-card,details.faixas,.rr-grade>div,.r2-esp-c,.r2-at-c,.cp-lista li,.cp-col-fixa,.cp-col-it,.cfg-chip{background:#1a1a1a;border-color:transparent;border-radius:var(--raio-in);}
.rr-n,.r2-esp-n{font-size:22px;font-weight:500;}
.r2-at-c{border-left-width:3px;}
.r2-at-c.r2-laranja{border-left-color:var(--laranja);}
.r2-tab tbody tr:first-child td{background:#14201a;}

/* barras e rosca do Resumo */
.bh{font-size:13px;}
.bh .trilho{background:transparent;}
.bh .v{font-family:inherit;}
.strip{background:#1a1a1a;}

/* ---------- abas e chaves: a seleção é branco sobre cinza, nunca a cor dos dados ---------- */
.toggle{border-color:#444;border-radius:999px;}
.toggle button{font-size:12px;padding:5px 12px;}
.toggle button.on{background:#ffffff;color:#000;}
.sub-aba{background:transparent;border:1px solid #444;border-radius:999px;font-weight:500;font-size:13px;height:34px;padding:0 16px;}
.sub-aba.on{background:#ffffff;border-color:#ffffff;color:#000;}
.cp-abas{gap:var(--gap);}
.cp-aba{background:var(--panel);border-radius:var(--raio) var(--raio) 0 0;font-weight:500;font-size:14px;color:#bbbbbb;}
.cp-aba.on{background:#1a1a1a;color:#ffffff;border-bottom-color:#ffffff;}
.cp-selo{background:#ffffff;color:#000;font-weight:600;font-size:11px;}
.cp-bt{background:#1a1a1a;border-color:#444;border-radius:999px;}
.cp-bt:hover{border-color:#ffffff;}
.cp-tab thead th,.cp-tab tfoot td,.cp-tab thead .cp-ck,.cp-tab tfoot .cp-ck,.cp-tab tfoot td:first-child{background:#1a1a1a;}
.cp-tab tbody td{border-right:0;border-bottom:1px solid #161616;}
.cp-tab tbody tr.cp-marc td{background:#1d1d1d;}
.cp-sw{background:#444;}
.cp-sw.on{background:#3fc07a;}
.cp-nome:hover:not(:disabled){color:#ffffff;}
.cp-menu{background:#1a1a1a;border:0;box-shadow:0 8px 24px rgba(0,0,0,.5);border-radius:var(--raio-in);}
.cp-filtros input,.cp-filtros select{background:#1a1a1a;border-color:#444;border-radius:10px;}
.cp-modal{border:0;}
.cp-m-topo,.cp-m-pe{border-color:var(--line);}

/* pontos de status sem brilho */
.dot.d-ok,.dot.d-aviso,.dot.d-erro,.cp-dot.ok,.cp-dot.erro{box-shadow:none;}

#toast{background:#ffffff;color:#000;border-radius:999px;font-weight:600;}

/* ---------- celular ---------- */
@media (max-width:760px){
  .sidebar{width:100%;border-right:0;border-bottom:1px solid var(--line);padding:10px 16px;}
  .marca{padding:0 8px 0 0;}
  .menu-item{height:40px;padding:0 12px;}
  .conteudo{padding:0 16px 60px;}
  .topo{margin:0 -16px 16px;padding:12px 16px;min-height:56px;}
  .panel{padding:16px;}
  .card{padding:16px;}
  .card.grande .val{font-size:28px;}
}

/* ---------- aba Operações (21/10): LM, bot e búzios lado a lado ---------- */
.op-total{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,180px),1fr));gap:18px;}
.op-total>div{display:flex;flex-direction:column;gap:4px;min-width:0;}
.op-total small,.op-topo small{font-size:12px;color:var(--muted);font-weight:500;}
.op-total b{font-size:24px;font-weight:600;letter-spacing:-.01em;}
.op-grade{grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr));margin-bottom:var(--gap);}
.op-card{min-width:0;}
.op-topo{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:10px 0 12px;}
.op-topo>div{display:flex;flex-direction:column;gap:2px;}
.op-topo b{font-size:22px;font-weight:600;letter-spacing:-.01em;}
.op-dias summary,.op-cfg summary{cursor:pointer;display:flex;gap:10px;align-items:baseline;flex-wrap:wrap;}
.op-dias .table-wrap{margin-top:12px;}
.op-dias td.num,.op-dias th:not(:first-child){text-align:right;}
.op-cfg-grade{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:22px;margin-top:14px;}
.op-cfg-grade .form-l{min-width:0;}
.op-lista{display:flex;flex-direction:column;gap:4px;max-height:240px;overflow:auto;}
.op-conta{display:flex;gap:8px;align-items:center;cursor:pointer;}