/* =====================================================
   Sobol Auth UI (wp-login.php) - Lost Password Styling
   Scope: body.login (WordPress auth screens)
   Palette: gold primary to match Sobol theme
===================================================== */

:root{
  --sobol-primary:#C8A56A;
  --sobol-primary-2:#B89155;
  --sobol-text:#101828;
  --sobol-muted:#667085;
  --sobol-border:rgba(16,24,40,.12);
  --sobol-shadow:0 22px 70px rgba(16,24,40,.10);
  --sobol-radius:22px;
}

body.login{
  background:#F5F7FB;
  font-family:"Tajawal","IBM Plex Sans Arabic","Cairo",system-ui,-apple-system,"Segoe UI",Tahoma,Arial,sans-serif;
  direction:rtl;
}

body.login #login{
  width:min(520px, 92vw);
  padding:0;
}

body.login #loginform,
body.login #lostpasswordform,
body.login form.resetpass-form,
body.login .lost_reset_password{
  background:#fff;
  border:1px solid var(--sobol-border);
  border-radius:var(--sobol-radius);
  box-shadow:var(--sobol-shadow);
  padding:22px 22px 18px;
}

body.login #loginform,
body.login #lostpasswordform{
  margin-top:18px;
}

body.login #login h1{
  margin: 0 0 10px;
  text-align:center;
}
body.login #login h1 a{
  background-size: contain;
  width: 220px;
  height: 84px;
  margin: 0 auto;
}

body.login label{
  font-weight:800;
  font-size:13px;
  color:var(--sobol-text);
  margin: 10px 0 6px;
}

body.login input[type="text"],
body.login input[type="email"],
body.login input[type="password"]{
  width:100%;
  border:1px solid var(--sobol-border);
  border-radius:16px;
  padding:12px 14px;
  outline:none;
  background:#fbfbfc;
  transition:border-color .15s ease, box-shadow .15s ease, background .15s ease;
}

body.login input[type="text"]:focus,
body.login input[type="email"]:focus,
body.login input[type="password"]:focus{
  background:#fff;
  border-color: rgba(200,165,106,.65);
  box-shadow: 0 0 0 4px rgba(200,165,106,.18);
}

body.login .button-primary,
body.login input[type="submit"]{
  width:100%;
  margin-top:14px;
  border:0;
  border-radius:18px;
  padding:12px 16px;
  font-weight:900;
  cursor:pointer;
  background: var(--sobol-primary);
  color:#fff;
  box-shadow:0 14px 36px rgba(0,0,0,.12);
  transition:transform .15s ease, box-shadow .15s ease, opacity .15s ease;
}

body.login .button-primary:hover,
body.login input[type="submit"]:hover{
  opacity:.95;
  box-shadow:0 18px 44px rgba(0,0,0,.14);
}

body.login .button-primary:active,
body.login input[type="submit"]:active{
  transform: translateY(1px);
}

body.login .message,
body.login #login_error{
  border-radius:16px;
  padding:12px 14px;
  border:1px solid rgba(200,165,106,.30);
  background: rgba(200,165,106,.12);
  color:var(--sobol-text);
  box-shadow: 0 10px 24px rgba(16,24,40,.06);
}

body.login #nav,
body.login #backtoblog{
  text-align:center;
}

body.login #nav a,
body.login #backtoblog a{
  color: var(--sobol-primary-2);
  font-weight:800;
}

body.login #nav a:hover,
body.login #backtoblog a:hover{
  opacity:.85;
}



/* =====================================================
   Front-end Lost Password / Reset Password Styling
   Targets:
   - WooCommerce: form.woocommerce-ResetPassword / form.lost_reset_password
   - WordPress front templates: #lostpasswordform / .lost_reset_password
===================================================== */

.woocommerce form.woocommerce-ResetPassword,
.woocommerce form.lost_reset_password,
form.woocommerce-ResetPassword,
form.lost_reset_password,
#lostpasswordform,
.lost_reset_password{
  max-width: 560px;
  margin: 40px auto !important;
  background: #fff;
  border: 1px solid var(--sobol-border);
  border-radius: var(--sobol-radius);
  box-shadow: var(--sobol-shadow);
  padding: 22px 22px 18px;
  direction: rtl;
  text-align: right;
}

/* Headings / intro text (where present) */
.woocommerce .woocommerce-message,
.woocommerce .woocommerce-error,
.woocommerce .woocommerce-info,
#login_error,
.entry-content .message{
  max-width: 560px;
  margin: 18px auto !important;
  border-radius: 16px;
  padding: 12px 14px;
  border: 1px solid rgba(200,165,106,.30);
  background: rgba(200,165,106,.12);
  color: var(--sobol-text);
  box-shadow: 0 10px 24px rgba(16,24,40,.06);
}

/* Labels */
.woocommerce form.woocommerce-ResetPassword label,
.woocommerce form.lost_reset_password label,
form.woocommerce-ResetPassword label,
form.lost_reset_password label,
#lostpasswordform label,
.lost_reset_password label{
  display:block;
  font-weight:800;
  font-size:13px;
  color:var(--sobol-text);
  margin: 12px 0 6px;
}

/* Inputs */
.woocommerce form.woocommerce-ResetPassword input[type="text"],
.woocommerce form.woocommerce-ResetPassword input[type="email"],
.woocommerce form.lost_reset_password input[type="text"],
.woocommerce form.lost_reset_password input[type="email"],
form.woocommerce-ResetPassword input[type="text"],
form.woocommerce-ResetPassword input[type="email"],
form.lost_reset_password input[type="text"],
form.lost_reset_password input[type="email"],
#lostpasswordform input[type="text"],
#lostpasswordform input[type="email"],
#lostpasswordform input#user_login,
.lost_reset_password input[type="text"],
.lost_reset_password input[type="email"]{
  width:100%;
  border:1px solid var(--sobol-border);
  border-radius:16px;
  padding:12px 14px;
  outline:none;
  background:#fbfbfc;
  transition:border-color .15s ease, box-shadow .15s ease, background .15s ease;
}

.woocommerce form.woocommerce-ResetPassword input[type="text"]:focus,
.woocommerce form.woocommerce-ResetPassword input[type="email"]:focus,
.woocommerce form.lost_reset_password input[type="text"]:focus,
.woocommerce form.lost_reset_password input[type="email"]:focus,
form.woocommerce-ResetPassword input[type="text"]:focus,
form.woocommerce-ResetPassword input[type="email"]:focus,
form.lost_reset_password input[type="text"]:focus,
form.lost_reset_password input[type="email"]:focus,
#lostpasswordform input[type="text"]:focus,
#lostpasswordform input[type="email"]:focus,
#lostpasswordform input#user_login:focus,
.lost_reset_password input[type="text"]:focus,
.lost_reset_password input[type="email"]:focus{
  background:#fff;
  border-color: rgba(200,165,106,.65);
  box-shadow: 0 0 0 4px rgba(200,165,106,.18);
}

/* Submit button */
.woocommerce form.woocommerce-ResetPassword button,
.woocommerce form.woocommerce-ResetPassword input[type="submit"],
.woocommerce form.lost_reset_password button,
.woocommerce form.lost_reset_password input[type="submit"],
form.woocommerce-ResetPassword button,
form.woocommerce-ResetPassword input[type="submit"],
form.lost_reset_password button,
form.lost_reset_password input[type="submit"],
#lostpasswordform input[type="submit"],
#lostpasswordform input#wp-submit,
.lost_reset_password button,
.lost_reset_password input[type="submit"]{
  width:100%;
  margin-top:14px;
  border:0;
  border-radius:18px;
  padding:12px 16px;
  font-weight:900;
  cursor:pointer;
  background: linear-gradient(135deg, var(--sobol-primary), var(--sobol-primary-2));
  color:#fff;
  box-shadow: 0 14px 36px rgba(0,0,0,.12);
  transition: transform .15s ease, box-shadow .15s ease, opacity .15s ease;
}

.woocommerce form.woocommerce-ResetPassword button:hover,
.woocommerce form.woocommerce-ResetPassword input[type="submit"]:hover,
.woocommerce form.lost_reset_password button:hover,
.woocommerce form.lost_reset_password input[type="submit"]:hover,
form.woocommerce-ResetPassword button:hover,
form.woocommerce-ResetPassword input[type="submit"]:hover,
form.lost_reset_password button:hover,
form.lost_reset_password input[type="submit"]:hover,
#lostpasswordform input[type="submit"]:hover,
#lostpasswordform input#wp-submit:hover,
.lost_reset_password button:hover,
.lost_reset_password input[type="submit"]:hover{
  opacity:.95;
  box-shadow: 0 18px 44px rgba(0,0,0,.14);
}

.woocommerce form.woocommerce-ResetPassword button:active,
.woocommerce form.woocommerce-ResetPassword input[type="submit"]:active,
.woocommerce form.lost_reset_password button:active,
.woocommerce form.lost_reset_password input[type="submit"]:active,
form.woocommerce-ResetPassword button:active,
form.woocommerce-ResetPassword input[type="submit"]:active,
form.lost_reset_password button:active,
form.lost_reset_password input[type="submit"]:active,
#lostpasswordform input[type="submit"]:active,
#lostpasswordform input#wp-submit:active,
.lost_reset_password button:active,
.lost_reset_password input[type="submit"]:active{
  transform: translateY(1px);
}