/** @type {import('tailwindcss').Config} */
module.exports = {
  content: [
    "./templates/**/*.html",
    "./static/**/*.js",
    "./static/css/input.css"
  ],
  darkMode: 'class',
  theme: {
    extend: {
      spacing: {
        '72': '18rem',
        '84': '21rem',
        '96': '24rem',
        // Custom spacing für Mercedes Grid System
        'card-sm': '1rem',
        'card-md': '1.5rem',
        'card-lg': '2rem',
        'section': '2.5rem'
      },
      colors: {
        // Mercedes-Benz Corporate Colors - Deep Black Theme
        'mercedes': {
          'black': '#000000',        // Tiefschwarz für Dark Mode
          'dark-gray': '#0a0a0a',    // Sehr dunkles Grau
          'silver': '#C0C0C0',
          'light-gray': '#f5f5f5',
          'platinum': '#E5E4E2',
          'charcoal': '#1a1a1a',     // Dunkle Akzentfarbe
          'steel': '#71797E'
        },
        // Deep Black Dark Mode Farben
        'deep-black': {
          'primary': '#000000',      // Haupthintergrund
          'secondary': '#0a0a0a',    // Sekundärer Hintergrund
          'surface': '#1a1a1a',      // Kartenoberflächen
          'border': '#333333',       // Rahmenfarben
          'text': '#ffffff',         // Primärer Text
          'text-muted': '#a0a0a0'    // Gedämpfter Text
        },
        // Professional Grid Colors
        'grid': {
          'gap-sm': '1rem',
          'gap-md': '1.5rem', 
          'gap-lg': '2rem',
          'gap-xl': '2.5rem'
        },
        // Status Farben - Optimiert für Dark Mode
        'status': {
          'online': '#10b981',
          'offline': '#ef4444',
          'warning': '#f59e0b',
          'info': '#3b82f6',
          'success': '#059669',
          'error': '#dc2626',
          'pending': '#8b5cf6',
          'processing': '#06b6d4'
        },
        // Dark Mode optimierte Farben - Verbessert
        'dark': {
          'bg': '#0f172a',        // Dunkler Hintergrund
          'bg-secondary': '#131c2e', // Sekundärer Hintergrund noch dunkler
          'surface': '#1e293b',
          'surface-hover': '#334155',
          'card': '#1e293b',      // Dunklere Kartenfarbe für besseren Kontrast
          'card-hover': '#334155', // Dunklerer Hover-Zustand
          'text': '#f8fafc',
          'text-secondary': '#e2e8f0',
          'text-muted': '#94a3b8',
          'text-disabled': '#64748b',
          'border': '#475569',
          'border-light': '#475569',
          'hover': '#334155',     // Dunklerer Hover-Zustand
          'focus': '#475569',
          'accent': '#3b82f6'
        },
        // Light Mode optimierte Farben - Verbessert
        'light': {
          'bg': '#ffffff',
          'bg-secondary': '#f8fafc',
          'surface': '#f7fafc',
          'surface-hover': '#edf2f7',
          'card': '#ffffff',
          'card-hover': '#f7fafc',
          'text': '#1a202c',
          'text-secondary': '#2d3748',
          'text-muted': '#4a5568',
          'text-disabled': '#a0aec0',
          'border': '#e2e8f0',
          'border-light': '#edf2f7',
          'hover': '#f1f5f9',
          'focus': '#e2e8f0',
          'accent': '#3b82f6'
        },
        // Printer Status Farben - Erweitert
        'printer': {
          'ready': '#10b981',
          'busy': '#f59e0b',
          'error': '#ef4444',
          'offline': '#6b7280',
          'maintenance': '#8b5cf6',
          'initializing': '#06b6d4',
          'online': '#10b981',
          'maintenance': '#8b5cf6',
          'error': '#dc2626'
        },
        // Job Status Farben - Erweitert
        'job': {
          'queued': '#6b7280',
          'printing': '#3b82f6',
          'completed': '#10b981',
          'failed': '#ef4444',
          'cancelled': '#f59e0b',
          'paused': '#8b5cf6',
          'retrying': '#f97316'
        },
        // Accent Farben - Erweitert
        'accent': {
          'primary': '#3b82f6',
          'secondary': '#8b5cf6',
          'tertiary': '#06b6d4',
          'quaternary': '#10b981',
          'quinary': '#f97316'
        },
        // Gradient Farben - Erweitert
        'gradient': {
          'from-blue': '#3b82f6',
          'to-purple': '#8b5cf6',
          'from-green': '#10b981',
          'to-blue': '#3b82f6',
          'from-purple': '#8b5cf6',
          'to-pink': '#ec4899',
          'from-orange': '#f97316',
          'to-red': '#ef4444'
        }
      },
      // Grid Layout Definitionen
      gridTemplateColumns: {
        'stats-mobile': '1fr',
        'stats-tablet': 'repeat(2, 1fr)',
        'stats-desktop': 'repeat(4, 1fr)',
        'cards-mobile': '1fr',
        'cards-tablet': 'repeat(2, 1fr)',
        'cards-desktop': 'repeat(3, 1fr)',
        'wide-desktop': 'repeat(4, 1fr)'
      },
      // Professional Shadows für Glasmorphismus
      boxShadow: {
        'mercedes-glass': '0 8px 32px rgba(0, 0, 0, 0.3), 0 0 0 1px rgba(255, 255, 255, 0.1)',
        'mercedes-hover': '0 12px 48px rgba(0, 0, 0, 0.4), 0 0 0 1px rgba(255, 255, 255, 0.15)',
        'card-dark': '0 25px 50px rgba(0, 0, 0, 0.25), 0 0 0 1px rgba(255, 255, 255, 0.05)',
        'deep-black': '0 20px 40px rgba(0, 0, 0, 0.8), 0 0 0 1px rgba(255, 255, 255, 0.1)'
      },
      // Backdrop Blur Values
      backdropBlur: {
        'mercedes': '20px',
        'strong': '25px'
      },
      // Typography für Mercedes-Design
      fontFamily: {
        'mercedes': ['Inter', 'system-ui', 'sans-serif']
      },
      // Animation Timings
      transitionDuration: {
        '400': '400ms',
        '600': '600ms'
      },
      // Border Radius für konsistente Rundungen
      borderRadius: {
        'mercedes': '1.5rem',
        'card': '1.25rem'
      },
      typography: {
        DEFAULT: {
          css: {
            'code::before': {
              content: 'none',
            },
            'code::after': {
              content: 'none',
            },
            maxWidth: 'none'
          },
        },
      },
    },
  },
  plugins: [
    require('@tailwindcss/forms')({
      strategy: 'class'
    }),
    require('@tailwindcss/typography')
  ],
}