export default function TestPage() {
    return (
        <div className="min-h-screen bg-gradient-to-br from-purple-500 to-pink-500 p-8">
            <div className="max-w-4xl mx-auto">
                <div className="bg-white rounded-xl shadow-2xl p-8">
                    <h1 className="text-4xl font-bold text-gray-900 mb-4">
                        🎨 Test de TailwindCSS
                    </h1>
                    <p className="text-xl text-gray-600 mb-6">
                        Si ves colores y estilos, TailwindCSS está funcionando correctamente.
                    </p>

                    <div className="grid grid-cols-3 gap-4 mb-6">
                        <div className="bg-red-500 h-20 rounded-lg shadow-lg"></div>
                        <div className="bg-green-500 h-20 rounded-lg shadow-lg"></div>
                        <div className="bg-blue-500 h-20 rounded-lg shadow-lg"></div>
                    </div>

                    <button className="bg-indigo-600 text-white px-6 py-3 rounded-lg font-semibold hover:bg-indigo-700 transition-colors">
                        Botón de Prueba
                    </button>
                </div>
            </div>
        </div>
    );
}
