/* --- NexTask - Auth Styles --- */

.auth-gradient {
    background: var(--bg-main);
    background-image:
        radial-gradient(circle at 25% 35%, rgba(99, 102, 241, 0.08) 0%, transparent 45%),
        radial-gradient(circle at 75% 65%, rgba(139, 92, 246, 0.08) 0%, transparent 45%);
}

.auth-card {
    background: var(--bg-card);
    backdrop-filter: var(--glass-blur);
    border: var(--glass-border);
    border-radius: var(--radius-xl);
    box-shadow: var(--shadow-xl);
    animation: slideUp 0.5s cubic-bezier(0.16, 1, 0.3, 1);
}

.auth-logo {
    animation: float 3s ease-in-out infinite;
}

@keyframes float {

    0%,
    100% {
        transform: translateY(0px);
    }

    50% {
        transform: translateY(-10px);
    }
}

.auth-input:focus {
    transform: translateY(-2px);
}

.auth-button {
    position: relative;
    overflow: hidden;
}

.auth-button::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 0;
    height: 0;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.2);
    transform: translate(-50%, -50%);
    transition: width 0.6s, height 0.6s;
}

.auth-button:hover::before {
    width: 300px;
    height: 300px;
}