/* ============================================================================
   HCHS LOGIN-SCREEN BRANDING — wp-login.php (all states: login, lost password,
   check-your-email, set/reset password, "password changed").
   Astra child theme, enqueued by hchs_login_branding_assets() in functions.php
   (Glenn, 2026-09-02, DECISIONS §139). VISUAL ONLY — no auth/redirect change.

   Palette (site tokens, see documents/brand/hchs-footer-tokens.css + style.css):
     charcoal bar #2a2622 | gold #be9656 | light gold #e7c98a / #e7c893
     warm white #f3f3f3   | ink #303030  | dark gold (links on white) #7a5c2e
   Measured WCAG 2.1 contrast (this pass):
     #e7c893 on #2a2622  9.35:1 AAA  (seal caption, links below the card)
     #e7c98a on #2a2622  9.38:1 AAA  (primary button text at rest)
     #2a2622 on #be9656  5.49:1 AA   (primary button hover/focus)
     #303030 on #ffffff 13.20:1 AAA  (card labels/body)
     #7a5c2e on #ffffff  6.18:1 AA   (links inside the white card)
     #ffffff on #be9656  2.73:1 FAIL — never used (Lena's rule: gold = fills/rules)
   ============================================================================ */

/* --- page --- */
body.login {
    background: #2a2622;
    border-top: 4px solid #be9656;
    font-family: "HCHSLato", -apple-system, "Segoe UI", "DejaVu Sans", sans-serif;
}
.login #login { padding-top: 6%; }

/* --- seal + Society name (replaces the WordPress W / "Powered by WordPress") --- */
.login h1.wp-login-logo a {
    /* background-image is injected inline from attachment 2425 (300px derivative) */
    background-color: transparent;
    background-position: center top;
    background-repeat: no-repeat;
    background-size: 130px 130px;
    width: auto;
    max-width: 320px;
    height: auto;
    padding: 142px 0 0;
    margin: 0 auto 22px;
    text-indent: 0;
    overflow: visible;
    display: block;
    text-align: center;
    font-family: "Playfair Display", Georgia, "DejaVu Serif", serif;
    font-size: 22px;
    font-weight: 500;
    line-height: 1.25;
    color: #e7c893;
    text-decoration: none;
}
.login h1.wp-login-logo a:hover,
.login h1.wp-login-logo a:focus { color: #fff; }
.login h1.wp-login-logo a:focus-visible {
    outline: 2px solid #be9656;
    outline-offset: 6px;
    border-radius: 4px;
}

/* --- the form card --- */
.login form {
    background: #fff;
    border: 0;
    border-top: 3px solid #be9656;
    border-radius: 4px;
    box-shadow: 0 10px 28px rgba(0, 0, 0, 0.35);
    padding: 26px 24px 30px;
}
.login label { color: #303030; }
.login form .input,
.login input[type="text"],
.login input[type="password"],
.login input[type="email"] {
    border: 1px solid #8c8479;
    border-radius: 3px;
    background: #fff;
    color: #303030;
    box-shadow: none;
}
.login form .input:focus,
.login input[type="text"]:focus,
.login input[type="password"]:focus,
.login input[type="email"]:focus {
    border-color: #8a6d3b;
    box-shadow: 0 0 0 3px rgba(190, 150, 86, 0.4);
    outline: 2px solid transparent;
}
/* Set-password field: core forms.css targets #pass1:focus by ID (blue ring);
   match the ID so the gold ring wins. Strength border colours are left alone. */
.login #pass1:focus,
.login #pass1-text:focus {
    box-shadow: 0 0 0 3px rgba(190, 150, 86, 0.4);
    outline: 2px solid transparent;
}
/* Remember Me checkbox: charcoal box, charcoal tick (core draws a blue tick) */
.login input[type="checkbox"] { border-color: #8c8479; box-shadow: none; }
.login input[type="checkbox"]:focus {
    border-color: #8a6d3b;
    box-shadow: 0 0 0 3px rgba(190, 150, 86, 0.4);
    outline: 2px solid transparent;
}
.login input[type="checkbox"]:checked { border-color: #2a2622; }
.login input[type="checkbox"]:checked::before {
    content: url("data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2020%2020%27%3E%3Cpath%20d%3D%27M14.83%204.89l1.34.94-5.81%208.38H9.02L5.78%209.67l1.34-1.25%202.57%202.4z%27%20fill%3D%27%232a2622%27%2F%3E%3C%2Fsvg%3E");
}

/* --- primary button (Log In / Get New Password / Save Password): the nav-pill
       language inverted — charcoal fill, light-gold text; gold fill + charcoal
       text on hover/focus (white-on-gold fails AA, so charcoal text instead) --- */
.login .button-primary,
.wp-core-ui.login .button-primary {
    background: #2a2622;
    border: 1px solid #be9656;
    border-radius: 999px;
    color: #e7c98a;
    text-shadow: none;
    box-shadow: none;
    font-weight: 700;
    letter-spacing: 0.02em;
    padding: 0 22px;
    min-height: 36px;
    line-height: 34px;
}
.login .button-primary:hover,
.login .button-primary:focus,
.wp-core-ui.login .button-primary:hover,
.wp-core-ui.login .button-primary:focus {
    background: #be9656;
    border-color: #be9656;
    color: #2a2622;
}
.login .button-primary:focus,
.wp-core-ui.login .button-primary:focus {
    box-shadow: 0 0 0 1px #fff, 0 0 0 3px #be9656;
    outline: 2px solid transparent;
}
.login .button-primary:active,
.wp-core-ui.login .button-primary:active { background: #8a6d3b; border-color: #8a6d3b; color: #fff; }

/* --- secondary buttons: show/hide password, Generate Password, Cancel --- */
.login .button-secondary,
.wp-core-ui.login .button-secondary,
.login .button.wp-generate-pw,
.login .button.wp-cancel-pw {
    color: #2a2622;
    border-color: #8c8479;
    background: #fff;
    box-shadow: none;
}
.login .button-secondary:hover,
.login .button-secondary:focus,
.wp-core-ui.login .button-secondary:hover,
.wp-core-ui.login .button-secondary:focus {
    color: #2a2622;
    border-color: #2a2622;
    background: #f3f3f3;
}
.login .button.wp-hide-pw,
.wp-core-ui.login .button.wp-hide-pw {
    color: #2a2622;
    background: transparent;
    border-color: transparent;
}
.login .button.wp-hide-pw:focus,
.wp-core-ui.login .button.wp-hide-pw:focus {
    border-color: #8a6d3b;
    box-shadow: 0 0 0 3px rgba(190, 150, 86, 0.4);
    background: transparent;
}

/* --- notices: gold rule for informational messages; success stays green,
       errors stay red (semantic colours kept) --- */
.login .message,
.login .notice-info {
    border-left-color: #be9656;
    color: #303030;
    border-radius: 0 4px 4px 0;
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.25);
}
.login .success,
.login #login_error {
    color: #303030;
    border-radius: 0 4px 4px 0;
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.25);
}
.login .message a,
.login .success a,
.login #login_error a,
.login #login form p a,
.login #login form .description a,
.login #login form .indicator-hint a {
    color: #7a5c2e;
    text-decoration: underline;
}
.login .message a:hover,
.login .success a:hover,
.login #login_error a:hover,
.login #login form p a:hover,
.login .message a:focus,
.login .success a:focus,
.login #login_error a:focus,
.login #login form p a:focus { color: #2a2622; }
.login #login form .description,
.login #login form .indicator-hint { color: #303030; }

/* --- the links below the card: "Lost your password?", "Log in", "Register",
       "← Go to Huntingdon County Historical Society", privacy link, language --- */
.login #nav,
.login #backtoblog { font-size: 14px; text-align: center; }
.login #nav a,
.login #backtoblog a,
.login .privacy-policy-page-link a,
.login .language-switcher label {
    color: #e7c893;
    text-decoration: none;
    border-bottom: 1px solid rgba(231, 200, 147, 0.45);
}
.login #nav a:hover,
.login #nav a:focus,
.login #backtoblog a:hover,
.login #backtoblog a:focus,
.login .privacy-policy-page-link a:hover,
.login .privacy-policy-page-link a:focus {
    color: #fff;
    border-bottom-color: #fff;
}
.login #nav a:focus-visible,
.login #backtoblog a:focus-visible,
.login .privacy-policy-page-link a:focus-visible {
    outline: 2px solid #be9656;
    outline-offset: 3px;
    border-radius: 2px;
}
.login .language-switcher { color: #e7c893; }

/* --- "Continue with Google" (Nextend) sits inside the white card; left on the
       plugin's own light skin so it stays readable — only the gap is tidied --- */
.login #nsl-custom-login-form-main .nsl-container-login-layout-below { padding-top: 22px; }

/* --- small screens --- */
@media screen and (max-width: 480px) {
    .login #login { padding-top: 28px; }
    .login h1.wp-login-logo a {
        background-size: 110px 110px;
        padding-top: 120px;
        font-size: 19px;
        margin-bottom: 18px;
    }
    .login form { padding: 22px 18px 26px; }
}