/* ======================================= */
/* CSS for control sap.ushell/ShellHeader  */
/* Horizon High Contrast Black theme       */
/* ======================================= */

.sapUshellShellHeader {
	height: 3.25rem;
	line-height: 2.75rem;
	box-shadow: inset 0 -0.0625rem 0 0 var(--sapShell_BorderColor);
}

/** ShellHeadItems **/

.sapUshellShellHeadItm {
	color: var(--sapShell_InteractiveTextColor);
	line-height: 2.25rem;
	outline: none;
}

.sapUshellShellHeadItm:focus {
	outline: none;
}

/* Content (Icon) inside a ShellHeadItem */
.sapUshellShellHeadItmCntnt {
	color: var(--sapContent_FocusColor);
	margin: 0.25rem;
	border-radius: .375rem;
	outline-offset: -0.25rem;
	box-shadow: none;
	border: 1px @sapDefault_BorderStyle var(--sapContent_FocusColor);
}

.sapUshellShellHeadItm:hover > .sapUshellShellHeadItmCntnt {
	background-color: var(--sapShell_Hover_Background);
}

.sapUshellShellHeadItm:focus:not(:focus-visible) > .sapUshellShellHeadItmCntnt {
	background-color: var(--sapShell_Hover_Background);
	border-color: var(--sapButton_Lite_BorderColor);
}

.sapUshellShellHeadItm:focus-visible > .sapUshellShellHeadItmCntnt {
	outline: var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--sapContent_FocusColor);
}

.sapUshellShellHeadItm:active > .sapUshellShellHeadItmCntnt {
	background-color: var(--sapButton_Hover_Background);
}

/* Badge */
.sapUshellShellHeadItmCounter::after {
	border-color: var(--sapGroup_ContentBorderColor);
}

/** Logo **/

.sapUshellShellIco {
	height: inherit;
}

/* The logo control itself, places its content (logo image) vertically centered. */
#shell-header-logo {
	display: flex;
	justify-content: center;
	align-items: center;
	border-radius: .375rem;
	border: 1px @sapDefault_BorderStyle var(--sapShell_BorderColor);
	margin: .25rem 0;
	outline-offset: -0.25rem;
}

#shell-header-logo:hover {
	background-color: var(--sapShell_Hover_Background);
}

#shell-header-logo:focus:not(:focus-visible) {
	outline-color: transparent;
}

#shell-header-logo:focus-visible {
	outline: var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--sapContent_FocusColor);
}

#shell-header-logo:active {
	background-color: var(--sapShell_Active_Background);
}

/** UserActionsMenu Button (Avatar) **/
.sapUshellShellHeader {

	#userActionsMenuHeaderButton {
		border: 1px @sapDefault_BorderStyle var(--sapShell_InteractiveBorderColor);
	}

	#userActionsMenuHeaderButton:hover {
		box-shadow: var(--sapContent_Interaction_Shadow);
		background-color: var(--sapShell_Active_Background);
	}

	#userActionsMenuHeaderButton:focus:not(:focus-visible) {
		outline: none;
	}

	#userActionsMenuHeaderButton:focus-visible {
		outline: var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--sapContent_FocusColor);
		box-shadow: none;
	}

	#userActionsMenuHeaderButton:active {
		background-color: var(--sapShell_Active_Background);
	}
}