/* Najobu — tokens del sistema de diseño (tema claro) + acento de Najobu Pay (finanzas) */
:root {
  --bg: #FFFFFF;
  --bg-subtle: #F5F5F7;
  --bg-raised: #FFFFFF;
  --ink: #1D1D1F;
  --ink-muted: #6E6E73;
  --line: #D2D2D7;
  --line-strong: #86868B;
  --action: #000000;
  --on-action: #FFFFFF;
  --focus: #0071E3;
  --success: #1A7F4B;
  --danger: #C4271C;

  /* Acento del producto: accent-finanzas */
  --accent: #0A5BD8;
  --on-accent: #FFFFFF;
  --accent-tint: #E6EFFD;

  /* Valores del tema oscuro, usados en el bloque negro de Seguridad */
  --dark-bg: #000000;
  --dark-raised: #1C1C1E;
  --dark-ink: #F5F5F7;
  --dark-ink-muted: #A1A1A6;
  --dark-line: #3A3A3C;
  --dark-accent: #5AA2FF;

  --font-display: "Manrope", "Helvetica Neue", Arial, sans-serif;
  --font-text: "Instrument Sans", "Helvetica Neue", Arial, sans-serif;

  --space-1: 4px;  --space-2: 8px;  --space-3: 12px; --space-4: 16px; --space-5: 24px;
  --space-6: 32px; --space-7: 48px; --space-8: 64px; --space-9: 96px; --space-10: 128px;

  --radius-sm: 8px; --radius-md: 12px; --radius-lg: 20px; --radius-xl: 28px; --radius-pill: 999px;

  --shadow-card: 0 1px 2px rgba(0,0,0,0.04), 0 8px 24px rgba(0,0,0,0.06);
  --shadow-float: 0 2px 4px rgba(0,0,0,0.05), 0 16px 48px rgba(0,0,0,0.12);
}