/*
 * NexHire design tokens — canonical values per spec §7A.1, transcribed from
 * the approved MVP Portal 9 prototype. This file is the single source of
 * truth for colour, radius, shadow, easing and type; components consume the
 * custom properties, never raw hex.
 *
 * Fonts: DM Sans (body/UI), Syne (display/brand), JetBrains Mono (numbers,
 * money, IDs). Self-hosted font files land with the asset pipeline; until
 * then the stacks fall back to system faces.
 */
:root {
    /* Navy sidebar scale */
    --nx-navy-900: #0B1120;
    --nx-navy-800: #141E30;
    --nx-navy-700: #1C2A40;

    /* Primary */
    --nx-primary: #2563EB;
    --nx-primary-hover: #1D4ED8;
    --nx-primary-tint: #EFF6FF;

    /* Semantic + -xl tints */
    --nx-teal: #0891B2;
    --nx-teal-xl: #ECFEFF;
    --nx-green: #059669;
    --nx-green-xl: #ECFDF5;
    --nx-amber: #D97706;
    --nx-amber-xl: #FFFBEB;
    --nx-red: #DC2626;
    --nx-red-xl: #FEF2F2;
    --nx-purple: #7C3AED;
    --nx-purple-xl: #F5F3FF;
    /* Text in a semantic colour (round 974). The colours above are for
       fills; as small text on their own tint teal, green, amber and red
       read at 3.07–4.41:1, under WCAG 1.4.3's 4.5:1. These are one shade
       darker and read at 4.84–5.91:1. Purple passes as it is. */
    --nx-teal-text: #0E7490;
    --nx-green-text: #047857;
    --nx-amber-text: #B45309;
    --nx-red-text: #B91C1C;

    /* Surfaces & lines */
    --nx-bg: #F8FAFC;
    --nx-border: #E2E8F0;
    --nx-border-strong: #CBD5E1;

    /* Text scale (dark → light) */
    --nx-text-900: #0F172A;
    --nx-text-700: #334155;
    --nx-text-500: #64748B;
    --nx-text-300: #CBD5E1;

    /* Shadows s1–s3 */
    --nx-shadow-1: 0 1px 2px rgba(15, 23, 42, .06);
    --nx-shadow-2: 0 2px 8px rgba(15, 23, 42, .08);
    --nx-shadow-3: 0 8px 24px rgba(15, 23, 42, .12);

    /* Radii */
    --nx-radius-sm: 6px;
    --nx-radius: 8px;
    --nx-radius-md: 10px;
    --nx-radius-lg: 12px;
    --nx-radius-xl: 16px;
    --nx-radius-pill: 999px;

    /* Motion */
    --nx-ease: .18s cubic-bezier(.4, 0, .2, 1);

    /* Type */
    --nx-font-body: "DM Sans", -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    --nx-font-display: "Syne", var(--nx-font-body);
    --nx-font-mono: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}

/* Map tokens onto Bootstrap 5's theming layer so BS components inherit them. */
:root {
    --bs-primary: var(--nx-primary);
    --bs-primary-rgb: 37, 99, 235;
    --bs-success: var(--nx-green);
    --bs-warning: var(--nx-amber);
    --bs-danger: var(--nx-red);
    --bs-info: var(--nx-teal);
    --bs-body-bg: var(--nx-bg);
    --bs-body-color: var(--nx-text-900);
    --bs-border-color: var(--nx-border);
    --bs-body-font-family: var(--nx-font-body);
    --bs-border-radius: var(--nx-radius);
    --bs-border-radius-sm: var(--nx-radius-sm);
    /* Links. Bootstrap's own blue (#0D6EFD) reads at 4.30:1 on the page
       background, under WCAG 1.4.3's 4.5:1 for body text; the rendered-page
       checker found it on every candidate page (round 974). The primary's
       hover shade reads at 6.41:1, and stays the same on a workspace's
       branded career site, whatever its colour. */
    --bs-link-color: var(--nx-primary-hover);
    --bs-link-color-rgb: 29, 78, 216;
    --bs-link-hover-color: #1E40AF;
    --bs-link-hover-color-rgb: 30, 64, 175;
    /* Inline code. Bootstrap's pink (#D63384) reads at 4.30:1 on the page
       background; one shade darker reads at 5.77:1 (round 975). */
    --bs-code-color: #BE185D;
    --bs-border-radius-lg: var(--nx-radius-lg);
}