import type { Config } from 'tailwindcss'

const config: Config = {
  content: ['./src/**/*.{js,ts,jsx,tsx,mdx}'],
  theme: {
    extend: {
      colors: {
        purple: {
          primary: '#A467B7',
          deep: '#683285',
          accent: '#AE79BF',
          lavender: '#E7D3EF',
          soft: '#F5EEF8',
        },
        nearle: {
          dark: '#111827',
          mid: '#475569',
          light: '#94A3B8',
          border: '#E2E8F0',
          bgsoft: '#F8FAFC',
        },
      },
      fontFamily: {
        display: ['var(--font-display)', 'Syne', 'sans-serif'],
        body: ['var(--font-body)', 'DM Sans', 'sans-serif'],
        mono: ['var(--font-mono)', 'JetBrains Mono', 'monospace'],
      },
      fontWeight: {
        '800': '800',
      },
      boxShadow: {
        'nearle-sm': '0 4px 16px rgba(164, 103, 183, 0.08)',
        'nearle-md': '0 8px 32px rgba(164, 103, 183, 0.15)',
        'nearle-lg': '0 20px 60px rgba(164, 103, 183, 0.20)',
        'cta': '0 4px 20px rgba(104, 50, 133, 0.30)',
        'cta-hover': '0 8px 32px rgba(104, 50, 133, 0.40)',
      },
      backgroundImage: {
        'gradient-hero':
          'radial-gradient(ellipse 80% 60% at 50% -10%, #E7D3EF 0%, #FFFFFF 70%)',
        'gradient-card':
          'linear-gradient(135deg, #FFFFFF 0%, #F5EEF8 100%)',
        'gradient-purple':
          'linear-gradient(135deg, #683285 0%, #A467B7 100%)',
      },
      animation: {
        float: 'float 6s ease-in-out infinite',
        'pulse-slow': 'pulse 4s ease-in-out infinite',
        'slide-in': 'slideIn 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94)',
        'ride-loop': 'rideLoop 12s linear infinite',
        'dash-loop': 'dashLoop 1.5s linear infinite',
      },
      keyframes: {
        float: {
          '0%, 100%': { transform: 'translateY(0px)' },
          '50%': { transform: 'translateY(-12px)' },
        },
        slideIn: {
          from: { opacity: '0', transform: 'translateY(24px)' },
          to: { opacity: '1', transform: 'translateY(0)' },
        },
        rideLoop: {
          '0%': { offsetDistance: '0%' },
          '100%': { offsetDistance: '100%' },
        },
        dashLoop: {
          to: { strokeDashoffset: '-24' },
        },
      },
    },
  },
  plugins: [],
}

export default config