/* JMJtech · tema cinza claro e preto (Manual da Marca v1.0, página 08)
   Vale para o CRM e para os módulos Pipeline Executivo e MyLeads, que rodam dentro dele.
   Cinza claro #E0DFE5 como fundo de apoio (menu, capa, destaques), preto #000103 no texto,
   branco no fundo principal e azul #153CF6 só no símbolo, no destaque e no link.
   Carrega depois de jmjtech-marca.css e prevalece sobre ela. */

:root {
  --jmj-cinza: #E0DFE5; --jmj-preto: #000103; --jmj-azul: #153CF6;
  --jmj-cinza-hover: rgba(0, 1, 3, .06); --jmj-cinza-fio: rgba(0, 1, 3, .12);
}

/* ===== Menu lateral: cinza claro, letras pretas, logo positivo ===== */
aside.lateral, aside.side, aside#side, .lateral { background: var(--jmj-cinza) !important; color: var(--jmj-preto) !important; border-right: 1px solid var(--jmj-cinza-fio); }
aside.lateral .fio, aside.lateral .marca-fio, aside.lateral .lat-marca .fio { background: var(--jmj-cinza-fio) !important; }
aside.lateral .produto b, aside.lateral > .marca b, aside.lateral .lat-nome b, aside.lateral b { color: var(--jmj-preto) !important; }
aside.lateral nav button, aside.lateral nav a, aside.lateral .aba, aside.lateral .nav-link button, aside.lateral .nav button { color: var(--jmj-preto) !important; background: transparent; }
aside.lateral nav button svg, aside.lateral nav a svg, aside.lateral .aba svg { color: var(--jmj-preto) !important; opacity: .78; }
aside.lateral nav button:hover, aside.lateral nav a:hover, aside.lateral .aba:hover { background: var(--jmj-cinza-hover) !important; color: var(--jmj-preto) !important; }
aside.lateral nav .ativo, aside.lateral nav .ativa, aside.lateral .aba.ativa, aside.lateral nav button.ativo, aside.lateral nav a.on, aside.lateral .nav-link.ativo button, aside.lateral .nav-link button.ativo {
  background: #fff !important; color: var(--jmj-preto) !important; box-shadow: inset 3px 0 0 var(--jmj-azul) !important; font-weight: 600 !important;
}
aside.lateral nav .ativo svg, aside.lateral .aba.ativa svg, aside.lateral nav .ativa svg { color: var(--jmj-azul) !important; opacity: 1; }
aside.lateral .nav-grupo, aside.lateral .nav-sec, aside.lateral nav .grp, aside.lateral .sec { color: #45454F !important; }
aside.lateral .busca-atalho, aside.lateral .lat-recolher { border: 1px solid var(--jmj-cinza-fio) !important; background: #fff !important; color: var(--jmj-preto) !important; }
aside.lateral kbd { background: var(--jmj-cinza) !important; color: var(--jmj-preto) !important; }
aside.lateral .lat-pe, aside.lateral .jmj-pe-menu, aside.lateral .lat-rodape { border-top-color: var(--jmj-cinza-fio) !important; }
aside.lateral .avatar, aside.lateral .jmj-avatar, aside.lateral .av { background-color: var(--jmj-preto) !important; color: #fff !important; }
aside.lateral .lat-quem b, aside.lateral .jmj-quem b { color: var(--jmj-preto) !important; }
aside.lateral .lat-quem small, aside.lateral .jmj-quem small { color: #45454F !important; }
aside.lateral .lat-sair, aside.lateral .jmj-sair, aside.lateral .topo-bt { color: var(--jmj-preto) !important; border: 1px solid var(--jmj-cinza-fio) !important; background: #fff !important; }
aside.lateral .lat-rodape:not(.jmj-pe-menu), aside.lateral .jmj-info, aside.lateral .lat-rodape span, aside.lateral small { color: #45454F !important; }
aside.lateral .lat-link, aside.lateral .jmj-link, aside.lateral .lat-rodape-link, aside.lateral a.lat-link { color: var(--jmj-azul) !important; }
aside.lateral .lat-nome { border-left-color: var(--jmj-cinza-fio) !important; }
aside.lateral .contador { background: var(--jmj-preto) !important; color: #fff !important; }
aside.lateral .contador.alerta { background: #e8952b !important; color: var(--jmj-preto) !important; }
aside.lateral .selo { color: #fff; }
aside.lateral .seta-ext { color: #686875 !important; }
aside.lateral::-webkit-scrollbar-thumb { background: rgba(0,1,3,.18); }

/* Barra superior do celular */
.topo-movel { background: var(--jmj-cinza) !important; color: var(--jmj-preto) !important; border-bottom: 1px solid var(--jmj-cinza-fio); }
.topo-movel button, .topo-movel b, .topo-movel svg { color: var(--jmj-preto) !important; }

/* ===== Botões: preto chapado, letra branca; azul fica para link e destaque ===== */
.bt-primario, .btn-primary, .btn.primary, .bt.primario, .login-bt, .jmj-prim, .rp-bt.primario { background: var(--jmj-preto) !important; border-color: var(--jmj-preto) !important; color: #fff !important; }
.bt-primario:hover, .btn-primary:hover, .login-bt:hover, .jmj-prim:hover { background: #26262D !important; border-color: #26262D !important; }

/* ===== Tela de entrada: capa cinza claro com texto preto ===== */
.entrada .entrada-azul { background: var(--jmj-cinza) !important; color: var(--jmj-preto) !important; border-top: 3px solid var(--jmj-azul) !important; }
.entrada .entrada-azul *, .entrada .entrada-tese h1, .entrada .entrada-etapas span { color: var(--jmj-preto) !important; }
.entrada .entrada-marca small, .entrada .entrada-tese p { color: #45454F !important; }
.entrada .entrada-marca span { background: var(--jmj-cinza-fio) !important; }
.entrada .entrada-etapas i { background: var(--jmj-azul) !important; box-shadow: none !important; }
.login::before {
  background-color: var(--jmj-cinza) !important; color: var(--jmj-preto) !important; border-top: 3px solid var(--jmj-azul) !important;
  background-image: url("jmjtech-pos.svg") !important;
}

/* ===== Destaques: cinza claro com texto preto e filete azul ===== */
.radar, .ent-exec, .evo-sintese, .ia-leitura, .rede-kpis div {
  background: var(--jmj-cinza) !important; color: var(--jmj-preto) !important; border-top: 2px solid var(--jmj-azul) !important;
}
.ent-exec *, .evo-sintese *, .ia-leitura *, .rede-kpis div * { color: var(--jmj-preto); }
.radar h2, .radar b { color: var(--jmj-preto) !important; }
.radar p, .radar small:not(.radar-faixa small) { color: #45454F !important; }
.radar .alternador { border-color: var(--jmj-cinza-fio) !important; background: #fff !important; }
.radar .alternador button { color: var(--jmj-preto) !important; }
.radar .alternador button.ativo { background: var(--jmj-preto) !important; color: #fff !important; }
.radar-faixa button, .radar-faixa button b, .radar-faixa button small { color: #fff !important; }
.rede { background: var(--jmj-cinza) !important; color: var(--jmj-preto) !important; }
.rede-seg button { color: var(--jmj-preto) !important; }
.rede-seg button.on { background: var(--jmj-preto) !important; color: #fff !important; }
.cluster { background: #fff !important; border: 1px solid var(--jmj-cinza-fio) !important; color: var(--jmj-preto) !important; }

/* Pipeline: rodapé do menu */
aside.lateral .jmj-pe-pipeline .lat-quem b, aside.lateral .jmj-pe-pipeline .lat-usuario .topo-bt, aside.lateral .jmj-pe-pipeline .lat-rodape-link { color: var(--jmj-preto) !important; }
aside.lateral .jmj-pe-pipeline .lat-usuario .topo-bt:hover { background: var(--jmj-cinza-hover) !important; }

/* ===== Módulo aberto dentro do CRM =====
   O menu e o rodapé ficam no CRM. O menu próprio do módulo vira uma faixa de abas no topo. */
html.jmj-embutido, html.jmj-embutido body { background: #fff !important; }
html.jmj-embutido .app, html.jmj-embutido .app.recolhida { display: block !important; grid-template-columns: none !important; min-height: 100vh; }
html.jmj-embutido .topo-movel { display: none !important; }
html.jmj-embutido aside.lateral {
  position: sticky !important; top: 0 !important; inset: auto !important; transform: none !important; width: auto !important; height: auto !important;
  display: flex !important; flex-direction: row !important; align-items: stretch !important; gap: 0 !important;
  padding: 0 20px !important; overflow-x: auto !important; overflow-y: hidden !important; z-index: 40 !important;
  background: #fff !important; border-right: 0 !important; border-bottom: 1px solid var(--jmj-cinza) !important; min-height: 46px;
}
html.jmj-embutido aside.lateral > :not(nav):not(.nav) { display: none !important; }
html.jmj-embutido aside.lateral nav, html.jmj-embutido aside.lateral .nav {
  display: flex !important; flex-direction: row !important; align-items: stretch !important; gap: 2px !important; padding: 0 !important; margin: 0 !important; overflow: visible !important; flex: none !important;
}
html.jmj-embutido aside.lateral .nav-sec, html.jmj-embutido aside.lateral .nav-grupo, html.jmj-embutido aside.lateral nav .grp, html.jmj-embutido aside.lateral .sec,
html.jmj-embutido aside.lateral .jmj-externo { display: none !important; }
html.jmj-embutido aside.lateral nav a[target="_blank"] { display: none !important; }
html.jmj-embutido aside.lateral nav button, html.jmj-embutido aside.lateral nav a, html.jmj-embutido aside.lateral .aba {
  white-space: nowrap !important; height: 46px !important; min-height: 46px !important; padding: 0 12px !important; margin: 0 !important; width: auto !important;
  display: inline-flex !important; align-items: center !important; gap: 8px !important; background: transparent !important; box-shadow: none !important; font-size: 13.5px !important;
}
html.jmj-embutido aside.lateral nav a > button { height: 46px !important; padding: 0 !important; background: transparent !important; box-shadow: none !important; }
html.jmj-embutido aside.lateral nav .ativo, html.jmj-embutido aside.lateral nav .ativa, html.jmj-embutido aside.lateral .aba.ativa,
html.jmj-embutido aside.lateral nav button.ativo, html.jmj-embutido aside.lateral nav a.on, html.jmj-embutido aside.lateral .nav-link.ativo button {
  background: transparent !important; box-shadow: inset 0 -2px 0 var(--jmj-azul) !important; color: var(--jmj-preto) !important;
}
html.jmj-embutido aside.lateral nav span:not(.selo):not(.contador):not(.badge) { display: inline !important; }
html.jmj-embutido .conteudo { min-height: calc(100vh - 47px); }

/* Blocos de destaque que tinham texto claro sobre fundo escuro: tudo em preto, variações legíveis */
.ent-exec *, .evo-sintese *, .ia-leitura *, .rede-kpis div * { color: var(--jmj-preto) !important; }
.ent-exec .ent-olho, .ent-exec .ent-dica, .ent-exec .rot, .ent-exec .sub, .ent-exec small,
.evo-sintese small, .evo-sintese p, .ia-leitura small, .ia-leitura p, .rede-kpis div small { color: #45454F !important; }
.ent-exec .acima, .ent-exec .ent-delta.acima, .evo-sintese .acima { color: #0A7F52 !important; }
.ent-exec .abaixo, .ent-exec .ent-delta.abaixo, .evo-sintese .abaixo { color: #C42B2F !important; }
.ent-exec .ent-rotulo { color: var(--jmj-preto) !important; }

/* MyLeads · Mapa de relacionamentos: rede sobre cinza claro, rótulos pretos */
.rede { background: var(--jmj-cinza) !important; color: var(--jmj-preto) !important; }
.rede .anel { stroke: rgba(0,1,3,.10) !important; }
.rede .rot { fill: var(--jmj-preto) !important; stroke: var(--jmj-cinza) !important; }
.rede .rot-centro { fill: var(--jmj-preto) !important; }
.rede .rot-cat text { stroke: var(--jmj-cinza) !important; }
.rede .rot-cat .rot-cat-n { fill: #45454F !important; }
.rede .halo { fill: rgba(21,60,246,.10) !important; stroke: rgba(21,60,246,.35) !important; }
.rede-seg { background: #fff !important; border: 1px solid var(--jmj-cinza-fio) !important; border-radius: 0 !important; }
.rede-seg button { color: var(--jmj-preto) !important; border-radius: 0 !important; }
.rede-seg button.on { background: var(--jmj-preto) !important; color: #fff !important; }
.rede-busca input { background: #fff !important; color: var(--jmj-preto) !important; border: 1px solid var(--jmj-cinza-fio) !important; border-radius: 0 !important; }
.rede-busca input::placeholder { color: #686875 !important; }
.rede-sugest, .rede-painel { background: #fff !important; color: var(--jmj-preto) !important; border: 1px solid var(--jmj-cinza-fio) !important; }
.rede-sugest button, .rede-painel * { color: var(--jmj-preto); }
.rede-sugest small, .rede-painel small { color: #45454F !important; }
.rede-sugest button:hover { background: var(--jmj-cinza-hover) !important; }
.rede-filtros button { background: #fff !important; color: #45454F !important; border: 1px solid var(--jmj-cinza-fio) !important; border-radius: 0 !important; }
.rede-filtros button.on { background: color-mix(in srgb, var(--c) 14%, #fff) !important; color: var(--jmj-preto) !important; border-color: color-mix(in srgb, var(--c) 55%, transparent) !important; }
.rede-filtros button i { opacity: 1 !important; }
.rede-zoom button { background: #fff !important; color: var(--jmj-preto) !important; border: 1px solid var(--jmj-cinza-fio) !important; }
.rede-zoom button:hover { background: var(--jmj-cinza) !important; }
.rede-legenda { background: rgba(255,255,255,.9) !important; color: var(--jmj-preto) !important; border: 1px solid var(--jmj-cinza-fio) !important; }
.rede-vazio { color: #45454F !important; }
.rede-kpis span { color: #45454F !important; }
.m-N { color: #8E8E99 !important; } .m-P { color: #B45309 !important; }

/* Pipeline · Linha do tempo de entrada (geração de demanda): gráfico sobre branco, linha azul forte,
   números pretos, pico em verde e mês atual em âmbar, grade e média visíveis */
.ent-exec .ent-area { background: #fff !important; border: 1px solid var(--jmj-cinza-fio) !important; padding: 14px 10px 6px !important; }
.ent-exec .ent-resumo .bloco { border-left-color: var(--jmj-cinza-fio) !important; }
.ent-exec .ent-coluna { fill: rgba(21,60,246,.10) !important; }
.ent-exec .ent-grade { stroke: rgba(0,1,3,.08) !important; }
.ent-exec .ent-base { stroke: rgba(0,1,3,.35) !important; }
.ent-exec .ent-media { stroke: #45454F !important; stroke-width: 1.2 !important; }
.ent-exec .ent-media-rot { fill: #45454F !important; }
.ent-exec .ent-linha { stroke: var(--jmj-azul) !important; stroke-width: 3 !important; filter: none !important; }
.ent-exec .ent-no { fill: #fff !important; stroke: var(--jmj-azul) !important; stroke-width: 2.6 !important; }
.ent-exec .ent-num { fill: var(--jmj-preto) !important; font-weight: 600 !important; }
.ent-exec .ent-no-g.zero .ent-no { fill: #fff !important; stroke: #8E8E99 !important; }
.ent-exec .ent-no-g.zero .ent-num { fill: #8E8E99 !important; }
.ent-exec .ent-halo { fill: rgba(10,127,82,.16) !important; }
.ent-exec .ent-no-g.pico .ent-no { fill: #0A7F52 !important; stroke: #0A7F52 !important; }
.ent-exec .ent-no-g.pico .ent-num { fill: #0A7F52 !important; }
.ent-exec .ent-no-g.atual .ent-no { fill: #fff !important; stroke: #B45309 !important; }
.ent-exec .ent-no-g.atual .ent-num { fill: #B45309 !important; }
.ent-exec .ent-mes, .ent-exec .ent-mes * { color: var(--jmj-preto) !important; }
.ent-exec .ent-mes:not(:disabled):hover { background: rgba(21,60,246,.06) !important; }
.ent-exec .ent-mes:focus-visible { outline-color: var(--jmj-azul) !important; }

/* MyLeads · Radar de dores: logomarca ao lado do nome, como no restante da plataforma */
.jmj-radar-emp { display: flex; align-items: center; gap: 10px; min-width: 0; }
.jmj-radar-emp > div { min-width: 0; }
.jmj-radar-logo { flex: 0 0 30px; width: 30px; height: 30px; display: grid; place-items: center; background: #fff; border: 1px solid var(--jmj-cinza); font-size: 11px; font-weight: 600; color: var(--jmj-preto); overflow: hidden; }
.jmj-radar-logo img { width: 20px; height: 20px; }
.jmj-radar-logo.grande { flex-basis: 44px; width: 44px; height: 44px; font-size: 14px; }
.jmj-radar-logo.grande img { width: 30px; height: 30px; }
.jmj-radar-emp h2 { margin: 0; }

/* MyLeads · Mapa das empresas sobre o Google Maps */
.jmj-gmapa { position: absolute; inset: 0; z-index: 0; }
.jmj-google-ativo { background: #E0DFE5 !important; }
.jmj-google-ativo .leaflet-bottom.leaflet-left { bottom: 24px; }
.jmj-google-ativo .leaflet-control-attribution { display: none; }
.ent-exec .ent-valor { color: #45454F !important; }
.ent-exec .ent-legenda, .ent-exec .ent-legenda span { color: var(--jmj-preto) !important; }
.ent-exec .ent-legenda .l-linha { background: var(--jmj-azul) !important; }
.ent-exec .ent-legenda .l-coluna { background: rgba(21,60,246,.22) !important; }
.ent-exec .ent-legenda .l-media { background: repeating-linear-gradient(90deg, #45454F 0 3px, transparent 3px 6px) !important; }
.ent-exec .ent-legenda .l-pico { background: #0A7F52 !important; }
.ent-exec .ent-legenda .l-atual { border-color: #B45309 !important; }

/* MyLeads · Eventos */
main.conteudo.jmj-ev-ativo > :not(.jmj-ev):not(.topo-movel) { display: none !important; }
.jmj-ev { display: grid; gap: 16px; }
.nav .jmj-ev-bt { display: flex; align-items: center; gap: 10px; width: 100%; text-align: left; }
.nav .jmj-ev-bt svg { flex: none; }
.nav.jmj-ev-on button.ativo:not(.jmj-ev-bt) { background: transparent !important; color: inherit !important; box-shadow: none !important; font-weight: 500 !important; }
.nav.jmj-ev-on button.ativo:not(.jmj-ev-bt)::before { display: none !important; }
.jmj-ev-info { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 16px; padding: 10px 14px; border: 1px solid var(--jmj-cinza); background: #F5F5F7; font-size: 12.5px; color: #45454F; }
.jmj-ev-info.coletando { border-left: 3px solid var(--jmj-azul); background: #fff; }
.jmj-ev-info.coletando > div { display: grid; gap: 2px; }
.jmj-ev-info.coletando b { color: var(--jmj-preto); font-size: 13.5px; }
.jmj-ev-erro { color: #C42B2F; font-weight: 600; }
.jmj-ev-kpis .kpi { min-width: 0; }
.jmj-ev-filtros { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.jmj-ev-filtros input.campo { flex: 1 1 240px; min-width: 200px; }
.jmj-ev-filtros select.campo { flex: 0 1 200px; }
.jmj-ev-chk { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; color: #45454F; white-space: nowrap; }
.jmj-ev-tab td { vertical-align: middle; }
.jmj-ev-emp { display: flex; align-items: center; gap: 10px; min-width: 240px; max-width: 360px; }
.jmj-ev-emp > div { min-width: 0; }
.jmj-ev-logo { flex: 0 0 30px; width: 30px; height: 30px; display: grid; place-items: center; background: #fff; border: 1px solid var(--jmj-cinza); font-size: 11px; font-weight: 600; color: var(--jmj-preto); overflow: hidden; }
.jmj-ev-logo img { width: 20px; height: 20px; }
.jmj-ev-sub { display: block; color: #686875; font-size: 12px; margin-top: 2px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 300px; }
.jmj-ev-data { white-space: nowrap; }
.jmj-ev-chip { display: inline-block; margin: 2px 4px 2px 0; padding: 2px 7px; background: #F0EFF3; border: 1px solid var(--jmj-cinza); font-size: 11.5px; color: var(--jmj-preto); white-space: nowrap; }
.jmj-ev-barra { display: flex; align-items: center; gap: 8px; min-width: 110px; }
.jmj-ev-barra i { display: block; height: 6px; flex: none; }
.jmj-ev-barra b { font-variant-numeric: tabular-nums; font-size: 12.5px; }
.jmj-ev-acoes { text-align: right; white-space: nowrap; }
.jmj-ev-oculto { opacity: .5; }
.jmj-ev-toast { position: fixed; left: 50%; bottom: 22px; transform: translateX(-50%); background: var(--jmj-preto); color: #fff; padding: 10px 16px; font-size: 13px; z-index: 9999; }
.jmj-ev-toast.erro { background: #C42B2F; }

/* Telas que passaram para o CRM somem do menu do módulo; tela única não mostra menu */
html.jmj-embutido .jmj-movido, html.jmj-embutido aside.lateral nav a.jmj-movido, html.jmj-embutido aside.lateral nav button.jmj-movido, html.jmj-embutido aside.lateral .aba.jmj-movido { display: none !important; }
html.jmj-tela-unica aside.lateral { display: none !important; }
html.jmj-tela-unica .conteudo { min-height: 100vh; }

/* Fotos dos usuários: o arquivo de marca tirava a imagem do avatar do menu */
.avatar[style*="background-image"], .jmj-avatar[style*="background-image"], .av[style*="background-image"] { background-size: cover !important; background-position: center !important; color: transparent !important; }

/* Avatar padrão em todos os módulos: iniciais centralizadas, fundo preto e letra branca; foto quando houver */
.evo-av, .avatar, .av, .jmj-avatar { display: inline-flex !important; align-items: center !important; justify-content: center !important; line-height: 1 !important; padding: 0 !important; font-family: var(--jmj-fonte) !important; font-weight: 600 !important; letter-spacing: .02em !important; }
.evo-av:not([style*="background-image"]):not([data-jmj-foto="1"]), .avatar:not([style*="background-image"]):not([data-jmj-foto="1"]), .av:not([style*="background-image"]):not([data-jmj-foto="1"]), .jmj-avatar:not([style*="background-image"]):not([data-jmj-foto="1"]) { background-color: #000103 !important; color: #fff !important; }
.evo-av { border-radius: 50% !important; overflow: hidden; flex: none; }
.evo-av[style*="background-image"], [data-jmj-foto="1"] { background-size: cover !important; background-position: center !important; color: transparent !important; }