/* Picture — Modern WP Login styles (mobile-first) */

:root {
  --login-surface: #ffffff;
  --login-ink: #17324B; /* deep slate */
  --login-muted: #6b7280;
  --login-line: #e7e3dc;
  --login-accent: #c19a6b; /* warm bronze */
  --login-accent-dark: #a57d4d;
}

/* Full-bleed soft gradient background */
body.login {
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  background: radial-gradient(1200px 600px at 50% 0%, rgba(0,0,0,0.04), transparent 60%),
              linear-gradient(180deg, #f6f4ee 0%, #f2efe9 40%, #f8f7f3 100%);
}

/* Center container and control width */
#login {
  width: min(94vw, 640px);
  margin: 2rem auto;
  padding: 0;
}
/* Ensure all children align to the same width rhythm */
body.login #login > * { max-width: 100%; }

/* Logo — replaced via inline background-image from theme */
body.login h1 { text-align: center; margin-bottom: 1.25rem; }
body.login h1 a {
  width: 72px; height: 72px;
  background-size: cover; background-position: center; background-repeat: no-repeat;
  border-radius: 50%;
  box-shadow: 0 6px 24px rgba(17,17,17,.08), 0 2px 8px rgba(17,17,17,.06);
}

/* Card */
body.login form {
  background: var(--login-surface);
  border: 1px solid var(--login-line);
  border-radius: 20px;
  box-shadow: 0 18px 40px rgba(17,17,17,.08);
  padding: clamp(1rem, 3.5vw, 2rem);
  color: var(--login-ink);
  width: auto;
  margin: 0;
}

/* Consistent spacing for form fields */
body.login form p { margin-bottom: 0.9rem; }
body.login form p.submit { margin-top: 1rem; }

/* Labels & inputs */
body.login label { font-weight: 700; color: var(--login-ink); }
body.login .input,
body.login input[type="text"],
body.login input[type="email"],
body.login input[type="password"],
body.login input[type="url"] {
  border: 2px solid var(--login-line);
  border-radius: 14px;
  padding: 0.85rem 1rem;
  font-size: 16px;
  color: var(--login-ink);
  box-shadow: none;
}
body.login .input:focus { 
  border-color: var(--login-accent);
  box-shadow: 0 0 0 3px rgba(193,154,107,.16);
}

/* Remember me */
body.login .forgetmenot label { color: var(--login-ink); font-weight: 600; }
body.login .forgetmenot input[type="checkbox"]{ width: 20px; height: 20px; }

/* Primary button */
body.login .button-primary { 
  width: 100%;
  border-radius: 14px;
  background: linear-gradient(135deg, var(--login-accent), var(--login-accent-dark));
  border: none;
  box-shadow: 0 8px 22px rgba(193,154,107,.35);
  padding: 0.9rem 1rem;
  font-weight: 700;
  letter-spacing: .02em;
}
body.login .button-primary:hover { filter: brightness(1.02); transform: translateY(-1px); }

/* Notices */
body.login .notice, body.login #login_error, body.login .message {
  border-radius: 12px;
  border: none;
  padding: 1rem 1.25rem;
  box-shadow: 0 6px 16px rgba(17,17,17,.06);
  margin: 0 0 1rem 0;
  width: 100%;
}
body.login #login_error { background: #fdecea; color: #8a1c1c; border-left: 4px solid #dc3545; }
body.login .message { background: #e8f2ff; color: #0c5460; border-left: 4px solid #31a6ff; }

/* Register screen tweaks */
body.login-action-register #login { width: min(94vw, 680px); }
body.login-action-register .message.register {
  background: #e8f2ff;
  color: #0c5460;
  border-left: 4px solid #31a6ff;
  border-radius: 14px;
  width: auto;
}
body.login-action-register form#registerform .input { width: 100%; box-sizing: border-box; }
body.login-action-register form#registerform label { display: block; margin-bottom: .35rem; }
body.login-action-register #nav { margin-top: .75rem; }
/* Make large submit buttons full-width */
body.login .button.button-large { width: 100%; border-radius: 14px; }

/* Lost password + other views share same rhythm */
body.login-action-lostpassword #login,
body.login-action-rp #login,
body.login-action-resetpass #login { width: min(94vw, 640px); }

/* Links (register/forgot) */
body.login #nav, body.login #backtoblog { text-align: center; }
body.login #nav a, body.login #backtoblog a { color: var(--login-ink); font-weight: 600; }
body.login #nav a:hover, body.login #backtoblog a:hover { color: var(--login-accent); }

/* Language switcher spacing */
body.login .language-switcher { margin-top: 1rem; }

/* Small screens */
@media (max-width: 480px) {
  body.login h1 a { width: 60px; height: 60px; }
  #login { width: 92vw; }
  body.login form { border-radius: 16px; }
  body.login .button-primary { border-radius: 12px; }
}