/* ============================================================
   Tokens de diseño · CRM GESÙ Hope Center
   Fuente: DESIGN/design_tokens_ghc.md (Paquete 2 · CRM completo).
   Ningún token previo se modifica; se transcriben tal cual como variables CSS.
   ============================================================ */
:root {
  /* 1.1 Marca */
  --brand-primary: #1E54EA;
  --brand-primary-hover: #1541B8;
  --brand-primary-soft: #EAF0FE;
  --brand-primary-border: #CFDDFB;
  --brand-secondary: #F79A3C;
  --brand-secondary-hover: #E8871F;
  --brand-secondary-text: #B5670C;
  --brand-secondary-soft: #FEF2E3;
  --brand-secondary-border: #F6D9B4;

  /* 1.2 Neutros */
  --bg-app: #EDF0F6;
  --bg-rail: #0E1A33;
  --surface: #FFFFFF;
  --surface-2: #F7F9FC;
  --border: #E3E8F0;
  --border-soft: #EEF1F6;
  --border-strong: #DDE3EE;
  --text-strong: #16223B;
  --text: #35415A;
  --text-muted: #6B7690;
  --text-subtle: #8A93A6;

  /* 1.3 Estado semántico */
  --success: #1F9D57;   --success-bg: #E4F6EC;  --success-text: #157A42;  --success-border: #BEE7CE;
  --warning: #C77700;   --warning-bg: #FEF6E6;  --warning-text: #8A6A3A;  --warning-border: #F0D9A8;
  --error: #D6453B;     --error-bg: #FBE6E4;    --error-text: #A23A32;    --error-border: #F3C8C4;
  --info: #1E54EA;      --info-bg: #EAF0FE;     --info-text: #1541B8;     --info-border: #CFDDFB;

  /* 9.1 Superficies nuevas del CRM */
  --surface-inverse: #0E1A33;
  --brand-tertiary: #7A5AF0;
  --brand-tertiary-soft: #EEEAFB;
  --brand-tertiary-text: #5B3FD0;
  --brand-quaternary: #14A2B8;
  --hero-gradient: linear-gradient(120deg, #12224A, #1E3E8C);
  --sensitive-bg: #FBEEEA;
  --sensitive-border: #F3C8C4;
  --sensitive-text: #A23A32;

  /* Texto sobre el riel oscuro */
  --rail-title: #E6ECF7;
  --rail-item: #AEBBD6;
  --rail-group: #6E82AA;
  --rail-sub: #8CA0C6;
  --rail-active-bg: rgba(30, 84, 234, .32);

  /* 2 Tipografía */
  --font: 'Public Sans', system-ui, -apple-system, 'Segoe UI', sans-serif;

  /* 3 Espaciado (base 4px) */
  --space-1: 4px;  --space-2: 8px;  --space-3: 12px; --space-4: 16px;
  --space-5: 20px; --space-6: 24px; --space-8: 32px; --space-10: 40px;

  /* 4 Radios */
  --radius-sm: 7px; --radius-md: 9px; --radius-lg: 14px; --radius-xl: 18px; --radius-pill: 999px;

  /* 5 Sombras */
  --shadow-sm: 0 1px 2px rgba(16, 34, 60, .05);
  --shadow-md: 0 4px 12px -2px rgba(16, 34, 60, .10);
  --shadow-lg: 0 12px 28px -12px rgba(16, 34, 60, .22);
  --shadow-primary: 0 2px 6px rgba(30, 84, 234, .28);
  --focus-ring: 0 0 0 3px rgba(30, 84, 234, .30);
  --focus-ring-error: 0 0 0 3px rgba(214, 69, 59, .12);

  /* 9.4 Riel y campos oscuros */
  --rail-width: 256px;
  --field-dark-bg: rgba(255, 255, 255, .06);
  --field-dark-border: rgba(255, 255, 255, .16);
}