import type { Config } from 'tailwindcss';

const config: Config = {
  content: ['./src/**/*.{js,ts,jsx,tsx,mdx}'],
  theme: {
    extend: {
      fontFamily: {
        sans: ['var(--font-inter)', 'system-ui', 'sans-serif'],
        display: ['var(--font-space-grotesk)', 'system-ui', 'sans-serif'],
      },
      colors: {
        navy: {
          950: '#020617',
          900: '#0a0f1e',
          800: '#0f172a',
          700: '#1e293b',
        },
      },
      animation: {
        float: 'float 6s ease-in-out infinite',
        'float-slow': 'float 9s ease-in-out infinite',
        'pulse-ring': 'pulseRing 3s ease-out infinite',
        'scan': 'scan 4s ease-out infinite',
        'fade-up': 'fadeUp 0.6s ease forwards',
        shimmer: 'shimmer 2.5s linear infinite',
      },
      keyframes: {
        float: {
          '0%, 100%': { transform: 'translateY(0px) rotate(0deg)' },
          '50%': { transform: 'translateY(-18px) rotate(1deg)' },
        },
        pulseRing: {
          '0%': { r: '0', opacity: '0.6' },
          '100%': { r: '200', opacity: '0' },
        },
        scan: {
          '0%': { transform: 'scale(0)', opacity: '0.5' },
          '100%': { transform: 'scale(1.8)', opacity: '0' },
        },
        fadeUp: {
          '0%': { opacity: '0', transform: 'translateY(24px)' },
          '100%': { opacity: '1', transform: 'translateY(0)' },
        },
        shimmer: {
          '0%': { backgroundPosition: '-200% 0' },
          '100%': { backgroundPosition: '200% 0' },
        },
      },
      backgroundImage: {
        'grid-navy': `linear-gradient(rgba(96,165,250,0.06) 1px, transparent 1px),
          linear-gradient(90deg, rgba(96,165,250,0.06) 1px, transparent 1px)`,
      },
      boxShadow: {
        glow: '0 0 30px rgba(59,130,246,0.35)',
        'glow-lg': '0 0 60px rgba(59,130,246,0.4)',
        'glow-cyan': '0 0 30px rgba(34,211,238,0.35)',
      },
    },
  },
  plugins: [],
};
export default config;