:root {
	--page-max-width: 100% !important;
	--better-login-box-position: static;
	--better-login-box-left: auto;
	--better-login-box-right: auto;
	--better-login-box-top: 18%;
	--better-login-box-bg: #fff;
	--better-login-box-width: 400px;
	--better-login-box-padding: 40px;
	--better-login-title-display: block;
	--better-login-title-after-display: none;
	--better-carousel-fade-opacity: 1;
	--better-search-display: flex;
	--better-help-display: flex;
	--better-app-switcher-display: block;
	--better-like-comment-display: block;
	--better-footer-display: flex;
	--brand-logo-fill: #231f20;
	--brand-logo-secondary-fill: #e85f17;
}

:root[data-theme="dark"] {
	--brand-logo-fill: #f8f5f1;
	--brand-logo-secondary-fill: #ff8a3d;
}

#page-login {
	background: var(--better-login-bg-color, transparent);
	background-image: var(--better-login-bg-carousel-image, var(--better-login-bg-image, none)) !important;
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
	height: 100vh;
	margin: 0;
	overflow: hidden;
	position: relative;
}

#page-login .page-content-wrapper,
#page-login .page_content {
	position: relative;
	z-index: 1;
}

#page-login .for-login,
#page-login .for-signup,
#page-login .for-forgot,
#page-login .for-login-with-email-link {
	z-index: 1;
}

#page-login .page-card-head > img.app-logo,
#page-login .page-card-head > svg.app-logo,
#page-login .page-card-head > svg.better-desk-inline-logo {
	height: auto !important;
	max-height: none !important;
	max-width: 220px !important;
	width: var(--better-login-logo-width, 150px) !important;
}

#page-login::before {
	background-image: var(--better-login-bg-carousel-image, var(--better-login-bg-image, none));
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
	content: "";
	inset: 0;
	opacity: var(--better-carousel-fade-opacity, 1);
	pointer-events: none;
	position: absolute;
	transition: opacity 0.7s;
	z-index: 0;
}

.for-login,
.for-signup,
.for-forgot,
.for-login-with-email-link {
	background-color: var(--better-login-box-bg-outer, transparent) !important;
	border-radius: var(--better-login-box-border-radius, 0) !important;
	left: var(--better-login-box-left, auto);
	position: var(--better-login-box-position, static);
	right: var(--better-login-box-right, auto);
	top: var(--better-login-box-top, 18%);
}

.for-login {
	animation: betterShowLoginFallback 0.2s ease-in-out 1s forwards;
	opacity: 0;
	transform: translateY(20px);
	transition: opacity 0.2s ease-in-out, transform 0.2s ease-in-out;
}

.for-login.theme-ready {
	animation: none;
	opacity: 1;
	transform: translateY(0);
}

@keyframes betterShowLoginFallback {
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

.login-content.page-card,
.signup-content.page-card {
	background-color: var(--better-login-box-bg, #fff) !important;
	border: 2px solid var(--better-login-box-bg, #fff) !important;
	padding: var(--better-login-box-padding, 40px);
	width: var(--better-login-box-width, 400px);
}

.sign-up-message {
	background: transparent !important;
	border: 0 !important;
	box-shadow: none !important;
	color: inherit;
	margin-top: 20px;
	padding: 0 !important;
}

.for-login .page-card-head h4 {
	display: var(--better-login-title-display, block);
}

.for-login .page-card-head::after {
	background-image: linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4));
	background-position: center top;
	background-repeat: no-repeat;
	background-size: 40% 1px;
	color: var(--better-login-title-after-color, var(--better-page-heading-color));
	content: var(--better-login-title-after-content, "");
	display: var(--better-login-title-after-display, none);
	justify-content: center;
	margin-top: var(--better-login-title-after-margin, 10px);
	padding-top: 20px;
}

.page-card-head h4 {
	color: var(--better-page-heading-color) !important;
}

.btn-primary.btn-login,
.btn-primary.btn-forgot {
	background-color: var(--better-login-btn-bg, var(--bdt-btn-primary-background, #171717)) !important;
	color: var(--better-login-btn-color, var(--bdt-btn-primary-foreground, #fff)) !important;
}

.btn-primary.btn-login:hover,
.btn-primary.btn-forgot:hover {
	background-color: var(--better-login-btn-hover-bg, var(--better-login-btn-bg, #171717)) !important;
	color: var(--better-login-btn-hover-color, var(--better-login-btn-color, #fff)) !important;
}

.form-control {
	background-color: var(--better-input-bg, var(--bdt-input-background, #f3f3f3)) !important;
	border-color: var(--better-input-border, var(--bdt-input-border, #f3f3f3)) !important;
	color: var(--better-input-color, var(--bdt-input-foreground, #383838)) !important;
}

label.control-label {
	color: var(--better-input-label-color, inherit) !important;
}

.navbar,
.desktop-navbar {
	background-color: var(--better-navbar-bg, var(--bdt-navbar-background)) !important;
	color: var(--better-navbar-color, var(--bdt-navbar-foreground)) !important;
}

.navbar .nav-link,
.desktop-navbar .nav-link {
	color: var(--better-navbar-color, var(--bdt-navbar-foreground)) !important;
}

.input-group.search-bar {
	display: var(--better-search-display, flex) !important;
}

.dropdown-help,
.nav-item.dropdown-help,
[data-original-title="Help"],
[aria-label="Help"] {
	display: var(--better-help-display, flex) !important;
}

.app-switcher-dropdown,
.navbar .dropdown-app-switcher,
.sidebar .app-switcher-dropdown {
	display: var(--better-app-switcher-display, block) !important;
	pointer-events: var(--better-app-switcher-pointer-events, auto) !important;
}

body,
.main-section,
.layout-main-section,
.page-content,
.desktop-container {
	background-color: var(--better-body-bg, var(--bdt-main-background)) !important;
	color: var(--better-content-text-color, var(--bdt-main-foreground)) !important;
}

.layout-main-section,
.frappe-card,
.page-form,
.form-layout,
.widget-box,
.card {
	background-color: var(--better-content-bg, var(--bdt-card-background)) !important;
	color: var(--better-content-text-color, var(--bdt-card-foreground)) !important;
}

.sidebar,
.sidebar-wrapper,
.standard-sidebar-section,
.workspace-sidebar {
	background-color: var(--better-sidebar-bg, var(--bdt-sidebar-background)) !important;
	color: var(--better-sidebar-text-color, var(--bdt-sidebar-foreground)) !important;
}

.sidebar a,
.sidebar-item,
.standard-sidebar-item,
.workspace-sidebar .sidebar-item {
	color: var(--better-sidebar-text-color, var(--bdt-sidebar-foreground)) !important;
}

.datatable .dt-header .dt-cell,
.list-row-head,
.report-wrapper .datatable .dt-header {
	background-color: var(--better-table-head-bg) !important;
	color: var(--better-table-head-color) !important;
}

.datatable .dt-row,
.list-row,
.report-wrapper .datatable .dt-row {
	background-color: var(--better-table-body-bg) !important;
	color: var(--better-table-body-color) !important;
}

.comment-count,
.liked-by,
.like-action,
.comment-action,
.list-liked-by-me,
.list-comments {
	display: var(--better-like-comment-display, initial) !important;
}

.number-widget-box,
.widget.number-widget-box,
.dashboard-widget-box {
	background-color: var(--better-widget-bg, var(--bdt-card-background)) !important;
	border-color: var(--better-widget-border, var(--bdt-card-border)) !important;
	color: var(--better-widget-color, var(--bdt-card-foreground)) !important;
}

#better-desk-footer {
	align-items: center;
	background: var(--better-footer-bg, #f8f9fa);
	border-top: 1px solid var(--better-footer-border, #dee2e6);
	color: var(--better-footer-color, #495057);
	display: var(--better-footer-display, flex);
	font-size: 12px;
	gap: 16px;
	justify-content: space-between;
	padding: 10px 16px;
	width: 100%;
	z-index: 20;
}

#better-desk-footer.sticky {
	bottom: 0;
	left: 50px;
	position: fixed;
	right: 0;
	width: auto;
}

.body-sidebar-container.expanded ~ .main-section #better-desk-footer.sticky,
.main-section.has-better-sticky-footer #better-desk-footer.sticky {
	left: 220px;
}

.better-carousel-nav {
	align-items: center;
	background: rgba(0, 0, 0, 0.35);
	border: 0;
	border-radius: 999px;
	color: #fff;
	display: flex;
	font-size: 24px;
	height: 44px;
	justify-content: center;
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	width: 44px;
	z-index: 5;
}

.better-carousel-nav-left {
	left: 24px;
}

.better-carousel-nav-right {
	right: 24px;
}

@media (max-width: 767px) {
	.for-login,
	.for-signup,
	.for-forgot,
	.for-login-with-email-link {
		left: auto;
		position: static;
		right: auto;
	}

	.login-content.page-card,
	.signup-content.page-card {
		max-width: calc(100vw - 32px);
		width: var(--better-login-box-width, 400px);
	}

	body.better-disable-mobile-card-view .layout-main-section .frappe-list .result-container .list-row-container:not(:has(.list-row-head)) .list-row.level {
		align-items: center !important;
	}

	body.better-disable-mobile-card-view .layout-main-section .frappe-list .result-container .list-row-container:not(:has(.list-row-head)) .level-left {
		display: flex !important;
		min-width: 0 !important;
	}

	body.better-disable-mobile-card-view .layout-main-section .frappe-list .result-container .mobile-layout {
		display: none !important;
	}

	body.better-disable-mobile-card-flex .layout-main-section .frappe-list .result-container .list-row-container:not(:has(.list-row-head)) .level-left {
		display: flex !important;
		min-width: 0 !important;
	}

	body.better-disable-mobile-card-flex .layout-main-section .frappe-list .result-container .mobile-layout {
		display: inline-flex !important;
	}

	#better-desk-footer,
	#better-desk-footer.sticky {
		left: 0;
		position: static;
		width: 100%;
	}
}


.better-theme-runtime-status {
	border: 1px solid var(--border-color, #d9dee3);
	border-radius: 8px;
	padding: 12px;
}

.better-theme-status-row {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-bottom: 12px;
}

.better-theme-status-row .indicator-pill {
	border-radius: 999px;
	font-size: 12px;
	font-weight: 600;
	padding: 4px 9px;
}

.better-theme-status-grid {
	display: grid;
	gap: 8px;
	grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
}

.better-theme-status-grid > div {
	background: var(--control-bg, #f7f8fa);
	border-radius: 6px;
	padding: 8px 10px;
}

.better-theme-status-grid small,
.better-theme-status-grid strong {
	display: block;
}

.better-theme-status-grid small {
	color: var(--text-muted, #6b7280);
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0;
	text-transform: uppercase;
}

.better-theme-status-grid strong {
	font-size: 13px;
	margin-top: 3px;
}

.better-theme-missing-fields {
	color: var(--red-600, #b42318);
	font-size: 12px;
	margin-top: 10px;
}