/** @type {import('tailwindcss').Config} */
export default {
  content: ['./src/**/*.{html,js,svelte,ts}'],
  theme: {
    extend: {
      colors: {
        tokyo: {
          bg: '#1a1b26',
          'bg-dark': '#16161e',
          'bg-highlight': '#292e42',
          'bg-selection': '#364a82',
          fg: '#a9b1d6',
          'fg-dark': '#565f89',
          'fg-light': '#c0caf5',
          red: '#f7768e',
          orange: '#ff9e64',
          yellow: '#e0af68',
          green: '#9ece6a',
          cyan: '#7dcfff',
          blue: '#7aa2f7',
          purple: '#bb9af7',
          magenta: '#c0caf5',
        },
      },
      fontFamily: {
        sans: ['Inter', 'system-ui', 'sans-serif'],
      },
      animation: {
        'fade-in': 'fadeIn 0.5s ease-in-out',
        'slide-in': 'slideIn 0.3s ease-out',
      },
      keyframes: {
        fadeIn: {
          '0%': { opacity: '0' },
          '100%': { opacity: '1' },
        },
        slideIn: {
          '0%': { transform: 'translateY(-10px)', opacity: '0' },
          '100%': { transform: 'translateY(0)', opacity: '1' },
        },
      },
    },
  },
  plugins: [],
}