/* ==========================================================================
   FORJA Design System — Tokens (ITE/STO Exchange)
   ========================================================================== */

:root {
  /* --- Colors: Base (Structure) --- */
  --forja-bg-0: #0A0E14;    /* Fondo absoluto / Canvas background */
  --forja-bg-1: #11161F;    /* Paneles principales / Main containers */
  --forja-bg-2: #1A212C;    /* Tarjetas & elevaciones / Cards & modals */
  --forja-bg-3: #242C38;    /* Inputs & Hover states */
  --forja-bg-4: #2D3748;    /* Active states & dropdown items */
  --forja-line: #2A3340;    /* Bordes sutiles / Dividers */
  --forja-line-strong: #3F4C5E; /* Bordes enfocados / Active borders */

  /* --- Colors: Text & Typography --- */
  --forja-text-primary: #F0F4F8;
  --forja-text-secondary: #8FA3B8;
  --forja-text-muted: #5A6E85;
  --forja-text-inverse: #0A0E14;

  /* --- Colors: Brand (Identity) --- */
  --forja-cobre: #C77B3C;        /* Principal — Cobre forjado */
  --forja-cobre-hover: #D88C4B;
  --forja-cobre-active: #B56B2E;
  --forja-cobre-glow: rgba(199, 123, 60, 0.2);

  --forja-oro: #E5B463;          /* STO & Accent — Oro mate */
  --forja-oro-hover: #F0C374;
  --forja-oro-active: #D4A350;
  --forja-oro-glow: rgba(229, 180, 99, 0.2);

  --forja-acero: #8FA3B8;        /* Gris azulado / Neutral metallic */

  /* --- Colors: Semantic --- */
  --forja-buy: #2EB67D;          /* Verde orden compra / Subsidized green */
  --forja-buy-hover: #37C98B;
  --forja-buy-bg: rgba(46, 182, 125, 0.12);
  --forja-buy-border: rgba(46, 182, 125, 0.3);

  --forja-sell: #D04A3A;         /* Rojo orden venta / Terracotta red */
  --forja-sell-hover: #DE5747;
  --forja-sell-bg: rgba(208, 74, 58, 0.12);
  --forja-sell-border: rgba(208, 74, 58, 0.3);

  --forja-alerta: #E0A93C;       /* Warning / Yellow brass */
  --forja-alerta-bg: rgba(224, 169, 60, 0.12);

  --forja-info: #6B8FAD;         /* Info / Steel blue */
  --forja-info-bg: rgba(107, 143, 173, 0.12);

  /* --- Typography --- */
  --forja-font-sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --forja-font-mono: 'JetBrains Mono', 'IBM Plex Mono', 'Roboto Mono', monospace;
  --forja-font-display: 'Space Grotesk', 'Inter', sans-serif;

  /* Font Weights */
  --forja-fw-regular: 400;
  --forja-fw-medium: 500;
  --forja-fw-semibold: 600;
  --forja-fw-bold: 700;

  /* --- Spacing --- */
  --forja-space-xs: 4px;
  --forja-space-sm: 8px;
  --forja-space-md: 16px;
  --forja-space-lg: 24px;
  --forja-space-xl: 32px;
  --forja-space-2xl: 48px;

  /* --- Border Radius --- */
  --forja-radius-sm: 4px;
  --forja-radius-md: 8px;
  --forja-radius-lg: 12px;
  --forja-radius-xl: 16px;
  --forja-radius-full: 9999px;

  /* --- Elevation & Shadows --- */
  --forja-shadow-sm: 0 2px 4px rgba(0, 0, 0, 0.4);
  --forja-shadow-md: 0 4px 12px rgba(0, 0, 0, 0.5);
  --forja-shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.6);
  --forja-shadow-cobre: 0 0 16px var(--forja-cobre-glow);
  --forja-shadow-oro: 0 0 16px var(--forja-oro-glow);

  /* --- Motion / Transitions --- */
  --forja-transition-fast: 0.15s cubic-bezier(0.4, 0, 0.2, 1);
  --forja-transition-normal: 0.25s cubic-bezier(0.4, 0, 0.2, 1);
  --forja-transition-slow: 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}
