:root { --primary: #6a11cb; --secondary: #2575fc; --white: #ffffff; }
body { font-family: 'Poppins', sans-serif; margin: 0; padding: 0; background: #f8f9fa; overflow-x: hidden; }

/* Buttons */
.btn-primary { 
    background: linear-gradient(to right, var(--primary), var(--secondary)); 
    color: white; padding: 15px; border-radius: 12px; display: block; 
    text-decoration: none; font-weight: 600; border: none; width: 100%; margin-bottom: 10px;
    box-shadow: 0 4px 15px rgba(106, 17, 203, 0.3);
}
.btn-secondary { 
    background: #fff; color: var(--primary); padding: 15px; border-radius: 12px; 
    display: block; text-decoration: none; font-weight: 600; border: 2px solid var(--primary); 
}

/* Auth Cards */
.auth-page { background: #f0f2f5; }
.top-shape { 
    height: 200px; background: linear-gradient(45deg, var(--primary), var(--secondary)); 
    border-bottom-left-radius: 50% 20%; border-bottom-right-radius: 50% 20%; 
}
.auth-card { 
    background: white; padding: 30px; border-radius: 25px; 
    margin: -100px 20px 20px 20px; box-shadow: 0 10px 30px rgba(0,0,0,0.1); 
    text-align: center;
}

/* Input Styling */
.input-group input, .input-group select {
    width: 100%; padding: 14px; margin-bottom: 15px; border: 1.5px solid #eee;
    border-radius: 10px; font-size: 14px; transition: 0.3s; box-sizing: border-box;
}
.input-group input:focus { border-color: var(--primary); outline: none; box-shadow: 0 0 8px rgba(106,17,203,0.1); }

/* Loader */
.loader-line {
    width: 150px; height: 4px; background: #eee; margin-top: 20px;
    position: relative; overflow: hidden; border-radius: 5px;
}
.loader-line::after {
    content: ''; position: absolute; left: -100%; height: 4px; width: 100%;
    background: var(--primary); animation: loading 1.5s infinite;
}
@keyframes loading { 100% { left: 100%; } }