/* Plataforma BESS · o que a plataforma acrescenta ao tema do aura-app (app.css):
   1) tokens de compatibilidade para o Fluxo BESS portado do CRM (fluxo.css usa --card, --sup1, --linha, --texto…);
   2) tema claro (marca white label escolhe claro ou escuro: as variáveis vêm por JS em aplicarMarca);
   3) barra de 5 abas, páginas largas (faturamento, fluxo, admin), módulo de faturamento e cadastro de marca.
   Cor nunca é o único diferenciador: estado sempre com rótulo ou ícone. */
:root{
  --card:var(--sup); --sup1:var(--sup2); --linha:var(--borda); --linha-forte:var(--borda2);
  --texto:var(--tinta); --texto-fraco:var(--tinta2); --azul-tx:var(--azul-texto); --roxo-tx:#8B8CFF;
  --ok:var(--sucesso-claro); --ambar:#FFA000; --frio:#95A0B5; --neutro:#7A8699;
  --s1:#6B8AFF; --s2:#C98500; --s3:#9085E9; --s4:#D55181;
  --raio-g:12px; --raio-m:10px; --raio-p:8px; --sombra:0 1px 2px rgba(0,0,0,.35); --sombra-topo:0 6px 24px rgba(0,0,0,.45);
  --acento:var(--azul-texto);
}
:root[data-tema="claro"]{color-scheme:light; --s1:#1F2CFF; --s2:#B36B00; --s3:#5A5BFF; --s4:#B4335F; --ambar:#b26a00; --frio:#7A8699; --sombra:0 1px 3px rgba(31,35,50,.18)}
:root[data-tema="claro"] .tabs{background:color-mix(in srgb,var(--sup) 96%,transparent)}
:root[data-tema="claro"] .topo{box-shadow:var(--sombra-topo)}
:root[data-tema="claro"] .entrar{background:radial-gradient(700px 420px at 85% -10%, color-mix(in srgb,var(--azul) 22%,transparent), transparent 60%),var(--fundo)}
:root[data-tema="claro"] .no{box-shadow:0 4px 14px rgba(31,35,50,.18)}
:root[data-tema="claro"] .cursor-ponto{stroke:var(--sup)}
:root[data-tema="claro"] #toast{box-shadow:0 10px 30px rgba(31,35,50,.25)}
:root[data-tema="claro"] .fundo{background:rgba(31,35,50,.55)}
.topo{box-shadow:var(--sombra-topo)}
.topo .logo{max-width:120px;object-fit:contain}
.entrar-marca .logo{max-width:220px;max-height:56px;object-fit:contain}

/* ---------- 5 abas + atalhos de módulo no PC ---------- */
.tabs-in{grid-template-columns:repeat(5,1fr)}
.tabs button .ico{width:22px;height:22px}
.app.larga{max-width:1200px}
.topo-in.larga{max-width:1200px}
.topo .modulos{display:none;margin-left:auto;gap:4px}
.topo .modulos a{color:rgba(255,255,255,.85);text-decoration:none;font-weight:700;font-size:13.5px;padding:6px 10px;border-radius:999px;border:1px solid transparent;display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.topo .modulos a .ico{width:16px;height:16px}
.topo .modulos a[aria-current="page"]{background:rgba(255,255,255,.16);border-color:rgba(255,255,255,.35);color:#fff}
@media (min-width:900px){.topo .modulos{display:flex}}
.tela.larga{max-width:none}

/* ---------- faturamento ---------- */
.sub-abas.n5{grid-template-columns:repeat(5,1fr)} .sub-abas.n4{grid-template-columns:repeat(4,1fr)} .sub-abas.n3{grid-template-columns:repeat(3,1fr)}
.sub-abas button{font-size:13.5px;padding:8px 4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fat-cab{display:flex;align-items:flex-start;gap:12px;flex-wrap:wrap;justify-content:space-between}
.fat-cab .t{font-size:18px;font-weight:800;line-height:1.2}
.fat-cab .s{font-size:13px;color:var(--tinta3)}
.lista-comp{display:flex;flex-direction:column}
.comp{display:grid;grid-template-columns:auto 1fr auto;gap:4px 12px;align-items:center;padding:11px 0;border-bottom:1px solid var(--borda);width:100%;background:none;border-left:0;border-right:0;border-top:0;color:var(--tinta);text-align:left;cursor:pointer;-webkit-tap-highlight-color:transparent;min-height:56px}
.comp:last-child{border-bottom:0}
.comp .c{font-weight:800;font-size:15.5px;white-space:nowrap}
.comp .c small{display:block;font-size:11.5px;color:var(--tinta3);font-weight:500}
.comp .m{min-width:0;font-size:13px;color:var(--tinta2);line-height:1.3}
.comp .v{font-weight:800;font-size:16px;white-space:nowrap;text-align:right}
.comp .v small{display:block;font-size:11.5px;font-weight:600;color:var(--tinta3)}
.selo.rascunho{color:var(--tinta2)} .selo.fechada{color:var(--azul-texto);border-color:var(--azul-claro)} .selo.emitida{color:var(--alerta-claro);border-color:var(--alerta)} .selo.paga{color:var(--sucesso-claro);border-color:var(--sucesso-claro)} .selo.cancelada{color:var(--tinta3);text-decoration:line-through}
.descr{font-size:14.5px;line-height:1.45;color:var(--tinta2)}
.descr b{color:var(--tinta)}
.passos{display:flex;flex-direction:column;gap:8px}
.passo{background:var(--sup2);border-radius:12px;padding:10px 12px;border-left:3px solid var(--borda2);display:grid;grid-template-columns:auto 1fr auto;gap:2px 10px;align-items:baseline}
.passo .id{font-weight:800;font-size:12.5px;color:var(--azul-texto);letter-spacing:.04em}
.passo .t{font-weight:700;font-size:14.5px}
.passo .v{font-weight:800;font-size:15.5px;white-space:nowrap;text-align:right}
.passo .f{grid-column:1/-1;font-size:12.5px;color:var(--tinta3);line-height:1.4;overflow-wrap:anywhere}
.passo .f code{font-family:inherit;color:var(--tinta2);font-weight:600}
.passo .n{grid-column:1/-1;font-size:12.5px;color:var(--tinta2);line-height:1.4;margin-top:2px}
.passo.total{border-left-color:var(--sucesso-claro);background:color-mix(in srgb,var(--sucesso-claro) 10%,var(--sup2))}
.passo.total .v{color:var(--sucesso-claro);font-size:19px}
.passo.base{border-left-color:var(--azul-claro)}
.kv{display:grid;grid-template-columns:1fr auto;gap:5px 12px;font-size:13.5px;color:var(--tinta2)}
.kv span:nth-child(even){text-align:right;color:var(--tinta);font-weight:600;white-space:nowrap}
.kv .ed{color:var(--alerta-claro);font-size:11px;font-weight:700;margin-left:6px}
.kv .orig{display:block;font-size:11px;color:var(--tinta3);font-weight:500;text-decoration:line-through}
.campos.fat{grid-template-columns:1fr 1fr}
@media (max-width:420px){.campos.fat{grid-template-columns:1fr}}
.campo.lido input{border-color:var(--sucesso-claro)}
.campo .orig{font-size:12px;color:var(--alerta-claro)}
.campo .unid{font-size:11.5px;color:var(--tinta3);font-weight:600}
.drop{border:2px dashed var(--borda2);border-radius:14px;padding:16px 14px;display:flex;gap:12px;align-items:center;cursor:pointer;background:var(--sup2);min-height:64px}
.drop .ico{width:28px;height:28px;color:var(--azul-texto);flex:none}
.drop b{display:block;font-size:15px}
.drop small{display:block;font-size:12.5px;color:var(--tinta3)}
.drop.sobre{border-color:var(--azul-claro)}
.origem{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px}
.origem button{border:1px solid var(--borda2);background:var(--sup2);color:var(--tinta);border-radius:12px;padding:10px 6px;font-weight:700;font-size:13.5px;display:flex;flex-direction:column;align-items:center;gap:4px;cursor:pointer;min-height:60px}
.origem button[aria-pressed="true"]{border-color:var(--azul);background:color-mix(in srgb,var(--azul) 18%,var(--sup2));color:var(--azul-texto)}
.log-ed{font-size:12.5px;color:var(--tinta2);display:flex;flex-direction:column;gap:4px}
.log-ed div{display:flex;flex-wrap:wrap;gap:4px 8px;padding:5px 0;border-bottom:1px solid var(--borda)}
.log-ed div:last-child{border-bottom:0}
.log-ed b{color:var(--tinta)}
.regra{background:var(--sup2);border-radius:12px;padding:10px 12px;border-left:3px solid var(--azul-claro)}
.regra h3{font-size:15px;font-weight:800;margin-bottom:4px}
.regra p{font-size:13.5px;color:var(--tinta2);line-height:1.4}
.regra ol{margin:6px 0 0 18px;font-size:13.5px;color:var(--tinta2);line-height:1.4;display:flex;flex-direction:column;gap:4px}
.itens-tab{font-size:12.5px}
.tabela-wrap{margin:0;padding:0}
.btn-linha{display:flex;gap:8px;flex-wrap:wrap}
.btn-linha .btn{flex:1 1 auto}
.rel-cab{display:flex;justify-content:space-between;gap:12px;align-items:center;flex-wrap:wrap}
.rel-cab .logo{height:30px}
@media print{
  .topo,.tabs,.btn-linha,.sub-abas,#toast,.so-tela{display:none!important}
  body{background:#fff;color:#000} .bloco,.passo,.regra{border-color:#999;background:#fff;color:#000;break-inside:avoid}
  .passo .v,.passo.total .v,.kv span,.passo .id{color:#000}
}

/* ---------- administração: organizações e marca ---------- */
.arvore{display:flex;flex-direction:column;gap:6px}
.org{display:flex;align-items:center;gap:10px;background:var(--sup);border:1px solid var(--borda);border-radius:12px;padding:10px 12px;flex-wrap:wrap}
.org.n1{margin-left:0} .org.n2{margin-left:22px} .org.n3{margin-left:44px} .org.n4{margin-left:66px}
.org .nome{font-weight:800;font-size:15px;min-width:0}
.org .nome small{display:block;font-size:12px;color:var(--tinta3);font-weight:500}
.org .marca-mini{width:22px;height:22px;border-radius:6px;border:1px solid var(--borda2);flex:none}
.org .acoes{margin-left:auto;display:flex;gap:6px;flex-wrap:wrap;flex-direction:row}
.org.off{opacity:.55}
.marca-prev{border-radius:14px;overflow:hidden;border:1px solid var(--borda2);margin:8px 0}
.marca-prev .mp-topo{padding:12px 14px;color:#fff;display:flex;align-items:center;gap:10px;font-weight:800}
.marca-prev .mp-topo img{height:24px;max-width:110px;object-fit:contain}
.marca-prev .mp-corpo{padding:12px 14px;display:flex;flex-direction:column;gap:8px}
.marca-prev .mp-card{border-radius:10px;padding:10px 12px;border-top:3px solid}
.marca-prev .mp-card .r{font-size:11px;text-transform:uppercase;letter-spacing:.06em;opacity:.75}
.marca-prev .mp-card .v{font-size:22px;font-weight:800}
.marca-prev .mp-btn{display:inline-block;border-radius:10px;padding:8px 14px;color:#fff;font-weight:700;font-size:14px}
.cores{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:8px}
.cores label{display:flex;flex-direction:column;gap:4px;font-size:12.5px;color:var(--tinta2);font-weight:600}
.cores input[type=color]{width:100%;height:40px;border:1px solid var(--borda2);border-radius:10px;background:var(--fundo);padding:2px}
.logo-prev{display:flex;align-items:center;gap:12px;background:var(--fundo);border:1px solid var(--borda2);border-radius:12px;padding:10px}
.logo-prev img{height:40px;max-width:180px;object-fit:contain}
.link-marca code{font-family:ui-monospace,Consolas,monospace;font-size:13px;color:var(--azul-texto);word-break:break-all;user-select:all}

/* ---------- Fluxo BESS (portado): classes do tema do CRM que o fluxo.js usa, dentro de .fx ---------- */
.fx{background:var(--sup);border-radius:var(--raio-g);box-shadow:var(--sombra);padding:0 0 12px;font-size:16px;min-width:0}
.fx .trilha{display:flex;flex-wrap:wrap;gap:6px 10px;align-items:center;padding:12px 16px 8px;font-size:20px;font-weight:800}
.fx .trilha .saida-ex{font-size:14px}
.fx .fx-trilha-acoes{margin-left:auto;display:flex;gap:6px;flex-wrap:wrap}
.fx .tag{display:inline-block;border-radius:var(--raio-p);padding:0 6px;font-size:13px;font-weight:700;background:var(--sup3);color:var(--texto)}
.fx .tag.nde{background:var(--sup3);color:var(--texto-fraco);font-weight:600}
.fx .saida-ex{font-size:13.5px;color:var(--texto-fraco)}
.fx .sec{background:var(--sup1);border-radius:14px;padding:12px 14px 14px;margin:0 14px 12px;border:1px solid var(--linha)}
.fx .sec h4{margin:0 0 8px;font-size:16px;font-weight:800;display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.fx .sec h4 .saida-ex{font-weight:500}
.fx .barra{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:8px 0}
.fx .btn{min-height:36px;padding:6px 12px;border-radius:8px;font-size:15px}
.fx .btn.mini{min-height:30px;padding:2px 8px;font-size:14px;font-weight:600;border-radius:8px}
.fx .btn.ghost{background:none;border-color:transparent;color:var(--texto-fraco);padding-left:0}
.fx .btn.armado{background:var(--ambar);border-color:var(--ambar);color:#151515}
.fx fieldset{border:1px solid var(--linha);border-radius:10px;padding:8px 12px 12px;margin:0 0 12px;min-width:0}
.fx legend{font-weight:800;color:var(--azul-tx);padding:0 6px}
.fx .campos{display:grid;grid-template-columns:1fr 1fr;gap:4px 12px}
.fx .campos .campo.largo{grid-column:1 / -1}
.fx .campo{display:flex;flex-direction:column;margin:5px 0;min-width:0;gap:2px}
.fx .campo label{font-size:12px;color:var(--texto-fraco);font-weight:700;text-transform:uppercase;letter-spacing:.3px}
.fx .campo input,.fx .campo select,.fx .campo textarea{border:1px solid var(--linha-forte);border-radius:var(--raio-p);padding:6px 8px;background:var(--fundo);color:var(--texto);min-width:0;min-height:36px}
.fx .campo.chk{flex-direction:row;align-items:center;gap:8px} .fx .campo.chk label{text-transform:none;font-size:15px;color:var(--texto)}
.fx .aviso{border-radius:8px;padding:8px 12px;margin:8px 0;font-size:15px;border:1px solid;overflow-wrap:anywhere;display:block;font-weight:500}
.fx .aviso.ok{background:color-mix(in srgb,var(--ok) 14%,transparent);border-color:var(--ok)} .fx .aviso.erro{background:color-mix(in srgb,var(--critico) 14%,transparent);border-color:var(--critico)} .fx .aviso.duvida{background:color-mix(in srgb,var(--ambar) 14%,transparent);border-color:var(--ambar)}
.fx .aviso ul{margin:4px 0 6px;padding-left:20px}
.fx table{border-collapse:collapse;width:100%;font-size:14px}
.fx th,.fx td{padding:6px 8px;border-bottom:1px solid var(--linha);text-align:left;vertical-align:top;white-space:nowrap}
.fx th{background:var(--sup1);color:var(--texto-fraco);font-size:12px;text-transform:uppercase;letter-spacing:.3px;position:sticky;top:0;border-bottom:1px solid var(--linha-forte)}
.fx .rol{overflow-x:auto;background:var(--sup1);border-radius:var(--raio-g)}
.fx .lin{display:flex;justify-content:space-between;gap:8px;padding:5px 0;border-bottom:1px solid var(--linha);font-size:15px}
.fx .lin:last-child{border-bottom:0}
.fx .vazio{padding:30px;text-align:center;color:var(--texto-fraco)}
.fx .radio{display:block;padding:3px 2px;font-size:16px;cursor:pointer}
.fx details{margin:6px 0} .fx summary{cursor:pointer;font-weight:700;color:var(--azul-tx)}
.fx .ok{color:var(--ok);font-weight:700}
.fx .ico{width:1em;height:1em;vertical-align:-.15em;flex-shrink:0}
.fx .btn .ico{width:.95em;height:.95em;margin-right:5px}
.fx .um{padding:0 14px}
/* o que não existe na plataforma: gravar no TeamDesk do CRM */
.fx #fxSalvar,.fx #fxSalvarC,.fx .fx-estudos{display:none!important}
.pagina-fx{padding-top:14px}
.pagina-fx .fx-nota-plat{font-size:13px;color:var(--tinta3);margin:0 0 10px}