/* ==========================================================================
   HANGARE AI LABS — TOKENS VISUAIS OFICIAIS BRANDBOOK REBRANDING 2026 (V4)
   Paleta Canônica:
   - Azul Noturno:    #07151B (Base institucional)
   - Grafite Azulado:  #132830 (Superfícies)
   - Turquesa:         #00CDB5 (Destaques e CTA / ponto característico)
   - Branco Gelo:      #F6F8F7 (Textos principais)
   - Cinza Frio:       #A7B7BA (Textos secundários)

   Sistema Tipográfico:
   - Manrope:          Títulos e chamadas
   - Inter:            Textos, números e interfaces
   ========================================================================== */

:root {
  /* Tipografia Canônica do BrandBook 2026 */
  --f-h: 'Manrope', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --f-b: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --f-m: 'JetBrains Mono', monospace;

  /* Transições e Curvas Easing */
  --ease: cubic-bezier(0.16, 1, 0.3, 1);
  --dur-fast: 180ms;
  --dur-med: 350ms;
  --dur-slow: 600ms;

  /* Tema Escuro Oficial BrandBook (Preferência Mandatória da Marca) */
  --bg-base: #07151B;           /* Azul noturno */
  --surface-card: #132830;      /* Grafite azulado */
  --surface-hover: #19343f;
  --surface-overlay: rgba(19, 40, 48, 0.92);

  --brand-turquesa: #00CDB5;    /* Turquesa oficial */
  --turquesa-soft: rgba(0, 205, 181, 0.1);
  --turquesa-glow: rgba(0, 205, 181, 0.22);

  --text-main: #F6F8F7;         /* Branco gelo */
  --text-muted: #A7B7BA;        /* Cinza frio */
  --text-faint: #435a60;

  --border-line: rgba(167, 183, 186, 0.12);
  --border-accent: rgba(0, 205, 181, 0.3);
  --border-subtle: rgba(255, 255, 255, 0.06);

  --header-bg: rgba(7, 21, 27, 0.85);

  /* Malha Ortopédica Fina & Linhas de Conexão (Linguagem Gráfica BrandBook) */
  --grid-pattern: linear-gradient(to right, rgba(167, 183, 186, 0.04) 1px, transparent 1px),
                  linear-gradient(to bottom, rgba(167, 183, 186, 0.04) 1px, transparent 1px);
}

/* Tema Claro Oficial (Aplicação Fundo Claro BrandBook página 4) */
:root[data-theme="light"],
html.light {
  --bg-base: #F6F8F7;           /* Branco gelo */
  --surface-card: #FFFFFF;
  --surface-hover: #F0F4F4;
  --surface-overlay: rgba(255, 255, 255, 0.94);

  --brand-turquesa: #009987;    /* Turquesa com contraste acessível para fundo claro */
  --turquesa-soft: rgba(0, 153, 135, 0.08);
  --turquesa-glow: rgba(0, 153, 135, 0.2);

  --text-main: #07151B;         /* Azul noturno */
  --text-muted: #4F6367;        /* Cinza frio escuro */
  --text-faint: #CBD5D7;

  --border-line: rgba(7, 21, 27, 0.1);
  --border-accent: rgba(0, 153, 135, 0.35);
  --border-subtle: rgba(7, 21, 27, 0.06);

  --header-bg: rgba(246, 248, 247, 0.9);

  --grid-pattern: linear-gradient(to right, rgba(7, 21, 27, 0.03) 1px, transparent 1px),
                  linear-gradient(to bottom, rgba(7, 21, 27, 0.03) 1px, transparent 1px);
}