/* =========================================================
   One AI Skill — branded native auth screens (wp-login.php)
   Phase 5C-A. Presentation only: WordPress markup untouched.
   Covers: login, register, lost password, reset password,
   error/notice states, interstitials (check email, logged out).
   ========================================================= */

/* Typography reuses the product font stack (--sv-font) with a full local
   system fallback. No web-font request is made here: wp-login screens must
   stay dependency-free, so 'Cabin' is used only if locally available and
   otherwise degrades to the system UI stack. */
body.login{
  font-family:'Cabin',system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  color:#1B2039;
  background:
    radial-gradient(1100px 520px at 88% -8%, rgba(43,194,169,.10), transparent 60%),
    radial-gradient(900px 480px at -6% 4%, rgba(138,58,70,.09), transparent 55%),
    #F6F1E5;
  min-height:100vh;
}

/* ---------- layout: centered branded card ---------- */
#login{
  width:388px;
  max-width:calc(100vw - 32px);
  padding:6vh 0 24px;
}
#login form,
#login .message,
#login .notice,
#login .success{
  border:1px solid rgba(27,32,57,.16);
  border-radius:18px;
  box-shadow:0 6px 22px rgba(27,32,57,.07);
  background:#fff;
}
#login form{
  padding:26px 24px 28px;
  margin-top:14px;
}

/* ---------- wordmark replaces the WordPress logo ---------- */
.login h1 a{
  background-image:url(../img/oneaiskill-logo-horizontal-soft.svg);
  background-size:contain;
  background-position:center;
  background-repeat:no-repeat;
  width:196px;
  height:44px;
  margin:0 auto 6px;
}
.login h1 a:focus{
  box-shadow:0 0 0 4px rgba(43,194,169,.30);
  border-radius:10px;
  outline:none;
}

/* ---------- messages / errors (keep semantics, soften look) ---------- */
.login .message,
.login .success{
  border-left:4px solid #2BC2A9;
  color:#4A5068;
  font-size:14.5px;
  line-height:1.5;
  padding:14px 16px;
}
.login .notice-error,
.login #login_error{
  border-left:4px solid #d63638; /* error red stays recognizable */
  border-radius:18px;
  color:#4A5068;
  font-size:14.5px;
  line-height:1.5;
  padding:14px 16px;
  overflow-wrap:break-word;
}
.login #login_error a{ color:#8A3A46; }
.sv-login-intro{ font-weight:500; }

/* ---------- form fields ---------- */
.login form .input,
.login input[type="text"],
.login input[type="password"],
.login input[type="email"]{
  font-family:inherit;
  font-size:16px;              /* prevents iOS focus zoom */
  color:#1B2039;
  background:#fff;
  border:1px solid rgba(27,32,57,.30);
  border-radius:12px;
  padding:10px 14px;
  min-height:46px;
  box-shadow:none;
  margin-bottom:4px;
}
.login form .input:focus,
.login input[type="text"]:focus,
.login input[type="password"]:focus,
.login input[type="email"]:focus{
  border-color:#2BC2A9;
  box-shadow:0 0 0 4px rgba(43,194,169,.14);
  outline:2px solid transparent; /* keep an outline slot for forced-colors mode */
}
.login label{
  font-size:14px;
  font-weight:600;
  color:#4A5068;
}
.login .forgetmenot label{ font-weight:500; }

/* password reveal button inside the field keeps working; align it */
.login .wp-pwd .button.wp-hide-pw{
  color:#5A6178;
  min-height:46px;
}
.login .wp-pwd .button.wp-hide-pw:focus{
  border-color:#2BC2A9;
  box-shadow:0 0 0 4px rgba(43,194,169,.14);
  outline:none;
}
/* weak-password confirm + strength meter inherit card look */
.login .pw-weak label{ font-weight:500; }
#pass-strength-result{ border-radius:10px; font-family:inherit; }

/* ---------- primary button = product button language ---------- */
.wp-core-ui .button-primary{
  font-family:inherit;
  font-weight:600;
  font-size:15px;
  color:#0E3A33;
  background:linear-gradient(135deg,#2BC2A9 0%,#2BC2A9 100%);
  border:0;
  border-radius:12px;
  min-height:46px;
  padding:8px 22px;
  text-shadow:none;
  box-shadow:0 8px 20px rgba(43,194,169,.28);
  transition:transform .15s, box-shadow .15s;
  width:100%;
  text-align:center;
}
.wp-core-ui .button-primary:hover,
.wp-core-ui .button-primary:active{
  color:#0E3A33;
  background:linear-gradient(135deg,#14b6b8 0%,#1cc296 100%);
  box-shadow:0 10px 24px rgba(43,194,169,.34);
}
.wp-core-ui .button-primary:focus{
  color:#0E3A33;
  background:linear-gradient(135deg,#14b6b8 0%,#1cc296 100%);
  box-shadow:0 0 0 4px rgba(43,194,169,.30);
  outline:2px solid transparent;
}
.login .submit{ margin-top:6px; }

/* ---------- links under the card ---------- */
.login #nav,
.login #backtoblog{
  font-size:14px;
  text-align:center;
  padding:0;
  margin:16px 0 0;
}
.login #nav a,
.login #backtoblog a{
  color:#4A5068;
  text-decoration:none;
  border-radius:8px;
  padding:4px 6px;
}
.login #nav a:hover,
.login #backtoblog a:hover{
  color:#1B2039;
  background:#F1EBDC;
}
.login #nav a:focus,
.login #backtoblog a:focus{
  box-shadow:0 0 0 3px rgba(43,194,169,.30);
  outline:none;
}
/* v2.9.1: the account-creation link ("Create account", action=register) gets the
   warm brand accent (--sv-amber #D7A23E in sv.css) as a soft chip + stronger
   weight. "Lost your password?" keeps the quiet default treatment above. */
.login #nav a[href*="action=register"]{
  font-weight:600;
  color:#1B2039;
  background:rgba(215,162,62,.16);
  border-radius:999px;
  padding:6px 13px;
}
.login #nav a[href*="action=register"]:hover{
  color:#1B2039;
  background:rgba(215,162,62,.28);
}
.login #nav a[href*="action=register"]:focus{
  box-shadow:0 0 0 3px rgba(215,162,62,.40);
  outline:none;
}

/* make the return-to-product link read as the calm primary escape hatch */
.login #backtoblog a{ font-weight:600; color:#8A3A46; }
.login #backtoblog a:hover{ color:#5a2fd8; background:#F1EBDC; }

/* ---------- privacy policy footer link (if a policy page is set) ---------- */
.login .privacy-policy-page-link{ margin:14px 0 0; }
.login .privacy-policy-link{ color:#5A6178; }

/* ---------- mobile ---------- */
@media (max-width:480px){
  #login{ padding-top:4vh; }
  #login form{ padding:20px 16px 22px; }
  .login h1 a{ width:170px; height:38px; }
}

/* ---------- reduced motion ---------- */
@media (prefers-reduced-motion: reduce){
  .wp-core-ui .button-primary{ transition:none; }
}
