@openui5/themelib_sap_horizon 1.132.1 → 1.134.0

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

@@ -36,10 +36,11 @@
 }
 
 .sapMTextArea.sapMInputBaseReadonly .sapMInputBaseReadonlyWrapper {
-	border: @sapUiFieldBorderWidth dashed @sapUiFieldReadOnlyBorderColor;
+	border: var(--sapField_BorderWidth) dashed var(--sapField_ReadOnly_BorderColor);
 }
 
 .sapMFocus.sapMTextArea.sapMInputBase.sapMInputBaseReadonly .sapMInputBaseContentWrapper {
+
 	&::before {
 		top: 1px;
 		left: 1px;

package/src/sap/m/themes/sap_horizon/TileContainer.less

@@ -8,7 +8,7 @@
 }
 
 .sapMTC .sapMTCScroller:focus::before {
-	border: 1px dotted @sapUiContentFocusColor;
+	border: 1px dotted var(--sapContent_FocusColor);
 	position: absolute;
 	top: -1px;
 	bottom: -1px;
@@ -23,14 +23,14 @@
 		outline: none;
 
 		&::before {
-			content: "";
+			content: '';
 			position: absolute;
 			left: -0.1875rem;
 			right: -0.1875rem;
 			top: -0.1875rem;
 			bottom: -0.1875rem;
-			border: 0.125rem solid @sapUiContentFocusColor;
+			border: 0.125rem solid var(--sapContent_FocusColor);
 			border-radius: 0.125rem;
 		}
 	}
-}
+}

package/src/sap/m/themes/sap_horizon/TileContent.less

@@ -3,16 +3,16 @@
 /* Horizon theme                      */
 /* ================================== */
 
-@_sap_m_TileContent_NewsContentBackgroundColor: fade(@sapTile_Background, 96);
+@_sap_m_TileContent_NewsContentBackgroundColor: @sapTile_OverlayBackground;
 @_sap_m_TileContent_NewsFooterTextColor: @_sap_m_NewsContent_SubHeaderTextColor;
 
 .sapMTileCnt.News {
-	background-color: @sapTile_OverlayBackground;
+	background-color: var(--sapTile_OverlayBackground);
 	.sapMTileCntContent{
 		height: 3.625rem;
 	}
 }
 
 .sapMTileCnt.News .sapMTileCntFtrTxt {
-	color: @sapTile_OverlayForegroundColor;
+	color: var(--sapTile_OverlayForegroundColor);
 }

package/src/sap/m/themes/sap_horizon/Title.less

@@ -18,7 +18,7 @@
 					.sapFDynamicPageTitleMainHeadingInner {
 						margin-top: 0.6875rem;
 
-						.sapMTitle:not(.sapUICompVarMngmtTitle) {
+						.sapMTitle:not(.sapUICompVarMngmtTitle):not(.sapMVarMngmtTitle) {
 							font-size: @sapUiObjectHeaderTitleSnappedFontSize;
 							font-family: @sapUiObjectHeaderTitleFontFamily;
 						}

package/src/sap/m/themes/sap_horizon/ToggleButton.less

@@ -6,28 +6,34 @@
 html.sap-desktop .sapMToggleBtnPressed,
 .sapMToggleBtnPressed:not(.sapMBtnDisabled) {
 	box-shadow: none;
+
 	&.sapMBtnNegative {
-		background-color: @sapUiButtonRejectSelectedBackground;
-		border-color: @sapUiButtonRejectSelectedBorderColor;
-		color: @sapUiButtonRejectSelectedTextColor;
+		background-color: var(--sapButton_Reject_Selected_Background);
+		border-color: var(--sapButton_Reject_Selected_BorderColor);
+		color: var(--sapButton_Reject_Selected_TextColor);
+
 		& .sapUiIcon {
-			color: @sapUiButtonRejectSelectedTextColor;
+			color: var(--sapButton_Reject_Selected_TextColor);
 		}
 	}
+
 	&.sapMBtnSuccess {
-		background-color: @sapUiButtonAcceptSelectedBackground;
-		border-color: @sapUiButtonAcceptSelectedBorderColor;
-		color: @sapUiButtonAcceptSelectedTextColor;
+		background-color: var(--sapButton_Accept_Selected_Background);
+		border-color: var(--sapButton_Accept_Selected_BorderColor);
+		color: var(--sapButton_Accept_Selected_TextColor);
+
 		& .sapUiIcon {
-			color: @sapUiButtonAcceptSelectedTextColor;
+			color: var(--sapButton_Accept_Selected_TextColor);
 		}
 	}
+
 	&.sapMBtnCritical {
-		background-color: @sapUiButtonAttentionSelectedBackground;
-		border-color: @sapUiButtonAttentionSelectedBorderColor;
-		color: @sapUiButtonAttentionSelectedTextColor;
+		background-color: var(--sapButton_Attention_Selected_Background);
+		border-color: var(--sapButton_Attention_Selected_BorderColor);
+		color: var(--sapButton_Attention_Selected_TextColor);
+
 		& .sapUiIcon {
-			color: @sapUiButtonAttentionSelectedTextColor;
+			color: var(--sapButton_Attention_Selected_TextColor);
 		}
 	}
 }
@@ -36,66 +42,76 @@ html.sap-desktop .sapMToggleBtnPressed,
 .sapMBtn:hover > .sapMBtnHoverable.sapMToggleBtnPressed:not(.sapMBtnActive),
 .sapMBtn .sapMBtnHoverable.sapMToggleBtnPressed:hover {
 	box-shadow: none;
+
 	&.sapMBtnReject,
 	&.sapMBtnNegative {
-		background-color: @sapUiButtonRejectSelectedHoverBackground;
-		border-color: @sapUiButtonRejectSelectedHoverBorderColor;
-		color: @sapUiButtonRejectSelectedTextColor;
+		background-color: var(--sapButton_Reject_Selected_Hover_Background);
+		border-color: var(--sapButton_Reject_Selected_Hover_BorderColor);
+		color: var(--sapButton_Reject_Selected_TextColor);
+
 		& .sapUiIcon {
-			color: @sapUiButtonRejectSelectedTextColor;
+			color: var(--sapButton_Reject_Selected_TextColor);
 		}
 	}
+
 	&.sapMBtnAccept,
 	&.sapMBtnSuccess {
-		background-color: @sapUiButtonAcceptSelectedHoverBackground;
-		border-color: @sapUiButtonAcceptSelectedHoverBorderColor;
-		color: @sapUiButtonAcceptSelectedTextColor;
+		background-color: var(--sapButton_Accept_Selected_Hover_Background);
+		border-color: var(--sapButton_Accept_Selected_Hover_BorderColor);
+		color: var(--sapButton_Accept_Selected_TextColor);
+
 		& .sapUiIcon {
-			color: @sapUiButtonAcceptSelectedTextColor;
+			color: var(--sapButton_Accept_Selected_TextColor);
 		}
 	}
+
 	&.sapMBtnAttention,
 	&.sapMBtnCritical {
-		background-color: @sapUiButtonAttentionSelectedHoverBackground;
-		border-color: @sapUiButtonAttentionSelectedHoverBorderColor;
-		color: @sapUiButtonAttentionSelectedTextColor;
+		background-color: var(--sapButton_Attention_Selected_Hover_Background);
+		border-color: var(--sapButton_Attention_Selected_Hover_BorderColor);
+		color: var(--sapButton_Attention_Selected_TextColor);
+
 		& .sapUiIcon {
-			color: @sapUiButtonAttentionSelectedTextColor;
+			color: var(--sapButton_Attention_Selected_TextColor);
 		}
 	}
 }
 
-.sapMBtn .sapMBtnCritical.sapMBtnInner,
-.sapMBtn .sapMBtnNegative.sapMBtnInner,
-.sapMBtn .sapMBtnSuccess.sapMBtnInner,
-.sapMBtn .sapMBtnNeutral.sapMBtnInner{
-	text-shadow: none;
+.sapMBtn {
+
+	.sapMBtnCritical,
+	.sapMBtnNegative,
+	.sapMBtnSuccess,
+	.sapMBtnNeutral {
+
+		&.sapMBtnInner.sapMToggleBtnPressed {
+			text-shadow: none;
+		}
+	}
 }
 
 /* Focus of toggled button */
 .sapMBtn:focus > .sapMBtnInner.sapMToggleBtnPressed.sapMFocusable {
-	outline-color: @sapUiContentFocusColor;
+	outline-color: var(--sapContent_FocusColor);
 }
 
 .sapMBtn .sapMBtnCritical.sapMToggleBtnPressed,
 .sapContrast span.sapMBtnInner.sapMBtnCritical.sapMToggleBtnPressed,
 .sapMBtn:hover .sapMBtnCritical.sapMToggleBtnPressed,
 .sapContrast:hover span.sapMBtnInner.sapMBtnCritical.sapMToggleBtnPressed,
-
 .sapMBtn .sapMBtnNegative.sapMToggleBtnPressed,
 .sapContrast span.sapMBtnInner.sapMBtnNegative.sapMToggleBtnPressed,
 .sapMBtn:hover .sapMBtnNegative.sapMToggleBtnPressed,
 .sapContrast:hover span.sapMBtnInner.sapMBtnNegative.sapMToggleBtnPressed,
-
 .sapMBtn .sapMBtnSuccess.sapMToggleBtnPressed,
 .sapContrast span.sapMBtnInner.sapMBtnSuccess.sapMToggleBtnPressed,
 .sapMBtn:hover .sapMBtnSuccess.sapMToggleBtnPressed,
 .sapContrast:hover span.sapMBtnInner.sapMBtnSuccess.sapMToggleBtnPressed,
-
 .sapMBtn .sapMBtnNeutral.sapMToggleBtnPressed,
 .sapContrast span.sapMBtnInner.sapMBtnNeutral.sapMToggleBtnPressed,
 .sapMBtn:hover .sapMBtnNeutral.sapMToggleBtnPressed,
 .sapContrast:hover span.sapMBtnInner.sapMBtnNeutral.sapMToggleBtnPressed {
+
 	.sapMBtnContent,
 	.sapMBtnIcon {
 		color: inherit;
@@ -103,24 +119,24 @@ html.sap-desktop .sapMToggleBtnPressed,
 }
 
 .sapMBtn .sapMBtnEmphasized.sapMToggleBtnPressed {
-	background-color: @sapUiButtonSelectedBackground;
-	color: @sapUiButtonSelectedTextColor;
-	border-color: @sapUiButtonSelectedBorderColor;
+	background-color: var(--sapButton_Selected_Background);
+	color: var(--sapButton_Selected_TextColor);
+	border-color: var(--sapButton_Selected_BorderColor);
 }
 
 span.sapMBtnInner.sapMToggleBtnPressed .sapMBtnIcon,
 span.sapMBtnInner.sapMToggleBtnPressed.sapMBtnTransparent > .sapMBtnIcon,
 html.sap-desktop .sapMToggleBtnPressed.sapMBtnTransparent > .sapMBtnIcon {
-	color: @sapUiButtonSelectedTextColor;
+	color: var(--sapButton_Selected_TextColor);
 }
 
 
 html.sap-desktop .sapMBtn:focus > .sapMBtnEmphasized.sapMToggleBtnPressed.sapMFocusable {
-	border-color:    @sapUiContentFocusColor;
+	border-color: var(--sapContent_FocusColor);
 }
 
-html.sap-desktop .sapMBtn:focus > .sapMBtnEmphasized.sapMToggleBtnPressed.sapMFocusable:not(.sapMBadgeIndicator):after {
-	border-color: @sapUiContentFocusColor;
+html.sap-desktop .sapMBtn:focus > .sapMBtnEmphasized.sapMToggleBtnPressed.sapMFocusable:not(.sapMBadgeIndicator)::after {
+	border-color: var(--sapContent_FocusColor);
 	left: -0.0625rem;
 	top: -0.0625rem;
 	right: -0.0625rem;
@@ -128,13 +144,13 @@ html.sap-desktop .sapMBtn:focus > .sapMBtnEmphasized.sapMToggleBtnPressed.sapMFo
 	border-radius: 0.5rem;
 }
 
-html.sap-desktop .sapMBtn:focus > .sapMToggleBtnPressed.sapMBtnEmphasized.sapMFocusable:not(.sapMBtnActive):not(.sapMToggleBtnPressed):not(.sapMBadgeIndicator):before,
-html.sap-desktop .sapMBtn:focus > .sapMToggleBtnPressed.sapMBtnCritical.sapMFocusable:not(.sapMBtnActive):not(.sapMBadgeIndicator):before,
-html.sap-desktop .sapMBtn:focus > .sapMToggleBtnPressed.sapMBtnNegative.sapMFocusable:not(.sapMBtnActive):not(.sapMBadgeIndicator):before,
-html.sap-desktop .sapMBtn:focus > .sapMToggleBtnPressed.sapMBtnSuccess.sapMFocusable:not(.sapMBtnActive):not(.sapMBadgeIndicator):before {
-	border: 0.125rem solid @sapUiContentFocusColor;
+html.sap-desktop .sapMBtn:focus > .sapMToggleBtnPressed.sapMBtnEmphasized.sapMFocusable:not(.sapMBtnActive):not(.sapMToggleBtnPressed):not(.sapMBadgeIndicator)::before,
+html.sap-desktop .sapMBtn:focus > .sapMToggleBtnPressed.sapMBtnCritical.sapMFocusable:not(.sapMBtnActive):not(.sapMBadgeIndicator)::before,
+html.sap-desktop .sapMBtn:focus > .sapMToggleBtnPressed.sapMBtnNegative.sapMFocusable:not(.sapMBtnActive):not(.sapMBadgeIndicator)::before,
+html.sap-desktop .sapMBtn:focus > .sapMToggleBtnPressed.sapMBtnSuccess.sapMFocusable:not(.sapMBtnActive):not(.sapMBadgeIndicator)::before {
+	border: 0.125rem solid var(--sapContent_FocusColor);
 }
 
 .sapUiSizeCompact .sapMBar-CTX .sapMBtnDefault.sapMBtnInner.sapMToggleBtnPressed:not(.sapMBtnDisabled) {
-	border-color: @sapUiButtonSelectedBorderColor;
+	border-color: var(--sapButton_Selected_BorderColor);
 }

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

@@ -32,7 +32,7 @@
 	line-height: 1;
 }
 
-.sapMToken.sapMTokenSelected::before {
+.sapMToken.sapMTokenSelected:not(.sapMTokenReadOnly)::before {
 	content: '';
 	position: absolute;
 	pointer-events: none;
@@ -57,7 +57,6 @@ html.sap-desktop .sapMToken.sapMTokenSelected:not(.sapMTokenReadOnly):hover {
 
 .sapMToken.sapMTokenReadOnly {
 	padding: 0.25rem 0.3125rem;
-	color: @sapUiContentLabelColor;
 
 	.sapMTokenText {
 		line-height: 1rem;

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

@@ -26,11 +26,6 @@ html.sap-desktop .sapMTokenizer:focus {
 	border-radius: @sapField_BorderCornerRadius;
 }
 
-/* editable tokens in read-only tokenizer */
-.sapMTokenizer.sapMTokenizerReadonly .sapMToken {
-		color: @sapUiContentLabelColor;
-}
-
 .sapMTokenizer.sapMTokenizerReadonly .sapMToken.sapMTokenReadOnly {
 	padding: 0.25rem 0.3125rem;
 }

package/src/sap/m/themes/sap_horizon/ViewSettingsDialog.less

@@ -4,35 +4,39 @@
 /* ========================================= */
 
 @_sap_m_ViewSettingsDialog_HeaderBorderColor: darken(@sapUiGroupContentBackground, 8);
-.sapMVSD .sapMPageHeader{
+
+.sapMVSD .sapMPageHeader {
 	z-index: 2;
+
 	.sapMBarTitleStart .sapMBarPH {
 		padding-left: 0rem;
 	}
 }
 
 .sapMTB.sapMVSDFilterHeaderToolbar {
-	background-color:  @sapUiGroupContentBackground;
+	background-color: var(--sapGroup_ContentBackground);
 	border-bottom: 1px solid @_sap_m_ViewSettingsDialog_HeaderBorderColor;
 	padding-left: 0;
+
 	.sapMBarChild.sapMCb {
+
 		.sapMCbLabel {
-			font-family: @sapUiFontFamily;
-			color: @sapUiGroupTitleTextColor;
+			font-family: var(--sapFontFamily);
+			color: var(--sapGroup_TitleTextColor);
 		}
 	}
 }
 
 .sapMVSD.sapMDialog.sapMPopup-CTX .sapMIBar.sapMHeader-CTX,
 .sapMVSD.sapMDialog.sapMPopup-CTX .sapMIBar.sapMSubHeader-CTX {
-	background-color: @sapUiGroupContentBackground;
+	background-color: var(--sapGroup_ContentBackground);
 }
 
 .sapMVSD .sapMVSDBar {
 	box-shadow: @sapUiShadowHeader;
 }
 
-.sapMVSDBarWithSearch.sapMBar ,
+.sapMVSDBarWithSearch.sapMBar,
 .sapMVSD.sapMDialog.sapMPopup-CTX .sapMIBar.sapMHeader-CTX .sapMVSDBarWithSearch,
 .sapMVSD.sapMDialog.sapMPopup-CTX .sapMIBar.sapMSubHeader-CTX .sapMVSDBarWithSearch {
 	box-shadow: none;

package/src/sap/m/themes/sap_horizon/WheelSlider.less

@@ -1,11 +1,11 @@
-/* ======================================== */
-/* CSS for control sap.m/WheelSlider        */
-/* Horizon theme                            */
-/* ======================================== */
+/* ================================== */
+/* CSS for control sap.m/WheelSlider  */
+/* Horizon theme                      */
+/* ================================== */
 
 @_sap_m_TimePicker_ItemColor: darken(@sapUiListBackground, 3);
 @_sap_m_TimePicker_ItemHoverColor: darken(@sapUiListBackground, 6);
-@_sap_m_TimePicker_ItemBorderColor: @sapUiListBackground;
+@_sap_m_TimePicker_ItemBorderColor: var(--sapList_Background);
 
 .sapMWS:not(:last-child),
 .sapMWS.sapMWSExpanded:not(:last-child) {
@@ -13,51 +13,65 @@
 }
 
 .sapMWS {
+
 	.sapMWSLabel,
 	.sapMWSInner {
 		width: 3rem;
 		height: 2.875rem;
+
 		.sapMWSItem,
 		.sapMWSSelectionFrame {
 			width: 3rem;
 			height: 2.875rem;
 		}
+
 		.sapMWSItem {
 			border-radius: 0.25rem;
-			background: @sapUiActive;
+			background: var(--sapActiveColor);
 			border: 1px solid @_sap_m_TimePicker_ItemBorderColor;
+
 			&:hover {
 				background: darken(@sapUiSelected, 10);
 			}
 		}
 	}
+
 	&.sapMWSExpanded {
+
 		.sapMWSInner {
+
 			.sapMWSItem {
 				background: @_sap_m_TimePicker_ItemColor;
 				border: 1px solid @_sap_m_TimePicker_ItemBorderColor;
+
 				&:hover {
 					background: @_sap_m_TimePicker_ItemHoverColor;
 				}
+
 				&:active {
-					background: @sapUiActive;
-					color: @sapUiContentContrastTextColor;
+					background: var(--sapActiveColor);
+					color: var(--sapContent_ContrastTextColor);
 				}
 
 			}
+
 			.sapMWSSelectionFrame {
-				border: 0.125rem solid @sapUiSelected;
+				border: 0.125rem solid var(--sapSelectedColor);
 				border-radius: 0.25rem;
 				outline:none;
+
 				&:hover {
+
 					+ ul > li.sapMWSItem.sapMWSItemSelected {
 						background: @_sap_m_TimePicker_ItemHoverColor;
 					}
 				}
+
 				&:active {
+
 					& + ul > li.sapMWSItem.sapMWSItemSelected {
-						background: @sapUiActive;
-						color: @sapUiContentContrastTextColor;
+						background: var(--sapActiveColor);
+						color: var(--sapContent_ContrastTextColor);
 					}
 				}
 			}
@@ -66,42 +80,52 @@
 }
 
 .sapUiSizeCompact .sapMWS {
+
 	.sapMWSLabel,
 	.sapMWSInner {
+		width: 3rem;
+		height: 2rem;
+
 		.sapMWSItem,
 		.sapMWSSelectionFrame,
 		.sapMWSExpanded {
 			width: 3rem;
 		}
-		width: 3rem;
-		height: 2rem;
 	}
 }
 
 .sap-phone {
+
 	.sapMWS {
+
 		.sapMWSLabel,
 		.sapMWSInner {
 			width: 3rem;
 			height: 2.875rem;
+
 			.sapMWSItem,
 			.sapMWSSelectionFrame {
 				width: 3rem;
 				height: 2.875rem;
 			}
+
 			.sapMWSItem {
 				border: 1px solid @_sap_m_TimePicker_ItemBorderColor;
 			}
 		}
+
 		&.sapMWSExpanded {
+
 			.sapMWSInner {
+
 				.sapMWSItem {
 					background: @_sap_m_TimePicker_ItemColor;
 					border: 1px solid @_sap_m_TimePicker_ItemBorderColor;
 					width: 3rem;
 				}
+
 				.sapMWSSelectionFrame {
-					outline: 0.125rem solid @sapUiSelected;
+					outline: 0.125rem solid var(--sapSelectedColor);
 					outline-offset: -0.188rem;
 				}
 			}

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

@@ -40,6 +40,7 @@
 .sapFAvatarColorTileIcon {
 	background-color: var(--sapTile_Background);
 	color: var(--sapTile_IconColor);
+	border: 0.0625rem solid var(--sapAvatar_Lite_BorderColor);
 
 	.sapFAvatarInitialsHolder {
 		color: currentColor;
@@ -49,21 +50,33 @@
 .sapFAvatarColorPlaceholder {
 	background-color: var(--sapContent_ImagePlaceholderBackground);
 	color: var(--sapContent_ImagePlaceholderForegroundColor);
+	border: 0.0625rem solid var(--sapAvatar_Lite_BorderColor);
 
 	.sapFAvatarInitialsHolder {
 		color: currentColor;
 	}
 }
 
+.sapFAvatarColorTransparent {
+	background-color: var(--sapAvatar_Lite_Background);
+	border: 0.0625rem solid var(--sapAvatar_Lite_BorderColor);
+}
+
 .generateColor (@accentIndex) {
 	@css-selector: ~"sapFAvatarColorAccent@{accentIndex}"; // Create the css selector string
 	@background-param: ~"sapUiAvatar@{accentIndex}Background"; // Build the color param which is a sapUiAccent
 	@color-param: ~"sapUiAvatar@{accentIndex}TextColor";
+	@hover-color: ~"sapUiAvatar@{accentIndex}HoverBackground";
 
 	// Build the real CSS selector.
 	// The output would be something like this: .sapFAvatar.sapFAvatarColorAccent6 {background-color: #0092d1;}
 	.@{css-selector} {
 		background-color: @@background-param;
+		&.sapFAvatarImage.sapFAvatarFocusable:not(.sapMAvatarPressed):not(.sapMAvatarDisabled):hover,
+		&.sapFAvatarFocusable:not(.sapMAvatarPressed):not(.sapMAvatarDisabled):hover {
+			background-color: @@hover-color;
+			box-shadow: @_sap_m_Avatar_Hover_Box_Shadow_Offset var(--sapAvatar_Hover_BorderColor);
+		}
 	}
 
 	.@{css-selector}.sapFAvatarIcon,

package/src/sap/m/themes/sap_horizon_dark/Button.less

@@ -137,6 +137,7 @@
 /* Custom focus border:                                                 */
 /* ---------------------------------------------------------------------*/
 
+.sapMBtn:focus-visible > .sapMBtnEmphasized.sapMBtnActive.sapMFocusable,
 html.sap-desktop .sapMBtn:focus > .sapMBtnEmphasized.sapMBtnActive.sapMFocusable {
 	border-color: var(--sapContent_FocusColor);
 }
@@ -154,6 +155,7 @@ html.sap-desktop .sapMBtn:focus > .sapMBtnEmphasized.sapMBtnActive.sapMFocusable
 	border-color: var(--sapButton_Success_BorderColor);
 }
 
+.sapMBtn:focus-visible > .sapMFocusable:not(.sapMBadgeIndicator)::before,
 html.sap-desktop .sapMBtn:focus > .sapMFocusable:not(.sapMBadgeIndicator)::before {
 	content: '';
 	position: absolute;
@@ -167,6 +169,10 @@ html.sap-desktop .sapMBtn:focus > .sapMFocusable:not(.sapMBadgeIndicator)::befor
 	border-radius: 0.375rem;
 }
 
+.sapMBtn:focus-visible > .sapMBtnEmphasized.sapMFocusable:not(.sapMBtnActive):not(.sapMToggleBtnPressed):not(.sapMBadgeIndicator)::before,
+.sapMBtn:focus-visible > .sapMBtnCritical.sapMFocusable:not(.sapMBtnActive):not(.sapMBadgeIndicator)::before,
+.sapMBtn:focus-visible > .sapMBtnNegative.sapMFocusable:not(.sapMBtnActive):not(.sapMBadgeIndicator)::before,
+.sapMBtn:focus-visible > .sapMBtnSuccess.sapMFocusable:not(.sapMBtnActive):not(.sapMBadgeIndicator)::before,
 html.sap-desktop .sapMBtn:focus > .sapMBtnEmphasized.sapMFocusable:not(.sapMBtnActive):not(.sapMToggleBtnPressed):not(.sapMBadgeIndicator)::before,
 html.sap-desktop .sapMBtn:focus > .sapMBtnCritical.sapMFocusable:not(.sapMBtnActive):not(.sapMBadgeIndicator)::before,
 html.sap-desktop .sapMBtn:focus > .sapMBtnNegative.sapMFocusable:not(.sapMBtnActive):not(.sapMBadgeIndicator)::before,
@@ -183,6 +189,17 @@ html.sap-desktop .sapMBtn:focus > .sapMBtnSuccess.sapMFocusable:not(.sapMBtnActi
 	text-shadow: var(--sapContent_TextShadow);
 }
 
+.sapMBtn {
+	.sapMBtnCritical,
+	.sapMBtnNegative,
+	.sapMBtnSuccess,
+	.sapMBtnNeutral {
+		&.sapMBtnInner.sapMBtnActive {
+			text-shadow: none;
+		}
+	}
+}
+
 /* ---------------------------------------------------------------------*/
 /* Disabled, hover and active states:                                   */
 /* ---------------------------------------------------------------------*/