/* M-Val portal login — clean left-aligned card on a gradient of the two logo colours (red to navy).
   Scoped to body:has(.page-card); the Frappe template & JS are untouched (2FA / reset / email-link keep working). */

body:has(.page-card) {
	min-height: 100vh;
	background:
		radial-gradient(1000px 520px at 14% 6%, rgba(255, 255, 255, .10), transparent 55%),
		radial-gradient(1250px 780px at 50% 112%, rgba(11, 47, 80, .80), transparent 60%),
		radial-gradient(900px 620px at 6% 98%, rgba(16, 66, 111, .55), transparent 62%),
		linear-gradient(165deg, #a21d25 0%, #7a1c33 36%, #2b3360 62%, #10426f 100%);
}

/* Center the card */
body:has(.page-card) .page-content-wrapper { min-height: 100vh; display: flex; align-items: center; justify-content: center; padding: 28px 16px; }
body:has(.page-card) main, body:has(.page-card) .page_content { width: 100%; max-width: none; }
body:has(.page-card) .for-login, body:has(.page-card) .for-login-with-email-link, body:has(.page-card) .for-forgot, body:has(.page-card) .for-signup { width: 100%; }

/* Card — clean, left-aligned */
body:has(.page-card) .page-card {
	width: 100%;
	max-width: 440px;
	margin: 0 auto;
	background: #ffffff;
	border: none;
	border-radius: 18px;
	padding: 20px 30px 18px;
	box-shadow: 0 10px 30px rgba(0, 0, 0, .18), 0 30px 70px rgba(0, 0, 0, .30);
	text-align: center;
}

/* Head: centered logo + bold heading */
body:has(.page-card) .page-card-head { border: none; padding: 0; text-align: center; margin-bottom: 10px; }
body:has(.page-card) .app-logo, body:has(.page-card) .page-card-head img { height: 32px; width: auto; margin: 0 auto 5px; display: block; }
body:has(.page-card) .page-card-head h4, body:has(.page-card) .page-card-head-text h4 {
	font-size: 22px; font-weight: 700; letter-spacing: -.01em; color: #152029; margin: 0 0 2px;
}
body:has(.page-card) .page-card-subtitle, body:has(.page-card) .text-muted.text-normal { color: #6b7682; font-size: 13px; margin: 0; }

/* Fields */
body:has(.page-card) .page-card-body { padding: 0; }
body:has(.page-card) .form-group { margin-bottom: 9px; text-align: left; }
body:has(.page-card) .form-label { font-size: 12.5px; font-weight: 600; color: #3f4a54; margin-bottom: 4px; }
body:has(.page-card) .email-field, body:has(.page-card) .password-field { position: relative; }
body:has(.page-card) .form-control {
	height: auto;
	padding: 10px 42px;
	border: 1px solid #e4e8ee;
	border-radius: 11px;
	font-size: 14px;
	background: #f2f5f8;
	color: #152029;
	box-shadow: none;
	transition: border-color .15s, box-shadow .15s, background .15s;
}
body:has(.page-card) .form-control::placeholder { color: #9aa4ae; }
body:has(.page-card) .form-control:focus { border-color: #a21d25; background: #fff; box-shadow: 0 0 0 3px rgba(162, 29, 37, .14); outline: none; }
body:has(.page-card) .field-icon { top: 50%; transform: translateY(-50%); left: 15px; color: #9aa4ae; }
body:has(.page-card) .toggle-password { right: 13px; left: auto; color: #9aa4ae; cursor: pointer; }

/* Forgot link */
body:has(.page-card) .forgot-password-message { text-align: center; font-size: 13px; margin: 2px 0 0; }
body:has(.page-card) .forgot-password-message a, body:has(.page-card) a[href="#forgot"] { color: #a21d25 !important; font-weight: 600; text-decoration: none; }
body:has(.page-card) .forgot-password-message a:hover { text-decoration: underline; }

/* Buttons */
body:has(.page-card) .page-card-actions { margin-top: 10px; }
body:has(.page-card) .btn-login, body:has(.page-card) .btn-primary.btn-login, body:has(.page-card) .btn-signup,
body:has(.page-card) .btn-primary, body:has(.page-card) .page-card button[type="submit"] {
	height: auto; width: 100%; padding: 13px 16px; border-radius: 12px;
	background: #10426f !important; border: none; color: #fff !important;
	font-size: 14.5px; font-weight: 600; box-shadow: none;
	transition: background .15s, transform .05s;
}
body:has(.page-card) .btn-login:hover, body:has(.page-card) .btn-primary.btn-login:hover, body:has(.page-card) .btn-signup:hover,
body:has(.page-card) .btn-primary:hover, body:has(.page-card) .page-card button[type="submit"]:hover { background: #0b2f50 !important; color: #fff !important; }
body:has(.page-card) .btn-login:active { transform: translateY(1px); }
body:has(.page-card) .login-button-wrapper { margin-top: 10px; }
body:has(.page-card) .btn-login-option {
	width: 100%; border-radius: 12px; border: 1px solid #e4e8ee; background: #fff; color: #152029;
	font-weight: 600; padding: 12px 16px; margin-top: 10px;
}
body:has(.page-card) .btn-login-option:hover { background: #f3f4f6; }

/* Misc */
body:has(.page-card) .sign-up-message { text-align: center; font-size: 13px; margin-top: 14px; }
body:has(.page-card) .sign-up-message a { color: #a21d25; font-weight: 600; text-decoration: none; }
body:has(.page-card) .login-error-banner { border-radius: 10px; }
body:has(.page-card) .web-footer, body:has(.page-card) footer { display: none; }

@media (max-width: 480px) {
	body:has(.page-card) .page-card { padding: 30px 24px 26px; border-radius: 16px; }
	body:has(.page-card) .page-card-head h4 { font-size: 23px; }
}