/* --- LOGIN FORM STYLING --- */
.auth-container { display: flex; justify-content: center; align-items: center; padding: 2rem 1rem; flex-grow: 1; }
.auth-card { background: var(--surface); width: 100%; max-width: 400px; border-radius: 8px; box-shadow: var(--shadow-8); overflow: hidden; animation: fadeIn 0.4s ease-out; }
@keyframes fadeIn { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: translateY(0); } }
.auth-header { background: var(--primary); padding: 2rem 1rem; text-align: center; color: white; }
.auth-header h1 { margin: 0; font-size: 1.5rem; font-weight: 500; }
.auth-body { padding: 2rem; }
.input-group { position: relative; margin-bottom: 1.5rem; }
.input-group .material-icons { position: absolute; left: 0; top: 12px; color: rgba(0,0,0,0.54); font-size: 1.25rem; }
.auth-input { width: 100%; border: none; border-bottom: 2px solid #e0e0e0; padding: 10px 10px 10px 32px; font-size: 1rem; font-family: inherit; transition: border-color 0.3s; background: transparent; }
.auth-input:focus { outline: none; border-bottom-color: var(--primary); }
.auth-btn-submit { width: 100%; background: var(--primary); color: white; border: none; padding: 0.875rem; border-radius: 4px; font-weight: 700; font-size: 0.875rem; text-transform: uppercase; cursor: pointer; box-shadow: var(--shadow-1); margin-top: 1rem; }
.auth-footer-links { text-align: center; margin-top: 1.5rem; font-size: 0.875rem; color: rgba(0,0,0,0.6); }
.auth-footer-links a { color: var(--primary); text-decoration: none; font-weight: 500; }