/* MedaMeta Design Tokens
   Single source of truth for UI styling
*/

:root {
  /* Brand Colors */
  --color-brand-blue: #1F3A5F;
  --color-brand-teal: #3FA7A1;
  --color-brand-cyan: #E8F4F3;

  /* Neutral Colors */
  --color-bg-primary: #FFFFFF;
  --color-bg-secondary: #F5F7FA;

  --color-border-default: #E2E6EA;

  --color-text-primary: #1E293B;
  --color-text-secondary: #64748B;
  --color-text-muted: #94A3B8;

  /* Semantic Colors */
  --color-success: #2E8B57;
  --color-warning: #E0A800;
  --color-error: #C0362C;
  --color-info: #2563EB;

  /* Typography */
  --font-ui: 'Inter', system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
  --font-heading: 'Source Sans 3', 'IBM Plex Sans', sans-serif;

  --font-size-xs: 12px;
  --font-size-sm: 14px;
  --font-size-md: 16px;
  --font-size-lg: 18px;
  --font-size-xl: 22px;
  --font-size-2xl: 28px;

  --font-weight-regular: 400;
  --font-weight-medium: 500;
  --font-weight-semibold: 600;

  --line-height-tight: 1.3;
  --line-height-normal: 1.45;
  --line-height-relaxed: 1.6;

  /* Spacing (8px system) */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 16px;
  --space-4: 24px;
  --space-5: 32px;
  --space-6: 48px;

  /* Radius */
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 12px;

  /* Shadows (use sparingly) */
  --shadow-none: none;
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.04);
  --shadow-md: 0 2px 6px rgba(0, 0, 0, 0.06);

  /* Motion */
  --motion-fast: 150ms;
  --motion-normal: 200ms;
  --motion-slow: 250ms;

  --easing-standard: cubic-bezier(0.4, 0.0, 0.2, 1);

  /* Component Defaults */
  --button-height: 40px;
  --button-padding-x: 16px;
  --button-radius: var(--radius-md);

  --input-height: 40px;
  --input-padding-x: 12px;
  --input-radius: var(--radius-md);
}