/* ==========================================================================
   HelpGent — WordPress login screens (wp-login.php: log in, lost password,
   check your email, reset password). Loaded after WordPress's login.css and
   common.css (inc/login-screen.php). Matches the checkout page and the
   Account login card; uses the shared tokens only.
   ========================================================================== */

/* page: the checkout's soft indigo wash */
body.login{min-height:100vh;font-family:var(--font);color:var(--text);
  background:
    radial-gradient(900px 420px at 50% -6%, rgb(var(--accent-rgb) / .10), transparent 70%),
    radial-gradient(520px 320px at 92% 18%, rgb(var(--glow-1-rgb) / .10), transparent 70%),
    linear-gradient(var(--tint), var(--white) 420px) no-repeat,
    var(--white)}
body.login #login{width:100%;max-width:440px;padding:56px var(--gutter) 40px}

/* logo: the HelpGent mark in indigo, the wordmark in text colour */
body.login h1.wp-login-logo a{display:flex;justify-content:center;width:auto;height:auto;margin:0 0 32px;
  background:none;text-indent:0;overflow:visible;color:var(--text)}
body.login h1.wp-login-logo .logo__svg{height:36px;width:auto}
body.login h1.wp-login-logo .logo__svg > g > g{fill:var(--accent)}
body.login h1.wp-login-logo a:focus{outline:none;box-shadow:var(--ring);border-radius:var(--radius)}

/* the form card */
body.login form{display:grid;gap:18px;margin:0;padding:32px;background:var(--white);border:1px solid var(--line);border-radius:var(--radius-lg);
  box-shadow:var(--shadow-card);overflow:visible}
/* spacing comes from the grid gap on every screen; WordPress's own margins (some set by ID) are cleared */
body.login form > *,body.login form > p,body.login form .user-pass-wrap,body.login form .forgetmenot{margin:0}
body.login form > .clear{display:none}
body.login label{display:block;margin-bottom:8px;font-size:15px;font-weight:500;line-height:1.4;color:var(--text)}
body.login form .input,body.login input[type="text"],body.login input[type="email"],body.login input[type="password"]{
  width:100%;height:50px;min-height:50px;margin:0;padding:0 16px;font-family:var(--font);font-size:16px;line-height:1.2;color:var(--text);
  background:var(--white);border:1px solid var(--line-2);border-radius:var(--radius);box-shadow:none;
  transition:border-color var(--t-ui),box-shadow var(--t-ui)}
body.login form .input:hover{border-color:var(--text-3)}
body.login form .input:focus,body.login input[type="password"]:focus,body.login input[type="text"]:focus{outline:none;border-color:var(--accent);box-shadow:var(--ring)}
body.login .wp-pwd{position:relative}
body.login .wp-pwd .input{padding-right:52px}
/* show/hide eye: a small icon inside the field (WordPress gives it .button-secondary too, so .button-secondary is never styled wholesale here) */
body.login.wp-core-ui .button.wp-hide-pw{position:absolute;top:0;right:4px;left:auto;width:44px;min-width:0;height:50px;margin:0;padding:0;
  color:var(--text-2);background:none;border:0;box-shadow:none}
body.login.wp-core-ui .button.wp-hide-pw:hover,body.login.wp-core-ui .button.wp-hide-pw:focus{color:var(--accent);background:none;border:0;box-shadow:none}

/* keep me logged in */
body.login .forgetmenot{float:none}
body.login .forgetmenot label{display:inline-flex;align-items:center;gap:10px;margin:0;font-weight:400;color:var(--text-2)}
body.login input[type="checkbox"]{width:18px;height:18px;margin:0;border-color:var(--line-2);border-radius:4px;box-shadow:none}
body.login input[type="checkbox"]:checked{background:var(--accent);border-color:var(--accent)}
body.login input[type="checkbox"]:checked::before{filter:brightness(0) invert(1)}
body.login input[type="checkbox"]:focus{box-shadow:var(--ring)}

/* buttons: the theme's filled button, full width */
body.login .submit{float:none;margin:0;padding:0}
body.login .wp-core-ui .button-primary,body.login.wp-core-ui .button-primary{float:none;width:100%;height:auto;min-height:0;padding:16px 24px;
  font-family:var(--font);font-size:16px;font-weight:500;line-height:1.2;text-shadow:none;
  color:#fff;background:var(--accent);border:1px solid var(--accent);border-radius:var(--radius);box-shadow:none;
  transition:background var(--t-ui),border-color var(--t-ui)}
body.login.wp-core-ui .button-primary:hover{background:var(--accent-hover);border-color:var(--accent-hover)}
body.login.wp-core-ui .button-primary:focus{box-shadow:var(--ring)}
/* reset password: "Generate password" as the theme's white button */
body.login .reset-pass-submit{display:grid;grid-template-columns:minmax(0,1fr);gap:12px;width:100%}
body.login.wp-core-ui .reset-pass-submit .button{width:100%;justify-self:stretch}
body.login.wp-core-ui .button.wp-generate-pw{width:100%;margin:0;padding:12px 18px;height:auto;
  font-family:var(--font);font-size:15px;font-weight:500;color:var(--text);background:var(--white);border:1px solid var(--line-2);border-radius:var(--radius);box-shadow:none}
body.login.wp-core-ui .button.wp-generate-pw:hover{border-color:var(--accent);color:var(--accent)}

/* password strength and hints (reset password) */
body.login #pass-strength-result{margin:8px 0 0;padding:8px 12px;border-radius:var(--radius);font-size:14px;font-weight:500;border-width:1px}
body.login .description.indicator-hint{margin:0;font-size:14px;line-height:1.6;color:var(--text-2)}
body.login .pw-weak label{display:inline-flex;align-items:center;gap:10px;font-weight:400;color:var(--text-2)}

/* messages: notices in the card style; errors in red */
body.login .message,body.login .notice,body.login .success,body.login #login_error{margin:0 0 20px;padding:14px 16px;
  font-size:14px;line-height:1.6;color:var(--text);background:var(--accent-soft);border:0;border-left:0;border-radius:var(--radius);box-shadow:none}
body.login #login_error,body.login .notice-error{background:#FDECEC;color:#B4262B}
body.login .message a,body.login .notice a,body.login #login_error a{color:var(--accent);font-weight:500}

/* links under the card */
body.login #nav,body.login #backtoblog{margin:20px 0 0;padding:0;text-align:center;font-size:15px}
body.login #backtoblog{margin-top:8px}
body.login #nav a,body.login #backtoblog a{color:var(--accent);font-weight:500;text-decoration:none}
body.login #nav a:hover,body.login #backtoblog a:hover{color:var(--accent-hover);text-decoration:underline}
body.login .privacy-policy-page-link{margin-top:24px}
body.login .privacy-policy-page-link a{color:var(--text-2)}

@media (max-width:480px){
  body.login #login{padding-top:36px}
  body.login form{padding:24px 20px}
}