import { defaultConfig } from '@tamagui/config/v4';
import { createTamagui } from '@tamagui/core';
import { shorthands } from '@tamagui/shorthands';
import { tokens as baseTokens, themes as baseThemes } from '@tamagui/themes';
import { createAnimations } from '@tamagui/animations-css';

const tokens = {
  ...baseTokens,
  color: {
    ...baseTokens.color,
    primary: '#007AFF',
    accent: '#5AD2F4',
    success: '#2ECC71',
    warning: '#F5C542',
    danger: '#FF5F56',
    surface: '#ffffff',
    muted: '#f3f4f6',
  },
  radius: {
    ...baseTokens.radius,
    card: 18,
    tile: 16,
    pill: 999,
  },
  size: {
    ...baseTokens.size,
    card: 18,
  },
};

const themes = {
  ...baseThemes,
  light: {
    ...baseThemes.light,
    primary: tokens.color.primary,
    accent: tokens.color.accent,
    background: '#f5f7fb',
    surface: tokens.color.surface,
  },
  dark: {
    ...baseThemes.dark,
    primary: tokens.color.primary,
    accent: tokens.color.accent,
    background: '#0f172a',
    surface: '#111827',
  },
};

const sharedWeights = {
  4: '400',
  5: '500',
  6: '600',
  7: '700',
  8: '800',
  9: '900',
};

const fonts = {
  ...defaultConfig.fonts,
  body: {
    ...defaultConfig.fonts.body,
    family: 'Montserrat',
    weight: sharedWeights,
  },
  heading: {
    ...defaultConfig.fonts.heading,
    family: 'Montserrat',
    weight: sharedWeights,
  },
  display: {
    ...defaultConfig.fonts.heading,
    family: 'Playfair Display',
    weight: sharedWeights,
  },
};

const config = createTamagui({
  ...defaultConfig,
  animations: createAnimations({
    fast: 'ease-in 150ms',
    medium: 'ease 250ms',
    slow: 'ease-out 400ms',
  }),
  tokens,
  themes,
  fonts,
  defaultFont: 'body',
  shorthands,
  media: {
    ...defaultConfig.media,
    xs: { maxWidth: 660 },
    sm: { maxWidth: 840 },
    md: { maxWidth: 1024 },
  },
});

export type AppConfig = typeof config;
export default config;

declare module '@tamagui/core' {
  interface TamaguiCustomConfig extends AppConfig {}
}