/* ════════════════════════════════════════════════════════════════════════
   tokens.css — design tokens (lei imutável do master).
   Único parametrizável por projeto: qual --accent-* é promovido a --primary.
   SEMAS → PRIMARY_ACCENT = blue (logo #NOVA SEMAS).
   ════════════════════════════════════════════════════════════════════════ */

@font-face {
  font-family: 'Geist';
  src: url('../fonts/Geist-Regular.woff2') format('woff2');
  font-weight: 400; font-display: swap;
}
@font-face {
  font-family: 'Geist';
  src: url('../fonts/Geist-Medium.woff2') format('woff2');
  font-weight: 500; font-display: swap;
}
@font-face {
  font-family: 'Geist';
  src: url('../fonts/Geist-SemiBold.woff2') format('woff2');
  font-weight: 600; font-display: swap;
}
@font-face {
  font-family: 'Geist';
  src: url('../fonts/Geist-Bold.woff2') format('woff2');
  font-weight: 700; font-display: swap;
}
@font-face {
  font-family: 'Geist Mono';
  src: url('../fonts/GeistMono-Regular.woff2') format('woff2');
  font-weight: 400; font-display: swap;
}

:root {
  /* ════════ TIPOGRAFIA ════════ */
  --font-sans: 'Geist', Inter, ui-sans-serif, system-ui, sans-serif;
  --font-mono: 'Geist Mono', ui-monospace, 'Courier New', monospace;

  --text-xs:   12px;
  --text-sm:   14px;
  --text-base: 16px;
  --text-lg:   18px;
  --text-xl:   20px;
  --text-2xl:  24px;
  --text-3xl:  30px;
  --text-4xl:  36px;
  --text-5xl:  48px;

  --fw-regular:  400;
  --fw-medium:   500;
  --fw-semibold: 600;
  --fw-bold:     700;

  --tracking-tight:   -0.02em;
  --tracking-tighter: -0.03em;
  --tracking-wide:     0.05em;
  --tracking-widest:   0.1em;

  /* ════════ CORES NEUTRAS ════════ */
  --neutral-0:   #ffffff;
  --neutral-50:  #fafafa;
  --neutral-100: #f5f5f5;
  --neutral-200: #e5e5e5;
  --neutral-300: #d4d4d4;
  --neutral-400: #a3a3a3;
  --neutral-500: #737373;
  --neutral-600: #525252;
  --neutral-700: #404040;
  --neutral-800: #262626;
  --neutral-900: #171717;
  --neutral-950: #0a0a0a;

  /* ════════ ACENTOS ════════ */
  --accent-blue-50:    #eff6ff;
  --accent-blue-100:   #dbeafe;
  --accent-blue-600:   #2563eb;
  --accent-blue-700:   #1d4ed8;

  --accent-purple-50:  #faf5ff;
  --accent-purple-100: #f3e8ff;
  --accent-purple-600: #9333ea;

  --accent-emerald-50:  #ecfdf5;
  --accent-emerald-100: #d1fae5;
  --accent-emerald-600: #059669;
  --accent-emerald-700: #047857;

  --accent-amber-50:  #fffbeb;
  --accent-amber-100: #fef3c7;
  --accent-amber-600: #d97706;

  --accent-red-50:  #fef2f2;
  --accent-red-100: #fee2e2;
  --accent-red-600: #dc2626;

  /* ════════ MARCA — navy do Clube do Remo (#081126). Escudo = só referência, não vai no app. ════════ */
  --brand-50:   #eef0f5;   /* branco-azulado p/ realces sutis */
  --brand-100:  #c9ccd3;   /* cinza claro — contorno (apoio Remo) */
  --brand-200:  #9aa3b2;
  --brand-500:  #2e3a57;
  --brand-600:  #1a2236;   /* navy secundário */
  --brand-700:  #081126;   /* navy principal */
  --brand-800:  #050b18;

  /* ════════ SEMÂNTICA — TEMA ESCURO (navy Remo). Usar sempre estas. ════════ */
  --bg:             #081126;   /* navy principal */
  --bg-subtle:      #0c1830;
  --bg-muted:       #1a2236;   /* navy secundário — superfícies/cards */
  --bg-inverted:    #f5f5f5;

  --text:           #f5f5f5;   /* branco */
  --text-secondary: #c9ccd3;   /* cinza claro */
  --text-muted:     #9aa0ab;
  --text-subtle:    #6c7380;   /* cinza escuro — detalhes */
  --text-inverted:  #081126;

  --border:         #1e2840;
  --border-strong:  #2b3754;
  --border-subtle:  #141d33;

  /* PRIMARY = branco sobre navy (monocromático sóbrio) */
  --primary:        #f5f5f5;
  --primary-hover:  #e4e7ee;
  --primary-text:   #081126;
  --primary-subtle: #1a2236;
  --primary-border: #2b3754;

  /* STATUS — tons ajustados p/ leitura sobre fundo escuro */
  --success:        #34d399;
  --success-bg:     rgba(52,211,153,0.12);
  --success-border: rgba(52,211,153,0.30);

  --info:           #c9ccd3;
  --info-bg:        #1a2236;
  --info-border:    #2b3754;

  --warning:        #fbbf24;
  --warning-bg:     rgba(251,191,36,0.12);
  --warning-border: rgba(251,191,36,0.30);

  --danger:         #f87171;
  --danger-bg:      rgba(248,113,113,0.12);
  --danger-border:  rgba(248,113,113,0.30);

  /* ════════ 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;
  --space-20: 80px;
  --space-24: 96px;

  /* ════════ RADIUS ════════ */
  --radius-sm:   4px;
  --radius-md:   8px;
  --radius-lg:   12px;
  --radius-xl:   16px;
  --radius-2xl:  20px;
  --radius-3xl:  32px;   /* cards "hero" arredondados (estética de referência) */
  --radius-full: 9999px;

  /* ════════ SHADOWS ════════ */
  --shadow-sm:  0 1px 2px rgba(0,0,0,0.30);
  --shadow-md:  0 8px 24px rgba(0,0,0,0.40);
  --shadow-lg:  0 18px 44px rgba(0,0,0,0.50);
  --shadow-xl:  0 24px 56px rgba(0,0,0,0.55);
  --shadow-2xl: 0 28px 70px rgba(0,0,0,0.60);

  /* ════════ TRANSIÇÕES ════════ */
  --ease:          cubic-bezier(0.4, 0, 0.2, 1);
  --ease-out:      cubic-bezier(0, 0, 0.2, 1);
  --duration-fast: 150ms;
  --duration:      250ms;
  --duration-slow: 400ms;

  /* ════════ Z-INDEX ════════ */
  --z-dropdown: 100;
  --z-modal:    500;
  --z-tooltip:  1000;
  --z-toast:    2000;

  /* ════════ SAFE-AREA (notch / barras) ════════ */
  --safe-top:    env(safe-area-inset-top, 0px);
  --safe-bottom: env(safe-area-inset-bottom, 0px);
  --safe-left:   env(safe-area-inset-left, 0px);
  --safe-right:  env(safe-area-inset-right, 0px);
}