body.pc-login {
	--pc-login-midnight: var(--pc-brand-primary, #122b40);
	--pc-login-midnight-hover: var(--pc-brand-primary-hover, #0b1e2e);
	--pc-login-blue: var(--pc-brand-accent, #078bb5);
	--pc-login-chip: var(--pc-brand-hover, #f3eadf);
	--pc-login-canvas: var(--pc-brand-canvas, #faf4ea);
	--pc-login-card: var(--pc-brand-surface, #fffcf7);
	--pc-login-border: var(--pc-brand-border, #eadbc6);
	--pc-login-input-border: var(--pc-brand-border, #e3d2bd);
	--pc-login-text: #3b2a1e;
	--pc-login-muted: #7d6656;
	margin: 0;
	min-width: 0;
	background: var(--pc-login-canvas);
	color: var(--pc-login-text);
	font-family: Inter, sans-serif;
	font-weight: 400;
}

/* Frappe's web template wraps page content in a padded container; let the login shell run edge to edge. */
body.pc-login .page-content-wrapper,
body.pc-login main.container,
body.pc-login .page_content {
	max-width: none;
	width: 100%;
	margin: 0;
	padding: 0;
}

body.pc-login .pc-login-shell {
	display: grid;
	grid-template-columns: minmax(0, 55fr) minmax(420px, 45fr);
	min-height: 100vh;
	min-height: 100svh;
	background: var(--pc-login-canvas);
}

body.pc-login .pc-login-photo {
	position: relative;
	display: flex;
	align-items: flex-end;
	min-width: 0;
	padding: clamp(32px, 5vw, 72px);
	background-color: #6b3f29;
	background-image:
		linear-gradient(180deg, rgba(60, 25, 10, 0.15) 0%, rgba(55, 22, 8, 0.88) 100%),
		url("/assets/product_core/images/login-team-1400.webp");
	background-image:
		linear-gradient(180deg, rgba(60, 25, 10, 0.15) 0%, rgba(55, 22, 8, 0.88) 100%),
		image-set(url("/assets/product_core/images/login-team-1400.webp") 1x);
	background-position: left center;
	background-size: cover;
	color: #fff4e6;
}

body.pc-login .pc-login-photo-copy {
	max-width: 520px;
}

body.pc-login .pc-login-photo-title {
	margin: 0 0 10px;
	color: #fff4e6;
	font-size: clamp(26px, 2.4vw, 32px);
	font-weight: 600;
	letter-spacing: -0.025em;
	line-height: 1.18;
}

body.pc-login .pc-login-tagline {
	margin: 0;
	color: #f6d9c2;
	font-size: 15px;
	font-weight: 400;
	line-height: 1.55;
}

body.pc-login .pc-login-form-side {
	display: flex;
	flex-direction: column;
	align-items: stretch;
	justify-content: center;
	min-width: 0;
	padding: 48px clamp(32px, 5vw, 72px);
	background: var(--pc-login-canvas);
}

body.pc-login .pc-login-brand {
	display: block;
	width: min(180px, 100%);
	min-width: 140px;
	margin: 0 auto 28px;
}

body.pc-login .pc-login-brand img {
	display: block;
	width: 100%;
	height: auto;
}

body.pc-login .pc-login-form-side > section {
	width: 100%;
	max-width: 400px;
	margin-right: auto;
	margin-left: auto;
}

body.pc-login .login-content.page-card {
	width: 100%;
	max-width: 400px;
	margin: 0;
	padding: 36px;
	border: 1px solid var(--pc-login-border);
	border-radius: 16px;
	background: var(--pc-login-card);
	box-shadow: 0 18px 50px rgba(59, 42, 30, 0.08);
	color: var(--pc-login-text);
}

body.pc-login .page-card-head {
	text-align: left;
}

body.pc-login .page-card-head .pc-login-native-logo {
	display: none;
}

body.pc-login .pc-login-workspace {
	display: inline-flex;
	align-items: center;
	max-width: 100%;
	margin: 0 0 18px;
	padding: 6px 11px;
	overflow-wrap: anywhere;
	border-radius: 999px;
	background: var(--pc-login-chip);
	color: var(--pc-login-midnight);
	font-size: 12px;
	font-weight: 500;
	line-height: 1.3;
}

body.pc-login .page-card-head h4 {
	margin: 0 0 8px;
	color: var(--pc-login-midnight);
	font-size: 24px;
	font-weight: 600;
	letter-spacing: -0.02em;
	line-height: 1.25;
	text-align: left;
}

body.pc-login section.for-login .pc-login-login-subtitle {
	display: none;
}

body.pc-login .page-card-subtitle,
body.pc-login .form-signin,
body.pc-login .page-card-actions {
	color: var(--pc-login-muted);
}

body.pc-login .form-control,
body.pc-login input[type="email"],
body.pc-login input[type="password"],
body.pc-login input[type="text"] {
	min-height: 44px;
	border: 1px solid var(--pc-login-input-border);
	border-radius: 10px;
	background: #fff;
	color: var(--pc-login-text);
	font-weight: 400;
	box-shadow: none;
}

body.pc-login .form-control:focus,
body.pc-login input[type="email"]:focus,
body.pc-login input[type="password"]:focus,
body.pc-login input[type="text"]:focus {
	border-color: var(--pc-login-blue);
	outline: 3px solid rgba(7, 139, 181, 0.25);
	outline-offset: 1px;
	box-shadow: none;
}

/* !important: a site's Website Theme may force .es-button colours with !important; the login uses Saiph's palette unless a partner brand sets its own login logo and colours. */
body.pc-login button.es-button[type="submit"] {
	min-height: 44px;
	border: 1px solid var(--pc-login-midnight) !important;
	border-radius: 10px;
	background: var(--pc-login-midnight) !important;
	color: #fff !important;
	font-weight: 600;
	box-shadow: none;
}

body.pc-login button.es-button[type="submit"]:hover {
	border-color: var(--pc-login-midnight-hover) !important;
	background: var(--pc-login-midnight-hover) !important;
}

body.pc-login a {
	color: var(--pc-login-midnight);
}

body.pc-login .btn-login-with-email-link {
	color: var(--pc-login-midnight) !important;
	font-weight: 500;
	text-decoration: underline;
	text-underline-offset: 3px;
}

body.pc-login .btn-login-with-email-link {
	display: block;
	width: fit-content;
	margin-right: auto;
	margin-left: auto;
	padding: 6px;
	border: 0 !important;
	background: transparent !important; /* see the !important note above */
	text-align: center;
}

body.pc-login a:focus-visible,
body.pc-login button:focus-visible,
body.pc-login .toggle-password:focus-visible {
	outline: 3px solid var(--pc-login-blue);
	outline-offset: 3px;
}

body.pc-login .pc-login-caps-hint {
	margin: 7px 0 0;
	color: var(--pc-login-muted);
	font-size: 12px;
	font-weight: 400;
	line-height: 1.4;
}

body.pc-login .pc-login-caps-hint[hidden] {
	display: none;
}

body.pc-login .pc-login-footer {
	width: 100%;
	max-width: 400px;
	margin: 22px auto 0;
	color: var(--pc-login-muted);
	font-size: 12px;
	font-weight: 400;
	text-align: center;
}

@media (max-width: 959px) {
	body.pc-login .pc-login-shell {
		display: block;
		min-height: 100vh;
		min-height: 100svh;
	}

	body.pc-login .pc-login-photo {
		height: 180px;
		min-height: 180px;
		padding: 22px 24px;
		background-image:
			linear-gradient(180deg, rgba(60, 25, 10, 0.15) 0%, rgba(55, 22, 8, 0.88) 100%),
			url("/assets/product_core/images/login-team-800.webp");
		background-image:
			linear-gradient(180deg, rgba(60, 25, 10, 0.15) 0%, rgba(55, 22, 8, 0.88) 100%),
			image-set(url("/assets/product_core/images/login-team-800.webp") 1x);
	}

	body.pc-login .pc-login-photo-title {
		margin: 0;
		font-size: 24px;
	}

	body.pc-login .pc-login-tagline {
		display: none;
	}

	body.pc-login .pc-login-form-side {
		justify-content: flex-start;
		padding: 28px 16px 32px;
	}

	body.pc-login .pc-login-brand {
		width: 154px;
		margin-bottom: 22px;
	}

	body.pc-login .login-content.page-card {
		padding: 28px 24px;
	}
}

@media (prefers-color-scheme: dark) {
	body.pc-login {
		--pc-login-canvas: #1e1915;
		--pc-login-card: #27201b;
		--pc-login-border: #3a2f27;
		--pc-login-input-border: #55463b;
		--pc-login-text: #f3e8dd;
		--pc-login-muted: #bfae9f;
		background: var(--pc-login-canvas);
	}

	body.pc-login .pc-login-workspace {
		background: #3a2f27;
		color: #f3e8dd;
	}

	body.pc-login .page-card-head h4,
	body.pc-login a,
	body.pc-login .btn-login-with-email-link {
		color: #f3e8dd !important;
	}

	body.pc-login .form-control,
	body.pc-login input[type="email"],
	body.pc-login input[type="password"],
	body.pc-login input[type="text"] {
		background: #2f2620;
		color: #f3e8dd;
	}

	body.pc-login button.es-button[type="submit"] {
		border-color: #0a6f91 !important;
		background: #0a6f91 !important;
		color: #fff !important;
	}

	body.pc-login button.es-button[type="submit"]:hover {
		border-color: #085a76 !important;
		background: #085a76 !important;
	}
}

@media (prefers-reduced-motion: reduce) {
	body.pc-login *,
	body.pc-login *::before,
	body.pc-login *::after {
		scroll-behavior: auto;
		transition-duration: 0.01ms;
		animation-duration: 0.01ms;
		animation-iteration-count: 1;
	}
}