/* Login Button Styling */
.login-btn {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 50px !important;
    height: 50px !important;
    padding: 0 !important;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
    color: white !important;
    border-radius: 50% !important;
    text-decoration: none !important;
    transition: all 0.3s ease !important;
    box-shadow: 0 2px 10px rgba(102, 126, 234, 0.3) !important;
    border: none !important;
    font-weight: 500 !important;
}

    .login-btn:hover {
        background: linear-gradient(135deg, #5a6fd8 0%, #6a4190 100%) !important;
        color: white !important;
        text-decoration: none !important;
        transform: translateY(-2px) !important;
        box-shadow: 0 4px 15px rgba(102, 126, 234, 0.4) !important;
    }

        .login-btn:hover .login-icon {
            transform: scale(1.4) rotate(10deg) !important;
            animation: none !important;
            filter: drop-shadow(0 0 15px rgba(255, 255, 255, 1)) !important;
            stroke-width: 3 !important;
        }

    .login-btn:focus {
        color: white !important;
        text-decoration: none !important;
        box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.3) !important;
    }

.login-icon {
    width: 28px !important;
    height: 28px !important;
    stroke-width: 2.5 !important;
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1) !important;
    animation: loginPulse 2.5s ease-in-out infinite !important;
    filter: drop-shadow(0 0 4px rgba(255, 255, 255, 0.4)) !important;
}

@keyframes loginPulse {
    0%, 100% {
        transform: scale(1);
        filter: drop-shadow(0 0 4px rgba(255, 255, 255, 0.4));
    }

    25% {
        transform: scale(1.08);
        filter: drop-shadow(0 0 8px rgba(255, 255, 255, 0.6));
    }

    50% {
        transform: scale(1.12);
        filter: drop-shadow(0 0 12px rgba(255, 255, 255, 0.8));
    }

    75% {
        transform: scale(1.08);
        filter: drop-shadow(0 0 8px rgba(255, 255, 255, 0.6));
    }
}

.login-btn .nav-text {
    font-size: 13px !important;
    font-weight: 500 !important;
    color: white !important;
    text-align:center;
    padding-right:5px;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .login-btn {
        width: 45px !important;
        height: 45px !important;
    }

    .login-icon {
        width: 24px !important;
        height: 24px !important;
        stroke-width: 2.3 !important;
    }
}
