/** @type {import('tailwindcss').Config} */
export default {
  content: [
    "./index.html",
    "./src/**/*.{vue,js,ts,jsx,tsx}",
  ],
  theme: {
    extend: {
      colors: {
        background: 'hsl(var(--background))',
        foreground: 'hsl(var(--foreground))',
        card: {
          DEFAULT: 'hsl(var(--card))',
          foreground: 'hsl(var(--card-foreground))',
        },
        popover: {
          DEFAULT: 'hsl(var(--popover))',
          foreground: 'hsl(var(--popover-foreground))',
        },
        primary: {
          DEFAULT: 'hsl(var(--primary))',
          foreground: 'hsl(var(--primary-foreground))',
          glow: 'hsl(var(--primary-glow))',
          light: 'hsl(var(--primary-light))',
        },
        secondary: {
          DEFAULT: 'hsl(var(--secondary))',
          foreground: 'hsl(var(--secondary-foreground))',
        },
        muted: {
          DEFAULT: 'hsl(var(--muted))',
          foreground: 'hsl(var(--muted-foreground))',
        },
        accent: {
          DEFAULT: 'hsl(var(--accent))',
          foreground: 'hsl(var(--accent-foreground))',
        },
        destructive: {
          DEFAULT: 'hsl(var(--destructive))',
          foreground: 'hsl(var(--destructive-foreground))',
        },
        border: 'hsl(var(--border))',
        input: 'hsl(var(--input))',
        ring: 'hsl(var(--ring))',
        glass: 'hsl(var(--glass))',
        'glass-border': 'hsl(var(--glass-border))',
        'white-soft': 'hsl(var(--white-soft))',
        'dept-structure': {
          DEFAULT: 'hsl(var(--dept-structure))',
          light: 'hsl(var(--dept-structure-light))',
          glow: 'hsl(var(--dept-structure-glow))',
        },
        'dept-thermal': {
          DEFAULT: 'hsl(var(--dept-thermal))',
          light: 'hsl(var(--dept-thermal-light))',
          glow: 'hsl(var(--dept-thermal-glow))',
        },
        'dept-control': {
          DEFAULT: 'hsl(var(--dept-control))',
          light: 'hsl(var(--dept-control-light))',
          glow: 'hsl(var(--dept-control-glow))',
        },
      },
      borderRadius: {
        lg: 'var(--radius)',
        md: 'calc(var(--radius) - 2px)',
        sm: 'calc(var(--radius) - 4px)',
      },
      backgroundImage: {
        'gradient-primary': 'var(--gradient-primary)',
        'gradient-glow': 'var(--gradient-glow)',
        'gradient-card': 'var(--gradient-card)',
        'gradient-success': 'var(--gradient-success)',
        'gradient-thermal': 'var(--gradient-thermal)',
        'gradient-control': 'var(--gradient-control)',
        'gradient-structure': 'var(--gradient-structure)',
        'gradient-sidebar': 'var(--gradient-sidebar)',
        'gradient-glass': 'var(--gradient-glass)',
      },
      boxShadow: {
        'sm': 'var(--shadow-sm)',
        'md': 'var(--shadow-md)',
        'lg': 'var(--shadow-lg)',
        'xl': 'var(--shadow-xl)',
        'glow': 'var(--shadow-glow)',
        'glow-structure': 'var(--shadow-glow-structure)',
        'glow-thermal': 'var(--shadow-glow-thermal)',
        'glow-control': 'var(--shadow-glow-control)',
        'card': 'var(--shadow-card)',
        'elevated': 'var(--shadow-elevated)',
        'glass': 'var(--shadow-glass)',
        'neumorphic': 'var(--shadow-neumorphic)',
        'neumorphic-hover': 'var(--shadow-neumorphic-hover)',
        'neumorphic-inset': 'var(--shadow-neumorphic-inset)',
        'neumorphic-light': 'var(--shadow-neumorphic-light)',
        'neumorphic-raised': 'var(--shadow-neumorphic-raised)',
        'liquid': 'var(--shadow-liquid)',
        'liquid-hover': 'var(--shadow-liquid-hover)',
      },
      backdropBlur: {
        sm: 'var(--backdrop-blur-sm)',
        md: 'var(--backdrop-blur-md)',
        lg: 'var(--backdrop-blur-lg)',
        xl: 'var(--backdrop-blur-xl)',
      },
      transitionDuration: {
        smooth: 'var(--transition-smooth)',
        spring: 'var(--transition-spring)',
        drawer: 'var(--transition-drawer)',
        liquid: 'var(--transition-liquid)',
        bounce: 'var(--transition-bounce)',
      },
      animation: {
        'blob-float': 'blob-float 20s ease-in-out infinite',
        'blob-float-2': 'blob-float-2 25s ease-in-out infinite',
        'blob-float-3': 'blob-float-3 30s ease-in-out infinite',
      },
      keyframes: {
        'blob-float': {
          '0%, 100%': { transform: 'translate(0, 0) scale(1) rotate(0deg)' },
          '25%': { transform: 'translate(20px, -30px) scale(1.05) rotate(2deg)' },
          '50%': { transform: 'translate(-15px, 25px) scale(0.95) rotate(-1deg)' },
          '75%': { transform: 'translate(30px, 15px) scale(1.02) rotate(1deg)' },
        },
        'blob-float-2': {
          '0%, 100%': { transform: 'translate(0, 0) scale(1) rotate(0deg)' },
          '33%': { transform: 'translate(-25px, 20px) scale(0.98) rotate(-2deg)' },
          '66%': { transform: 'translate(15px, -20px) scale(1.03) rotate(1deg)' },
        },
        'blob-float-3': {
          '0%, 100%': { transform: 'translate(0, 0) scale(1) rotate(0deg)' },
          '20%': { transform: 'translate(25px, 30px) scale(1.04) rotate(1.5deg)' },
          '40%': { transform: 'translate(-20px, -15px) scale(0.96) rotate(-1.5deg)' },
          '60%': { transform: 'translate(-10px, 25px) scale(1.01) rotate(0.5deg)' },
          '80%': { transform: 'translate(20px, -10px) scale(0.99) rotate(-0.5deg)' },
        },
      },
    },
  },
  plugins: [],
}