/* ==========================================================================
   Innov Tech — Design tokens "Eclipse / Blueprint UI" (fase 1 do redesign)

   Fonte única da paleta. style.css NÃO usa estes nomes diretamente na
   maioria das regras: os tokens antigos (--surface, --line, --primary...)
   do :root de style.css passaram a apontar pra cá — assim a troca de
   identidade repinta as ~3.700 linhas existentes sem reescrevê-las, e um
   ajuste de cor futuro é feito só neste arquivo.

   Profundidade por LUMINOSIDADE (não por borda forte): cada camada é um
   degrau mais clara que a de baixo —
     nível 0  --innov-bg              sidebar / fundo da aplicação
     nível 1  --innov-canvas          área de conteúdo (com o "blueprint")
     nível 2  --innov-surface         cards
     nível 3  --innov-surface-raised  thead, tiles internos, inputs
     nível 4  --innov-surface-overlay popovers, dropdowns, modais
   (O tema anterior tinha a ordem invertida: card #01021a mais ESCURO que o
   fundo #111827 — por isso tudo parecia um bloco preto só.)

   Contraste medido (WCAG 2.x), texto sobre --innov-surface:
     --innov-text 14:1 · --innov-text-secondary 7.8:1 · --innov-text-muted 5.1:1
     --innov-primary-text 6.6:1 · branco sobre --innov-primary 4.55:1 (AA)
   ========================================================================== */

:root {
  /* ---------- Camadas ---------- */
  --innov-bg:              #0B1322;
  --innov-canvas:          #0F1A2D;
  --innov-surface:         #15233A;
  --innov-surface-raised:  #1B2B46;
  --innov-surface-hover:   #22355A;
  --innov-surface-overlay: #1F3050;
  --innov-zebra:           rgba(148, 172, 212, 0.025);

  /* ---------- Bordas (neutras, nunca azul saturado) ---------- */
  --innov-border:          rgba(148, 172, 212, 0.13);
  --innov-border-strong:   rgba(148, 172, 212, 0.24);

  /* ---------- Texto ---------- */
  --innov-text:            #EEF3FB;
  --innov-text-secondary:  #A9B7CD;
  --innov-text-muted:      #8494AE;

  /* ---------- Índigo elétrico (cor principal) ----------
     Dois papéis com luminância diferente, de propósito:
     --innov-primary        preenchimento de botão (texto branco AA em cima)
     --innov-primary-bright acento gráfico — borda, rail, anel de foco, ícone
     --innov-primary-text   link/texto índigo sobre fundo escuro */
  --innov-primary:         #5468F0;
  --innov-primary-hover:   #4A5EE6;
  --innov-primary-bright:  #6377FF;
  --innov-primary-text:    #93A2FF;
  --innov-primary-soft:    rgba(99, 119, 255, 0.13);
  --innov-on-primary:      #FFFFFF;

  /* ---------- Teal / ciano (acento secundário) ---------- */
  --innov-accent:          #2DD4BF;
  --innov-accent-soft:     rgba(45, 212, 191, 0.12);

  /* ---------- Estados (saturação contida; fundo sempre translúcido) ---------- */
  --innov-success:         #4ADE9B;
  --innov-success-soft:    rgba(74, 222, 155, 0.12);
  --innov-warning:         #F2B84B;
  --innov-warning-soft:    rgba(242, 184, 75, 0.12);
  --innov-danger:          #FF6B74;
  --innov-danger-soft:     rgba(255, 107, 116, 0.12);
  --innov-danger-strong:   #E5484D; /* preenchimento de botão destrutivo (branco 4.6:1) */
  --innov-neutral-soft:    rgba(148, 172, 212, 0.12);

  /* ---------- Assinatura "electric edge" (índigo → teal) ---------- */
  --innov-edge: linear-gradient(90deg, var(--innov-primary-bright) 0%, var(--innov-accent) 100%);
  --innov-edge-vertical: linear-gradient(180deg, var(--innov-primary-bright) 0%, var(--innov-accent) 100%);

  /* ---------- Raio ---------- */
  --innov-radius-sm: 8px;
  --innov-radius-md: 12px;
  --innov-radius-lg: 16px;
  --innov-radius-pill: 999px;

  /* ---------- Sombra (leve — profundidade vem da luminosidade) ---------- */
  --innov-shadow-sm: 0 1px 2px rgba(3, 8, 20, 0.35);
  --innov-shadow-md: 0 12px 32px -12px rgba(3, 8, 20, 0.65), 0 2px 6px rgba(3, 8, 20, 0.3);
  --innov-overlay:   rgba(6, 11, 22, 0.66);

  /* ---------- Foco ---------- */
  --innov-ring:      0 0 0 3px rgba(99, 119, 255, 0.35);

  /* ---------- Espaçamento (escala 4/8/12/16/24/32) ---------- */
  --sp-1: 4px;
  --sp-2: 8px;
  --sp-3: 12px;
  --sp-4: 16px;
  --sp-5: 24px;
  --sp-6: 32px;

  /* ---------- Movimento ---------- */
  --innov-ease: cubic-bezier(.2, .7, .3, 1);
  --innov-dur:  160ms;
}
