export const colors = {
  // Primary
  primary: '#007AFF',
  
  // Backgrounds
  background: '#F2F2F7',
  surface: '#FFFFFF',
  card: '#FFFFFF',
  surfaceSecondary: '#F2F2F7',
  
  // Text
  textPrimary: '#000000',
  textSecondary: '#3C3C43',
  textTertiary: '#8E8E93',
  
  // Borders
  border: 'transparent',
  
  // Status
  success: '#34C759',
  error: '#FF3B30',
  // Alias used across the app for notification / error states
  notification: '#FF3B30',
  warning: '#FF9500',
  
  // States
  disabled: '#8E8E93',
  overlay: 'rgba(0, 0, 0, 0.5)',
  overlayStrong: 'rgba(0, 0, 0, 0.65)',
  userTimeText: 'rgba(255, 255, 255, 0.7)',
  
  // Agent UI
  agentBg: '#F0F0FF',
  agentBorder: '#D0D0FF',
  agentAccent: '#4040CC',
  overlayLight: 'rgba(0, 0, 0, 0.45)',
  transparent: 'transparent' as const,
  // Color to use on top of `primary` buttons
  onPrimary: '#FFFFFF',
  // Additional helpers
  successLight: '#d1fae5',
  successDark: '#065f46',
  errorLight: '#fee2e2',
  errorDark: '#991b1b',
  errorBg: '#fff0f0',
};

export const spacing = {
  xs: 4,
  sm: 8,
  md: 12,
  lg: 16,
  xl: 24,
  xxl: 32,
};

export const typography = {
  sizes: {
    xs: 12,
    sm: 14,
    md: 16,
    lg: 17,
    xl: 20,
  },
  weights: {
    regular: '400' as const,
    medium: '500' as const,
    semibold: '600' as const,
    bold: '700' as const,
  },
};

export const borderRadius = {
  sm: 4,
  md: 6,
  lg: 8,
  xl: 12,
};

export default colors;