/* AuditWise design tokens — navy / white / light grey / restrained teal */
:root {
  --navy-950: #08172b;
  --navy-900: #0c2340;
  --navy-800: #12315a;
  --navy-700: #1b4275;
  --navy-600: #2a5794;
  --navy-100: #e3eaf4;
  --navy-50:  #f1f5fa;

  --teal-700: #0b6e70;
  --teal-600: #0f8587;
  --teal-500: #14a3a5;
  --teal-100: #d7f0f0;
  --teal-50:  #eef9f9;

  --grey-900: #1d2430;
  --grey-700: #434d5c;
  --grey-600: #5d6878;
  --grey-500: #7d8796;
  --grey-400: #a5adb9;
  --grey-300: #cdd3dc;
  --grey-200: #e2e6ec;
  --grey-150: #ebeef2;
  --grey-100: #f2f4f7;
  --grey-50:  #f8f9fb;
  --white: #ffffff;

  --green-700: #1d6b3e; --green-100: #dcf2e4;
  --amber-700: #8a5a00; --amber-100: #fcefd2;
  --red-700: #a3242b;   --red-100: #fbe1e2;
  --blue-700: #1f4fa8;  --blue-100: #e0eafb;
  --violet-700: #5b3aa6; --violet-100: #ebe4fa;

  --bg: var(--grey-100);
  --surface: var(--white);
  --surface-2: var(--grey-50);
  --text: var(--grey-900);
  --text-muted: var(--grey-600);
  --border: var(--grey-200);
  --border-strong: var(--grey-300);
  --primary: var(--navy-800);
  --primary-hover: var(--navy-700);
  --accent: var(--teal-600);
  --focus: 0 0 0 3px rgba(20, 163, 165, .28);

  --font: "Inter", "Segoe UI", "Helvetica Neue", Roboto, Arial, sans-serif;
  --font-mono: "JetBrains Mono", "Cascadia Mono", Consolas, "Courier New", monospace;
  --fs-xs: 11.5px; --fs-sm: 12.5px; --fs-md: 13.5px; --fs-lg: 15px; --fs-xl: 18px; --fs-2xl: 22px;

  --r-sm: 4px; --r-md: 6px; --r-lg: 10px;
  --sp-1: 4px; --sp-2: 8px; --sp-3: 12px; --sp-4: 16px; --sp-5: 20px; --sp-6: 24px; --sp-8: 32px;
  --shadow-1: 0 1px 2px rgba(12, 35, 64, .06), 0 1px 1px rgba(12, 35, 64, .04);
  --shadow-2: 0 4px 14px rgba(12, 35, 64, .10);
  --shadow-3: 0 18px 48px rgba(12, 35, 64, .22);

  --sidebar-w: 248px;
  --sidebar-w-collapsed: 60px;
  --topbar-h: 54px;
}
