/** @type {import('tailwindcss').Config} */
export default {
  content: [
    '../../apps/frontend/src/**/*.{astro,tsx,ts,jsx,js,mdx}',
    '../../apps/backend/src/**/*.{tsx,ts,jsx,js}'
  ],
  theme: {
    extend: {
      colors: {
        primary: '#1F3A93',
        secondary: '#F39C12',
        accent: '#16A085',
        background: '#FFFFFF',
        surface: '#F7FAFC',
        text: '#1A202C'
      },
      fontFamily: {
        sans: ['Noto Sans CJK TC', 'Inter', 'system-ui', '-apple-system', 'sans-serif'],
        heading: ['Noto Sans CJK TC', 'Inter', 'system-ui', '-apple-system', 'sans-serif'],
      },
      typography: {
        DEFAULT: {
          css: {
            fontFamily: 'Noto Sans CJK TC, Inter, system-ui, -apple-system, sans-serif',
            color: 'var(--color-text)',
            a: {
              color: 'var(--color-primary)',
              '&:hover': {
                color: '#1a2f7a',
              },
            },
            h1: {
              color: 'var(--color-text)',
            },
            h2: {
              color: 'var(--color-text)',
            },
            h3: {
              color: 'var(--color-text)',
            },
            h4: {
              color: 'var(--color-text)',
            },
            strong: {
              color: 'var(--color-text)',
            },
            code: {
              color: 'var(--color-text)',
              backgroundColor: 'var(--color-surface)',
              borderRadius: 'var(--radius-sm)',
              padding: '0.125rem 0.25rem',
            },
            'code::before': {
              content: '""',
            },
            'code::after': {
              content: '""',
            },
            pre: {
              backgroundColor: 'var(--color-surface)',
              borderRadius: 'var(--radius-md)',
              border: '1px solid var(--color-border)',
            },
            blockquote: {
              borderLeftColor: 'var(--color-primary)',
              color: 'var(--color-text-muted)',
            },
            hr: {
              borderColor: 'var(--color-border)',
            },
            ul: {
              color: 'var(--color-text)',
            },
            ol: {
              color: 'var(--color-text)',
            },
            li: {
              color: 'var(--color-text)',
            },
          },
        },
      },
    }
  },
  plugins: [
    require('@tailwindcss/typography'),
  ]
};