/*
 * MOS login visual polish
 *
 * This file is intentionally limited to the existing .mos-login-* component
 * classes. Load it after each login page's current inline <style> block.
 * It contains no layout, visibility, or behavior changes.
 */

.mos-login-panel,
.mos-login-info-panel {
	border-color: #d9e2ec;
	border-radius: 16px;
	box-shadow: 0 12px 28px rgba(16, 63, 104, 0.08);
}

.mos-login-field input {
	border-radius: 8px;
	transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.mos-login-field input:focus {
	border-color: #17568c;
	box-shadow: 0 0 0 3px rgba(23, 86, 140, 0.16);
	outline: 2px solid transparent;
}

.mos-login-button,
.mos-login-secondary-button {
	border-radius: 12px;
	transition: background-color 0.15s ease, border-color 0.15s ease,
		box-shadow 0.15s ease;
}

.mos-login-button {
	box-shadow: 0 10px 20px rgba(23, 86, 140, 0.22);
}

.mos-login-button:hover,
.mos-login-button:focus {
	box-shadow: 0 12px 24px rgba(23, 86, 140, 0.28);
}

.mos-login-secondary-button:hover,
.mos-login-secondary-button:focus {
	background-color: #eef5fb;
	border-color: #103f68;
}

.mos-login-button:focus,
.mos-login-secondary-button:focus {
	outline: 3px solid rgba(23, 86, 140, 0.28);
	outline-offset: 2px;
}

.mos-login-alert,
.mos-login-credential {
	border-radius: 8px;
}

@media (prefers-reduced-motion: reduce) {
	.mos-login-field input,
	.mos-login-button,
	.mos-login-secondary-button {
		transition: none;
	}
}