/*
 * Immogration design tokens – single source of truth for colors, type, spacing.
 * Start theme derived from the current website (navy / red). When the final
 * design arrives, change values here (and in _theme-colors.scss via
 * `ng generate @angular/material:theme-color`), not in components.
 */
:root {
  --img-color-primary: #2b3350;
  --img-color-primary-hover: #3a4468;
  --img-color-primary-contrast: #ffffff;
  --img-color-accent: #b5312b;
  --img-color-accent-hover: #9c2823;
  --img-color-accent-contrast: #ffffff;

  --img-color-bg: #eef0f6;
  --img-color-surface: #ffffff;
  --img-color-surface-alt: #f6f7fb;
  --img-color-border: #d9dce6;

  --img-color-text: #1f2433;
  --img-color-text-muted: #5e6478;
  --img-color-text-on-primary: #ffffff;

  --img-color-success: #2e7d32;
  --img-color-success-bg: #e6f4e7;
  --img-color-warning: #ed6c02;
  --img-color-warning-bg: #fff1e3;
  --img-color-error: #c62828;
  --img-color-error-bg: #fbe9e9;
  --img-color-info: #0277bd;
  --img-color-info-bg: #e3f2fb;
  --img-color-neutral: #5e6478;
  --img-color-neutral-bg: #eceef3;

  --img-font-family: 'Inter', 'Helvetica Neue', Arial, system-ui, sans-serif;
  --img-font-size-base: 16px;
  --img-line-height: 1.5;

  --img-radius-sm: 4px;
  --img-radius-md: 8px;
  --img-radius-lg: 16px;

  --img-space-1: 4px;
  --img-space-2: 8px;
  --img-space-3: 12px;
  --img-space-4: 16px;
  --img-space-5: 24px;
  --img-space-6: 32px;
  --img-space-7: 48px;
  --img-space-8: 64px;

  --img-shadow-card: 0 1px 3px rgba(31, 36, 51, 0.12), 0 1px 2px rgba(31, 36, 51, 0.06);
  --img-shell-header-height: 64px;
  --img-shell-nav-width: 240px;
}