import defaultTheme from 'tailwindcss/defaultTheme';
import forms from '@tailwindcss/forms';
import typography from '@tailwindcss/typography';

/** @type {import('tailwindcss').Config} */
export default {
    content: [
        './vendor/laravel/framework/src/Illuminate/Pagination/resources/views/*.blade.php',
        './storage/framework/views/*.php',
        './resources/views/**/*.blade.php',
        './resources/js/**/*.vue',
    ],
    darkMode: 'class',

    theme: {
        extend: {
            // ─── COULEURS ────────────────────────────────────────────────
            colors: {
                // Palette principale — CABM
                primary: {
                    DEFAULT: '#1a4b8c',   // Bleu Méditerranée
                    dark:    '#122f5a',   // Bleu nuit
                    light:   '#3a7abf',   // Bleu ciel (ex: sky)
                },
                accent: {
                    DEFAULT: '#c8102e',   // Rouge Occitan
                    soft:    'rgba(200,16,46,0.10)',
                },
                highlight: {
                    DEFAULT: '#f5a800',   // Or du Midi
                    soft:    'rgba(245,168,0,0.12)',
                    dark:    '#3a2800',   // Texte sur fond or
                },
                // Neutres chauds
                sand:      '#e8e0d0',    // Sable garrigue (ex: sand)
                neutral:   '#f0ece4',    // Fond neutre warm
                surface:   '#faf9f7',    // Surface carte (ex: white)
                // Texte
                ink: {
                    DEFAULT: '#2d2d2d',  // Anthracite
                    muted:   'rgba(45,45,45,0.50)',
                    faint:   'rgba(45,45,45,0.28)',
                },
                // Dark mode
                dark: {
                    bg:      '#0f1923',
                    surface: '#162130',
                    sidebar: '#0a111a',
                    border:  'rgba(255,255,255,0.06)',
                },
                // Sémantiques
                success: '#10b981',
                warning: '#f5a800',
                danger:  '#c8102e',
                info:    '#3a7abf',

                // Compat rétro (garde les anciens noms fonctionnels)
                anthracite: '#2d2d2d',
                sky:        '#3a7abf',
            },

            // ─── TYPOGRAPHIE ─────────────────────────────────────────────
            fontFamily: {
                sans:     ['Nunito', 'Helvetica Neue', 'Arial', 'sans-serif'],
                serif:    ['Merriweather', 'Georgia', 'serif'],
                subtitle: ['Nunito', 'Gill Sans', 'sans-serif'],
                mono:     ['JetBrains Mono', 'Fira Code', 'monospace'],
            },
            fontSize: {
                '2xs': ['0.625rem', { lineHeight: '1rem',    letterSpacing: '0.12em' }],  // 10px — labels caps
                'xs':  ['0.75rem',  { lineHeight: '1.25rem'                          }],  // 12px
                'sm':  ['0.8125rem',{ lineHeight: '1.375rem'                         }],  // 13px
                'base':['0.875rem', { lineHeight: '1.5rem'                           }],  // 14px
                'md':  ['1rem',     { lineHeight: '1.625rem'                         }],  // 16px
                'lg':  ['1.0625rem',{ lineHeight: '1.75rem'                          }],  // 17px
                'xl':  ['1.125rem', { lineHeight: '1.75rem'                          }],  // 18px
                '2xl': ['1.25rem',  { lineHeight: '1.875rem'                         }],  // 20px
                '3xl': ['1.5rem',   { lineHeight: '2rem'                             }],  // 24px
                '4xl': ['2rem',     { lineHeight: '2.25rem', letterSpacing: '-0.02em'}],  // 32px
            },

            // ─── ESPACEMENT ──────────────────────────────────────────────
            // Garde l'échelle Tailwind standard + quelques tokens nommés
            spacing: {
                'sidebar':    '220px',
                'sidebar-sm': '64px',
                'header':     '60px',
                'navbar':     '40px',
            },

            // ─── BORDER RADIUS ───────────────────────────────────────────
            borderRadius: {
                'none':  '0',
                'sm':    '6px',
                'DEFAULT':'8px',
                'md':    '10px',
                'lg':    '12px',
                'xl':    '14px',
                '2xl':   '16px',
                '3xl':   '20px',
                '4xl':   '28px',
                'full':  '9999px',
                // Tokens sémantiques
                'card':  '16px',
                'btn':   '10px',
                'badge': '20px',
                'input': '10px',
            },

            // ─── OMBRES ──────────────────────────────────────────────────
            boxShadow: {
                'xs':   '0 1px 3px rgba(0,0,0,0.05)',
                'sm':   '0 1px 4px rgba(0,0,0,0.07)',
                'DEFAULT':'0 2px 8px rgba(0,0,0,0.09)',
                'md':   '0 4px 16px rgba(0,0,0,0.10)',
                'lg':   '0 8px 28px rgba(0,0,0,0.12)',
                'xl':   '0 16px 48px rgba(0,0,0,0.14)',
                // Sémantiques couleurs
                'primary': '0 4px 16px rgba(26,75,140,0.20)',
                'gold':    '0 4px 16px rgba(245,168,0,0.30)',
                'accent':  '0 4px 16px rgba(200,16,46,0.18)',
                // Dark mode
                'dark-sm': '0 2px 12px rgba(0,0,0,0.30)',
                'dark-md': '0 4px 24px rgba(0,0,0,0.40)',
                'none':    'none',
            },

            // ─── TRANSITIONS ─────────────────────────────────────────────
            transitionDuration: {
                'fast':    '120ms',
                'DEFAULT': '180ms',
                'slow':    '300ms',
            },
            transitionTimingFunction: {
                'smooth': 'cubic-bezier(0.4, 0, 0.2, 1)',
                'spring': 'cubic-bezier(0.34, 1.56, 0.64, 1)',
            },

            // ─── ANIMATIONS ──────────────────────────────────────────────
            keyframes: {
                'fade-in': {
                    from: { opacity: '0', transform: 'translateY(6px)' },
                    to:   { opacity: '1', transform: 'translateY(0)'   },
                },
                'slide-in': {
                    from: { opacity: '0', transform: 'translateX(-8px)' },
                    to:   { opacity: '1', transform: 'translateX(0)'    },
                },
                'pulse-gold': {
                    '0%, 100%': { boxShadow: '0 0 0 0 rgba(245,168,0,0.3)' },
                    '50%':      { boxShadow: '0 0 0 6px rgba(245,168,0,0)' },
                },
            },
            animation: {
                'fade-in':   'fade-in 0.2s ease-out',
                'slide-in':  'slide-in 0.2s ease-out',
                'pulse-gold':'pulse-gold 2s ease-in-out infinite',
            },
        },
    },

    plugins: [forms, typography],
};