/* ============================================================
   Pro SST — COR POR MODULO
   ------------------------------------------------------------
   Retorno do cliente GSO EXAMES (25/09): o visual novo ficou "sem cores"
   e as cores ajudavam a saber onde se esta (Finance verde, Marketing...).
   A cor volta como IDENTIDADE DO MODULO, nao como enfeite: fundo segue
   branco e a cor do modulo entra onde orienta — aba ativa da topbar, item
   ativo da sidebar, cabecalho da pagina, botao principal, chips, graficos.

   As camadas novas (topbar, sidebar, listas, formularios, kanban/lead,
   dashboards) leem cada uma sua variavel de acento; aqui todas passam a
   apontar para a cor do modulo (body.mod-<modulo>, posta em cada base).
   Carregar DEPOIS dos outros CSS: mesma especificidade, vence a ordem.

   Paleta = a das abas antigas do panel_switcher (a memoria do usuario):
   Control azul Pro SST, Finance verde Cazura, Atendimento verde,
   Marketing rosa, RH indigo.
   ============================================================ */

body.mod-control     { --mod: #1E5CAD; --mod-d: #153060; --mod-tint: #E8F0FA; }
body.mod-finance     { --mod: #3B6064; --mod-d: #2E4E51; --mod-tint: #EAF1EF; }
body.mod-atendimento { --mod: #15803D; --mod-d: #166534; --mod-tint: #E7F6EC; }
body.mod-marketing   { --mod: #BE123C; --mod-d: #9F1239; --mod-tint: #FDECEF; }
body.mod-rh          { --mod: #4F46E5; --mod-d: #3730A3; --mod-tint: #EEF0FE; }

html[data-theme="dark"] body.mod-control     { --mod: #7FB2EE; --mod-d: #5B9BEA; --mod-tint: rgba(91, 155, 234, .16); }
html[data-theme="dark"] body.mod-finance     { --mod: #7FB8A5; --mod-d: #6FA894; --mod-tint: rgba(127, 184, 165, .16); }
html[data-theme="dark"] body.mod-atendimento { --mod: #4ADE80; --mod-d: #22C55E; --mod-tint: rgba(74, 222, 128, .14); }
html[data-theme="dark"] body.mod-marketing   { --mod: #FB7185; --mod-d: #F43F5E; --mod-tint: rgba(251, 113, 133, .16); }
html[data-theme="dark"] body.mod-rh          { --mod: #A5B4FC; --mod-d: #818CF8; --mod-tint: rgba(165, 180, 252, .16); }

/* ---------- Toda camada nova aponta para a cor do modulo ---------- */
body[class*="mod-"].topbar-nova,
html[data-theme="dark"] body[class*="mod-"].topbar-nova {
  --tb-on-accent: var(--mod);
}
body[class*="mod-"].sidebar-nova,
html[data-theme="dark"] body[class*="mod-"].sidebar-nova {
  --sb-accent: var(--mod);
  --sb-accent-d: var(--mod-d);
  --ln-accent: var(--mod);
  --ln-accent-d: var(--mod-d);
}
/* o Finance tem fundo de item ativo proprio (cartao branco), fica */
body[class*="mod-"]:not(.fin-cazura).sidebar-nova,
html[data-theme="dark"] body[class*="mod-"]:not(.fin-cazura).sidebar-nova {
  --sb-tint: var(--mod-tint);
}
body[class*="mod-"].crm-pipeline-novo,
html[data-theme="dark"] body[class*="mod-"].crm-pipeline-novo {
  --tbk-accent: var(--mod);
  --tbk-accent-d: var(--mod-d);
  --tbk-tint: var(--mod-tint);
}
body[class*="mod-"] .cd,
html[data-theme="dark"] body[class*="mod-"] .cd {
  --cd-accent: var(--mod);
  --cd-tint: var(--mod-tint);
}

/* ---------- Cabecalho da pagina: fundo clarinho + icone na cor do modulo ----------
   Meio-termo entre a faixa em gradiente antiga e o titulo branco da
   repaginacao: a faixa volta como um cartao com fundo levemente tingido
   na cor do modulo, e o icone ao lado do titulo reaparece num quadrado
   de cor solida. Cobre os dois esqueletos de cabecalho que listas-nova.css
   e forms-nova.css reconhecem (telas ja refeitas .ld/.cl/.cd ficam fora). */
html body[class*="mod-"].sidebar-nova :is(#conteudo-principal > [class*="space-y-"]:not(.cl):not(.ld) > :first-child:is([class*="bg-gradient"][class*="rounded-"], .theme-header, [class*="-hero"]), #conteudo-principal :is([class*="bg-gradient-to"], .theme-header)[class*="rounded-2xl"]:has(h1):not(:is(.ld, .cl, .cd) *)) {
  background: color-mix(in srgb, var(--mod) 6%, var(--ln-card)) !important;
  border: 1px solid color-mix(in srgb, var(--mod) 16%, var(--ln-card)) !important;
  border-radius: 12px !important;
  padding: 18px 22px !important;
}
html[data-theme="dark"] body[class*="mod-"].sidebar-nova :is(#conteudo-principal > [class*="space-y-"]:not(.cl):not(.ld) > :first-child:is([class*="bg-gradient"][class*="rounded-"], .theme-header, [class*="-hero"]), #conteudo-principal :is([class*="bg-gradient-to"], .theme-header)[class*="rounded-2xl"]:has(h1):not(:is(.ld, .cl, .cd) *)) {
  background: color-mix(in srgb, var(--mod) 10%, var(--ln-card)) !important;
  border-color: color-mix(in srgb, var(--mod) 24%, var(--ln-card)) !important;
}
html body[class*="mod-"].sidebar-nova :is(#conteudo-principal > [class*="space-y-"]:not(.cl):not(.ld) > :first-child:is([class*="bg-gradient"][class*="rounded-"], .theme-header, [class*="-hero"]), #conteudo-principal :is([class*="bg-gradient-to"], .theme-header)[class*="rounded-2xl"]:has(h1):not(:is(.ld, .cl, .cd) *)) div:is(.w-12, .w-14, .w-16):is(.h-12, .h-14, .h-16) {
  display: flex !important;
  width: 44px !important; height: 44px !important; flex: 0 0 44px;
  background: var(--mod) !important; background-image: none !important;
  border-radius: 10px !important;
  box-shadow: none !important; backdrop-filter: none !important;
  color: #FFF !important;
}
html body[class*="mod-"].sidebar-nova :is(#conteudo-principal > [class*="space-y-"]:not(.cl):not(.ld) > :first-child:is([class*="bg-gradient"][class*="rounded-"], .theme-header, [class*="-hero"]), #conteudo-principal :is([class*="bg-gradient-to"], .theme-header)[class*="rounded-2xl"]:has(h1):not(:is(.ld, .cl, .cd) *)) div:is(.w-12, .w-14, .w-16):is(.h-12, .h-14, .h-16) :is(svg, span, i) {
  color: #FFF !important; width: 22px; height: 22px;
}