:root{--primary-color:#2563eb;--secondary-color:#1e40af;--background-color:#f8fafc;--text-color:#1f2937;--border-radius:8px;--spacing-unit:1rem}.login-container{display:flex;justify-content:center;align-items:center;min-height:100vh;background-color:var(--background-color);padding:var(--spacing-unit)}.login-container form{background:white;padding:2rem;border-radius:var(--border-radius);box-shadow:0 4px 6px -1px rgb(0 0 0/.1);width:100%;max-width:400px}.login-container form label{display:block;margin-bottom:.5rem;color:var(--text-color);font-weight:500}.login-container form input{width:100%;padding:.75rem;border:1px solid #e5e7eb;border-radius:var(--border-radius);margin-bottom:1rem;font-size:1rem;transition:border-color .2s ease}.login-container form input:focus{outline:none;border-color:var(--primary-color)}.login-container form button{width:100%;padding:.75rem;background-color:var(--primary-color);color:white;border:none;border-radius:var(--border-radius);font-size:1rem;font-weight:500;cursor:pointer;transition:background-color .2s ease;margin-bottom:.5rem}.login-container form button:hover{background-color:var(--secondary-color)}.login-container form button:last-child{margin-bottom:0}@media (max-width:480px){.login-container form{padding:1.5rem}}