/* wwwroot/css/login.css
   Small overrides to perfectly match the register page look,
   while giving the single Log in button a primary (filled pink) style.
*/

/* Use the same tokens as styles.css (redundant but safe if this is cached alone) */
:root {
    --pink-500: #ec4899;
    --pink-600: #db2777;
    --pink-700: #be185d;
}

/* Make the single login button look like your primary (filled) register button */
.login-button {
    /* base size/shape already comes from styles.css via the shared selector:
     .register-button, .login-button { ... } */
    background-color: var(--pink-500);
    border: 2px solid var(--pink-700);
    color: #fff;
    box-shadow: 0 0 20px rgba(236, 72, 153, 0.25);
}

    .login-button:hover,
    .login-button:focus-visible {
        background-color: var(--pink-600);
        border-color: var(--pink-700);
        color: #fff;
    }

/* Small “forgot password?” link aligned to the bottom-right of the password field */
.pw-row {
    margin-top: .25rem;
    display: flex;
    justify-content: flex-end;
}

.forgot-link {
    color: #a8a29e; /* matches your .terms-text tone */
    font-size: 0.75rem; /* small/quiet */
    text-decoration: none;
}

    .forgot-link:hover {
        text-decoration: underline;
        color: #c7c1bc;
    }