/* ─────────────────────────────────────────────────────────────────────
   FIGMA TOKENS — coinz-market
   Extracted 2026-05-11 from Figma file Product-CZ, frame
   "Desk – Coinz Market B" (node 2046:11410) via mcp__figma-desktop.
   This file OVERRIDES shared/theme.css where Figma is canonical.

   Note: the Figma frame still shows the OLD tabular layout (pre-18:04
   EEST meeting). The tokens are valid and durable — David will update
   the layout to match our 1×1 rail in a follow-up. Engineers picking
   this up should rely on the variable NAMES (e.g., "Surface/Dark") not
   the layout shown in Figma.
   ───────────────────────────────────────────────────────────────────── */

:root {
  /* ─── Figma variables (verbatim names → CSS custom properties)
     Mapping convention: --figma-{path-with-dashes-instead-of-slashes}
     Engineering maps these 1:1 to Stimulus values or Bootstrap utility classes. */

  /* Surface */
  --figma-surface-dark:        #001f58;       /* base bg */
  --figma-surface-dark-50:     #00072480;     /* 50%-alpha overlay */
  --figma-surface-dark-0:      #001f5800;     /* fully transparent variant */
  --figma-surface-lighter:     #0f2a5c;       /* card surface */
  --figma-surface-lightest:    #123a85;       /* hover / elevated surface */

  /* Text */
  --figma-text-primary:        #ffffff;
  --figma-text-secondary:      #8297bd;       /* muted body */
  --figma-text-dark-constant:  #000724;       /* for use on bright/light bg */
  --figma-text-inverted:       #000724;

  /* Border */
  --figma-border-light:        #4c7ac3;       /* cyan-blue, primary border */
  --figma-border-secondary:    #586680;

  /* Whites */
  --figma-white-50:            #ffffff1a;     /* 10% white (despite the name) */

  /* Gradient */
  --figma-green-gradient:      linear-gradient(135deg, #1a8a4d, #3aff8a);

  /* ─── Typography (Coinz uses Open Sans, NOT Inter) */
  --figma-font:                "Open Sans", system-ui, sans-serif;
  --figma-font-pre-title:      400 14px/1 var(--figma-font);   /* uppercase headers, tracking 0 */
  --figma-font-body-l-bold:    600 16px/1 var(--figma-font);
  --figma-font-body-m:         300 14px/1 var(--figma-font);

  /* ─── Override shared/theme.css where Figma is canonical
     (these win the cascade because figma-tokens.css loads AFTER theme.css) */

  /* Switch typography family — was Inter */
  --font-display:              var(--figma-font);

  /* Re-anchor the navy palette to Figma's exact values */
  --color-bg:                  var(--figma-surface-dark);
  --color-bg-deep:             var(--figma-text-dark-constant);
  --color-surface:             var(--figma-surface-lighter);
  --color-surface-2:           var(--figma-surface-lightest);
  --color-surface-3:           var(--figma-surface-lightest);

  /* Text — Figma's Text/Secondary (#8297bd) and Border/Secondary (#586680)
     read too gray against the deep-navy surfaces. PM feedback (2026-05-12):
     bump everything readable to (near-)white; design will reintroduce
     hierarchy with motion and energy, not low-contrast text. */
  --color-text:                var(--figma-text-primary);    /* #ffffff */
  --color-text-muted:          #ffffff;
  --color-text-dim:            #ffffff;

  /* Borders */
  --color-border:              var(--figma-border-secondary);
  --color-border-soft:         var(--figma-white-50);
}
