/** @type {import('tailwindcss').Config} */
export default {
  content: ['./index.html', './src/**/*.{js,ts,vue,tsx}'],
  theme: {
    extend: {
      colors: {
        'app-primary': '#3067EF',
        'app-bg': '#F4F8FF',
        'app-text': '#1f2329',
        'app-text-secondary': '#646a73',
        'app-text-disable': '#bbbfc4',
        'app-border': '#dee0e3',
        'app-white': '#ffffff',
        'app-header-bg': '#F4F8FF',
        'app-sidebar-bg': '#ffffff',
        'app-card-bg': '#ffffff',
        'app-hover': 'rgba(48, 103, 239, 0.06)',
        'app-active': '#ECF2FF'
      },
      keyframes: {
        'fade-in': {
          '0%': { opacity: '0', transform: 'translateY(10px)' },
          '100%': { opacity: '1', transform: 'translateY(0)' }
        },
        'bounce-short': {
          '0%, 100%': { transform: 'translateY(0)' },
          '50%': { transform: 'translateY(-10px)' }
        }
      },
      animation: {
        'fade-in': 'fade-in 0.3s ease-out',
        'bounce-short': 'bounce-short 1s ease-in-out infinite'
      },
      fontFamily: {
        sans: ['PingFang SC', 'AlibabaPuHuiTi', 'sans-serif']
      },
      fontSize: {
        base: '14px'
      },
      boxShadow: {
        app: '0px 2px 4px 0px rgba(31, 35, 41, 0.12)'
      }
    }
  },
  plugins: []
}