/**
 * Theme configuration for Pottery Diary
 * Modern, US-market optimized design with clear signaling colors
 */

export const colors = {
  // Primary colors - Sage/Olive green from new palette
  primary: '#8B9A7C', // Sage/Olive green
  primaryLight: '#B0B1A5', // Lighter sage
  primaryDark: '#7A7B70', // Darker sage

  // Accent colors - Beige/Sand from new palette
  accent: '#DECCA3', // Beige/Sand
  accentLight: '#E8DCC0', // Lighter beige
  accentDark: '#C9B78E', // Darker beige

  // Backgrounds - Light cream theme
  background: '#F8F6F0', // Main cream/off-white
  backgroundSecondary: '#EEEEEE', // Light gray for cards
  card: '#FFFFFF', // White cards

  // Text - Dark on light backgrounds
  text: '#3D352E', // Primary text (dark brown)
  textSecondary: '#5A514B', // Secondary text
  textTertiary: '#7A7570', // Dimmed text/icons
  buttonText: '#FFFFFF', // White text for primary buttons

  // Borders - Subtle on light backgrounds
  border: '#DECCA3', // Beige border
  borderLight: '#EEEEEE', // Light gray border

  // Status colors
  success: '#7A9B6B', // Soft green
  successLight: '#A3C494', // Lighter green
  warning: '#D4A574', // Warm amber
  error: '#C5675C', // Soft red
  info: '#9A9B8E', // Sage (same as primary)

  // Step type colors - Adjusted for light backgrounds
  forming: '#C89B7C', // Clay tone
  trimming: '#9A9B8E', // Sage green
  drying: '#DECCA3', // Beige/sand
  bisqueFiring: '#D4A574', // Warm amber
  glazing: '#A89B9B', // Mauve
  glazeFiring: '#C5675C', // Terracotta
  misc: '#7A7570', // Gray
};

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

export const typography = {
  fontSize: {
    xs: 12,
    sm: 14,
    md: 16,
    lg: 20, // Slightly larger for retro feel
    xl: 28, // Bigger, bolder headers
    xxl: 36,
  },
  fontWeight: {
    regular: '400' as const,
    medium: '500' as const,
    semiBold: '600' as const,
    bold: '800' as const, // Bolder for retro headings
  },
  // Retro-style letter spacing
  letterSpacing: {
    tight: -0.5,
    normal: 0,
    wide: 0.5,
    wider: 1,
  },
};

export const borderRadius = {
  sm: 6,
  md: 12, // More rounded for retro feel
  lg: 16,
  xl: 24,
  full: 9999,
};

export const shadows = {
  sm: {
    shadowColor: '#000000',
    shadowOffset: { width: 0, height: 2 },
    shadowOpacity: 0.25,
    shadowRadius: 3,
    elevation: 2,
  },
  md: {
    shadowColor: '#000000',
    shadowOffset: { width: 0, height: 3 },
    shadowOpacity: 0.3,
    shadowRadius: 6,
    elevation: 4,
  },
  lg: {
    shadowColor: '#000000',
    shadowOffset: { width: 0, height: 5 },
    shadowOpacity: 0.4,
    shadowRadius: 10,
    elevation: 6,
  },
};

// Minimum tappable size for accessibility
export const MIN_TAP_SIZE = 44;

export const stepTypeColors = {
  forming: colors.forming,
  trimming: colors.trimming,
  drying: colors.drying,
  bisque_firing: colors.bisqueFiring,
  glazing: colors.glazing,
  glaze_firing: colors.glazeFiring,
  misc: colors.misc,
};

export const stepTypeIcons: Record<string, string> = {
  forming: 'hand-front-right',
  trimming: 'content-cut',
  drying: 'weather-windy',
  bisque_firing: 'fire',
  glazing: 'brush',
  glaze_firing: 'lightning-bolt',
  misc: 'notebook-outline',
};

export const stepTypeLabels: Record<string, string> = {
  forming: 'Forming',
  trimming: 'Trimming',
  drying: 'Drying',
  bisque_firing: 'Bisque Firing',
  glazing: 'Glazing',
  glaze_firing: 'Glaze Firing',
  misc: 'Misc',
};