/* =============================================================
   COVALYZE Design System — Token Layer
   =============================================================
   Source of truth for colour and type. Ported from the COVALYZE
   Design System export (`colors_and_type.css` + the analytics
   product kit).

   COVALYZE has two visually distinct surfaces. This application is
   the analytics product — everything behind the login — so it uses
   the *product* palette: navy primary text, orange section labels,
   green primary / blue secondary actions, dense tables, flat light
   surfaces, 2px corners.

   The marketing register (mono uppercase kickers, square navy
   buttons, editorial full-strength borders) must not leak in here.

   Load order:  fonts/font-face.css → this file → covalyze.css
   ============================================================= */

:root {
  /* ─── Brand ───────────────────────────────────────────── */
  --color-primary:        #162F7A;          /* Covalyze Blue */
  --color-primary-hover:  #1a347a;
  --color-primary-rgb:    22 47 122;        /* for color-mix / rgba() */

  /* ─── Data viz (from the DS; oklch) ──────────────────── */
  --color-chart-1:  oklch(0.646 0.222 41.116);    /* Orange — KPI accent   */
  --color-chart-2:  oklch(0.600 0.118 184.704);   /* Teal                  */
  --color-chart-3:  oklch(0.398 0.070 227.392);   /* Deep navy             */
  --color-chart-4:  oklch(0.828 0.189 84.429);    /* Yellow                */
  --color-chart-5:  oklch(0.769 0.188 70.080);    /* Amber                 */

  /* ─── Analytics product palette ──────────────────────── */
  --p-surface:      #f3f4f6;        /* shell behind the canvas */
  --p-canvas:       #ffffff;
  --p-stripe:       #f7f8fa;        /* zebra rows, raised fills */
  --p-hover:        #eef2f7;
  --p-line:         #d4d8e0;
  --p-line-soft:    #e6e9ee;
  --p-text:         #162F7A;        /* navy primary */
  --p-text-2:       #475569;
  --p-text-mute:    #6b7280;
  --p-rail-fg:      #6b8aad;        /* muted blue for rail icons */
  --p-orange:       #D97A2A;        /* section / group labels */
  --p-green:        #2E8540;        /* primary action */
  --p-green-hover:  #2a7639;
  --p-blue:         #2D6FB6;        /* secondary action */
  --p-blue-hover:   #265c98;
  --p-red:          #C84845;
  --p-yellow:       #E2A03F;
  --p-focus:        #93c5fd;

  /* ─── Type ───────────────────────────────────────────── */
  --font-sans: 'Geist Variable', -apple-system, BlinkMacSystemFont, 'Segoe UI',
               Roboto, 'Helvetica Neue', Arial, sans-serif;
  --font-mono: 'Geist Mono Variable', 'SF Mono', Monaco, 'Cascadia Code',
               'Roboto Mono', 'Courier New', monospace;
}

/* ─── In-product type roles ───────────────────────────────
   The marketing kit's display/kicker scale is deliberately absent —
   it does not belong behind the login. */

/* Section / group label — sentence case, orange. The product's one
   "loud" register, replacing the marketing mono kicker. */
.cv-group-label {
  font-family: var(--font-sans);
  font-weight: 500;
  font-size: 15px;
  letter-spacing: -0.005em;
  color: var(--p-orange);
  margin: 4px 0 8px;
}

/* KPI numeral — the DS accent is always chart-1 orange. */
.cv-stat-value {
  font-family: var(--font-mono);
  font-weight: 700;
  letter-spacing: -0.03em;
  line-height: 1;
  font-variant-numeric: tabular-nums;
  color: var(--color-chart-1);
}

/* Figures in tables: Geist Mono keeps digit columns aligned. */
.mono,
.cv-num {
  font-family: var(--font-mono);
  font-variant-numeric: tabular-nums;
}
