.login{--reg-spacing:.25rem;display:flex;flex-direction:column;justify-content:center}.login .error{padding:var(--reg-spacing);font-size:1rem;text-align:center;color:crimson}.login .success{padding:var(--reg-spacing);font-size:1.2rem;color:var(--primary-color)}.login-form{width:45%;margin:5dvh auto;padding:2rem 2.5rem;background:#fff;border-radius:12px;box-shadow:0 4px 24px rgba(0,0,0,.1);display:flex;flex-direction:column;gap:1.5rem;outline:1px solid rgba(0,0,0,0)}.login-form.is-ok{width:65%;padding:3dvh}.login-form.is-ok h1{text-align:center}.login-form.is-ok .logged-in-message{text-align:center;margin-block:0}.login-form.is-ok .logged-in-message:first-of-type strong{color:var(--primary-color);font-weight:600}.login-form.is-ok .logged-in-message .count{font-weight:700;color:var(--primary-color)}.login-form.is-ok .redirect{display:flex;justify-content:center;margin-top:1rem}.login-form .sign-in-button{width:fit-content;align-self:center}.log-in-content{--sizes:450px;width:var(--sizes);box-sizing:border-box;background-color:var(--white-color);border-radius:10px;padding:var(--reg-spacing);transition:var(--reg-transi)}.login-icon{font-size:5rem}.input-remember{display:flex}.input-remember label{margin-left:.25rem}.input-wrapper{display:flex;flex-direction:column;text-align:left;margin-bottom:1rem}.input-wrapper label{font-weight:700}.input-wrapper input{padding:5px;font-size:1.2rem}