/** @type {import('tailwindcss').Config} */
module.exports = {
  darkMode: 'class',
  content: ['./src/**/*.{ts,tsx}'],
  theme: {
    extend: {
      colors: {
        canvas: { dark: '#0b0e11', light: '#ffffff' },
        surface: { card: '#1e2329', elevated: '#2b3139', soft: '#fafafa', strong: '#f5f5f5', hover: '#252c35' },
        brand: { yellow: '#FCD535', 'yellow-active': '#f0b90b', 'yellow-disabled': '#3a3a1f', turquoise: '#2dbdb6' },
        hairline: { light: '#eaecef', dark: '#2b3139' },
        ink: '#181a20',
        muted: { DEFAULT: '#707a8a', strong: '#929aa5' },
        trading: { up: '#0ecb81', down: '#f6465d' },
        info: '#3b82f6',
      },
      fontFamily: {
        sans: ['var(--font-inter)', 'system-ui', 'sans-serif'],
        mono: ['var(--font-ibm-plex-mono)', 'Consolas', 'monospace'],
      },
      borderRadius: { xs: '2px', sm: '4px', md: '6px', lg: '8px', xl: '12px', pill: '9999px' },
      spacing: { section: '80px' },
      fontSize: {
        'hero': ['64px', { lineHeight: '1.1', letterSpacing: '-1px', fontWeight: '700' }],
        'display-lg': ['48px', { lineHeight: '1.1', letterSpacing: '-0.5px', fontWeight: '700' }],
        'display-md': ['40px', { lineHeight: '1.15', letterSpacing: '-0.3px', fontWeight: '600' }],
        'display-sm': ['32px', { lineHeight: '1.2', fontWeight: '600' }],
        'title-lg': ['24px', { lineHeight: '1.3', fontWeight: '600' }],
        'title-md': ['20px', { lineHeight: '1.35', fontWeight: '600' }],
        'title-sm': ['16px', { lineHeight: '1.4', fontWeight: '600' }],
        'num-display': ['40px', { lineHeight: '1.1', letterSpacing: '-0.3px', fontWeight: '700' }],
        'num-md': ['16px', { lineHeight: '1.4', fontWeight: '500' }],
        'num-sm': ['14px', { lineHeight: '1.4', fontWeight: '500' }],
        'body-md': ['14px', { lineHeight: '1.5', fontWeight: '400' }],
        'body-sm': ['13px', { lineHeight: '1.5', fontWeight: '400' }],
        'caption': ['12px', { lineHeight: '1.4', fontWeight: '500' }],
        'button': ['14px', { lineHeight: '1', fontWeight: '600' }],
        'nav': ['14px', { lineHeight: '1.4', fontWeight: '500' }],
      },
      keyframes: {
        'flash-green': { '0%,100%': { backgroundColor: 'transparent' }, '50%': { backgroundColor: 'rgba(14,203,129,0.15)' } },
        'flash-red': { '0%,100%': { backgroundColor: 'transparent' }, '50%': { backgroundColor: 'rgba(246,70,93,0.15)' } },
        'pulse-glow': { '0%,100%': { boxShadow: '0 0 0 0 rgba(252,213,53,0.4)' }, '50%': { boxShadow: '0 0 20px 4px rgba(252,213,53,0.15)' } },
        'slide-up': { '0%': { transform: 'translateY(10px)', opacity: '0' }, '100%': { transform: 'translateY(0)', opacity: '1' } },
        'slide-in-right': { '0%': { transform: 'translateX(20px)', opacity: '0' }, '100%': { transform: 'translateX(0)', opacity: '1' } },
      },
      animation: {
        'flash-green': 'flash-green 0.6s ease-in-out',
        'flash-red': 'flash-red 0.6s ease-in-out',
        'pulse-glow': 'pulse-glow 2s ease-in-out infinite',
        'slide-up': 'slide-up 0.5s ease-out',
        'slide-in-right': 'slide-in-right 0.4s ease-out',
      },
    },
  },
  plugins: [],
}