export const theme = {
  colors: {
    aqua: '#05DCEF',
    background: '#ffffff',
    backgroundGray: '#F5F5F5',
    text: '#333333',
    textLight: '#666666',
    border: '#dddddd',
    error: '#ff3b30',
    cyan: '#00FFFF',
    lightGreen: '#7FFFAA',
    gradients: {
      primary: ['#05DCEF', '#7DE2F5', '#B8F2FF'],
      contrast: ['#00F5A0', '#00D9F5'],
      header: ['#05DCEF', '#7DE2F5'],
      button: ['#05DCEF', '#7DE2F5']
    },
    chart: {
      cyan: '#00FFFF',
      lightGreen: '#7FFFAA'
    }
  },
  fontSize: {
    small: 12,
    regular: 14,
    medium: 16,
    large: 18,
    xlarge: 20,
    xxlarge: 24,
    title: 32
  },
  spacing: {
    xs: 4,
    small: 8,
    medium: 16,
    large: 24,
    xl: 32
  },
  borderRadius: {
    small: 4,
    medium: 8,
    large: 12,
    xl: 16,
    circle: 999
  },
  shadow: {
    small: {
      shadowColor: '#000',
      shadowOffset: { width: 0, height: 2 },
      shadowOpacity: 0.25,
      shadowRadius: 3.84,
      elevation: 2
    },
    medium: {
      shadowColor: '#000',
      shadowOffset: { width: 0, height: 4 },
      shadowOpacity: 0.3,
      shadowRadius: 4.65,
      elevation: 4
    },
    large: {
      shadowColor: '#000',
      shadowOffset: { width: 0, height: 6 },
      shadowOpacity: 0.37,
      shadowRadius: 7.49,
      elevation: 6
    }
  }
};