import { Platform } from 'react-native';

export const COLORS = {
  // Slate scale (matches Tailwind slate-*)
  slate900: '#0f172a',
  slate800: '#1e293b',
  slate700: '#334155',
  slate600: '#475569',
  slate500: '#64748b',
  slate400: '#94a3b8',
  slate300: '#cbd5e1',
  slate200: '#e2e8f0',
  slate100: '#f1f5f9',
  slate50:  '#f8fafc',
  white:    '#ffffff',
  // Semantic
  error:    '#ef4444',
  errorBg:  '#fef2f2',
  errorBorder: '#fecaca',
  successBg: '#ecfdf5',
  successText: '#059669',
};

export const FONTS = {
  heading: Platform.OS === 'ios' ? 'Georgia' : 'serif',
  serif:   Platform.OS === 'ios' ? 'Georgia' : 'serif',
  sans:    Platform.OS === 'ios' ? 'System'  : 'Roboto',
  mono:    Platform.OS === 'ios' ? 'Courier' : 'monospace',
};

export const FONT_SIZE = {
  xxs:  9,
  xs:   11,
  sm:   13,
  base: 15,
  md:   17,
  lg:   20,
  xl:   24,
  xxl:  30,
  xxxl: 36,
  hero: 48,
};

export const SPACING = {
  xs:   4,
  sm:   8,
  md:   16,
  lg:   24,
  xl:   32,
  xxl:  48,
  xxxl: 64,
};

export const RADIUS = {
  none: 0,
  sm:   4,
  md:   8,
  lg:   12,
  full: 999,
};

export const LETTER_SPACING = {
  tight:  -0.5,
  normal: 0,
  wide:   1,
  wider:  2,
  widest: 3,
};
