.mobility-header-first-row {
	background-color: var(--primary-color);
	padding: 0 10px;
	overflow: hidden;
	min-height: 45px;
}

.mobility-header-second-row {
	display: flex;
	align-items: center;
	gap: .5rem;
	justify-content: flex-end;
	padding: .5rem .7rem;
	border-bottom: 1px solid var(--bs-border-color-translucent);
	flex-wrap: wrap;
	background: white;
}

.mobility-header-inst-info {
	color: var(--text-color-on-primary);
}

.mobility-header-inst-logo, .application-header-product-logo {
	max-height: 45px;
}

.mobility-header {
	display: flex;
}

.mobility-header.sticky-mobility-header {
	position: sticky;
	top: 0;
	z-index: 2;
}

.progTitleOffcanvas2023 {
	background-color: var(--primary-color);
	color: var(--text-color-on-primary);
	font-weight: bold;
	border-radius: 0;
	vertical-align: middle;
	line-height: var(--bs-body-line-height);
	padding: calc(0.5rem + 1px) 10px;
}

.progTitleOffcanvas2023New {
	padding: 0 10px;
	display: flex;
	gap: 0 .5rem;
	flex-wrap: wrap;

	&:has(.mobility-header-components .header-online-help-button:only-child) {
		flex-wrap: nowrap; /* in case only the help button is in header components */
	}
}

.mobility-header-breadcrumbs {
	padding: calc(0.5rem + 1px) 0;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;

	&:has(.progTitleBreadcrumbsMenuPath) {
		direction: rtl; /* ensures that ellipsis is placed at start because breadcrumbs are less important than actual program name */
	}
}

.progTitleOffcanvas2023 .mobility-header-components {
	padding: .25rem 0;
	flex-grow: 1;
}

.progTitleOffcanvas2023.sticky-header {
	position: sticky;
	top: 0;
	z-index: 2;
}

.progTitleOffcanvas2023 .header-online-help-button {
	padding: 0 0 0 .2rem !important;
}

.mobility-header-second-row .header-online-help-button {
	color: var(--text-color-on-bright-bg) !important;
}

.mobility-header-second-row .header-online-help-button.no-help-available {
	color: #808080 !important
}

.progTitleOffcanvas2023 .header-online-help-button.no-help-available,
.mobility-header-first-row .header-online-help-button.no-help-available {
	opacity: 50%;
}