/* ============================================================
   MODEV — tokens de cor do ecossistema
   Paleta conforme o Manual de Identidade Visual (aplicações digitais).
   Cada sistema define --modev-produto com a sua cor; todo o resto
   do tema é comum, para que os sistemas pareçam a mesma família.
   ============================================================ */

:root {
  /* ---- paleta institucional ---- */
  --modev-preto:   #000000;
  --modev-branco:  #ffffff;
  --modev-cinza:   #666666;  /* Cool Gray 10 U/C */
  --modev-magenta: #990066;  /* Pantone 265 U/C */
  --modev-roxo:    #9900ff;  /* Pantone 2725 U/C */
  --modev-laranja: #ff6600;  /* Pantone 021 U/C  */
  --modev-verde:   #3cff6e;  /* Pantone 802 U/C  */
  --modev-ciano:   #33ffcc;  /* Pantone 7471 U/C */

  /* ---- neutros de interface (derivados do preto institucional) ---- */
  --modev-n-0:   #ffffff;
  --modev-n-50:  #f6f6f7;
  --modev-n-100: #ededee;
  --modev-n-200: #dcdcde;
  --modev-n-300: #bcbcc0;
  --modev-n-400: #949499;
  --modev-n-500: #666666;
  --modev-n-700: #3d3d40;
  --modev-n-800: #212123;
  --modev-n-900: #111112;

  /* ---- cor do produto ----
     Sem valor definido, o "+" nao e preenchido: fica vazado, mostrando o fundo,
     que e o tratamento original da marca em uma cor so. Cada sistema define a sua. ---- */
  --modev-produto: transparent;

  /* ---- semânticos ---- */
  --modev-sucesso: #1e8e5a;
  --modev-atencao: #c98a16;
  --modev-erro:    #d92d20;
  --modev-info:    #2b6cb0;

  /* ---- status de projeto (Planner) ---- */
  --modev-status-planejado:    var(--modev-n-400);
  --modev-status-andamento:    var(--modev-info);
  --modev-status-risco:        var(--modev-atencao);
  --modev-status-atrasado:     var(--modev-erro);
  --modev-status-concluido:    var(--modev-sucesso);
  --modev-status-bloqueado:    var(--modev-n-700);

  /* ---- papéis de interface ---- */
  --modev-bg:          var(--modev-n-50);
  --modev-surface:     var(--modev-n-0);
  --modev-surface-alt: var(--modev-n-100);
  --modev-border:      var(--modev-n-200);
  --modev-text:        var(--modev-n-900);
  --modev-text-muted:  var(--modev-n-500);
  --modev-primary:     var(--modev-n-900);
  --modev-on-primary:  var(--modev-n-0);
  --modev-focus:       var(--modev-produto);

  /* ---- forma e tipografia ---- */
  --modev-radius-sm: 4px;
  --modev-radius-md: 8px;
  --modev-radius-lg: 14px;
  --modev-font-marca: 'Cocogoose', 'Montserrat', system-ui, sans-serif; /* só marca e títulos */
  --modev-font-ui:    'Inter', 'Segoe UI', system-ui, -apple-system, sans-serif;
  --modev-font-dados: 'JetBrains Mono', 'SF Mono', Consolas, monospace;
}

[data-tema="escuro"] {
  --modev-bg:          var(--modev-n-900);
  --modev-surface:     var(--modev-n-800);
  --modev-surface-alt: var(--modev-n-700);
  --modev-border:      #34343a;
  --modev-text:        var(--modev-n-100);
  --modev-text-muted:  var(--modev-n-400);
  --modev-primary:     var(--modev-produto);
  --modev-on-primary:  var(--modev-preto);
}

/* ---- cada sistema do ecossistema ----
   O cinza NÃO entra aqui: ele é a cor do cabeçalho e do resto da interface.
   O portal usa o "+" neutro (herda a cor do texto) — cor só quando o
   usuário está dentro de um sistema específico. ---- */
[data-produto="portal"]    { --modev-produto: transparent; --modev-focus: var(--modev-preto); }
[data-produto="systems"]   { --modev-produto: var(--modev-roxo); }
[data-produto="planner"]   { --modev-produto: var(--modev-ciano); }
[data-produto="financial"] { --modev-produto: var(--modev-laranja); }
[data-produto="sales"]     { --modev-produto: var(--modev-magenta); }
[data-produto="wiki"]      { --modev-produto: var(--modev-verde); }

/* Atenção: verde, ciano e laranja são cores de altíssima saturação.
   Use-as como acento (bordas, ícones, foco, gráficos), nunca como
   fundo de blocos grandes de texto. Sobre elas, texto sempre preto. */