button

module.exports = {
    darkMode: 'class', // Enable dark mode based on class
    theme: {
        extend: {
            colors: {

                // Global button colors
                button: {
                    DEFAULT: '#a31319',  // Default button background color (light mode)
                    dark: '#4a0000',     // Dark button background color (dark mode)
                    textLight: '#ffffff', // Button text color in light mode
                    textDark: '#e63946',  // Button text color in dark mode
                    hover: '#e63946',    // Button hover color for light mode
                    hoverDark: '#9b0000',// Button hover color for dark mode
                },
            },
            backgroundImage: {

                'btn-gradient-light': 'linear-gradient(to right, #a31319, #000000)', // Light mode gradient
                'btn-gradient-dark': 'linear-gradient(to right, #000000, #a31319)',  // Dark mode gradient
            }
        }
    },
    plugins: [],
};

        <!-- Button with text color based on light and dark mode -->
        <button class="bg-gradientRedToBlack text-button-textLight py-2 px-4 rounded-lg hover:bg-gradientBlackToRed dark:bg-gradientBlackToRed dark:text-button-textDark dark:hover:bg-gradientRedToBlack">
            Submit
        </button>