/*
 * Medlink v3 — header Login popup (Elementor Pro popup "Login (Client / Staff)", built by
 * _build-revamp/build-login-popup.php). Strong selectors so the page stylesheet's global resets
 * (body.ml x4 *{margin:0;padding:0} etc.) don't flatten it.
 */
body.ml.ml.ml.ml.ml .ml-login {
	--display: flex; display: flex; flex-direction: column; align-items: center; gap: 0;
	padding: 34px 28px 28px; background: #fff; font-family: var(--sans, "Plus Jakarta Sans", sans-serif);
}
body.ml.ml.ml.ml.ml .ml-login .ml-login-logo img { width: 132px; height: auto; display: block; margin: 0 auto; }
body.ml.ml.ml.ml.ml .ml-login .ml-login-title .elementor-heading-title {
	margin: 18px 0 24px; text-align: center; font-family: var(--sans, "Plus Jakarta Sans", sans-serif);
	font-weight: 800; font-size: clamp(20px, 2.4vw, 26px); line-height: 1.2; letter-spacing: -.01em; color: var(--navy, #0E3A31);
}
body.ml.ml.ml.ml.ml .ml-login .ml-login-cards {
	--display: grid; display: grid; grid-template-columns: 1fr 1fr; gap: 16px; width: 100%; padding: 0;
}
body.ml.ml.ml.ml.ml .ml-login .ml-login-card {
	--display: flex; display: flex; align-items: center; justify-content: center; position: relative; overflow: hidden;
	min-height: 360px; padding: 20px; border-radius: 18px; background-size: cover; background-position: center;
	transition: transform .25s ease, box-shadow .25s ease;
}
body.ml.ml.ml.ml.ml .ml-login .ml-login-card::before {
	content: ""; position: absolute; inset: 0; z-index: 0; border-radius: inherit;
	background: linear-gradient(180deg, rgba(14,58,49,.12) 0%, rgba(14,58,49,.58) 100%);
}
body.ml.ml.ml.ml.ml .ml-login .ml-login-card:hover { transform: translateY(-3px); box-shadow: 0 18px 34px rgba(14,58,49,.25); }
body.ml.ml.ml.ml.ml .ml-login .ml-login-card > * { position: relative; z-index: 1; }
body.ml.ml.ml.ml.ml .ml-login .ml-login-btn .elementor-button {
	display: inline-flex; align-items: center; justify-content: center; min-width: 150px;
	padding: 15px 34px; border-radius: 999px; border: 2px solid rgba(255,255,255,.9);
	background: var(--teal, #48A890); color: #fff; box-shadow: 0 12px 26px rgba(14,58,49,.35);
	font-family: var(--sans, "Plus Jakarta Sans", sans-serif); font-weight: 800; font-size: 16px; line-height: 1.2;
	letter-spacing: .08em; text-transform: uppercase; transition: background .2s, transform .2s;
}
body.ml.ml.ml.ml.ml .ml-login .ml-login-btn .elementor-button:hover { background: var(--teal-700, #297563); color: #fff; transform: translateY(-2px); }
body.ml.ml.ml.ml.ml .elementor-popup-modal .dialog-close-button { top: 14px; right: 14px; font-size: 22px; }
body.ml.ml.ml.ml.ml .elementor-popup-modal .dialog-close-button svg { fill: var(--navy, #0E3A31); }

@media (max-width: 640px) {
	body.ml.ml.ml.ml.ml .ml-login { padding: 30px 18px 18px; }
	body.ml.ml.ml.ml.ml .ml-login .ml-login-cards { grid-template-columns: 1fr; gap: 12px; }
	body.ml.ml.ml.ml.ml .ml-login .ml-login-card { min-height: 190px; }
}
body.ml.ml.ml.ml.ml .elementor-popup-modal .dialog-widget-content:has(.ml-login) { border-radius: 24px; overflow: hidden; }
