@tailwind base;
@tailwind components;
@tailwind utilities;

/* Custom styles for the platform */
@layer components {
    .btn-primary {
        @apply bg-gradient-to-r from-blue-600 to-purple-600 hover:from-blue-700 hover:to-purple-700 text-white font-semibold py-3 px-6 rounded-lg transition-all duration-300 transform hover:scale-105 shadow-lg hover:shadow-xl;
    }

    .btn-secondary {
        @apply bg-white text-gray-800 border-2 border-gray-300 hover:border-gray-400 font-semibold py-3 px-6 rounded-lg transition-all duration-300;
    }

    .card-event {
        @apply bg-white rounded-xl shadow-lg hover:shadow-xl transition-all duration-300 transform hover:-translate-y-2 border border-gray-100;
    }

    .hero-gradient {
        @apply bg-gradient-to-br from-blue-900 via-blue-800 to-purple-900;
    }

    .section-title {
        @apply text-3xl md:text-4xl font-bold text-gray-900 mb-8 text-center;
    }

    .section-subtitle {
        @apply text-lg text-gray-600 text-center max-w-3xl mx-auto mb-12;
    }

    .feature-card {
        @apply bg-white p-8 rounded-xl shadow-lg hover:shadow-xl transition-all duration-300 border border-gray-100;
    }

    .stats-card {
        @apply bg-gradient-to-br from-blue-50 to-purple-50 p-6 rounded-xl border border-blue-100;
    }
}