@openui5/themelib_sap_horizon 1.115.1 → 1.117.0

package/src/sap/m/themes/sap_horizon_hcb/Slider.less

@@ -28,7 +28,8 @@
 	top: -.0625rem;
 }
 
-.sapMSliderInner:not(.sapMSliderInnerDisabled):hover > .sapMSliderHandle {
+.sapMSliderInner:not(.sapMSliderInnerDisabled) .sapMSliderProgress:hover ~ .sapMSliderHandle,
+.sapMSliderHandle:hover {
 	background: @sapUiSliderHoverHandleBackground;
 	border-color: @sapUiSliderHoverHandleBorderColor;
 	box-shadow: @sapUiContentSelectedShadow;

package/src/sap/m/themes/sap_horizon_hcb/TextArea.less

@@ -24,4 +24,8 @@
 
 .sapMInputBase.sapMTextArea .sapMTextAreaInner {
 	line-height: 1.5;
-}
+}
+
+.sapMTextAreaMirror {
+	line-height: 1.5;
+}

package/src/sap/m/themes/sap_horizon_hcb/Token.less

@@ -12,6 +12,8 @@
 .sapMToken {
 	padding-left: @_sap_m_Token_LeftPadding;
 	border-radius: 0.25rem;
+	color: @sapTextColor;
+	font-size: @sapFontSize;
 }
 
 html.sap-desktop .sapMToken:not(.sapMTokenReadOnly):hover {
@@ -24,6 +26,11 @@ html.sap-desktop .sapMToken.sapMTokenSelected:not(.sapMTokenReadOnly):hover {
 	border: @sapUiButtonBorderWidth solid @sapUiButtonSelectedBorderColor;
 }
 
+html.sap-desktop .sapMToken:focus {
+	outline: @sapUiContentFocusWidth @sapUiContentFocusStyle @sapUiContentFocusColor;
+	outline-offset: -0.1875rem;
+}
+
 html.sap-desktop .sapMToken {
 	&.sapMTokenReadOnly,
 	&.sapMTokenReadOnly:hover,
@@ -35,19 +42,19 @@ html.sap-desktop .sapMToken {
 	}
 }
 
-html.sap-desktop .sapMToken:focus {
-	outline: none;
+.sapMToken.sapMTokenReadOnly {
+	padding: 0.25rem 0.3125rem;
+	color: @sapUiContentLabelColor;
+
+	.sapMTokenText {
+		line-height: 1rem;
+	}
 }
 
-html.sap-desktop .sapMToken:focus::after {
-	content: '';
-	position: absolute;
-	pointer-events: none;
-	z-index: 2;
-	border: @sapUiContentFocusWidth @sapUiContentFocusStyle @sapUiFieldActiveBorderColor;
-	border-radius: 0.25rem;
-	top: 0.0625rem;
-	bottom: 0.0625rem;
-	left: 0.0625rem;
-	right: 0.0625rem;
+.sapUiSizeCompact .sapMToken.sapMTokenReadOnly {
+	padding: 0.125rem 0.25rem;
+
+	.sapMTokenText {
+		line-height: 0.875rem;
+	}
 }

package/src/sap/m/themes/sap_horizon_hcb/Tokenizer.less

@@ -36,9 +36,16 @@ html.sap-desktop .sapMTokenizer.sapMTokenizerReadonly {
 	}
 }
 
+.sapMTokenizer.sapMTokenizerReadonly .sapMToken.sapMTokenReadOnly {
+	padding: 0.25rem 0.3125rem;
+}
+
 .sapUiSizeCompact {
 	.sapMTokenizer {
 		padding-left: 0.25rem;
+		&.sapMTokenizerReadonly .sapMToken.sapMTokenReadOnly {
+			padding: 0.125rem 0.25rem;
+		}
 		.sapMToken {
 			margin-right: 0.25rem;
 			margin-top: 0.0625rem;

package/src/sap/m/themes/sap_horizon_hcb/Wizard.less

@@ -34,7 +34,7 @@
 }
 
 .sapMWizard:not(.sapMWizardModePage) .sapMWizardLastActivatedStep {
-	min-height: calc(100% - 3rem);
+	min-height: ~"calc(100% - 3rem)";
 }
 
 html.sap-phone .sapMWizard .sapMWizardNextButtonVisible {

package/src/sap/m/themes/sap_horizon_hcw/Avatar.less

@@ -8,6 +8,7 @@
 @_sap_m_Avatar_Font_Size_M: 1.5rem;
 @_sap_m_Avatar_Font_Size_S: 1.125rem;
 @_sap_m_Avatar_Font_Size_XS: 1rem;
+@_sap_m_Avatar_Hover_Box_Shadow_Offset: 0px;
 
 .sapFAvatarImageContain,
 .sapFAvatarIcon,
@@ -28,8 +29,11 @@
 }
 
 .sapFAvatarFocusable:focus {
-	outline: none;
-	box-shadow: 0px 0px 0px 0.125rem @sapUiContentFocusColor;
+	outline-width: 0.125rem;
+}
+
+.sapFAvatar:not(.sapMAvatarPressed):not(.sapMAvatarDisabled):hover {
+	background-color: @sapActiveColor;
 }
 
 .sapFAvatarColorTileIcon {

package/src/sap/m/themes/sap_horizon_hcw/CheckBox.less

@@ -9,6 +9,10 @@
 	line-height: 2.7rem;
 }
 
+.sapMCb:focus {
+	outline: none;
+}
+
 .sapMCbBg {
 	height: 1.375rem;
 	width: 1.375rem;

package/src/sap/m/themes/sap_horizon_hcw/GroupHeaderListItem.less

@@ -0,0 +1,8 @@
+/* ========================================== */
+/* CSS for control sap.m/GroupHeaderListItem  */
+/* Horizon High Contrast White theme          */
+/* ========================================== */
+
+.sapMListUl .sapMLIB.sapMGHLI {
+	font-weight: bold;
+}

package/src/sap/m/themes/sap_horizon_hcw/IconTabBar.less

@@ -169,6 +169,10 @@
 	}
 }
 
+.sapMITBTextOnly .sapMITBFilter .sapMITBText {
+	line-height: 0.75rem;
+}
+
 /* Head Container - compact */
 
 .sapUiSizeCompact.sapMITH {
@@ -228,6 +232,10 @@
 			margin-top: 0.125rem;
 		}
 	}
+
+	.sapMITBTextOnly .sapMITBFilter .sapMITBText {
+		line-height: 0.75rem;
+	}
 }
 
 .sapMITBContentArrow {

package/src/sap/m/themes/sap_horizon_hcw/Link.less

@@ -21,6 +21,29 @@
 .sapMLnk.sapMLnkSubtle {
 	color: @sapUiLinkSubtleColor;
 	text-decoration: underline;
+
+	&:not(.sapMLnkDsbl) {
+		&:active {
+			color: @sapUiLinkSubtleColor;
+		}
+	}
+}
+
+html.sap-desktop .sapMLnk:not(.sapMLnkDsbl) {
+	&:focus {
+		outline: 0.125rem dotted @sapUiContentFocusColor;
+
+		&:hover:not(:active) {
+			text-decoration: none;
+		}
+	}
+
+	&.sapMLnkSubtle {
+		&:hover:not(:active):not(:focus) {
+			color: @sapUiLinkSubtleColor;
+			text-decoration: none;
+		}
+	}
 }
 
 .sapMLnk:not(.sapMLnkDsbl) {
@@ -35,13 +58,4 @@
 
 .sapMListTblRow.sapMLIBSelected .sapMLnk:not(.sapMLnkDsbl) {
 	text-shadow: @sapUiContentTextShadow;
-}
-
-html.sap-desktop .sapMLnk:focus:not(.sapMLnkDsbl) {
-	outline: 0.125rem dotted @sapUiContentFocusColor;
-}
-
-html.sap-desktop .sapMLnk:hover:not(:active):not(.sapMLnkDsbl).sapMLnkSubtle,
-html.sap-desktop .sapMLnk:focus:hover:not(:active):not(.sapMLnkDsbl) {
-	text-decoration: none;
 }

package/src/sap/m/themes/sap_horizon_hcw/ListItemBase.less

@@ -18,7 +18,3 @@
 .sapMTableRowCustomFocus:focus > :not(.sapMListTblDummyCell:last-child)::before {
 	border-width: 2px;
 }
-
-.sapMListShowSeparatorsNone .sapMLIBShowSeparator:not(:hover) {
-	box-shadow: inset 0px -0.0625rem @sapUiListSelectionBorderColor;
-}

package/src/sap/m/themes/sap_horizon_hcw/Panel.less

@@ -4,7 +4,7 @@
 /* ================================== */
 
 .sapMPanel {
-	min-height: 2.5rem;
+	min-height: 2.75rem;
 }
 
 .sapMPanelBGSolid {
@@ -55,11 +55,19 @@
 	font-size: 1.375rem;
 }
 
-.sapUiSizeCompact .sapMPanelWrappingDiv .sapUiIcon {
-	width: 2rem;
-	font-size: 1rem;
+.sapUiSizeCompact {
+	.sapMPanel {
+		min-height: 2.5rem;
+	}
+	.sapMPanelWrappingDiv .sapUiIcon {
+		width: 2rem;
+	}
 }
 
 .sapMPanelWrappingDiv .sapUiIcon {
 	color: @sapButton_Lite_TextColor;
+}
+
+.sapMPanelStickyHeadingDiv {
+	background-color: @sapUiGroupTitleBackground;
 }

package/src/sap/m/themes/sap_horizon_hcw/Popover.less

@@ -161,4 +161,10 @@
 /* pointing left arrow */
 .sapMPopoverArrLeft:after {
 	margin: 0.125rem 0 0 0.3125rem;
+}
+
+.sapMPopoverResizeHandle {
+	top: -8px;
+	right: -3px;
+	color: @sapButton_Lite_TextColor;
 }

package/src/sap/m/themes/sap_horizon_hcw/RadioButton.less

@@ -138,7 +138,7 @@
 .sapMRbWarn.sapMRbSel,
 .sapMRbWarn.sapMRbSel.sapMRbRo {
 	.sapMRbBInn {
-		fill: @sapUiFieldTextColor;
+		fill: @sapUiFieldWarningColor;
 		stroke: none;
 	}
 }

package/src/sap/m/themes/sap_horizon_hcw/SearchField.less

@@ -8,7 +8,6 @@
 // ==========================================================================
 
 @_sap_m_SearchField_Height: 2.75rem;
-@_sap_m_SearchField_FormHeight: 2.25rem;
 @_sap_m_SearchField_ButtonSize: 2.25rem;
 @_sap_m_SearchField_ButtonFontSize: 1rem;
 @_sap_m_SearchField_Compact_FormPaddingLeft: 0.5rem;
@@ -57,7 +56,6 @@
 }
 
 .sapMSF:not(.sapMSFDisabled):hover .sapMSFF {
-	box-shadow: @sapUiContentInteractionShadow;
 	background-color: @sapUiFieldHoverBackground;
 }
 

package/src/sap/m/themes/sap_horizon_hcw/Select.less

@@ -11,6 +11,27 @@
 	border-radius: 0.365rem;
 }
 
+/* arrow styles */
+
+.sapMSlt > .sapMSltArrow {
+	line-height: 2.25rem;
+}
+
+.sapUiSizeCompact .sapMSlt > .sapMSltArrow {
+	line-height: 1.625rem;
+}
+
+.sapMSltArrow {
+    width: 2.25rem;
+    height: 2.25rem;
+}
+
+.sapUiSizeCompact .sapMSltArrow {
+    width: 2rem;
+    height: 1.625rem;
+}
+
+
 /* hover and focus */
 
 .sapMSlt.sapMSltIconOnly.sapMSltHoverable:hover:not(.sapMSltState) {

package/src/sap/m/themes/sap_horizon_hcw/Slider.less

@@ -26,7 +26,8 @@
 	top: -.0625rem;
 }
 
-.sapMSliderInner:not(.sapMSliderInnerDisabled):hover > .sapMSliderHandle {
+.sapMSliderInner:not(.sapMSliderInnerDisabled) .sapMSliderProgress:hover ~ .sapMSliderHandle,
+.sapMSliderHandle:hover {
 	background: @sapUiSliderHoverHandleBackground;
 	border-color: @sapUiSliderHoverHandleBorderColor;
 	box-shadow: @sapUiContentSelectedShadow;

package/src/sap/m/themes/sap_horizon_hcw/TextArea.less

@@ -24,4 +24,8 @@
 
 .sapMInputBase.sapMTextArea .sapMTextAreaInner {
 	line-height: 1.5;
-}
+}
+
+.sapMTextAreaMirror {
+	line-height: 1.5;
+}

package/src/sap/m/themes/sap_horizon_hcw/Token.less

@@ -12,6 +12,8 @@
 .sapMToken {
 	padding-left: @_sap_m_Token_LeftPadding;
 	border-radius: 0.25rem;
+	color: @sapTextColor;
+	font-size: @sapFontSize;
 }
 
 html.sap-desktop .sapMToken:not(.sapMTokenReadOnly):hover {
@@ -24,6 +26,11 @@ html.sap-desktop .sapMToken.sapMTokenSelected:not(.sapMTokenReadOnly):hover {
 	border: @sapUiButtonBorderWidth solid @sapUiButtonSelectedBorderColor;
 }
 
+html.sap-desktop .sapMToken:focus {
+	outline: @sapUiContentFocusWidth @sapUiContentFocusStyle @sapUiContentFocusColor;
+	outline-offset: -0.1875rem;
+}
+
 html.sap-desktop .sapMToken {
 	&.sapMTokenReadOnly,
 	&.sapMTokenReadOnly:hover,
@@ -34,19 +41,20 @@ html.sap-desktop .sapMToken {
 		border: @sapUiButtonBorderWidth solid @sapUiFieldReadOnlyBorderColor;
 	}
 }
-html.sap-desktop .sapMToken:focus {
-	outline: none;
+
+.sapMToken.sapMTokenReadOnly {
+	padding: 0.25rem 0.3125rem;
+	color: @sapUiContentLabelColor;
+
+	.sapMTokenText {
+		line-height: 1rem;
+	}
 }
 
-html.sap-desktop .sapMToken:focus::after {
-	content: '';
-	position: absolute;
-	pointer-events: none;
-	z-index: 2;
-	border: @sapUiContentFocusWidth @sapUiContentFocusStyle @sapUiFieldActiveBorderColor;
-	border-radius: 0.25rem;
-	top: 0.0625rem;
-	bottom: 0.0625rem;
-	left: 0.0625rem;
-	right: 0.0625rem;
+.sapUiSizeCompact .sapMToken.sapMTokenReadOnly {
+	padding: 0.125rem 0.25rem;
+
+	.sapMTokenText {
+		line-height: 0.875rem;
+	}
 }

package/src/sap/m/themes/sap_horizon_hcw/Tokenizer.less

@@ -36,9 +36,16 @@ html.sap-desktop .sapMTokenizer.sapMTokenizerReadonly {
 	}
 }
 
+.sapMTokenizer.sapMTokenizerReadonly .sapMToken.sapMTokenReadOnly {
+	padding: 0.25rem 0.3125rem;
+}
+
 .sapUiSizeCompact {
 	.sapMTokenizer {
 		padding-left: 0.25rem;
+		&.sapMTokenizerReadonly .sapMToken.sapMTokenReadOnly {
+			padding: 0.125rem 0.25rem;
+		}
 		.sapMToken {
 			margin-right: 0.25rem;
 			margin-top: 0.0625rem;

package/src/sap/m/themes/sap_horizon_hcw/Wizard.less

@@ -34,7 +34,7 @@
 }
 
 .sapMWizard:not(.sapMWizardModePage) .sapMWizardLastActivatedStep {
-	min-height: calc(100% - 3rem);
+	min-height: ~"calc(100% - 3rem)";
 }
 
 html.sap-phone .sapMWizard .sapMWizardNextButtonVisible {

package/src/sap/tnt/themes/sap_horizon/NavigationList.less

@@ -12,6 +12,7 @@
 @_sap_tnt_NavigationList_ItemBottomMargin: 0.125rem;
 @_sap_tnt_NavigationList_ItemBottomMarginCompact: 0.5rem;
 @_sap_tnt_NavigationList_ItemFocusBorderOffset: -@sapUiContentFocusWidth;
+@_sap_tnt_NavigationList_ItemTransition: background-color 0.3s ease-in-out;
 @_sap_tnt_NavigationList_SelectedItemBorder: none;
 @_sap_tnt_NavigationList_Collapsed_SelectedItemBorder: 0.125rem solid @_sap_tnt_NavigationList_SelectedItemBorderColor;
 @_sap_tnt_NavigationList_GroupIconWidth: 2rem;
@@ -21,5 +22,12 @@
 @_sap_tnt_NavigationList_NoIconsNestedItemPadding: 2rem;
 @_sap_tnt_NavigationList_Padding: 0.5rem;
 @_sap_tnt_NavigationList_PaddingCompact: 1.5rem 0.75rem 0.75rem 0.75rem;
-@_sap_tnt_NavigationList_PopupPadding: 0.5rem;
+@_sap_tnt_NavigationList_ParentPopupPadding: 0.75rem;
+@_sap_tnt_NavigationList_ParentPopupBorderRadius: 0.75rem;
+@_sap_tnt_NavigationList_PopupItemPadding: 0 0.5rem;
+@_sap_tnt_NavigationList_PopupIconWidth: 0.5rem;
+@_sap_tnt_NavigationList_PopupBoxShadow: 0 0 0.125rem 0 fade(@sapUiContentShadowColor, 48), 0 1rem 2rem 0 fade(@sapUiContentShadowColor, 16);
+@_sap_tnt_NavigationList_PopupArrowBoxShadow: 0 0 0.125rem 0 fade(@sapUiContentShadowColor, 48), 0 1rem 2rem 0 fade(@sapUiContentShadowColor, 16);
+@_sap_tnt_NavigationList_PopupTitleTextSize: 1.25rem;
+@_sap_tnt_NavigationList_PopupTitleLineHeight: 1.5rem;
 @_sap_tnt_NavigationList_SelectionIndicatorDisplay: inline-block;

package/src/sap/tnt/themes/sap_horizon/SideNavigation.less

@@ -10,8 +10,9 @@
 @_sap_tnt_SideNavigation_NavigationSeparatorBackgroundColor: @sapUiToolbarSeparatorColor;
 @_sap_tnt_SideNavigation_NavigationSeparatorRadius: 0.125rem;
 @_sap_tnt_SideNavigation_NavigationSeparatorHeight: 0.0625rem;
-@_sap_tnt_SideNavigation_TriangleColor: @sapContent_NonInteractiveIconColor;
+@_sap_tnt_SideNavigation_TriangleColor: @sapUiContentNonInteractiveIconColor;
 @_sap_tnt_SideNavigation_BorderRadius: 0.5rem 0.5rem 0 0;
 @_sap_tnt_SideNavigation_PhoneBorderRadius: 0.5rem;
 @_sap_tnt_SideNavigation_BoxShadow: 0 0 0.125rem 0 fade(@sapUiContentShadowColor, 16), 0 0.5rem 1rem 0 fade(@sapUiContentShadowColor, 16);
-@_sap_tnt_SideNavigation_SeparatorMargin: 0.3125rem 0.5rem 0.3125rem 0.5rem;
+@_sap_tnt_SideNavigation_SeparatorMargin: 0.3125rem 0.5rem 0.3125rem 0.5rem;
+@_sap_tnt_SideNavigation_TriangleDisplay: none;

package/src/sap/tnt/themes/sap_horizon/ToolHeader.less

@@ -13,7 +13,7 @@
 @_sap_tnt_ToolHeader_Padding: 0 0.75rem;
 @_sap_tnt_ToolHeader_ArrowMarginBottom: 0.25rem;
 @_sap_tnt_ToolHeader_IconTabHeader_Height: auto;
-@_sap_tnt_ToolHeader_Shadow: 0 0 0.125rem 0 fade(@sapContent_ShadowColor,16), 0 0.5rem 1rem 0 fade(@sapContent_ShadowColor, 16);
+@_sap_tnt_ToolHeader_Shadow: 0 0 0.125rem 0 fade(@sapUiContentShadowColor,16), 0 0.5rem 1rem 0 fade(@sapUiContentShadowColor, 16);
 
 // ==========================================================================
 // sap.m.Toolbar overriding
@@ -39,6 +39,24 @@
 	}
 }
 
+// Styling for the cases when we have Header and SubHeader
+.sapTntToolPageHeaderWithSubHeaderWrapper .sapTntToolPageHeader:first-of-type .sapTntToolHeader {
+	border-bottom-right-radius: 0;
+	border-bottom-left-radius: 0;
+	box-shadow: none;
+}
+
+.sapTntToolPageHeaderWithSubHeaderWrapper .sapTntToolPageHeader:nth-of-type(2) .sapTntToolHeader {
+	border-top-right-radius: 0;
+	border-top-left-radius: 0;
+	box-shadow: none;
+}
+
+.sapTntToolPageHeaderWrapper.sapTntToolPageHeaderWithSubHeaderWrapper {
+	box-shadow: @_sap_tnt_ToolHeader_BoxShadow;
+	border-radius: @_sap_tnt_ToolHeader_BorderRadius;
+}
+
 // ==========================================================================
 // sap.m.Button overriding
 // ==========================================================================
@@ -141,7 +159,7 @@
 
 .sapTntToolHeader {
 	.sapMTitle {
-		text-shadow: none;		
+		text-shadow: none;
 		font-family: @sapFontBlackFamily;
 		font-size: 1.125rem;
 		line-height: 1.625rem;
@@ -177,24 +195,52 @@
 	.sapMSF {
 		height: 2.5rem;
 		padding-top: 0px;
+
+		&:not(.sapMSFVal) .sapMSFS {
+			pointer-events: none;
+		}
 	}
 
 	.sapMSF .sapMSFF {
 		border-radius: 2rem;
 		height: 2.5rem;
+		background-color: @sapUiShellInteractiveBackground;
+
+		&:hover {
+			background: @sapUiShellHoverBackground;
+			box-shadow: 0 0 0.125rem 0 fade(@sapUiContentShadowColor, 16), 0 0.5rem 1rem 0 fade(@sapUiContentShadowColor, 16);
+		}
+
+		.sapMSFI {
+			color: @sapUiShellTextColor;
+		}
+	}
+
+	.sapMSF.sapMFocus .sapMSFF {
+		background: @sapUiShellActiveBackground;
 	}
 
 	.sapMSFB {
-		line-height: 2.5rem;
-		width: 1.875rem;
+		width: 2rem;
+		height: 2rem;
+		margin-top: 0.25rem;
+		display: flex;
+		align-items: center;
+		justify-content: center;
+	}
+
+	.sapMSFB.sapMSFBA {
+		background: none;
+		box-shadow: none;
 	}
 
 	.sapMSFSSI {
 		display: inline;
 	}
 
-	.sapMSFF  .sapMSFSSI:before {
+	.sapMSFF .sapMSFSSI:before {
 		content: "\e00d";
+		color: @sapUiContentNonInteractiveIconColor;
 		display: block;
 		font-style: normal;
 		width: 1rem;
@@ -215,12 +261,11 @@
 		height: 1.25rem;
 		border-radius: 0.75rem;
 		font-size: 0.75rem;
-		margin-top: 0.625rem;
 		line-height: 1.25rem;
 	}
 
 	.sapMSFS {
-		width: 1.625rem;
+		margin-right: 0.25rem;
 		border: none;
 	}
 
@@ -232,19 +277,30 @@
 		box-shadow: none;
 		line-height: 1.25rem;
 	}
-	
+
 	.sapMSFS:active::after,
+	.sapMSFS.sapMSFBA::after,
 	.sapMSFR:active::after {
 		background: @sapActiveColor;
 		color: @sapContent_IconColor;
-		margin-top: 0.625rem;
 	}
 
 	.sapMSFS:hover::after,
 	.sapMSFR:hover::after {
 		background: @sapHoverColor;
 		color: @sapContent_IconColor;
-		margin-top: 0.625rem;
+	}
+
+	.sapMSFVal.sapMFocus .sapMSFF {
+		box-shadow: 0 0 0.125rem 0 fade(@sapUiContentShadowColor, 16), 0 0.5rem 1rem 0 fade(@sapUiContentShadowColor, 16);
+
+		&::before {
+			display: none;
+		}
+
+		.sapMSFS.sapMSFB::after {
+			outline: @sapUiContentFocusWidth @sapUiContentFocusStyle @sapUiContentFocusColor;
+		}
 	}
 }
 
@@ -252,7 +308,6 @@
 	.sapTntToolHeader {
 		.sapMSF {
 			height: 2rem;
-			padding-top: 1px;
 		}
 
 		.sapMSF .sapMSFF {
@@ -260,25 +315,18 @@
 		}
 
 		.sapMSFB {
-			line-height: 2rem;
-			width: 1.5rem;
+			margin-top: 0.1875rem;
+			width: 1.625rem;
+			height: 1.625rem;
 		}
 
-		.sapMSFF  .sapMSFSSI:before {
-			margin-top: 0.5rem;
+		.sapMSFS {
+			margin-right: 0.1875rem;
 		}
-	}
-
-	.sapMSFS:hover::after,
-	.sapMSFR:hover::after,
-	.sapMSFS:active::after,
-	.sapMSFR:active::after {
-		margin-top: 0.375rem;
-	}
 
-	.sapMSFS::after,
-	.sapMSFR::after {
-		margin-top: 0.375rem;
+		.sapMSFF .sapMSFSSI:before {
+			margin-top: 0.5rem;
+		}
 	}
 }
 

package/src/sap/tnt/themes/sap_horizon/ToolPage.less

@@ -10,11 +10,11 @@
 @_sap_tnt_ToolPage_AsideMarginsPhone: 0.25rem 0.25rem 0 0;
 @_sap_tnt_ToolPage_ContentMargins: 0.5rem 0 0 0;
 @_sap_tnt_ToolPage_ContentMarginsPhone: 0.25rem 0 0 0;
-@_sap_tnt_ToolPage_ContentShadow: 0 0 0.125rem 0 fade(@sapContent_ShadowColor,16), 0 0.5rem 1rem 0 fade(@sapContent_ShadowColor, 16);
-@_sap_tnt_ToolPage_ContentBackgroundStandard: @sapBackgroundColor;
-@_sap_tnt_ToolPage_ContentBackgroundSolid: @sapBackgroundColor;
+@_sap_tnt_ToolPage_ContentShadow: 0 0 0.125rem 0 fade(@sapUiContentShadowColor,16), 0 0.5rem 1rem 0 fade(@sapUiContentShadowColor, 16);
+@_sap_tnt_ToolPage_ContentBackgroundStandard: @sapUiBaseBG;
+@_sap_tnt_ToolPage_ContentBackgroundSolid: @sapUiBaseBG;
 @_sap_tnt_ToolPage_ContentBackgroundTransparent: transparent;
-@_sap_tnt_ToolPage_ContentBackgroundList: @sapGroup_ContentBackground;
+@_sap_tnt_ToolPage_ContentBackgroundList: @sapUiGroupContentBackground;
 @_sap_tnt_ToolPage_ContentBorderRadius: 0.5rem 0.5rem 0 0;
 @_sap_tnt_ToolPage_ContentBorderRadiusTabletPhone: 0.5rem;
 @_sap_tnt_ToolPage_AsideCollapsedPhoneTransform: calc(~"-100% - 0.25rem");