/** @type {import('tailwindcss').Config} */
export default {
  content: [
    "./index.html",
    "./src/**/*.{vue,js,ts,jsx,tsx}",
  ],
  theme: {
    extend: {
      colors: {
        // Service Finder Design System Colors based on garage.jpg
        'sf-wall': '#B5DCE3',
        'sf-green': '#70BC84',
        'sf-blue': '#004B63',
        'sf-accent': '#008CA4',
        // Neutral colors
        'sf-gray-light': '#f8fafc',
        'sf-gray': '#64748b',
        'sf-gray-dark': '#334155',
        // Dark dashboard theme
        'sf-dark': '#04151F',
        'sf-dark-lighter': '#0a2a40',
        'sf-dark-card': 'rgba(255,255,255,0.04)',
        'sf-dark-border': 'rgba(255,255,255,0.10)',
        'sf-dark-glass': 'rgba(255,255,255,0.05)'
      },
      fontFamily: {
        sans: ['Inter', 'system-ui', 'sans-serif'],
        mono: ['Fira Code', 'monospace']
      },
      backgroundImage: {
        'sf-wall-pattern': 'linear-gradient(135deg, #B5DCE3 0%, #d4e9ed 100%)',
        'sf-subtle-stripes': 'repeating-linear-gradient(45deg, transparent, transparent 10px, rgba(255,255,255,0.1) 10px, rgba(255,255,255,0.1) 20px)',
        'sf-dark-gradient': 'radial-gradient(ellipse 80% 60% at 50% 0%, #0a2a40 0%, #04151F 70%)'
      }
    },
  },
  plugins: [],
}