/*
 Custom WordPress login styling (wp-login.php and the password reset screen).
 Loaded only on wp-login.php via the login_enqueue_scripts hook.
 Palette matches the ESG Business Institute Elementor login page.
*/

:root {
	--zap-brand: #002448;        /* ESG navy */
	--zap-brand-hover: #003a6e;  /* lighter navy for hover feedback */
	--zap-secondary: #4a4a4a;    /* grey, as the SIGNUP button */
	--zap-secondary-hover: #333333;
	--zap-bg: #eef1f4;
	--zap-text: #1f2933;
	--zap-muted: #5b6b7a;
	--zap-card: #ffffff;
	--zap-field: #ececec;
	--zap-border: #d8dde3;
	--zap-radius: 16px;
	--zap-font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

body.login {
	background: radial-gradient(circle at top, #ffffff 0%, var(--zap-bg) 60%, #e3e8ed 100%);
	font-family: var(--zap-font);
}

/* Centre column */
#login {
	width: 360px;
	padding: 4% 0 0;
}

/* Logo: replace login-logo.png in the assets folder with your own */
.login h1 a {
	background-image: url('login-logo.png');
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
	width: 240px;
	height: 80px;
	margin-bottom: 18px;
}

/* The form card */
#loginform,
#registerform,
#lostpasswordform {
	background: var(--zap-card);
	border: 1px solid var(--zap-border);
	border-radius: var(--zap-radius);
	box-shadow: 0 20px 44px rgba(0, 36, 72, 0.14);
	padding: 30px 28px;
}

.login form .input,
.login input[type="text"],
.login input[type="password"],
.login input[type="email"] {
	border: 1px solid transparent;
	border-radius: 12px;
	padding: 14px 16px;
	font-size: 15px;
	color: var(--zap-text);
	background: var(--zap-field);
	box-shadow: none;
	transition: border-color .15s ease, box-shadow .15s ease, background .15s ease;
}

.login form .input:focus,
.login input[type="text"]:focus,
.login input[type="password"]:focus,
.login input[type="email"]:focus {
	border-color: var(--zap-brand);
	background: #ffffff;
	box-shadow: 0 0 0 3px rgba(0, 36, 72, 0.15);
	outline: none;
}

.login label {
	color: var(--zap-muted);
	font-size: 14px;
}

/* Submit button */
.login .button-primary,
.login #wp-submit {
	background: var(--zap-brand);
	border: none;
	border-radius: 12px;
	padding: 12px 18px;
	font-size: 15px;
	font-weight: 600;
	letter-spacing: .3px;
	width: 100%;
	text-shadow: none;
	box-shadow: 0 8px 18px rgba(0, 36, 72, 0.28);
	transition: background .15s ease, transform .05s ease;
}

.login .button-primary:hover,
.login #wp-submit:hover {
	background: var(--zap-brand-hover);
}

.login .button-primary:active,
.login #wp-submit:active {
	transform: translateY(1px);
}

/* Links below the form */
.login #nav,
.login #backtoblog {
	text-align: center;
	padding: 0;
	margin-top: 14px;
}

.login #nav a,
.login #backtoblog a {
	color: var(--zap-muted);
	font-size: 13px;
}

.login #nav a:hover,
.login #backtoblog a:hover {
	color: var(--zap-brand);
}

/* Messages */
.login #login_error,
.login .message,
.login .success {
	border-radius: 12px;
	border-left-width: 4px;
	font-size: 14px;
}

.login #login_error {
	border-left-color: var(--zap-secondary);
}

.login .message,
.login .success {
	border-left-color: var(--zap-brand);
}

.login .forgetmenot label {
	font-size: 13px;
}
