/* Stable design tokens for shared ERP UI. Values map to the current theme and app_settings overrides. */
:root {
  /* Colors */
  --color-brand-primary: var(--brand-blue, #1988d8);
  --color-brand-secondary: var(--brand-navy, #0A192F);
  --color-brand-accent: var(--brand-gold, #C5A059);
  --color-success: var(--brand-green, #38d67a);
  --color-warning: var(--brand-orange, #ff8a00);
  --color-danger: var(--brand-danger, #9B2C2C);
  --color-info: var(--brand-blue, #1988d8);
  --color-text: var(--text-main, #2D3748);
  --color-text-muted: var(--text-muted, #718096);
  --color-surface: var(--white, #ffffff);
  --color-surface-soft: var(--bg-soft, #f8fbff);
  --color-page: var(--bg-light, #F8FAFC);
  --color-border: var(--border-soft, #e5edf7);

  /* Spacing */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;

  /* Radius */
  --radius-xs: 6px;
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 18px;
  --radius-xl: 24px;

  /* Shadows */
  --shadow-xs: 0 4px 12px rgba(15, 23, 42, 0.05);
  --shadow-sm: 0 8px 24px rgba(15, 23, 42, 0.06);
  --shadow-md: 0 16px 40px rgba(15, 23, 42, 0.08);
  --shadow-lg: var(--shadow-soft, 0 20px 60px rgba(15, 23, 42, 0.10));

  /* Type scale */
  --font-size-xs: 11px;
  --font-size-sm: 12px;
  --font-size-base: var(--system-font-size, 13px);
  --font-size-md: 14px;
  --font-size-lg: 16px;
  --font-size-xl: 20px;
  --font-size-2xl: 24px;

  /* z-index */
  --z-header: 50;
  --z-sidebar: 60;
  --z-dropdown: 100;
  --z-modal: 200;
  --z-toast: 300;
}
