/* Modern admin login styles - updated design for wp-login.php and password reset pages */
:root{
	--e-bg:#f5f7fa;
	--e-card:#ffffff;
	--e-accent:#2b6cb0; /* primary blue */
	--e-text:#1f2937;
	--e-muted:#6b7280;
	--e-border:#e6e9ee;
}

html,body{height:100%;background:var(--e-bg);font-family:Inter,Segoe UI,Roboto,Helvetica,Arial,sans-serif}

/* Use local plugin asset for background so the login page works offline or when hosted under different base URL */
body.login{display:flex;align-items:center;justify-content:center;background: url('./images/background/section-bg.webp') center bottom / cover;}

.login .einetic-login-wrap{width:100%;max-width:420px;background:var(--e-card);border:1px solid var(--e-border);border-radius:10px;box-shadow:0 6px 24px rgba(34,50,80,0.06);padding:28px}

.login h1{display:flex;align-items:center;justify-content:center;margin:0 0 18px}
.login h1 a{display:inline-block;}

.einetic-login-logo{display:block;margin:0 auto 10px;width:140px;height:auto}

.login form{margin:0;border-radius:12px;box-shadow: -14px 14px 15px -9px rgba(0, 0, 0, .1);}
.login label{display:block;color:var(--e-text);font-weight:600;margin-bottom:6px}
.login .input, .login input[type="text"], .login input[type="password"], .login input[type="email"], .login input[type="tel"]{width:100%;box-sizing:border-box;padding:10px 12px;border:1px solid var(--e-border);border-radius:8px;background:#fff;color:var(--e-text);font-size:14px;margin-bottom:12px}

.login .button-primary{background:var(--e-accent);border-color:var(--e-accent);color:#fff;box-shadow:none;border-radius:8px;padding:10px 14px;font-weight:600}
.login .button-primary:hover{background:#225a9a}

.login .login-meta{display:flex;justify-content:space-between;align-items:center;margin-top:8px}
.login .lost-password, .login .remember{color:var(--e-muted);font-size:13px}

.login .message, .login .error{border-left:4px solid var(--e-accent);background:#fbfdff;padding:10px 12px;border-radius:6px;margin-bottom:12px;color:var(--e-text)}

.login .login-footer{display:flex;justify-content:center;margin-top:12px;color:var(--e-muted);font-size:13px}

/* Smaller screens */
@media (max-width:520px){
	.login .einetic-login-wrap{padding:18px}
}

/* Make sure WordPress injected logo not broken */
.login h1 a img{max-width:100%;height:auto}

/* Tweak for lostpassword form layout */
#loginform .login-username, #loginform .login-password{margin-bottom:10px}

/* Optional: style the wp-admin logo link on top-left for WP backend pages if needed */
.admin-bar .einetic-login-wrap{margin-top:28px}

/* Ensure "Remember Me" / forget-me checkbox area aligns nicely */
.forgetmenot{display:flex}

/* Adjust padding when intl-tel-input is used (separate/allow dropdown styles) */
.iti--allow-dropdown input, .iti--allow-dropdown input[type=tel], .iti--allow-dropdown input[type=text], .iti--separate-dial-code input, .iti--separate-dial-code input[type=tel], .iti--separate-dial-code input[type=text] {
	padding-right: 6px !important;
	padding-left: 90px !important;
}

/* Additional specificity for login form phone input with separate dial code */
.login form .iti--separate-dial-code input,
.login form .iti--separate-dial-code input[type=text],
.login form .iti--allow-dropdown.iti--separate-dial-code input {
	padding-left: 90px !important;
}

/* Ensure the intl-tel-input container takes full width so inputs align with other form controls */
.iti {
	width: 100%;
}