@openui5/themelib_sap_horizon 1.131.0 → 1.132.0

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

@@ -12,24 +12,24 @@
 @_sap_m_SearchField_ButtonFontSize: 1rem;
 @_sap_m_SearchField_CompactButtonLineHeight: 1.625rem;
 @_sap_m_SearchField_Compact_FormPaddingLeft: 0.5rem;
-@_sap_m_SearchField_ResetIcon: "\e03e";
+@_sap_m_SearchField_ResetIcon: '\e03e';
 @_sap_m_SearchField_Border: none;
 @_sap_m_SearchField_FocusOffset: 0;
 @_sap_m_SearchField_FocusBorderRadius: inherit;
 @_sap_m_SearchField_PlaceholderFontStyle: italic;
-@_sap_m_SearchField_ActiveBackgroundStyle: @sapUiFieldBackgroundStyle;
+@_sap_m_SearchField_ActiveBackgroundStyle: var(--sapField_BackgroundStyle);
 
 .sapMSFF {
-	border-radius: @sapUiFieldBorderCornerRadius;
+	border-radius: var(--sapField_BorderCornerRadius);
 }
 
 .sapMSFDisabled {
-	opacity: @sapUiContentDisabledOpacity;
+	opacity: var(--sapContent_DisabledOpacity);
 }
 
 .sapMSFB {
-	border-radius: @sapUiFieldBorderCornerRadius;
-	color: @sapUiFieldTextColor;
+	border-radius: var(--sapField_BorderCornerRadius);
+	color: var(--sapField_TextColor);
 
 	&:first-of-type {
 		margin-left: 0.25rem;
@@ -40,27 +40,27 @@
 	}
 
 	&:hover {
-		box-shadow: @sapUiFieldHoverShadow;
-		background: @sapUiFieldBackgroundStyle;
-		background-color: @sapUiFieldHoverBackground;
+		box-shadow: var(--sapField_Hover_Shadow);
+		background: var(--sapField_BackgroundStyle);
+		background-color: var(--sapField_Hover_Background);
 	}
 
 	&:active,
-	&.sapMSFBA // Firefox specific
-	{
-		box-shadow: @sapUiFieldHoverShadow;
-		color: @sapUiButtonSelectedTextColor;
-		background-color: @sapUiButtonLiteActiveBackground;
+	&.sapMSFBA { /* Firefox specific */
+		box-shadow: var(--sapField_Hover_Shadow);
+		color: var(--sapButton_Selected_TextColor);
+		background-color: var(--sapButton_Lite_Active_Background);
 	}
 }
 
 .sapMSF:not(.sapMSFDisabled):hover .sapMSFF {
-	background-color: @sapUiFieldHoverBackground;
+	background-color: var(--sapField_Hover_Background);
 }
 
 .sapMSF.sapMFocus {
+
 	.sapMSFF {
-		background-color: @sapUiFieldFocusBackground;
+		background-color: var(--sapField_Focus_Background);
 	}
 
 	&:hover .sapMSFF {
@@ -68,6 +68,6 @@
 	}
 
 	.sapMSFB:hover {
-		color: @sapUiButtonSelectedTextColor;
+		color: var(--sapButton_Selected_TextColor);
 	}
-}
+}

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

@@ -7,20 +7,22 @@
 	height: 2.75rem;
 	vertical-align: top;
 	position: relative;
+
 	.sapMSegBBtn {
+
 		.sapMSegBBtnInner {
 			font-size: @sapMFontMediumSize;
-			font-family: @sapFontBoldFamily;
+			font-family: var(--sapFontBoldFamily);
 			height: 2.25rem;
 			line-height: 2.25rem;
 			padding-left: 0.5625rem;
 			padding-right: 0.5625rem;
 			text-align: center;
 			text-shadow: none;
-			color: @sapUiButtonTextColor;
-			border-top: 1px solid @sapUiButtonBorderColor;
+			color: var(--sapButton_TextColor);
+			border-top: 1px solid var(--sapButton_BorderColor);
 			border-left: 1px solid transparent;
-			border-bottom: 1px solid @sapUiButtonBorderColor;
+			border-bottom: 1px solid var(--sapButton_BorderColor);
 			border-right: 1px solid transparent;
 			background-color: transparent;
 			margin-left: 1px;
@@ -28,6 +30,7 @@
 			margin-top: -1px;
 			margin-bottom: -1px;
 		}
+
 		&:not(.sapMSegBBtnMixed) .sapMImg {
 			padding-left: 0.5625rem;
 			padding-right: 0.5625rem;
@@ -36,9 +39,9 @@
 }
 
 .sapMSegB .sapMSegBBtn .sapMSegBBtnInnerWrapper {
-	border-top: 1px solid @sapUiButtonBorderColor;
-	border-bottom: 1px solid @sapUiButtonBorderColor;
-	background-color: @sapUiButtonBackground;
+	border-top: 1px solid var(--sapButton_BorderColor);
+	border-bottom: 1px solid var(--sapButton_BorderColor);
+	background-color: var(--sapButton_Background);
 }
 
 .sapMSegB .sapMSegBBtn {
@@ -46,49 +49,50 @@
 }
 
 .sapMSegBBtn:first-child .sapMSegBBtnInner {
-	border-top-left-radius: @sapUiButtonBorderCornerRadius;
-	border-bottom-left-radius: @sapUiButtonBorderCornerRadius;
-	border-left: 1px solid @sapUiButtonBorderColor;
+	border-top-left-radius: var(--sapButton_BorderCornerRadius);
+	border-bottom-left-radius: var(--sapButton_BorderCornerRadius);
+	border-left: 1px solid var(--sapButton_BorderColor);
 	margin-left: -1px;
 }
 
 .sapMSegBBtn:first-child .sapMSegBBtnInnerWrapper {
-	border-top-left-radius: @sapUiButtonBorderCornerRadius;
-	border-bottom-left-radius: @sapUiButtonBorderCornerRadius;
-	border-left: 1px solid @sapUiButtonBorderColor;
+	border-top-left-radius: var(--sapButton_BorderCornerRadius);
+	border-bottom-left-radius: var(--sapButton_BorderCornerRadius);
+	border-left: 1px solid var(--sapButton_BorderColor);
 }
 
 .sapMSegBBtn.sapMSegBtnLastVisibleButton .sapMSegBBtnInnerWrapper {
-	border-top-right-radius: @sapUiButtonBorderCornerRadius;
-	border-bottom-right-radius: @sapUiButtonBorderCornerRadius;
-	border-right: 1px solid @sapUiButtonBorderColor;
+	border-top-right-radius: var(--sapButton_BorderCornerRadius);
+	border-bottom-right-radius: var(--sapButton_BorderCornerRadius);
+	border-right: 1px solid var(--sapButton_BorderColor);
 }
 
 .sapMSegBBtn.sapMSegBtnLastVisibleButton .sapMSegBBtnInner{
-	border-top-right-radius: @sapUiButtonBorderCornerRadius;
-	border-bottom-right-radius: @sapUiButtonBorderCornerRadius;
-	border-right: 1px solid @sapUiButtonBorderColor;
+	border-top-right-radius: var(--sapButton_BorderCornerRadius);
+	border-bottom-right-radius: var(--sapButton_BorderCornerRadius);
+	border-right: 1px solid var(--sapButton_BorderColor);
 	margin-right: -1px;
 }
 
 html.sap-desktop .sapMSegBBtnFocusable:hover .sapMSegBBtnInner {
-	background: @sapUiButtonHoverBackground;
+	background: var(--sapButton_Hover_Background);
 	border-radius: 0.5rem;
-	border-color: @sapUiButtonHoverBorderColor;
+	border-color: var(--sapButton_Hover_BorderColor);
 }
 
 html.sap-desktop .sapMSegBBtnFocusable.sapMSegBBtnSel:hover .sapMSegBBtnInner {
-	border-color: @sapUiButtonSelectedBorderColor;
+	border-color: var(--sapButton_Selected_BorderColor);
 }
 
 html.sap-desktop .sapMSegBBtnFocusable.sapMBtnActive:hover .sapMSegBBtnInner {
-	border-color: @sapUiButtonHoverBorderColor;
+	border-color: var(--sapButton_Hover_BorderColor);
 }
 
 /* Custom focus outline: */
 html.sap-desktop {
-	.sapMSegBBtn:first-child.sapMSegBBtnFocusable:focus .sapMSegBBtnInner:after {
-		content: "";
+
+	.sapMSegBBtn:first-child.sapMSegBBtnFocusable:focus .sapMSegBBtnInner::after {
+		content: '';
 		position: absolute;
 		box-sizing: border-box;
 		left: 0.125rem;
@@ -96,11 +100,12 @@ html.sap-desktop {
 		right: 0.2rem;
 		bottom: 0.375rem;
 		pointer-events: none;
-		border: 0.125rem solid @sapUiContentFocusColor;
+		border: 0.125rem solid var(--sapContent_FocusColor);
 		border-radius: 0.375rem;
 	}
-	.sapUiSizeCompact .sapMSegBBtn:first-child.sapMSegBBtnFocusable:focus .sapMSegBBtnInner:after,
-	&.sapUiSizeCompact .sapMSegBBtn:first-child.sapMSegBBtnFocusable:focus .sapMSegBBtnInner:after {
+
+	.sapUiSizeCompact .sapMSegBBtn:first-child.sapMSegBBtnFocusable:focus .sapMSegBBtnInner::after,
+	&.sapUiSizeCompact .sapMSegBBtn:first-child.sapMSegBBtnFocusable:focus .sapMSegBBtnInner::after {
 		top: 0.3rem;
 		bottom: 0.3rem;
 	}
@@ -108,8 +113,9 @@ html.sap-desktop {
 
 /* Custom focus outline: */
 html.sap-desktop {
-	.sapMSegBBtn.sapMSegBtnLastVisibleButton.sapMSegBBtnFocusable:focus .sapMSegBBtnInner:after {
-		content: "";
+
+	.sapMSegBBtn.sapMSegBtnLastVisibleButton.sapMSegBBtnFocusable:focus .sapMSegBBtnInner::after {
+		content: '';
 		position: absolute;
 		box-sizing: border-box;
 		left: 0.2rem;
@@ -117,19 +123,21 @@ html.sap-desktop {
 		right: 0.125rem;
 		bottom: 0.375rem;
 		pointer-events: none;
-		border: 0.125rem solid @sapUiContentFocusColor;
+		border: 0.125rem solid var(--sapContent_FocusColor);
 		border-radius: 0.375rem;
 	}
-	.sapUiSizeCompact .sapMSegBBtn.sapMSegBtnLastVisibleButton.sapMSegBBtnFocusable:focus .sapMSegBBtnInner:after,
-	&.sapUiSizeCompact .sapMSegBBtn.sapMSegBtnLastVisibleButton.sapMSegBBtnFocusable:focus .sapMSegBBtnInner:after {
+
+	.sapUiSizeCompact .sapMSegBBtn.sapMSegBtnLastVisibleButton.sapMSegBBtnFocusable:focus .sapMSegBBtnInner::after,
+	&.sapUiSizeCompact .sapMSegBBtn.sapMSegBtnLastVisibleButton.sapMSegBBtnFocusable:focus .sapMSegBBtnInner::after {
 		top: 0.3rem;
 		bottom: 0.3rem;
 	}
 }
 
 html.sap-desktop {
-	.sapMSegBBtnFocusable:focus .sapMSegBBtnInner:after {
-		content: "";
+
+	.sapMSegBBtnFocusable:focus .sapMSegBBtnInner::after {
+		content: '';
 		position: absolute;
 		box-sizing: border-box;
 		left: 0.2rem;
@@ -137,23 +145,26 @@ html.sap-desktop {
 		right: 0.2rem;
 		bottom: 0.375rem;
 		pointer-events: none;
-		border: 0.125rem solid @sapUiContentFocusColor;
+		border: 0.125rem solid var(--sapContent_FocusColor);
 		border-radius: 0.375rem;
 	}
-	.sapUiSizeCompact .sapMSegBBtnFocusable:focus .sapMSegBBtnInner:after,
-	&.sapUiSizeCompact .sapMSegBBtnFocusable:focus .sapMSegBBtnInner:after {
+
+	.sapUiSizeCompact .sapMSegBBtnFocusable:focus .sapMSegBBtnInner::after,
+	&.sapUiSizeCompact .sapMSegBBtnFocusable:focus .sapMSegBBtnInner::after {
 		top: 0.3rem;
 		bottom: 0.3rem;
 	}
 }
 
 .sapMSegB.sapMSegBIcons {
+
 	.sapMSegBBtn.sapMSegBtnLastVisibleButton:not(.sapMSegBBtnMixed) .sapMSegBBtnInner {
 		margin-right: -1px;
 	}
 }
 
 .sapMSegB.sapMSegBIcons {
+
 	.sapMSegBBtn.sapMSegBtnLastVisibleButton:not(.sapMSegBBtnMixed) .sapMSegBBtnInner {
 		margin-right: -1px;
 	}
@@ -161,9 +172,11 @@ html.sap-desktop {
 
 /* Custom focus outline: */
 html.sap-desktop {
+
 	.sapMSegB.sapMSegBIcons {
-		.sapMSegBBtn.sapMSegBBtnFocusable:not(.sapMSegBtnLastVisibleButton):focus .sapMSegBBtnInner:after {
-			content: "";
+
+		.sapMSegBBtn.sapMSegBBtnFocusable:not(.sapMSegBtnLastVisibleButton):focus .sapMSegBBtnInner::after {
+			content: '';
 			position: absolute;
 			box-sizing: border-box;
 			left: 0.2rem;
@@ -171,12 +184,13 @@ html.sap-desktop {
 			right: 0.15rem;
 			bottom: 0.375rem;
 			pointer-events: none;
-			border: 0.125rem solid @sapUiContentFocusColor;
+			border: 0.125rem solid var(--sapContent_FocusColor);
 			border-radius: 0.375rem;
 		}
 	}
-	.sapUiSizeCompact .sapMSegB.sapMSegBIcons .sapMSegBBtn.sapMSegBBtnFocusable:not(.sapMSegBtnLastVisibleButton):focus .sapMSegBBtnInner:after,
-	&.sapUiSizeCompact .sapMSegB.sapMSegBIcons .sapMSegBBtn.sapMSegBBtnFocusable:not(.sapMSegBtnLastVisibleButton):focus .sapMSegBBtnInner:after {
+
+	.sapUiSizeCompact .sapMSegB.sapMSegBIcons .sapMSegBBtn.sapMSegBBtnFocusable:not(.sapMSegBtnLastVisibleButton):focus .sapMSegBBtnInner::after,
+	&.sapUiSizeCompact .sapMSegB.sapMSegBIcons .sapMSegBBtn.sapMSegBBtnFocusable:not(.sapMSegBtnLastVisibleButton):focus .sapMSegBBtnInner::after {
 		top: 0.3rem;
 		bottom: 0.3rem;
 	}
@@ -184,9 +198,11 @@ html.sap-desktop {
 
 /* Custom focus outline: */
 html.sap-desktop {
+
 	.sapMSegB.sapMSegBIcons {
-		.sapMSegBBtn.sapMSegBBtnFocusable:first-child:focus .sapMSegBBtnInner:after {
-			content: "";
+
+		.sapMSegBBtn.sapMSegBBtnFocusable:first-child:focus .sapMSegBBtnInner::after {
+			content: '';
 			position: absolute;
 			box-sizing: border-box;
 			left: 0.15rem;
@@ -194,11 +210,12 @@ html.sap-desktop {
 			right: 0.15rem;
 			bottom: 0.375rem;
 			pointer-events: none;
-			border: 0.125rem solid @sapUiContentFocusColor;
+			border: 0.125rem solid var(--sapContent_FocusColor);
 			border-radius: 0.375rem;
 		}
-		.sapUiSizeCompact .sapMSegBBtn.sapMSegBBtnFocusable:first-child:focus .sapMSegBBtnInner:after,
-		&.sapUiSizeCompact .sapMSegBBtn.sapMSegBBtnFocusable:first-child:focus .sapMSegBBtnInner:after {
+
+		.sapUiSizeCompact .sapMSegBBtn.sapMSegBBtnFocusable:first-child:focus .sapMSegBBtnInner::after,
+		&.sapUiSizeCompact .sapMSegBBtn.sapMSegBBtnFocusable:first-child:focus .sapMSegBBtnInner::after {
 			top: 0.3rem;
 			bottom: 0.3rem;
 		}
@@ -206,14 +223,17 @@ html.sap-desktop {
 }
 
 .sapMSegB.sapMSegBIcons {
+
 	.sapMSegBBtn:not(.sapMSegBBtnMixed) .sapMSegBBtnInner {
 		padding: 0;
 	}
+
 	.sapMSegBBtn.sapMSegBBtnMixed .sapMImg {
 		height: 2.125rem;
 		width: auto;
 		padding-right: 0.375rem;
 	}
+
 	.sapMSegBBtn.sapMSegBBtnMixed .sapUiIcon {
 		padding-left: 0;
 		padding-right: 0.375rem;
@@ -222,59 +242,68 @@ html.sap-desktop {
 }
 
 .sapMSegBBtn.sapMSegBBtnFocusable:active:hover {
+
 	.sapMSegBBtnInner {
-		background: @sapUiButtonSelectedBackground;
-		color: @sapUiButtonSelectedTextColor;
-		border-color: @sapUiButtonSelectedBorderColor;
+		background: var(--sapButton_Selected_Background);
+		color: var(--sapButton_Selected_TextColor);
+		border-color: var(--sapButton_Selected_BorderColor);
 	}
+
 	.sapUiIcon {
-		color: @sapUiButtonSelectedTextColor;
+		color: var(--sapButton_Selected_TextColor);
 	}
 }
 
 .sapMSegBBtn.sapMSegBBtnSel {
+
 	.sapMSegBBtnInner {
-		background: @sapUiButtonSelectedBackground;
-		color: @sapUiButtonSelectedTextColor;
-		border-color: @sapUiButtonSelectedBorderColor;
+		background: var(--sapButton_Selected_Background);
+		color: var(--sapButton_Selected_TextColor);
+		border-color: var(--sapButton_Selected_BorderColor);
 		border-radius: 0.5rem;
 	}
+
 	.sapUiIcon {
-		color: @sapUiButtonSelectedTextColor;
+		color: var(--sapButton_Selected_TextColor);
 	}
 }
 
 .sapMSegBBtn .sapMSegBBtnInnerWrapper {
-	background-color: @sapUiButtonBackground;
+	background-color: var(--sapButton_Background);
 }
 
 .sapMSegBBtn.sapMSegBBtnSel:hover {
+
 	.sapMSegBBtnInner {
-		border-color: @sapUiButtonSelectedBorderColor;
+		border-color: var(--sapButton_Selected_BorderColor);
 	}
 }
 
 .sapMSegBBtnFocusable.sapMBtnActive {
+
 	.sapMSegBBtnInner {
-		background: @sapUiButtonSelectedBackground;
-		color: @sapUiButtonSelectedTextColor;
+		background: var(--sapButton_Selected_Background);
+		color: var(--sapButton_Selected_TextColor);
 	}
-	.sapUiIcon{
-		color: @sapUiButtonSelectedTextColor;
+
+	.sapUiIcon {
+		color: var(--sapButton_Selected_TextColor);
 	}
 }
 
 html.sap-desktop .sapMSegBBtn.sapMSegBBtnFocusable.sapMSegBBtnSel:hover .sapMSegBBtnInner,
 html.sap-desktop .sapMSegBBtnFocusable.sapMBtnActive:hover .sapMSegBBtnInner {
-	background: @sapUiButtonSelectedHoverBackground;
+	background: var(--sapButton_Selected_Hover_Background);
 }
 
 .sapMSegBBtn.sapMSegBBtnFocusable.sapMSegBBtnSel {
+
 	.sapMSegBBtnInner {
-		border-right: 1px solid @sapUiButtonSelectedBorderColor;
+		border-right: 1px solid var(--sapButton_Selected_BorderColor);
 	}
+
 	.sapMSegBBtnInner:hover {
-		border-right: 1px solid @sapUiButtonSelectedHoverBorderColor;
+		border-right: 1px solid var(--sapButton_Selected_Hover_BorderColor);
 	}
 }
 
@@ -290,7 +319,7 @@ html.sap-desktop .sapMSegBBtnFocusable.sapMBtnActive:hover .sapMSegBBtnInner {
 	font-size: 1rem;
 	line-height: 2.125rem;
 	margin-right: 0;
-	color: @sapUiButtonIconColor;
+	color: var(--sapButton_IconColor);
 	vertical-align: top;
 	text-align: center;
 }
@@ -298,7 +327,7 @@ html.sap-desktop .sapMSegBBtnFocusable.sapMBtnActive:hover .sapMSegBBtnInner {
 	padding-right: 0.375rem;
 }
 
-.sapMSegBBtn .sapMBtnIcon:before {
+.sapMSegBBtn .sapMBtnIcon::before {
 	width: 1rem;
 	text-align: center;
 	display: inline-block;
@@ -309,6 +338,7 @@ html.sap-desktop .sapMSegBBtnFocusable.sapMBtnActive:hover .sapMSegBBtnInner {
 }
 
 .sapMSegBIcons:not(.sapMSegBBtnMixed) {
+
 	.sapMImg,
 	.sapUiIcon {
 		padding-left: 0.5625rem;
@@ -317,6 +347,7 @@ html.sap-desktop .sapMSegBBtnFocusable.sapMBtnActive:hover .sapMSegBBtnInner {
 }
 /* Compact size */
 .sapUiSizeCompact {
+
 	.sapMSegBBtn .sapMSegBBtnInner {
 		height: 1.625rem;
 		line-height: 1.5rem;
@@ -347,25 +378,32 @@ html.sap-desktop .sapMSegBBtnFocusable.sapMBtnActive:hover .sapMSegBBtnInner {
 		vertical-align: top;
 	}
 	.sapMSegB {
+
 		.sapMBtnIconLeft {
 			margin-left: 0;
 		}
 	}
+
 	.sapMSegBIcons:not(.sapMSegBBtnMixed) {
+
 		.sapMImg,
 		.sapUiIcon {
 			padding-left: 0.4375rem;
 			padding-right: 0.4375rem;
 		}
 	}
+
 	.sapMSegBIcons {
+
 		.sapMSegBBtn.sapMSegBBtnMixed {
+
 			.sapUiIcon,
 			.sapMImg {
 				padding-left: 0;
 				padding-right: 0.375rem;
 				margin: 0;
 			}
+
 			.sapMImg {
 				height: 1.5rem;
 				width: auto;//1.5rem;
@@ -376,6 +414,6 @@ html.sap-desktop .sapMSegBBtnFocusable.sapMBtnActive:hover .sapMSegBBtnInner {
 
 .sapMSegBBtn.sapMSegBtnLastVisibleButton .sapMSegBBtnInner,
 .sapMSegBBtn.sapMSegBtnLastVisibleButton .sapMSegBBtnInnerWrapper {
-	border-top-right-radius: @sapUiButtonBorderCornerRadius;
-	border-bottom-right-radius: @sapUiButtonBorderCornerRadius;
+	border-top-right-radius: var(--sapButton_BorderCornerRadius);
+	border-bottom-right-radius: var(--sapButton_BorderCornerRadius);
 }

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

@@ -5,36 +5,34 @@
 
 @_sap_m_SelectListItem_Height: 2.5rem;
 @_sap_m_SelectListItem_CompactHeight: 2rem;
-@_sap_m_SelectListItemBelizeFocus_Height: 0.25rem; // 2 borders * 0.0625rem + 2 offsets (top and bottom) * 0.0625rem
+@_sap_m_SelectListItemBelizeFocus_Height: 0.25rem; /* 2 borders * 0.0625rem + 2 offsets (top and bottom) * 0.0625rem */
 
 /* selected */
 .sapMSelectListItemBase.sapMSelectListItemBaseSelected {
-	background: @sapUiListSelectionBackgroundColor;
-	color: @sapUiListTextColor;
-	border-bottom: 0.0625rem solid @sapUiListSelectionBorderColor;
+	background: var(--sapList_SelectionBackgroundColor);
+	color: var(--sapList_TextColor);
+	border-bottom: 0.0625rem solid var(--sapList_SelectionBorderColor);
 
 	&:hover {
-		background: @sapUiListHoverSelectionBackground;
+		background: var(--sapList_Hover_SelectionBackground);
 	}
 }
 
-
 /* pressed */
 html.sap-desktop .sapMSelectListItemBase.sapMSelectListItemBasePressed:focus {
-	outline: 0.0625rem dotted @sapUiContentContrastFocusColor;
+	outline: 0.0625rem dotted var(--sapContent_ContrastFocusColor);
 }
 
 .sapMSelectListItemBase.sapMSelectListItemBasePressed,
 .sapMSelectListItemBase.sapMSelectListItemBaseSelected.sapMSelectListItemBasePressed {
-	background-color: @sapUiListActiveBackground;
-	color: @sapUiListActiveTextColor;
+	background-color: var(--sapList_Active_Background);
+	color: var(--sapList_Active_TextColor);
 }
 
 .sapMSelectListItemBase.sapMSelectListItemBasePressed .sapMSelectListItemIcon {
-	color: @sapUiContentContrastIconColor;
+	color: var(--sapContent_ContrastIconColor);
 }
 
-
 /* disabled */
 .sapMSelectListItemBaseDisabled {
 	opacity: 0.5;
@@ -45,8 +43,8 @@ html.sap-desktop .sapMSelectListItemBase:focus::after,
 .sapMSltPicker-CTX .sapMSelectListItemBaseSelected::after,
 .sapMComboBoxBasePicker-CTX .sapMSelectListItemBaseSelected::after {
 	pointer-events: none;
-	content: "";
-	outline: @sapUiContentFocusWidth @sapUiContentFocusStyle @sapUiContentFocusColor;
+	content: '';
+	outline: var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--sapContent_FocusColor);
 	outline-offset: -0.1875rem;
 	position: absolute;
 	top: 0;
@@ -62,9 +60,9 @@ html.sap-desktop .sapMSelectListItemBase:focus {
 }
 
 .sapMSelectListItemBase {
-	background-color: @sapUiListBackground;
-	border-color: @sapUiListBorderColor;
+	background-color: var(--sapList_Background);
+	border-color: var(--sapList_BorderColor);
 	position: relative;
-	font-size: @sapFontSize;
-	color: @sapUiListTextColor;
+	font-size: var(--sapFontSize);
+	color: var(--sapList_TextColor);
 }

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

@@ -25,10 +25,11 @@ html.sap-desktop .sapMShellCentralBox {
 }
 
 .sapMShellGlobalOuterBackground {
-	background: @sapUiShellBackground;
+	background: var(--sapShell_Background);
 }
 
 html.sap-desktop {
+
 	.sapMShellLogo,
 	.sapMShellAppWidthLimited .sapMShellLogo {
 		margin: 1rem 1rem 0 0;