/* ============================================================
   Inteligência MS — tema de marca (fonte única da verdade)
   BUILD: Rede Trivellin (tenant-forward)
   A linguagem cromática é da Trivellin; a MS assina como produto.
   Carregado DEPOIS do <style> de cada página, então sobrescreve.
   ============================================================ */

:root{
  /* ---- REDE TRIVELLIN (cliente — dominante nesta build) ---- */
  --tv-orange:#F47B20;        /* laranja puro da marca: realces, marcas, ícones */
  --tv-orange-deep:#C25E12;   /* variante p/ fundo com texto branco (contraste AA) */
  --tv-orange-dark:#8A4210;   /* laranja queimado, p/ profundidade */
  --tv-orange-soft:#FDF0E5;   /* fundo suave p/ badges e estados */
  --tv-orange-pale:#F0A868;   /* laranja claro p/ texto sobre fundo escuro */
  --tv-ink:#111111;
  --tv-paper:#FFFFFF;

  /* escala escura quente (substitui o antigo navy) */
  --deep:#151311;
  --deep2:#2E1A0C;
  --tv-warm-1:#3A332E;        /* cinza quente claro  */
  --tv-warm-2:#26211D;        /* cinza quente escuro */
  --tv-warm-line:#DCD5CE;
  --tv-warm-hover:#FAF7F4;

  /* ---- MS PARTNERS (produto — assinatura e estados de sucesso) ---- */
  --ms-ink:#0B0C0E;
  --ms-green:#3FA463;
  --ms-paper:#F4F4F1;
  --ms-steel:#8A8D93;
  --ms-green-dark:oklch(0.5 0.15 150);
  --ms-green-light:oklch(0.68 0.15 150);

  /* ---- Mapeamento semântico do app ---- */
  --bg:var(--ms-paper);
  --panel:#FFFFFF;
  --ink:var(--tv-ink);
  --muted:var(--ms-steel);
  --line:#E4E4E0;

  --brand:var(--tv-orange-deep);  /* ações primárias, item ativo */
  --brand2:var(--ms-green);       /* confirmações / sucesso (assinatura MS) */
  --accent:var(--tv-orange);

  /* estados: sucesso segue verde (semântica), atenção/erro inalterados */
  --ok:var(--ms-green-dark);
  --warn:#B97B16;
  --bad:#B3261E;
  --pend:var(--ms-steel);

  /* níveis de cliente */
  --n1:var(--tv-orange-deep);
  --n2:#B97B16;
  --n3:#9A3B8F;
}

/* ---- Barra lateral: preto Trivellin, realce laranja ---- */
.side{background:var(--tv-ink);color:#D9D9D9}
.side-foot{color:#7E8288;border-top-color:rgba(255,255,255,.08)}
.nav-item{color:#D9D9D9}
.nav-item:hover{background:rgba(244,123,32,.12)}
.nav-item.active{background:var(--tv-orange);color:#fff}
.nav-sep{color:#77797E}
.brand-name{color:#fff}
.brand-sub{color:var(--tv-orange)}
.brand-logo{background:var(--tv-orange)}
.hublink{color:#D9D9D9;background:rgba(255,255,255,.05);border-color:rgba(255,255,255,.1)}
.hublink:hover{background:rgba(244,123,32,.16);color:#fff;border-color:rgba(244,123,32,.4)}
.wl{background:rgba(255,255,255,.06);color:#A9ACB1}
.wl b{color:#fff}
.wl-chip{background:var(--tv-paper)}

/* ---- Botões ---- */
.btn-p{background:var(--tv-orange-deep);border-color:var(--tv-orange-deep);color:#fff}
.btn-p:hover{background:#A94E0C;border-color:#A94E0C}
.btn-g{background:var(--ms-green);border-color:var(--ms-green);color:#fff}
.btn-g:hover{background:var(--ms-green-dark);border-color:var(--ms-green-dark)}

/* ---- Realces / navegação ---- */
.rolebtn.active{background:var(--tv-orange-deep);color:#fff}
.step.active{border-color:var(--tv-orange);box-shadow:0 0 0 2px rgba(244,123,32,.20)}
.step.done{background:#F1F7F3;border-color:#CBE4D5}
.flow .node.cur{border-color:var(--tv-orange);background:var(--tv-orange-soft);color:var(--tv-orange-deep)}
.b-n1{background:var(--tv-orange-soft);color:var(--tv-orange-deep)}
.b-info{background:var(--tv-orange-soft);color:var(--tv-orange-deep)}
.b-ok{background:#EAF5EE;color:var(--ms-green-dark)}
.kcol{background:#F2F2EF}
.top{border-bottom-color:var(--line)}

/* ---- Menu de Serviços: cards claros, realce laranja Trivellin ---- */
.tile{background:var(--panel);border-color:var(--line)}
.tile:hover{border-color:var(--tv-orange-pale);box-shadow:0 16px 34px rgba(138,66,16,.13)}
.tile h3{color:var(--tv-ink)}
.tile .pnum{color:var(--tv-orange-deep)}
.tile .desc{color:var(--muted)}
.tile .go{color:#B0A79C}
.tile:hover .go{color:var(--tv-orange-deep)}
.tile .bigicon{background:var(--tv-orange-soft);color:var(--tv-orange-deep)}
.tile .tag{background:var(--tv-orange-soft);color:var(--tv-orange-deep)}

.tile.soon{background:#FAF7F4;border-color:var(--tv-warm-line)}
.tile.soon h3{color:#7C746B}
.tile.soon .desc{color:#9A9187}
.tile.soon .bigicon{background:#EFEAE4;color:#A79E95}
.tile.soon .tag{background:#EFEAE4;color:#8B8279}
.tile.soon .pnum{color:#A79E95}

/* barras de topo dos cards: tons de laranja, do claro ao queimado */
.s-credito{background:var(--tv-orange)}
.s-fin{background:var(--tv-orange-deep)}
.s-atend{background:var(--tv-orange-dark)}

/* ---- Marca MS na lateral (páginas de processo): logo oficial ---- */
.brand:has(.brand-mark){display:block;padding:20px 16px 14px}
.brand:has(.brand-mark) .brand-logo{display:none}
.brand:has(.brand-mark) .brand-name{display:none}
.brand-mark{display:block;width:100%;max-width:180px;height:auto}
.brand:has(.brand-mark) .brand-sub{display:block;margin-top:9px;color:var(--tv-orange)}

/* ---- Assinatura "Powered by" no rodapé da lateral ---- */
.powered-lbl{font-size:9px;letter-spacing:.7px;text-transform:uppercase;color:#7E8288;margin-bottom:8px}
.powered-logo{display:block;width:100%;max-width:140px;height:auto}

/* ---- Logo do cliente (Trivellin) no topo do menu preto, em chip branco ---- */
.client-logo{margin:16px 16px 4px;background:#fff;border-radius:12px;padding:13px 16px;display:flex;justify-content:center}
.client-logo img{max-width:100%;height:auto;max-height:56px;object-fit:contain;display:block}
/* rótulo do módulo (nas telas de processo), abaixo do logo do cliente */
.mod-label{padding:4px 18px 2px;font-size:10px;letter-spacing:1px;text-transform:uppercase;color:var(--tv-orange);font-weight:700}

/* ---- Logo do cliente centralizado na faixa do topo (páginas de processo) ---- */
.top{position:relative}
.top-logo{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  height:58px;max-width:290px;object-fit:contain;pointer-events:none}
@media(max-width:1240px){.top-logo{height:44px;max-width:215px}}
@media(max-width:1000px){.top-logo{display:none}}

/* ---- Neutros: troca o cinza-azulado por cinza quente ---- */
tr.clk:hover td{background:var(--tv-warm-hover)}
.step:hover{border-color:var(--tv-warm-line)}
.searchbar{border-color:var(--line)}