/*
 * Tokens do design system "Flows · JCB LATAM" (artifact de design system,
 * exportado em 23/09/2026). Copia fiel do tokens.css gerado de tokens.json:
 * nao edite aqui - mude o design system e copie de novo. As telas usam so
 * estas variaveis; application.css nao tem hex solto.
 */
:root {
  --jcb-yellow: #fcaf26;
  --jcb-yellow-dark: #e09d1f;
  --jcb-gray-dark: #575d5e;
  --jcb-gray-light: #b0b0a9;
  --black: #000000;
  --white: #ffffff;
  --gray-50: #f9fafb;
  --gray-100: #f3f4f6;
  --gray-200: #e5e7eb;
  --gray-400: #9ca3af;
  --gray-500: #6b7280;
  --gray-700: #374151;
  --gray-800: #1f2937;
  --divider: #e5e5e5;
  --green-50: #f0fdf4;
  --green-100: #dcfce7;
  --green-500: #22c55e;
  --green-700: #15803d;
  --green-800: #166534;
  --amber-50: #fffbeb;
  --amber-100: #fef3c7;
  --amber-500: #f59e0b;
  --amber-800: #92400e;
  --red-50: #fef2f2;
  --red-100: #fee2e2;
  --red-500: #ef4444;
  --red-600: #dc2626;
  --red-700: #b91c1c;
  --red-800: #991b1b;
  --blue-50: #eff6ff;
  --blue-100: #dbeafe;
  --blue-500: #3b82f6;
  --blue-700: #1d4ed8;
  --blue-800: #1e40af;
  --surface-page: var(--gray-50);
  --surface: var(--white);
  --surface-inverse: var(--black);
  --surface-hover: var(--gray-50);
  --text: var(--black);
  --text-muted: var(--jcb-gray-dark);
  --text-on-inverse: var(--white);
  --text-on-inverse-muted: var(--gray-400);
  --border: var(--jcb-gray-light);
  --border-control: var(--jcb-gray-dark);
  --action: var(--jcb-yellow);
  --action-hover: var(--jcb-yellow-dark);
  --on-action: var(--black);
  --focus-ring: var(--jcb-yellow);
  --danger-text: var(--red-600);
  --metric-alert: var(--red-700);
  --metric-warn: var(--amber-800);
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-6: 24px;
  --space-8: 32px;
  --space-12: 48px;
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-full: 9999px;
  --shadow-menu: 0 10px 15px -3px rgba(0,0,0,0.1), 0 4px 6px -4px rgba(0,0,0,0.1);
  --content-max: 1280px;
  --form-max: 1024px;
  --login-max: 448px;
  --navbar-height: 64px;
  --menu-width: 224px;
  --avatar-size: 28px;
  --logo-nav-height: 36px;
  --icon-md: 20px;
  --font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji";
}