/* IRS Design System — Design Tokens */

@font-face {
  font-family: "Source Sans Pro";
  src: url("/assets/fonts/SourceSansPro-Regular.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Source Sans Pro";
  src: url("/assets/fonts/SourceSansPro-Semibold.woff2") format("woff2");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Source Sans Pro";
  src: url("/assets/fonts/SourceSansPro-Bold.woff2") format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

:root {
  /* Brand colors — overridable in <head> via settings */
  --ds-primary: #005ea2;
  --ds-primary-dark: #1a4480;
  --ds-primary-darker: #162e51;
  --ds-primary-light: #d9e8f5;
  --ds-primary-lighter: #eaf3fb;

  --ds-accent: #00a91c;
  --ds-accent-dark: #00751a;
  --ds-accent-light: #d6f0dc;

  --ds-red: #d54309;
  --ds-red-dark: #b02a00;
  --ds-red-light: #fbeae6;

  --ds-gold: #ffbe2e;
  --ds-gold-dark: #946b00;
  --ds-gold-light: #fff5d6;

  /* Neutral scale */
  --ds-white: #ffffff;
  --ds-gray-50: #f9f9f9;
  --ds-gray-100: #f0f0f0;
  --ds-gray-200: #e6e6e6;
  --ds-gray-300: #dfe1e2;
  --ds-gray-400: #c9c9c9;
  --ds-gray-500: #a9aeb1;
  --ds-gray-600: #71767a;
  --ds-gray-700: #565c65;
  --ds-gray-800: #3d4551;
  --ds-gray-900: #1b1b1b;

  /* Semantic */
  --ds-bg: var(--ds-white);
  --ds-bg-alt: var(--ds-gray-100);
  --ds-border: var(--ds-gray-300);
  --ds-border-strong: var(--ds-gray-500);
  --ds-text: var(--ds-gray-900);
  --ds-text-muted: var(--ds-gray-600);
  --ds-text-inverse: var(--ds-white);

  /* Focus */
  --ds-focus: #2491ff;
  --ds-focus-width: 2px;
  --ds-focus-offset: 2px;

  /* Typography */
  --ds-font-sans: "Source Sans Pro", -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, sans-serif;
  --ds-font-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace;

  --ds-fs-xs: 0.75rem;
  --ds-fs-sm: 0.875rem;
  --ds-fs-base: 1rem;
  --ds-fs-lg: 1.125rem;
  --ds-fs-xl: 1.25rem;
  --ds-fs-2xl: 1.5rem;
  --ds-fs-3xl: 1.75rem;
  --ds-fs-4xl: 2rem;
  --ds-fs-5xl: 2.5rem;

  --ds-lh-tight: 1.25;
  --ds-lh-base: 1.5;
  --ds-lh-loose: 1.75;

  /* Spacing */
  --ds-space-1: 4px;
  --ds-space-2: 8px;
  --ds-space-3: 12px;
  --ds-space-4: 16px;
  --ds-space-5: 24px;
  --ds-space-6: 32px;
  --ds-space-7: 48px;
  --ds-space-8: 64px;

  /* Radius */
  --ds-radius-sm: 2px;
  --ds-radius: 4px;
  --ds-radius-md: 6px;
  --ds-radius-lg: 8px;
  --ds-radius-pill: 9999px;

  /* Shadow */
  --ds-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.06);
  --ds-shadow: 0 2px 4px rgba(0, 0, 0, 0.08);
  --ds-shadow-lg: 0 4px 12px rgba(0, 0, 0, 0.12);

  /* Layout */
  --ds-container: 720px;
  --ds-container-wide: 1200px;
  --ds-header-h: 64px;

  /* Motion */
  --ds-transition-fast: 120ms ease;
  --ds-transition: 200ms ease;
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --ds-transition-fast: 0ms;
    --ds-transition: 0ms;
  }
}