/* ==========================================================================
   login.css — wp-login.php (login, register, lost/reset password) in the
   library's design. Core markup and behaviour are untouched; only the look.
   ========================================================================== */

body.login {
  min-block-size: 100vh;
  margin: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-items: center;
  background: var(--color-bg);
  color: var(--color-text);
  font-family: var(--font-body);
  font-size: var(--text-base);
}
@media (min-width: 960px) {
  body.login { grid-template-columns: minmax(0, 1fr) minmax(360px, 44%); }
  body.login .ml-login-aside { display: flex; grid-column: 2; grid-row: 1 / span 9; }
}

/* Brand panel */
.ml-login-aside {
  display: none;
  align-self: stretch;
  position: relative;
  min-block-size: 100vh;
  align-items: center;
  justify-content: center;
  padding: var(--space-12);
  background: var(--color-deep, #2B1B0B) url("../img/pattern-footer.webp") center / 420px repeat;
  color: var(--color-on-deep, #EDE7D6);
  overflow: hidden;
}
.ml-login-aside::before { content: ""; position: absolute; inset: 0; background: linear-gradient(160deg, rgb(116 70 29 / 0.92), rgb(43 27 11 / 0.96)); }
.ml-login-aside__inner { position: relative; display: grid; gap: var(--space-8); max-inline-size: 420px; }
.ml-login-aside img { inline-size: 220px; block-size: auto; }
.ml-login-quote { margin: 0; font-family: var(--font-display, inherit); font-size: var(--text-2xl); line-height: 1.6; color: #FFF8E8; }
.ml-login-quote cite { display: block; margin-block-start: var(--space-2); font-size: var(--text-sm); font-style: normal; color: var(--ml-gold, #D8BE88); }
.ml-login-perks { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--space-3); font-size: var(--text-sm); }
.ml-login-perks li { display: flex; gap: var(--space-3); align-items: center; }
.ml-login-perks li::before { content: ""; inline-size: 8px; block-size: 8px; transform: rotate(45deg); background: var(--ml-gold, #D8BE88); flex: none; }

/* Form column */
body.login #login {
  grid-column: 1;
  inline-size: min(420px, calc(100vw - 2 * var(--space-5)));
  margin: var(--space-10) auto;
  padding: 0;
}
.login h1 a {
  background-size: contain;
  background-position: center;
  inline-size: 200px;
  block-size: 100px;
  margin: 0 auto var(--space-6);
}
[data-theme="dark"] .login h1 a { filter: brightness(1.6); }

.login form {
  margin: 0;
  padding: var(--space-8);
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-xl, 20px);
  box-shadow: var(--shadow-md);
}
.login form .input, .login input[type="text"], .login input[type="password"], .login input[type="email"] {
  inline-size: 100%;
  min-block-size: 48px;
  margin: var(--space-2) 0 var(--space-4);
  padding: var(--space-2) var(--space-4);
  font-size: var(--text-base);
  background: var(--color-bg);
  color: var(--color-text);
  border: 1px solid var(--color-border-strong);
  border-radius: var(--radius-md);
  box-shadow: none;
}
.login input:focus { border-color: var(--color-primary); box-shadow: 0 0 0 3px var(--color-primary-soft); outline: none; }
.login label { color: var(--color-heading); font-weight: var(--weight-medium); font-size: var(--text-sm); }
.login .forgetmenot { margin-block: var(--space-2); }
.login input[type="checkbox"] { accent-color: var(--color-primary); }

.login .button-primary,
.wp-core-ui.login .button-primary {
  float: none;
  inline-size: 100%;
  min-block-size: 48px;
  margin-block-start: var(--space-4);
  font-size: var(--text-md);
  font-weight: var(--weight-semibold);
  background: var(--color-primary);
  border: 0;
  border-radius: var(--radius-md);
  color: var(--color-on-primary);
  text-shadow: none;
  box-shadow: none;
}
.login .button-primary:hover, .login .button-primary:focus { background: var(--color-primary-hover); }
.login .submit { display: block; }
.wp-core-ui.login .button-secondary, .login .wp-hide-pw { color: var(--color-primary); border-color: transparent; background: transparent; min-block-size: 48px; }
.login .wp-pwd { position: relative; }
.login .wp-hide-pw { position: absolute; inset-block-start: var(--space-2); inset-inline-end: 0; }

.login #nav, .login #backtoblog { margin: var(--space-4) 0 0; padding: 0 var(--space-2); text-align: center; font-size: var(--text-sm); }
.login #nav a, .login #backtoblog a, .login .privacy-policy-page-link a { color: var(--color-primary); }
.login .message, .login .notice, .login #login_error {
  margin: 0 0 var(--space-4);
  padding: var(--space-3) var(--space-4);
  border: 0;
  border-inline-start: 4px solid var(--color-primary);
  border-radius: var(--radius-md);
  background: var(--color-primary-soft);
  color: var(--color-heading);
  box-shadow: none;
}
.login #login_error, .login .notice-error { border-inline-start-color: var(--color-danger); background: var(--color-danger-soft); }
.login .privacy-policy-page-link { text-align: center; margin: var(--space-6) 0 0; }

/* Password strength meter (reset password) */
.login #pass-strength-result { border-radius: var(--radius-sm); margin-block-end: var(--space-3); }

/* Language switcher below the form */
.login .language-switcher { grid-column: 1; margin: 0 auto var(--space-8); }
.login .language-switcher select { min-block-size: 40px; border-radius: var(--radius-md); }

/* RTL: core sets body.rtl; logical properties above cover alignment. */
body.login.rtl { direction: rtl; }