/* ContractFlow login screen. */
body.login {
	display: flex; flex-direction: column; justify-content: center; align-items: center;
	min-height: 100vh; margin: 0; padding: 32px 16px; box-sizing: border-box;
	font-family: 'Tajawal', 'Segoe UI', Tahoma, sans-serif;
	background:
		radial-gradient(60% 50% at 100% 0, rgba(195, 154, 69, .16), transparent 70%),
		radial-gradient(70% 60% at 0 100%, rgba(27, 106, 122, .55), transparent 70%),
		linear-gradient(160deg, #0c3f4c, #0f4c5c 50%, #082a33);
}
/* A faint signature line under everything, echoing the mark. */
body.login::before {
	content: ""; position: fixed; inset: auto 0 0; height: 220px; pointer-events: none; opacity: .07;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 60' preserveAspectRatio='none'%3E%3Cpath d='M0 40c50-30 95-34 137-8 37 23 72 23 109 0 42-26 95-26 154 8' fill='none' stroke='%23fff' stroke-width='2'/%3E%3C/svg%3E") center bottom 40px / 100% 160px no-repeat;
}
#login { width: 100%; max-width: 380px; padding: 0; margin: 0; }

/* Mark: the plugin's own tile by default; AdminTheme::login() swaps in a chosen logo on white. */
.login h1 a {
	width: 84px; height: 84px; margin: 0 auto 14px; border-radius: 24px;
	background: url(../images/mark-light.svg) center / 66px no-repeat, linear-gradient(150deg, #1b6a7a, #0b3440);
	box-shadow: 0 14px 34px -14px rgba(0, 0, 0, .7), inset 0 0 0 1px rgba(255, 255, 255, .12), 0 0 0 4px rgba(195, 154, 69, .35);
}
.cfp-login-brand { margin: 0 0 22px; text-align: center; line-height: 1.4; }
.cfp-login-brand strong { display: block; color: #fff; font-size: 26px; font-weight: 800; letter-spacing: .5px; }
.cfp-login-brand span { color: #d9c08a; font-size: 13px; }

.login form {
	position: relative; overflow: hidden; margin: 0; padding: 28px 26px 24px;
	border: 0; border-radius: 18px; background: #fff;
	box-shadow: 0 28px 60px -26px rgba(0, 0, 0, .7);
}
.login form::before {
	content: ""; position: absolute; inset: 0 0 auto; height: 4px;
	background: linear-gradient(90deg, #c39a45, #0f4c5c);
}
.login label { font-weight: 700; color: #15232c; }
.login form .input, .login input[type=text], .login input[type=password] {
	min-height: 46px; margin: 6px 0 18px; padding: 0 12px; border: 1px solid #e4ddcf; border-radius: 11px;
	background: #fbfaf7; font-size: 16px; box-shadow: none;
}
.login form .input:focus { border-color: #146b7d; background: #fff; box-shadow: 0 0 0 3px rgba(20, 107, 125, .18); }
.login .wp-pwd { margin-bottom: 4px; }
.login .button.wp-hide-pw { height: 46px; min-height: 46px; margin-top: 6px; color: #0f4c5c; }
.login .button.wp-hide-pw:focus { box-shadow: none; }

/* Remember-me on its own line, then a full-width submit. */
.login form .forgetmenot { float: none; display: flex; align-items: center; gap: 6px; margin: 0 0 18px; }
.login form .forgetmenot label { font-weight: 500; color: #4b5563; }
.login form .submit { display: block; }
.login form .submit .button-primary {
	float: none; width: 100%; height: 48px; min-height: 48px; border: 0; border-radius: 12px;
	background: linear-gradient(150deg, #146b7d, #0b3440); font-size: 16px; font-weight: 700;
	box-shadow: 0 10px 22px -12px rgba(11, 52, 64, .9);
}
.login form .submit .button-primary:hover { background: linear-gradient(150deg, #1b7c90, #0f4c5c); }

.login #nav { margin: 20px 0 0; padding: 0; text-align: center; }
.login #nav a, .login .privacy-policy-link { color: #dbe9ec; text-decoration: none; }
.login #nav a:hover { color: #f3dca6; text-decoration: underline; }
/* The site's front end redirects back here, so "back to site" leads nowhere. */
.login #backtoblog { display: none; }
.cfp-login-foot { position: relative; margin: 28px 0 0; color: rgba(219, 233, 236, .55); font-size: 12px; text-align: center; }

.login .message, .login .notice, .login #login_error {
	margin: 0 0 16px; border: 0; border-inline-start: 4px solid #c39a45; border-radius: 12px;
	box-shadow: 0 10px 24px -16px rgba(0, 0, 0, .6);
}
.login #login_error { border-inline-start-color: #b42d3a; }
.cfp-otp-hint { margin: -6px 0 16px; color: #6b7280; font-size: 12.5px; line-height: 1.6; }
/* Backup codes are typed with Latin digits: a monospace face, not Tajawal (which draws 0-9 as ٠-٩). */
.cfp-otp-hint code { padding: 1px 6px; border-radius: 5px; background: #f3efe6; font-family: Consolas, "Courier New", monospace; font-size: 12px; }

/* The «session expired» pop-up (interim login): core sets the logo link to width:auto, which stretches our tile. */
.interim-login.login h1 a { width: 72px; height: 72px; margin-bottom: 10px; background-size: 56px, auto; }
.interim-login .cfp-login-brand { margin-bottom: 14px; }
.interim-login .cfp-login-brand strong { font-size: 20px; }
.interim-login .cfp-login-foot { display: none; }
