/* Login Page Specific Styles */

/* Custom gradient matching sidebar colors */
.bg-gradient-to-br {
    background: linear-gradient(135deg, 
        var(--oxford-blue) 0%, 
        #0f1629 30%,
        #141d35 60%, 
        #1a2441 85%,
        #1f2a4d 100%
    ) !important;
}

/* Animated blob effect for background */
@keyframes blob {
    0% {
        transform: translate(0px, 0px) scale(1);
    }
    33% {
        transform: translate(30px, -50px) scale(1.1);
    }
    66% {
        transform: translate(-20px, 20px) scale(0.9);
    }
    100% {
        transform: translate(0px, 0px) scale(1);
    }
}

.animate-blob {
    animation: blob 7s infinite;
}

.animation-delay-2000 {
    animation-delay: 2s;
}

.animation-delay-4000 {
    animation-delay: 4s;
}

/* Glass morphism effect */
.backdrop-blur-xl {
    backdrop-filter: blur(24px);
    -webkit-backdrop-filter: blur(24px);
}

.backdrop-blur-sm {
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
}

/* Enhanced fade in animation */
@keyframes enhanced-fade-in {
    0% {
        opacity: 0;
        transform: translateY(20px) scale(0.95);
    }
    100% {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

.animate-fade-in {
    animation: enhanced-fade-in 0.6s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Input field enhancements */
input[type="text"]:focus,
input[type="password"]:focus {
    background-color: rgba(255, 255, 255, 0.15) !important;
}

/* Custom scrollbar for dark theme */
::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

::-webkit-scrollbar-track {
    background: rgba(255, 255, 255, 0.05);
    border-radius: 4px;
}

::-webkit-scrollbar-thumb {
    background: rgba(255, 255, 255, 0.2);
    border-radius: 4px;
}


/* Button loading state */
#loginBtn:disabled {
    cursor: not-allowed;
    opacity: 0.7;
}


/* Smooth transitions */
* {
    transition-property: background-color, border-color, color, fill, stroke, opacity, box-shadow, transform;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 150ms;
}

/* Gradient text effect for branding */
.gradient-text {
    background: linear-gradient(135deg, #474fea 0%, #676fff 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

/* Subtle pulse animation for system status */
@keyframes pulse {
    0%, 100% {
        opacity: 1;
    }
    50% {
        opacity: 0.5;
    }
}

.animate-pulse {
    animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
}

/* Error message animation */
@keyframes shake {
    0%, 100% {
        transform: translateX(0);
    }
    10%, 30%, 50%, 70%, 90% {
        transform: translateX(-2px);
    }
    20%, 40%, 60%, 80% {
        transform: translateX(2px);
    }
}

.animate-shake {
    animation: shake 0.5s cubic-bezier(0.36, 0.07, 0.19, 0.97);
}

/* Glow effect for focused elements */
.glow-effect {
    box-shadow: 0 0 20px rgba(71, 79, 234, 0.5);
}

/* Responsive adjustments */
@media (max-width: 640px) {
    .animate-blob {
        animation-duration: 10s;
    }
}