/* The login screen wears Pavo's identity, not Frappe's.
 *
 * SCOPED TO `#page-login`, which is the wrapper frappe's own login page renders and no other
 * website page does. `web_include_css` loads on EVERY website route, so an unscoped rule here would
 * repaint the portal, the password-reset page and any web form the shop ever publishes. The whole
 * file therefore sits inside that one id.
 *
 * The colour is measured, not invented: #0B4C76 is the dominant ink of the peacock the owner
 * already uses on pavo.ly (sampled from the site's own icon, 2026-09-06). Pavo means peacock; the
 * two branch marks (rose #C9506F, perfume #B86B28) are for the branch screens, and neither belongs
 * on a door that both branches walk through.
 */
#page-login {
    --pavo-ink: #0B4C76;
    --pavo-ink-deep: #08395A;
    --pavo-paper: #F6F3ED;
    --pavo-line: #E4DED2;
}

/* The page's own ground. `body` is not ours to claim — this id is. */
#page-login {
    background: radial-gradient(120% 90% at 50% 0%, #FFFFFF 0%, var(--pavo-paper) 62%, #EFEAE0 100%);
    min-height: 100vh;
}

#page-login .page-breadcrumbs,
#page-login .page-header-wrapper {
    display: none;
}

#page-login .for-login,
#page-login .for-forgot,
#page-login .for-signup,
#page-login .for-email-login {
    max-width: 26rem;
    margin: 0 auto;
}

/* ---- the mark + the name ---- */

#page-login .page-card-head {
    text-align: center;
    margin-bottom: 1.75rem;
}

#page-login .page-card-head .app-logo {
    width: 76px;
    height: 76px;
    margin-bottom: 0.9rem;
    /* The mark is a line drawing on transparency: no radius, no shadow, nothing to make it look
       like an app tile it is not. */
    border-radius: 0;
    box-shadow: none;
}

/* «Login to Frappe» is replaced wholesale — see pavo_login.js for why the text is set there and
   not here. This rule only dresses whatever the heading ends up saying. */
#page-login .page-card-head h4 {
    font-family: Georgia, "Times New Roman", serif;
    font-size: 1.75rem;
    font-weight: 700;
    letter-spacing: 0.02em;
    color: var(--pavo-ink);
    margin: 0;
}

#page-login .pavo-tagline {
    margin: 0.35rem 0 0;
    font-size: 0.8125rem;
    letter-spacing: 0.04em;
    color: #7A7266;
}

/* ---- the card ---- */

#page-login .page-card {
    background: #FFFFFF;
    border: 1px solid var(--pavo-line);
    border-radius: 14px;
    box-shadow: 0 1px 2px rgba(11, 76, 118, 0.04), 0 12px 32px -12px rgba(11, 76, 118, 0.18);
    padding: 1.75rem 1.5rem 1.5rem;
}

#page-login .form-control {
    background: #FAF8F4;
    border: 1px solid var(--pavo-line);
    border-radius: 8px;
    height: 2.75rem;
}

#page-login .form-control:focus {
    background: #FFFFFF;
    border-color: var(--pavo-ink);
    /* Frappe's own focus ring is a blue that is not this blue. */
    box-shadow: 0 0 0 3px rgba(11, 76, 118, 0.14);
}

#page-login .btn-primary,
#page-login .btn-login {
    background: var(--pavo-ink);
    border-color: var(--pavo-ink);
    border-radius: 8px;
    height: 2.75rem;
    font-weight: 600;
    letter-spacing: 0.01em;
}

#page-login .btn-primary:hover,
#page-login .btn-login:hover,
#page-login .btn-primary:focus,
#page-login .btn-login:focus {
    background: var(--pavo-ink-deep);
    border-color: var(--pavo-ink-deep);
    box-shadow: 0 0 0 3px rgba(11, 76, 118, 0.18);
}

#page-login .btn-default {
    background: #FFFFFF;
    border: 1px solid var(--pavo-line);
    border-radius: 8px;
    height: 2.75rem;
    color: var(--pavo-ink);
}

#page-login .btn-default:hover {
    background: var(--pavo-paper);
    border-color: var(--pavo-ink);
}

#page-login a,
#page-login .forgot-password-message a {
    color: var(--pavo-ink);
}

#page-login .field-icon use,
#page-login .field-icon {
    color: #9A9184;
}

/* The website navbar's «Home» link is the one thing on this page that leads AWAY from signing in,
   and there is no public site behind it — the ERP is the whole of what this host serves. */
#page-login .navbar,
body[data-path="login"] .navbar {
    display: none;
}