/** @type {import('tailwindcss').Config} */ export default { content: [ "./index.html", "./src/**/*.{js,ts,jsx,tsx}", ], darkMode: 'class', theme: { extend: { colors: { // Primary dark theme colors background: { DEFAULT: '#0f172a', 50: '#f8fafc', 100: '#f1f5f9', 200: '#e2e8f0', 300: '#cbd5e1', 400: '#94a3b8', 500: '#64748b', 600: '#475569', 700: '#334155', 800: '#1e293b', 900: '#0f172a', 950: '#020617', }, card: { DEFAULT: '#1e293b', hover: '#334155', }, accent: { DEFAULT: '#3b82f6', 50: '#eff6ff', 100: '#dbeafe', 200: '#bfdbfe', 300: '#93c5fd', 400: '#60a5fa', 500: '#3b82f6', 600: '#2563eb', 700: '#1d4ed8', 800: '#1e40af', 900: '#1e3a8a', }, success: { DEFAULT: '#22c55e', 50: '#f0fdf4', 100: '#dcfce7', 200: '#bbf7d0', 300: '#86efac', 400: '#4ade80', 500: '#22c55e', 600: '#16a34a', 700: '#15803d', 800: '#166534', 900: '#14532d', }, warning: { DEFAULT: '#eab308', 50: '#fefce8', 100: '#fef9c3', 200: '#fef08a', 300: '#fde047', 400: '#facc15', 500: '#eab308', 600: '#ca8a04', 700: '#a16207', 800: '#854d0e', 900: '#713f12', }, error: { DEFAULT: '#ef4444', 50: '#fef2f2', 100: '#fee2e2', 200: '#fecaca', 300: '#fca5a5', 400: '#f87171', 500: '#ef4444', 600: '#dc2626', 700: '#b91c1c', 800: '#991b1b', 900: '#7f1d1d', }, }, fontFamily: { sans: ['Inter', 'system-ui', '-apple-system', 'sans-serif'], mono: ['JetBrains Mono', 'Fira Code', 'monospace'], }, animation: { 'fade-in': 'fadeIn 0.3s ease-out', 'fade-out': 'fadeOut 0.3s ease-out', 'slide-in': 'slideIn 0.3s ease-out', 'slide-out': 'slideOut 0.3s ease-out', 'scale-in': 'scaleIn 0.2s ease-out', 'pulse-slow': 'pulse 3s cubic-bezier(0.4, 0, 0.6, 1) infinite', 'spin-slow': 'spin 3s linear infinite', 'bounce-slow': 'bounce 2s infinite', 'ping-slow': 'ping 2s cubic-bezier(0, 0, 0.2, 1) infinite', }, keyframes: { fadeIn: { '0%': { opacity: '0' }, '100%': { opacity: '1' }, }, fadeOut: { '0%': { opacity: '1' }, '100%': { opacity: '0' }, }, slideIn: { '0%': { transform: 'translateX(-100%)' }, '100%': { transform: 'translateX(0)' }, }, slideOut: { '0%': { transform: 'translateX(0)' }, '100%': { transform: 'translateX(-100%)' }, }, scaleIn: { '0%': { transform: 'scale(0.95)', opacity: '0' }, '100%': { transform: 'scale(1)', opacity: '1' }, }, }, boxShadow: { 'glow': '0 0 20px rgba(59, 130, 246, 0.3)', 'glow-lg': '0 0 40px rgba(59, 130, 246, 0.4)', 'inner-glow': 'inset 0 0 20px rgba(59, 130, 246, 0.1)', }, backdropBlur: { xs: '2px', }, }, }, plugins: [], }