/* Custom styles for Klub Franeker */

/* Additional hover effects */
.hover\:shadow-xl:hover {
    box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
}

.hover\:-translate-y-1:hover {
    transform: translateY(-0.25rem);
}

/* Primary (blue) utilities */
.text-emerald-600 {
    color: #1d4ed8;
}

.text-emerald-100 {
    color: #dbeafe;
}

.bg-emerald-50 {
    background-color: #eff6ff;
}

.bg-emerald-100 {
    background-color: #dbeafe;
}

.bg-emerald-600 {
    background-color: #1d4ed8;
}

.bg-emerald-700 {
    background-color: #1e3a8a;
}

.border-emerald-500 {
    border-color: #1d4ed8;
}

.border-emerald-600 {
    border-color: #1d4ed8;
}

.hover\:bg-emerald-50:hover {
    background-color: #eff6ff;
}

.hover\:bg-emerald-700:hover {
    background-color: #1e3a8a;
}

.hover\:text-emerald-600:hover {
    color: #1d4ed8;
}

.focus\:border-emerald-500:focus {
    border-color: #1d4ed8;
}

.focus\:border-emerald-600:focus {
    border-color: #1d4ed8;
}

/* Accent (amber) utilities */
.text-teal-600 {
    color: #f59e0b;
}

.bg-teal-100 {
    background-color: #fef3c7;
}

.bg-teal-700 {
    background-color: #b45309;
}

.hover\:bg-teal-50:hover {
    background-color: #fffbeb;
}

.from-emerald-50 {
    --tw-gradient-from: #eff6ff;
    --tw-gradient-to: rgba(239, 246, 255, 0);
    --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}

.to-teal-100 {
    --tw-gradient-to: #fef3c7;
}

.from-emerald-600 {
    --tw-gradient-from: #1d4ed8;
    --tw-gradient-to: rgba(29, 78, 216, 0);
    --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}

.to-teal-700 {
    --tw-gradient-to: #b45309;
}

/* Enhanced design elements */
header {
    backdrop-filter: blur(10px);
    background-color: rgba(255, 255, 255, 0.95);
}

.bg-gradient-to-br {
    background-image: linear-gradient(to bottom right, var(--tw-gradient-stops));
}

/* Smooth transitions */
* {
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
}

/* Custom button styles */
button.open-register-form,
button.open-login-form {
    transition: all 0.3s ease;
}

button.open-register-form:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 20px rgba(29, 78, 216, 0.3);
}

/* Card enhancements */
.bg-white.rounded-xl {
    transition: all 0.3s ease;
}

.bg-white.rounded-xl:hover {
    transform: translateY(-4px);
}

/* Modal enhancements */
.register-modal,
.login-modal {
    backdrop-filter: blur(8px);
}