/* Faris Family McDonalds branding - theme-independent, always loaded regardless of selected theme */

.descWrapper::before {
	content: "";
	display: block;
	width: 100px;
	height: 80px;
	margin: 0 auto 8px;
	background: url("../../themes/FarisFamily/images/logo.png") no-repeat center/contain;
}

.b-folders > .b-toolbar {
	position: relative;
	padding-top: 54px !important;
	background-color: var(--main-bg-color);
}
.b-folders > .b-toolbar::before {
	content: "";
	position: absolute;
	top: 6px;
	left: 8px;
	width: 40px;
	height: 40px;
	background: url("../../themes/FarisFamily/images/logo.png") no-repeat left center/contain;
}
.b-folders > .b-toolbar::after {
	content: "Faris Family";
	position: absolute;
	top: 6px;
	left: 54px;
	right: 8px;
	height: 40px;
	line-height: 40px;
	color: #FFC72C;
	font-weight: bold;
	font-size: 15px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

/* Login error alert - inherit the page theme colors instead of the default yellow/mono-font warning box.
   Positioned statically (not the default absolute overlay) so it sits above the form instead of
   overlapping the login card border, and uses a dark overlay (not the card's own bg color) so it
   has contrast against the card instead of blending into it. */
.LoginView .alert {
	position: static !important;
	display: block !important;
	width: auto;
	margin: 0 0 16px !important;
	background-color: rgba(0,0,0,0.55) !important;
	border: var(--login-border, 2px solid rgba(255,255,255,.6)) !important;
	border-radius: var(--login-border-radius, 6px) !important;
	color: var(--login-color) !important;
	text-shadow: none !important;
	box-shadow: none !important;
	padding: 10px 32px 10px 14px;
	box-sizing: border-box;
}
.LoginView .alert[hidden] {
	display: none !important;
}
.alert .close {
	color: var(--login-color) !important;
	opacity: 0.8;
}
.alert .close:hover {
	opacity: 1;
}
.alert p {
	font-family: inherit !important;
	opacity: 0.85;
	margin: 6px 0 0;
}
.alert a:not(.close) {
	color: var(--login-color) !important;
}