@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;600&display=swap');
        .gradient-icon {
            background: linear-gradient(50deg, #2C3E50, #4A90E2);
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
        }

        .gradient-text {
            background: linear-gradient(50deg, #2C3E50, #4A90E2);
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
        }

        .animated-bg {
            background: linear-gradient(50deg,#2C3E50, #4A90E2);            
            background-size: 300% 300%;
            animation: backgroundMove 12s ease infinite;
        }
        
        .toast-success {
            background-color: #4A90E2 !important; /* Shade of blue */
            color: white !important; /* Text color */
        }

        /* Login Card Animation */
        .fade-in {
            animation: fadeIn 1s ease-in-out;
        }
        @keyframes fadeIn {
            from { opacity: 0; transform: translateY(10px); }
            to { opacity: 1; transform: translateY(0); }
        }

        /* Glow Effects */
        .glow-input {
            border: 2px solid transparent; /* Removes default border */
            transition: box-shadow 0.3s ease-in-out, border-color 0.3s ease-in-out;
        }

        .glow-input:focus {
            border-color: #2C3E50 !important; /* Soft Blue Border */
            box-shadow: 0 0 10px rgba(74, 144, 226, 0.6), 0 0 20px rgba(44, 62, 80, 0.4); 
            outline: none !important; /* Removes default outline */
            transition: box-shadow 0.3s ease-in-out, border-color 0.3s ease-in-out;
        }
        

        /* Glowing Button */
        .glow-button {
            background: linear-gradient(50deg, #2C3E50, #4A90E2);
            font-weight: bold;
            transition: all 0.3s ease-in-out;
        }

        .glow-button:hover {
            box-shadow: 
            0 0 15px rgba(74, 144, 226, 0.8),  /* Light Blue Glow (#4A90E2) */
            0 0 30px rgba(44, 62, 80, 0.6);   /* Dark Blue Shadow (#2C3E50) */
                    transform: translateY(-2px);
        }
        /* Center Logo Glow Animation */
        @keyframes glowPulse {
            0% { box-shadow: 0 0 8px rgba(74, 144, 226, 0.5), 0 0 16px rgba(44, 62, 80, 0.4); }
            50% { box-shadow: 0 0 20px rgba(74, 144, 226, 0.8), 0 0 40px rgba(44, 62, 80, 0.6); }
            100% { box-shadow: 0 0 8px rgba(74, 144, 226, 0.5), 0 0 16px rgba(44, 62, 80, 0.4); }
        }
        
        /* .glowing-element {
            animation: glowPulse 3s infinite ease-in-out;
        }
        
        .highlighted-logo {
            animation: glowPulse 2s infinite;
        } */
       
        /* PDMS Logo Overlapping */
        .logo-container {
            position: absolute;
            top: -60px;
            left: 50%;
            transform: translateX(-50%);
            background: white;
            padding: 10px;
            border-radius: 50%;
            box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.2);
            top: -60px;
            left: 50%;
            transform: translateX(-50%);
            background: white;
            padding: 10px;
            border-radius: 50%;
            box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.2);
        }
        .logo-container img {
            height: 120px;
            width: 120px;
            border: 4px solid #4A90E2; /* Softer Blue Border */
            border-radius: 50%;
            box-shadow: 0px 0px 15px rgba(74, 144, 226, 0.6), 0px 0px 25px rgba(44, 62, 80, 0.4); 
            transition: transform 0.3s ease-in-out, box-shadow 0.3s ease-in-out;
        }
        
        /* Hover Effect for a Dynamic Feel */
        .logo-container img:hover {
            transform: scale(1.05);
            box-shadow: 0px 0px 20px rgba(74, 144, 226, 0.8), 0px 0px 35px rgba(44, 62, 80, 0.6);
        }