/** @type {import('tailwindcss').Config} */
// import rtl from 'tailwindcss-rtl';
// import flip from 'tailwindcss-flip';

export default {
    content: ['./index.html', './src/**/*.{js,ts,jsx,tsx}'],
    theme: {
        extend: {
            keyframes: {
                'slide-in-from-end': {
                    from: { transform: 'translateX(100%)' },
                    to: { transform: 'translateX(0)' },
                },
                'slide-in-from-start': {
                    from: { transform: 'translateX(-100%)' },
                    to: { transform: 'translateX(0)' },
                },
                'slide-out-to-end': {
                    from: { transform: 'translateX(0)' },
                    to: { transform: 'translateX(100%)' },
                },
                'slide-out-to-start': {
                    from: { transform: 'translateX(0)' },
                    to: { transform: 'translateX(-100%)' },
                },
                'expand-down': {
                    from: { opacity: '0', transform: 'scaleY(0)' },
                    to: { opacity: '1', transform: 'scaleY(1)' },
                },
                'collapse-up': {
                    from: { opacity: '1', transform: 'scaleY(1)' },
                    to: { opacity: '0', transform: 'scaleY(0)' },
                },
                'scroll-left': {
                    from: { transform: 'translateX(0)' },
                    to: { transform: 'translateX(var(--scroll-distance, -50%))' },
                },
            },
            animation: {
                'slide-in-from-end': 'slide-in-from-end 0.25s ease-out forwards',
                'slide-in-from-start': 'slide-in-from-start 0.25s ease-out forwards',
                'slide-out-to-end': 'slide-out-to-end 0.25s ease-out forwards',
                'slide-out-to-start': 'slide-out-to-start 0.25s ease-out forwards',
                'expand-down': 'expand-down 0.2s ease-out forwards',
                'collapse-up': 'collapse-up 0.15s ease-in forwards',
                'scroll-left': 'scroll-left 1s linear infinite',
            },
        },
    },
    // plugins: [rtl, flip],
    corePlugins: {
        preflight: false,
    },
    future: {
        hoverOnlyWhenSupported: true,
    },
    darkMode: 'class',
};
