/** @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%)' },
                },
            },
            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',
            },
        },
    },
    // plugins: [rtl, flip],
    corePlugins: {
        preflight: false,
    },
    future: {
        hoverOnlyWhenSupported: true,
    },
    darkMode: 'class',
};