.login-container {
    max-width: 400px;
    width: 95%;              
    margin: 8rem auto;       
    padding: 2.5rem;
    background: var(--card);
    border-radius: var(--border-radius);
    box-shadow: var(--shadow-lg);
    border: 1px solid var(--border);
}

.login-form {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
    width: 100%;
}

.login-form input {
    width: 100%;            
    padding: 0.75rem;
    border: 1px solid var(--border);
    border-radius: var(--border-radius);
    background: var(--background);
}

.login-form button {
    background: linear-gradient(135deg, var(--primary) 0%, hsl(310, 100%, 70%) 100%);
    color: var(--primary-foreground);
    padding: 0.8rem;
    border: none;
    border-radius: var(--border-radius);
    font-weight: 600;
    cursor: pointer;
    transition: transform 0.2s;
}

.login-form button:hover {
    transform: translateY(-2px);
}
        .message {
            text-align: center;
            margin-top: 1rem;
            color: var(--destructive);
        }
        .signup-link {
            text-align: center;
            margin-top: 1rem;
            font-size: 0.9rem;
        }
        .signup-link a {
            color: var(--primary);
            text-decoration: none;
            font-weight: 600;
        }