@openui5/themelib_sap_horizon 1.101.0 → 1.102.2

package/src/sap/f/themes/sap_horizon_hcw/ShellBar.less

@@ -3,13 +3,11 @@
 /* Horizon High Contrast White theme  */
 /* ================?================= */
 
-@_sap_f_Shell_Bar_Copilot_Design: dark; // Possible designs are "dark" and "light"
+.alwaysCozyOverrideByParent(~"sapFShellBar");
 
 .sapFShellBar {
-	height: 2.75rem;
 	box-shadow: inset 0 -0.0625rem 0 0 @sapUiShellBorderColor;
 	.sapFShellBarOTB {
-		height: 2.75rem;
 		background-color: transparent;
 	}
 }
@@ -21,22 +19,418 @@
         border: solid 1px @sapUiGroupContentBorderColor;
         color: @sapUiContentForegroundTextColor;
     }
-}.sapFShellBar .CPImage {
+}
+
+.sapFShellBar .CPImage,
+ .sapFShellBar .sapMIBar.sapMTB .CPImage {
 	.color1 {
 		stop-color: @sapUiContentIconColor;
 	}
 	.color2 {
 		stop-color: @sapUiContentIconColor;
 	}
-	&:focus {
-		outline-width: 0.125rem;
-		outline-offset: -0.375rem;
-	}
-	html[data-sap-ui-browser^="ie"] &:focus:before {
-		border-width: 0.125rem;
-	}
 }
 
 html.sap-desktop .sapMTB-Transparent-CTX .sapMBtnInner.sapMToggleBtnPressed{
 	background-color: @sapUiButtonAttentionActiveBackground;
+}
+
+.sapFShellBarSizeLargeDesktop {
+	padding: 0 3rem;
+}
+
+.sapFShellBarSizeDesktop {
+	padding: 0 2rem;
+}
+
+.sapFShellBar {
+	background: @sapUiShellColor;
+	height: 3.25rem;
+	box-shadow: inset 0 -0.0625rem 0 0 @sapUiShellBorderColor;
+
+	.sapFShellBarOTB.sapMIBar.sapMTB {
+		height: 3.25rem;
+	}
+
+	// Copilot
+	.CPImage,
+	& .sapMIBar.sapMTB .CPImage {
+		&:after {
+			position: absolute;
+			content: "";
+			left: 3px;
+			right: 3px;
+			top: 3px;
+			bottom: 3px;
+			outline: none;
+			pointer-events: none;
+			border-radius: 0.5rem;
+		}
+		&:focus {
+			border-radius: 0.5rem;
+			outline: none;
+			background-color: @sapUiShellActiveBackground;
+			color: @sapUiShellActiveTextColor;
+			&:after {
+				box-shadow: @sapUiContentSelectedShadow;
+			}
+		}
+		&:hover:not(:focus) {
+			background: @sapUiShellHoverBackground;
+			border-radius: 0.5rem;
+			&:after {
+				box-shadow: @sapUiContentInteractionShadow;
+			}
+		}
+		html[data-sap-ui-browser^="ie"] &:focus:before {
+			border-color: @sapUiContentContrastFocusColor;
+		}
+	}
+
+	&.sapMPageHeader .sapMIBar,
+	.sapMIBar {
+		height: 3.25rem;
+	}
+	.sapMBtn:hover > .sapMBtnHoverable.sapMToggleBtnPressed:not(.sapMBtnActive) {
+		border-color: @sapUiShellHoverBackground;
+	}
+	.sapMToggleBtnPressed:not(.sapMBtnDisabled),
+	.sapMTB-Transparent-CTX .sapMBtnInner.sapMToggleBtnPressed:not(.sapMBtnDisabled) {
+		background-color: @sapUiShellActiveBackground;
+		border-color: @sapUiShellActiveBackground;
+	}
+
+	// Avatar
+	.sapFShellBarProfile:focus {
+		border: none;
+	}
+	.sapFShellBarProfile:not(:focus):hover {
+		box-shadow: 0 0 0.125rem 0 fade(@sapContent_ShadowColor, 72);
+		background-color: none;
+	}
+
+	// Mega Menu
+	.sapFSHMegaMenu {
+		color: @sapUiShellTextColor;
+		overflow: visible;
+		font-size: @sapMFontHeader5Size;
+		font-weight: bold;
+
+		.sapMBtn:hover > .sapMBtnHoverable.sapMToggleBtnPressed:not(.sapMBtnActive) {
+			background: @sapUiShellHoverBackground;
+			box-shadow: @sapUiContentInteractionShadow;
+		}
+
+		.sapMBtn:hover > .sapMBtnHoverable.sapMToggleBtnPressed.sapMBtnActive {
+			background: @sapUiShellActiveBackground;
+			color: @sapUiShellActiveTextColor;
+			box-shadow: @sapUiContentSelectedShadow;
+		}
+
+		.sapMBtnInner,
+		.sapMBtnInner::after {
+			font-weight: normal;
+			font-size: 1rem;
+		}
+
+		.sapMBtnInner::after {
+			content: '\e1ef';
+			font-family: 'SAP-icons';
+		}
+	}
+
+	// Home Icon
+	.sapFShellBarHomeIcon {
+		max-height: 2rem;
+
+		&:hover {
+			background: @sapUiShellHoverBackground;
+			box-shadow: @sapUiContentInteractionShadow;
+			border-radius: 0.5rem;
+		}
+
+		&.sapMImgFocusable:focus {
+			border-radius: 0.5rem;
+		}
+	}
+
+	//Second Title
+	.sapFShellBarSecondTitle {
+		font-size: @sapMFontSmallSize;
+		color: @sapUiShellTextColor;
+		text-overflow: ellipsis;
+	}
+
+	// Search
+	.sapFShellBarSearch {
+		max-width: 35rem; // max width of searchField + button width
+
+		.sapMSF {
+			max-width: 35rem;
+		}
+
+		.sapMBtn {
+			padding: 0;
+			margin-left: 0.25rem;
+			position: absolute;
+			right: 0;
+		}
+
+		.sapMSFVal + .sapMBtn .sapMBtnInner {
+			background-color: @sapUiShellActiveBackground;
+
+			.sapMBtnIcon {
+				color: @sapUiShellInteractiveTextColor;
+			}
+		}
+	}
+
+	.sapFShellBarSearch.sapFShellBarSearchFullWidth .sapMBtn:not(.sapFShellBarSearchCancelButton) {
+		right: 3.875rem;
+	}
+
+	.sapFShellBarSearch.sapFShellBarSearchFullWidth .sapFShellBarSearchWrap .sapMSFF .sapMSFB {
+		margin-right: 5.5rem;
+	}
+
+	.sapFShellBarSearch.sapFShellBarSearchFullWidth .sapFShellBarSearchWrap {
+		max-width: 35rem;
+		padding: 0;
+	}
+
+	.sapFShellBarSearch.sapFShellBarSearchFullWidth .sapFShellBarSearchWrap .sapMSF.sapMSFVal form.sapMSFNS:not(.sapMSFReload) {
+		padding-right: 0.5rem;
+	}
+
+	.sapFShellBarSearchWrap {
+		position: relative;
+		.sapMSFF {
+			background: @sapUiUx3ShellHeaderColor;
+			border: 0.0625rem solid @sapUiShellInteractiveBorderColor;
+			border-radius: 0;
+			color: @sapUiShellInteractiveTextColor;
+			height: 2.25rem;
+			font-weight: normal;
+
+			// Clear icon
+			.sapMSFB {
+				border: 1px solid transparent; // prevent jumping when hovering
+				width: 2.125rem;
+				height: 2.125rem;
+				line-height: 2.125rem;
+				font-size: 1rem;
+				text-align: center;
+				padding: 0;
+				right: 0;
+				top: 0;
+				margin-right: 2.125rem;
+			}
+
+			.sapMSFB:hover {
+				box-shadow: none;
+				border: 0.0625rem solid @sapUiShellInteractiveBorderColor;
+				border-radius: 0;
+				height: 2.125rem;
+				color: @sapUiShellInteractiveTextColor;
+			}
+
+			.sapMSFB:active,
+			.sapMSFB.sapMSFBA {
+				background: @sapUiShellActiveBackground;
+				border: 0.0625rem solid @sapUiShellInteractiveBorderColor;
+				box-shadow: none;
+				border-radius: 0;
+				color: @sapUiShellActiveTextColor;
+			}
+		}
+
+		.sapMSF {
+			max-width: 35rem;
+			margin-right: 0;
+		}
+
+		.sapMSF:not(.sapMSFVal) form.sapMSFNS:not(.sapMSFReload) {
+			padding-right: 0.5rem;
+		}
+
+		.sapMSF:not(.sapMSFDisabled):hover .sapMSFF {
+			background-color: @sapUiShellHoverBackground;
+			box-shadow: @sapUiContentInteractionShadow;
+		}
+
+		.sapMBtn .sapMBtnInner {
+			border: 0.0625rem solid @sapUiShellInteractiveBorderColor;
+			border-radius: 0;
+			color: @sapUiShellInteractiveTextColor;
+		}
+
+		.sapMSFI {
+			color: @sapUiFieldPlaceholderTextColor;
+			font-weight: italic;
+		}
+	}
+}
+
+// Overriding styles comming from other controls
+html.sap-desktop .sapFShellBarSearchWrap .sapMBtn:focus > .sapMFocusable:not(.sapMBadgeIndicator):before {
+	border-radius: 1.125rem;
+}
+
+// Resets of sizes for "Compact" mode - controls should remain in cozy mode
+.alwaysCozyOverrideByParent(@controlClass) {
+	.sapUiSizeCompact {
+		.@{controlClass} {
+			height: 3.25rem;
+
+			&.sapMPageHeader .sapMIBar,
+			.sapMIBar {
+				height: 3.25rem;
+			}
+			// sap.m.MegaMenu
+			.sapFSHMegaMenu {
+				height: 2.75rem;
+			}
+			// sap.m.Button
+			.sapMBtn {
+				height: 2.75rem;
+				padding: 0.250rem 0;
+			}
+
+			.sapMBtnInner {
+				height: 2.25rem;
+				min-width: 2.25rem;
+			}
+
+			.sapMBtnInner.sapMBtnText {
+				padding-left: 0.625rem;
+				padding-right: 0.625rem;
+			}
+
+			.sapMBtnContent {
+				line-height: 2.125rem;
+			}
+
+			.sapMBtnIcon {
+				width: 2.125rem;
+				font-size: 1rem;
+				line-height: 2.125rem;
+				max-height: 2.375rem;
+				margin: 0;
+				padding: 0;
+			}
+			.sapMBtnIconLeft + .sapMBtnIconLeft {
+				left: 0;
+			}
+			.sapMBtnText {
+				.sapMBtnIconLeft + .sapMBtnIconLeft {
+					left: 2.875rem;
+				}
+			}
+			.sapMBtnInner > img {
+				width: 2.5rem;
+				margin-top: 0.2rem;
+				margin-left: 0.2rem;
+			}
+
+		  	html.sap-desktop & .sapMTB-Transparent-CTX .sapMBtnInner.sapMToggleBtnPressed, .sapMTB-Transparent-CTX .sapMBtnInner.sapMToggleBtnPressed:not(.sapMBtnDisabled) {
+				background-color: @sapUiShellActiveBackground;
+			}
+
+			// sap.m.MenuButton
+			.sapMMenuBtn.sapMMenuBtnRegular .sapMBtnInner::after {
+				height: 38px; //ie does not accept rem for height in pseudo elements, but it works with px when you zoom
+				line-height: 2.2rem;
+				padding-right: 0.75rem;
+				padding-left: 0.5625rem;
+			}
+			.sapMMenuBtn.sapMMenuBtnRegular .sapMBtnInner:not(.sapMBtnText) {
+				padding-right: 1.625rem;
+			}
+			.sapMMenuBtn.sapMMenuBtnRegular .sapMBtnInner {
+				padding-right: 2rem;
+			}
+			.sapMMenuBtn .sapMBtnIconFirst .sapMBtnIcon {
+				padding-right: 0.75rem;
+			}
+
+			// sap.m.SearchField
+			.sapFShellBarSearch {
+				max-width: 35rem;
+				.sapMSF {
+					max-width: 35rem;
+					margin-right: 0;
+				}
+			}
+
+			.sapFShellBarSearch.sapFShellBarSearchFullWidth .sapMBtn:not(.sapFShellBarSearchCancelButton) {
+				right: 4rem;
+			}
+
+			.sapFShellBarSearch.sapFShellBarSearchFullWidth .sapFShellBarSearchWrap .sapMSFF .sapMSFB {
+				margin-right: 5.625rem;
+			}
+
+			.sapFShellBarSearch.sapFShellBarSearchFullWidth .sapFShellBarSearchWrap {
+				max-width: 35rem;
+				padding: 0;
+			}
+
+			.sapFShellBarSearch.sapFShellBarSearchFullWidth .sapFShellBarSearchWrap .sapMSF.sapMSFVal form.sapMSFNS:not(.sapMSFReload) {
+				padding-right: 0.5rem;
+			}
+
+			.sapFShellBarSearchWrap {
+				.sapMBtn .sapMBtnInner {
+					border-radius: 0;
+				}
+			}
+			.sapMSF {
+				min-width: 7rem;
+				height: 2.75rem;
+				padding: 0.25rem 0;
+				.sapMSFI {
+					height: 2.125rem
+				}
+				.sapMSFF {
+					height: 2.25rem;
+					line-height: 2.125rem;
+					padding-left: 0.625rem;
+				}
+				.sapMSFR:not(.sapMSFNS) {
+					right: 2.375rem;
+				}
+				.sapMSFB {
+					border: 1px solid transparent; // prevent jumping when hovering
+					width: 2.125rem;
+					height: 2.125rem;
+					line-height: 2.125rem;
+					font-size: 1rem;
+					padding: 0;
+					right: 0;
+					top: 0;
+				}
+				.sapMSFB:hover {
+					height: 2.125rem;
+				}
+			}
+			// sap.m.Select
+			.sapMSlt {
+				height: 2.5rem;
+				.sapMSltArrow {
+					line-height: 2.5rem;
+					width: 2.5rem;
+				}
+				.sapMSltLabel {
+					line-height: 2.375rem;
+					padding: 0 3rem 0 0.625rem;
+				}
+				.sapMSelectListItem {
+					line-height: 2.5rem;
+				}
+				.sapMSelectListItemBase {
+					height: 2.5rem;
+				}
+			}
+		}
+	}
 }

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

@@ -8,9 +8,9 @@ html.sap-desktop .sapMList .sapMLIB.sapMALI:not(.sapMLIBActive) {
 }
 
 .sapMList .sapMLIB.sapMALI:focus {
-	outline-offset: -0.2rem;
+	outline-offset: -0.125rem;
 }
 
 .sapMALI > .sapMLIBContent {
-	line-height: 3rem;
+	line-height: 2.75rem;
 }

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

@@ -73,11 +73,10 @@ html.sap-desktop .sapMActionSelectPicker .sapMBtn:not(.sapMBtnDisabled) .sapMBtn
 	border: none;
 }
 
-.sapMActionSelectPicker ul:not(:only-child) .sapMSelectListItemBaseSelected:last-child:after {
-	border-radius:0;
+html.sap-desktop .sapMActionSelectPicker .sapMBtn:not(.sapMBtnDisabled):focus > .sapMBtnInner:before {
+	border-radius: 0;
+	left: 0.125rem;
+	top: 0.125rem;
+	right: 0.125rem;
+	bottom: 0.125rem;
 }
-
-.sapMActionSelectPicker .sapMBtn:last-child:focus .sapMFocusable {
-	border-bottom-left-radius: @sapUiElementBorderCornerRadius;
-	border-bottom-right-radius: @sapUiElementBorderCornerRadius;
-}

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

@@ -3,7 +3,42 @@
 /* Horizon  theme                     */
 /* ================================== */
 
+.sapMActionSheetPopover.sapMPopover {
+	box-shadow: @sapUiContentShadow2;
+}
+
 .sapMActionSheetDialog .sapMBar.sapMHeader-CTX > .sapMBarMiddle > .sapMBarPH > .sapMDialogTitle {
-	color: @sapUiContentContrastTextColor;
-	background: transparent;
+	color: @sapUiPageHeaderTextColor;
+	font-size: @sapMFontHeader5Size;
+	font-weight: bold;
+}
+
+.sapMDialog.sapMActionSheetDialog {
+	background-color: @sapUiPageHeaderBackground;
+	border-top-left-radius: @sapUiElementBorderCornerRadius;
+	border-top-right-radius: @sapUiElementBorderCornerRadius;
+	box-shadow: @sapUiContentShadow3;
+
+	&.sapMDialogPhone .sapMIBar.sapMHeader-CTX {
+		box-shadow: @sapUiContentHeaderShadow;
+		background-color: @sapUiPageHeaderBackground;
+		border-top-left-radius: @sapUiElementBorderCornerRadius;
+		border-top-right-radius: @sapUiElementBorderCornerRadius;
+	}
+
+	&.sapUiPopupWithPadding:not(.sapUiNoContentPadding) .sapMDialogScrollCont {
+		padding: 0;
+	}
+
+	& > .sapMDialogSection {
+		box-shadow: none;
+	}
+
+	&:not(.sapUiResponsiveContentPadding):not(.sapUiContentPadding).sapMDialog-NoFooter .sapMDialogScroll {
+		padding-bottom: 0;
+	}
+}
+
+.sapMActionSheetDialogWithTitle .sapMBarMiddle .sapMBarPH {
+	padding: 0 1rem;
 }

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

@@ -4,18 +4,22 @@
 /* ========================== */
 
 .sapMBar {
-	background-color: transparent;
 	text-shadow: none;
 }
 
-.sapMBarRight,
-.sapMBarPH {
-	padding-right: 0.5rem;
+.sapMBarLeft{
+	padding-left: 1rem;
+	padding-right: 0.25rem;
+}
+
+.sapMBarRight {
+	padding-left: 0.25rem;
+	padding-right: 1rem;
 }
 
-.sapMBarLeft,
 .sapMBarPH {
-	padding-left: 0.5rem;
+	padding-right: 0.25rem;
+	padding-left: 0.25rem;
 }
 
 .sapMBar .sapMBarRight.sapMBarContainer > *:first-child,
@@ -33,7 +37,7 @@
 .sapMBar .sapMBarRight.sapMBarContainer > *:not(:first-child):not(:last-child),
 .sapMBar .sapMBarLeft.sapMBarContainer > *:not(:first-child):not(:last-child),
 .sapMBar .sapMBarMiddle .sapMBarContainer > *:not(:first-child):not(:last-child){
-	margin: 0 0.25rem;
+	margin: 0 0.5rem;
 }
 
 .sapMBar .sapMBarRight.sapMBarContainer > *:first-child:last-child,
@@ -59,10 +63,7 @@
 }
 
 /* in Master page the bar should have a different color shadow only if we don't have subHeader (e.g. another bar) */
-.sapMSplitContainerMaster .sapMIBar .sapMHeader-CTX:only-of-type {
-	box-shadow: inset 0 -0.0625rem @sapUiGroupContentBorderColor;
-}
-
+.sapMSplitContainerMaster .sapMIBar .sapMHeader-CTX:only-of-type,
 /* in Master page the bar should have a different color shadow */
 .sapMSplitContainerMaster .sapMIBar.sapMSubHeader-CTX {
 	box-shadow: inset 0 -0.0625rem @sapUiGroupContentBorderColor;
@@ -75,4 +76,8 @@
 
 html[data-sap-ui-browser^="ff"].sap-desktop .sapMBarTitleAlignAuto .sapMBarPH {
 	justify-content: start;
+}
+
+.sapMIBar-CTX.sapMFooter-CTX {
+	border-top: 0.0625rem solid @sapUiPageFooterBorderColor;
 }

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

@@ -172,7 +172,7 @@ html.sap-desktop .sapMBtn:focus > .sapMFocusable:not(.sapMBadgeIndicator):before
 	border-radius: 0.375rem;
 }
 
-html.sap-desktop .sapMBtn:focus > .sapMBtnEmphasized.sapMFocusable: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(.sapMBadgeIndicator):before,
 html.sap-desktop .sapMBtn:focus > .sapMBtnNegative.sapMFocusable:not(.sapMBadgeIndicator):before,
 html.sap-desktop .sapMBtn:focus > .sapMBtnSuccess.sapMFocusable:not(.sapMBadgeIndicator):before,
@@ -180,7 +180,7 @@ html.sap-desktop .sapMBtn:focus > .sapMBtnNeutral.sapMFocusable:not(.sapMBadgeIn
 	border: 0.125rem solid @sapUiContentContrastFocusColor;
 }
 
-.sapMTB-Transparent-CTX .sapMBtnInner:not(.sapMToggleBtnPressed):not(.sapMBtnEmphasized):not(.sapMBtnAccept):not(.sapMBtnAttention):not(.sapMBtnReject):not(.sapMBtnActive):not(.sapMBtnGhost) {
+.sapMIBar .sapMBtnInner:not(.sapMToggleBtnPressed):not(.sapMBtnEmphasized):not(.sapMBtnAccept):not(.sapMBtnAttention):not(.sapMBtnReject):not(.sapMBtnActive):not(.sapMBtnGhost) {
 	border-color: @sapUiButtonLiteBorderColor;
 }
 
@@ -197,6 +197,26 @@ html.sap-desktop .sapMBtn:focus > .sapMBtnNeutral.sapMFocusable:not(.sapMBadgeIn
 /* (add separators, remove top/bottom border)       */
 /* ------------------------------------------------ */
 
+.sapMIBar .sapMBtn .sapMBtnInner.sapMBtnDefault,
+.sapMIBar .sapMBtn .sapMBtnInner.sapMBtnDefault .sapUiIcon {
+	color: @sapUiButtonLiteTextColor;
+	background-color: @sapUiButtonLiteBackground;
+}
+
+.sapMBtn:hover:not(.sapMBtnDisabled):not(.sapMSBActive) > .sapMBtnHoverable:not(.sapMBtnDisabled):not(.sapMBtnActive):not(.sapMToggleBtnPressed):not(.sapMBtnTransparent) {
+	&.sapMBtnDefault {
+		color: @sapUiButtonLiteTextColor;
+		.sapUiIcon {
+			color: @sapUiButtonLiteTextColor;
+		}
+	}
+}
+
+.sapMIBar .sapMBtnDefault.sapMBtnActive:not(.sapMBtnDisabled):not(.sapMToggleBtnPressed),
+.sapMIBar .sapMBtnTransparent.sapMBtnActive:not(.sapMBtnDisabled):not(.sapMToggleBtnPressed) {
+	border-color: @sapUiButtonLiteBorderColor;
+}
+
 .sapUiSizeCompact .sapMBar-CTX .sapMBtnInner.sapMBtnGhost:not(.sapMBtnDisabled) {
 	background: @sapUiButtonLiteBackground;
 	border: 0.0625rem solid @sapUiButtonBorderColor;
@@ -283,4 +303,16 @@ html.sap-desktop .sapMFooter-CTX .sapMBtnInner.sapMBtnReject {
 
 .sapMBtn:not(.sapMBtnDisabled):hover .sapMBtnInner:not(.sapMBtnActive).sapMBtnAttention {
 	box-shadow: @sapContent_Critical_Shadow;
+}
+
+/* ----------------------*/
+/* Badges                */
+/* ----------------------*/
+
+.sapMBtn .sapMBadge .sapMBadgeIndicator:after {
+	background-color: @sapContent_BadgeBackground;
+	border-color: @sapContent_BadgeBackground;
+	color: @sapContent_BadgeTextColor;
+	font-size: @sapFontSmallSize;
+	text-align: center;
 }

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

@@ -18,30 +18,8 @@
 @_sap_m_Carousel_PageIndicatorWidthSizeL: @_sap_m_Carousel_PageIndicatorWidthSizeS;
 @_sap_m_Carousel_PageIndicatorWidthSizeXL: @_sap_m_Carousel_PageIndicatorWidthSizeS;
 @_sap_m_Carousel_PageIndicatorContainerPadding: 0.5rem;
-
-.sapMCrsl {
-	background-color: @sapUiBaseBG;
-}
-
-/* Carousel controls: HUD */
-.sapMCrslHud a {
-	opacity: 0.5;
-	box-shadow: @sapUiShadowLevel1;
-}
-
-.sapMCrsl .sapMCrslHud a:hover,
-.sapMCrsl .sapMCrslHud a:focus {
-	box-shadow: @sapUiShadowLevel1;
-	border: 1px solid @sapUiButtonBorderColor;
-	background: @sapUiButtonHoverBackground;
-}
-
-.sapMCrsl .sapMCrslHud a:active {
-	box-shadow: @sapUiShadowLevel1;
-	background-color: @sapUiButtonActiveBackground;
-}
-
-.sapMCrslPrev:focus,
-.sapMCrslNext:focus {
-	outline: none;
-}
+@_sap_m_Carousel_ContentArrowBoxShadow: @sapContent_Shadow1;
+@_sap_m_Carousel_BulletInactiveBackground: @sapContent_ForegroundBorderColor;
+@_sap_m_Carousel_BulletInactiveBorderColor: @sapContent_ForegroundBorderColor;
+@_sap_m_Carousel_BulletActiveBackground: @sapContent_Selected_ForegroundColor;
+@_sap_m_Carousel_BulletActiveBorder: @sapContent_Selected_ForegroundColor;