/* Giao diện Đăng nhập & Đăng ký */
body {
    font-family: 'Inter', sans-serif;
    /* Gradient mới: Sâu hơn và hiện đại hơn */
    background: linear-gradient(135deg, #4f46e5 0%, #7c3aed 100%);
    height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
}
.auth-card {
    background: #ffffff; /* Trắng tinh khiết */
    padding: 40px;
    border-radius: 20px; /* Bo góc lớn hơn */
    /* Shadow sâu, mềm mại */
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25), 
                0 0 0 1px rgba(0, 0, 0, 0.05); 
    width: 100%;
    max-width: 420px;
    transition: transform 0.3s ease-in-out;
}
.auth-card:hover {
    transform: translateY(-5px);
}
.auth-card h3 {
    font-weight: 800; /* Extra bold */
    color: #1e293b; /* Màu tối hơn */
    margin-bottom: 25px;
}

/* Nút Primary */
.btn-primary { 
    background: #4f46e5; 
    border: none; 
    padding: 12px; 
    font-weight: 600; 
    border-radius: 10px; 
    width: 100%;
    transition: background 0.2s, transform 0.1s;
}
.btn-primary:hover { 
    background: #4338ca; 
    transform: translateY(-1px);
}
.btn-primary:active {
    background: #3730a3;
    transform: translateY(0);
}

/* Form Controls */
.form-control { 
    padding: 14px 15px; 
    background: #f8fafc; /* Nền input siêu nhẹ */
    border: 1px solid #e2e8f0; 
    border-radius: 10px; 
    font-size: 15px;
    transition: border-color 0.2s, box-shadow 0.2s;
}
.form-control:focus { 
    background: white; 
    border-color: #4f46e5; 
    box-shadow: 0 0 0 3px rgba(79, 70, 229, 0.1); 
}

/* Links */
.auth-link {
    font-size: 14px;
    color: #4f46e5;
    font-weight: 500;
}
.auth-link:hover {
    color: #4338ca;
}