/*
 * TTAI-only login accents.
 * Loaded after style.css + clean/login.css on /login, ONLY when the active app is TTAI
 * (see templates/login.tpl). Overrides Readocracy's green accent (#02db73 / #32db73 / #11ff82)
 * with the TTAI brand pink. Scoped to .readocracy-login so nothing outside login is affected.
 */
:root {
    --ttai-pink: #ff004e;
}

/* "Login" button — the base style (style.css ~line 988) is a green-filled button with
   white text, so make it a filled brand-pink CTA. Higher specificity than `.btn .login-btn`
   so it wins on every breakpoint. */
.readocracy-login .btn .login-btn {
    background: var(--ttai-pink);
    color: #fff;
    border-color: var(--ttai-pink);
}

/* Input focus ring */
.readocracy-login form input:focus {
    border-color: var(--ttai-pink);
}

/* Bottom accent bar */
.readocracy-login:after {
    background-color: var(--ttai-pink);
}

/* "I forgot my password" link hover */
.readocracy-login .field.fineprint a:hover {
    border-color: var(--ttai-pink);
    color: var(--ttai-pink);
}