/* =====================================================================
   NIS Design System — Design Tokens (single source of truth)
   ---------------------------------------------------------------------
   Phase 0 foundation. This file defines CSS custom properties ONLY —
   it changes nothing visually on its own. Shared components (Phase 1+)
   consume these tokens so the whole app draws from one palette, one
   type scale, one set of radii/shadows/spacing.

   Rules:
   - One professional blue. One green/amber/red/cyan for status.
   - Do NOT re-declare brand hex values in views or module CSS; use
     var(--nis-*) instead. This is what replaces the 771 scattered
     hard-coded colors.
   ===================================================================== */

:root {
    /* ---- Surfaces ---- */
    --nis-bg: #f1f5f9;            /* light slate-gray page background */
    --nis-surface: #ffffff;      /* clean white content cards */
    --nis-surface-2: #f8fafc;    /* subtle alternate surface (table stripes, headers) */

    /* ---- Text ---- */
    --nis-heading: #1e293b;      /* dark navy headings */
    --nis-text: #334155;         /* high-contrast body text */
    --nis-muted: #64748b;        /* secondary / helper text */
    --nis-on-primary: #ffffff;   /* text on the primary color */

    /* ---- Brand (one professional blue) ---- */
    --nis-primary: #2563eb;
    --nis-primary-hover: #1d4ed8;
    --nis-primary-soft: #eff6ff; /* subtle primary background (active nav, pills) */

    /* ---- Semantic status (separate from the brand accent) ---- */
    --nis-success: #16a34a;
    --nis-success-soft: #dcfce7;
    --nis-warning: #d97706;
    --nis-warning-soft: #fef3c7;
    --nis-danger: #dc2626;
    --nis-danger-soft: #fee2e2;
    --nis-info: #0891b2;         /* cyan */
    --nis-info-soft: #cffafe;

    /* ---- Borders & shadows (subtle) ---- */
    --nis-border: #e2e8f0;
    --nis-border-strong: #cbd5e1;
    --nis-shadow-sm: 0 1px 2px rgba(15, 23, 42, .06);
    --nis-shadow: 0 1px 3px rgba(15, 23, 42, .08), 0 1px 2px rgba(15, 23, 42, .04);
    --nis-shadow-md: 0 4px 12px rgba(15, 23, 42, .08);

    /* ---- Radius (moderate rounded corners) ---- */
    --nis-radius-sm: 6px;
    --nis-radius: 10px;
    --nis-radius-lg: 14px;

    /* ---- Spacing scale (compact but comfortable) ---- */
    --nis-space-1: 4px;
    --nis-space-2: 8px;
    --nis-space-3: 12px;
    --nis-space-4: 16px;
    --nis-space-5: 24px;
    --nis-space-6: 32px;

    /* ---- Typography ---- */
    --nis-font: "Nunito", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
    --nis-fs-xs: .75rem;
    --nis-fs-sm: .85rem;
    --nis-fs-base: 1rem;
    --nis-fs-lg: 1.15rem;
    --nis-fs-xl: 1.4rem;
    --nis-fs-2xl: 1.8rem;
    --nis-fw-medium: 500;
    --nis-fw-semibold: 600;
    --nis-fw-bold: 700;

    /* ---- Focus ring (accessibility) ---- */
    --nis-focus-ring: 0 0 0 3px rgba(37, 99, 235, .35);
}