/* ============================================================
   brand.css — Tokens de identidade visual do CMS Montes Claros
   Baseado no Brand Guide oficial do Conselho Municipal de Saúde
   Versão 1.0 | Secretaria Executiva CMS-MOC
   ============================================================ */

/* ── Google Fonts ─────────────────────────────────────────── */
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400;600;700;800;900&family=Open+Sans:wght@300;400;600&display=swap');

/* ── Variáveis de Cor ──────────────────────────────────────── */
:root {
  /* Paleta primária */
  --cms-blue:    #1B6CB5;   /* Azul institucional */
  --cms-navy:    #0D2E5A;   /* Azul marinho profundo */
  --cms-green:   #1E8A4A;   /* Verde saúde */
  --cms-yellow:  #F5C400;   /* Amarelo destaque */

  /* Paleta neutra */
  --cms-white:   #FFFFFF;
  --cms-off:     #F7F8FA;   /* Fundo suave */
  --cms-ink:     #111827;   /* Texto principal */
  --cms-muted:   #6B7280;   /* Texto secundário */
  --cms-border:  #E5E7EB;   /* Bordas */
  --cms-surface: #FFFFFF;   /* Superfície de cards */

  /* Estados */
  --cms-blue-hover:  #1558A0;
  --cms-navy-hover:  #0a2347;
  --cms-green-light: #D1FAE5;
  --cms-blue-light:  #DBEAFE;
  --cms-yellow-light:#FEF9C3;

  /* Sombras */
  --shadow-sm:  0 1px 3px rgba(13,46,90,0.08), 0 1px 2px rgba(13,46,90,0.06);
  --shadow-md:  0 4px 16px rgba(13,46,90,0.12), 0 2px 6px rgba(13,46,90,0.08);
  --shadow-lg:  0 10px 32px rgba(13,46,90,0.15), 0 4px 12px rgba(13,46,90,0.10);
  --shadow-card:0 2px 8px rgba(13,46,90,0.08);

  /* Tipografia */
  --font-display: 'Montserrat', sans-serif;
  --font-body:    'Open Sans', sans-serif;

  /* Escala tipográfica */
  --text-xs:   11px;
  --text-sm:   13px;
  --text-base: 15px;
  --text-md:   17px;
  --text-lg:   20px;
  --text-xl:   24px;
  --text-2xl:  32px;
  --text-3xl:  44px;

  /* Espaçamentos */
  --space-1:  4px;
  --space-2:  8px;
  --space-3:  12px;
  --space-4:  16px;
  --space-5:  20px;
  --space-6:  24px;
  --space-8:  32px;
  --space-10: 40px;
  --space-12: 48px;
  --space-16: 64px;

  /* Border radius */
  --radius-sm:  6px;
  --radius-md:  10px;
  --radius-lg:  14px;
  --radius-xl:  20px;
  --radius-full: 9999px;

  /* Transições */
  --transition-fast:   0.15s ease;
  --transition-base:   0.25s ease;
  --transition-slow:   0.4s ease;

  /* Navbar */
  --navbar-height: 60px;

  /* Z-index */
  --z-navbar:   100;
  --z-modal:    200;
  --z-toast:    300;
  --z-overlay:  150;
}

/* ── Dark Mode (futuro) ────────────────────────────────────── */
/* @media (prefers-color-scheme: dark) { ... } */