/* BMC custom login page — matches reference design */

html, body {
	margin: 0;
	padding: 0;
	background-color: #efefef;
}

body {
	background-color: #efefef;
}

.bmc-login-page {
	min-height: 100vh;
	background-color: #efefef !important;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0 16px;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
	box-sizing: border-box;
}

.bmc-login-wrap {
	width: 100%;
	max-width: 400px;
	display: flex;
	flex-direction: column;
	align-items: center;
}

.bmc-login-logo {
	display: flex;
	flex-direction: column;
	align-items: center;
	margin-bottom: 18px;
}

.bmc-login-logo img {
	width: 40px;
	height: 40px;
	object-fit: contain;
	margin-bottom: 8px;
}

.bmc-login-logo h4 {
	margin: 0;
	font-size: 15px;
	font-weight: 600;
	color: #1f2937;
	letter-spacing: 0;
}

.bmc-login-card {
	background: #ffffff;
	border-radius: 8px;
	padding: 22px 22px 20px;
	width: 100%;
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
	box-sizing: border-box;
	border: 1px solid rgba(15, 23, 42, 0.04);
}

.bmc-card-body {
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.bmc-form-group {
	margin: 0;
}

.bmc-field {
	position: relative;
	display: flex;
	align-items: center;
}

.bmc-form-control {
	width: 100%;
	height: 36px;
	padding: 0 50px 0 34px;
	border: none;
	border-radius: 6px;
	background-color: #f1f2f4;
	font-size: 13px;
	color: #1f2937;
	outline: none;
	transition: box-shadow 0.15s ease;
	box-sizing: border-box;
}

.bmc-form-control::placeholder {
	color: #9ca3af;
}

.bmc-form-control:focus {
	box-shadow: 0 0 0 2px rgba(15, 23, 42, 0.08);
	background-color: #ebeef0;
}

.bmc-field-icon {
	position: absolute;
	left: 11px;
	top: 50%;
	transform: translateY(-50%);
	color: #9ca3af;
	pointer-events: none;
	width: 14px;
	height: 14px;
}

.bmc-toggle-password {
	position: absolute;
	right: 12px;
	top: 50%;
	transform: translateY(-50%);
	font-size: 12px;
	color: #6b7280;
	cursor: pointer;
	user-select: none;
	background: transparent;
	border: none;
	padding: 2px 4px;
}

.bmc-toggle-password:hover {
	color: #1f2937;
}

.bmc-forgot {
	text-align: right;
	margin: -2px 2px 0 0;
	font-size: 12px;
}

.bmc-forgot a {
	color: #4b5563;
	text-decoration: none;
}

.bmc-forgot a:hover {
	color: #1f2937;
	text-decoration: underline;
}

.bmc-card-actions {
	display: flex;
	flex-direction: column;
	gap: 6px;
	margin-top: 14px;
}

.bmc-btn {
	display: block;
	width: 100%;
	height: 36px;
	border: none;
	border-radius: 6px;
	font-size: 13px;
	font-weight: 500;
	cursor: pointer;
	transition: background-color 0.15s ease, transform 0.05s ease;
	box-sizing: border-box;
}

.bmc-btn:active {
	transform: translateY(1px);
}

.bmc-btn-primary {
	background-color: #1a1a1a;
	color: #ffffff;
}

.bmc-btn-primary:hover {
	background-color: #000000;
}

.bmc-btn-secondary {
	background-color: #f1f2f4;
	color: #1f2937;
}

.bmc-btn-secondary:hover {
	background-color: #e5e7eb;
}

.bmc-divider {
	text-align: center;
	color: #6b7280;
	font-size: 12px;
	margin: 2px 0;
}

.bmc-back {
	margin-top: 8px;
	font-size: 12px;
}

.bmc-back a {
	color: #4b5563;
	text-decoration: none;
}

.bmc-back a:hover {
	color: #1f2937;
	text-decoration: underline;
}

/* Hide the default Frappe page-card / page-head behavior on this page */
.page-card,
.page-card-head {
	background: transparent !important;
	box-shadow: none !important;
	padding: 0 !important;
	margin: 0 !important;
}

/* Keep the card's own minimal shadow even when it also has .page-card */
.bmc-login-card.page-card {
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04) !important;
}

/* Kill any inherited vertical strips / side panels on the login page.
   Strip all default Frappe page chrome so the login is the only thing visible. */
#page-login,
#page-login .page-content-wrapper,
#page-login .page-breadcrumbs,
#page-login main.container,
#page-login .page-header-wrapper,
#page-login .page-header,
#page-login .page_content,
.page-content,
.page-content-wrapper,
.main-section,
.container,
.container-fluid,
.row,
.col,
.layout-side-section,
.layout-main-section,
.body-sidebar-container,
.page-body {
	background-color: #efefef !important;
	background-image: none !important;
	padding: 0 !important;
	margin: 0 !important;
	max-width: 100% !important;
	width: 100% !important;
}

/* Center the bmc-login-page inside the Frappe wrappers */
main.container > .page_content,
.page_content {
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	min-height: 100vh !important;
}

/* Strip Frappe web template sidebars / panels */
.web-footer,
.footer,
.page-footer,
.navbar,
.page-breadcrumbs,
.page-header,
.page-header-wrapper {
	display: none !important;
}

/* ── Error / status banner shown above each card ────────────────────── */

.bmc-login-error {
	display: none;
	margin: 0 0 14px 0;
	padding: 10px 12px;
	border-radius: 6px;
	font-size: 12px;
	line-height: 1.4;
	font-weight: 500;
	text-align: left;
	border: 1px solid transparent;
	box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
	position: relative;
	z-index: 5;
}

.bmc-login-error[style*="block"],
.bmc-login-error.show {
	display: block !important;
}

.bmc-error-red {
	background-color: #fdecea !important;
	color: #b3261e !important;
	border-color: #f5c2c0 !important;
}

.bmc-error-blue {
	background-color: #e8f0fe !important;
	color: #1967d2 !important;
	border-color: #c6dafc !important;
}

.bmc-error-green {
	background-color: #e6f4ea !important;
	color: #1e7e34 !important;
	border-color: #bfe5c9 !important;
}

/* Standard Frappe invalid flash on the card itself */
.bmc-login-card.invalid-login {
	animation: bmc-shake 0.4s ease-in-out;
	box-shadow:
		0 0 0 2px #f5c2c0,
		0 1px 2px rgba(0, 0, 0, 0.04) !important;
}

@keyframes bmc-shake {
	0%, 100% { transform: translateX(0); }
	20% { transform: translateX(-6px); }
	40% { transform: translateX(6px); }
	60% { transform: translateX(-4px); }
	80% { transform: translateX(4px); }
}

.bmc-card-body.invalid .bmc-form-control {
	box-shadow: 0 0 0 2px #f5c2c0;
	background-color: #fdecea;
}