/* ================================== */
/* CSS for control sap.m/RangeSlider  */
/* Horizon High Contrast Black theme  */
/* ================================== */

@_sap_m_RangeSlider_Handle_Height: 1.5rem;
@_sap_m_RangeSlider_Handle_Width: 2rem;
@_sap_m_RangeSlider_Handle_Height_Compact: 1.25rem;
@_sap_m_RangeSlider_Handle_Width_Compact: 1.5rem;

/* overlap */
.sapMSliderHandle.sapMSliderHandleOverlap {
	border: 0.125rem solid darken(@sapUiFieldActiveBorderColor, 5);
}

.sapMRangeSlider.sapMSlider {
	.sapMSliderLabels {
		height: 1rem;

		.sapMSliderRangeLabel {
			width: 2rem;
			font-size: @sapMFontSmallSize;
			color: @sapUiContentLabelColor;
		}
	}
	.sapMSliderInner .sapMSliderHandle {
		background: @sapUiSliderRangeHandleBackground;
		top: -0.6875rem;
	}

	.sapMSliderInner:not(.sapMSliderInnerDisabled) .sapMSliderHandle {
		&:hover {
			background-color: @sapUiSliderHoverHandleBackground;
			border-color: @sapUiSliderHoverHandleBorderColor;
		}

		&.sapMSliderHandlePressed {
			&:not(:focus) {
				background: transparent;
				border: 0.125rem solid @sapUiContentFocusColor;
				outline: none;
				box-shadow: none;
				top: -0.6875rem;
			}
		}

		&:focus {
			background: @sapUiSliderActiveRangeHandleBackground;
			border: 0.125rem solid @sapUiContentFocusColor;
			outline: none;
			box-shadow: none;
			top: -0.6875rem;
		}
	}

	.sapMSliderInner .sapMSliderHandle:not(.sapMSliderHandlePressed):not(.sapMRangeSlider.sapMSlider .sapMSliderInner:not(.sapMSliderInnerDisabled) .sapMSliderHandle:focus):after {
		top: 4px;
	}
}

.sapMRangeSlider .sapMSliderInner::before {
	border: 0.0625rem solid @sapUiContentMeasureIndicatorColor;
	background-color: @sapUiContentMeasureIndicatorColor;
}

.sapUiSizeCompact {
	.sapMRangeSlider.sapMSlider .sapMSliderInner:not(.sapMSliderInnerDisabled) .sapMSliderHandle.sapMSliderHandlePressed {
		&:not(:focus) {
			background: transparent;
			border: 0.125rem solid @sapUiContentFocusColor;
			outline: none;
			box-shadow: none;
			top: -0.5rem;
		}
	}

	.sapMRangeSlider.sapMSlider .sapMSliderInner:not(.sapMSliderInnerDisabled) .sapMSliderHandle:focus {
		background: @sapUiSliderActiveRangeHandleBackground;
		border: 0.125rem solid @sapUiContentFocusColor;
		outline: none;
		box-shadow: none;
		top: -0.5rem;
	}

	.sapMRangeSlider.sapMSlider .sapMSliderInner .sapMSliderHandle {
		top: -0.5rem;
	}

	.sapMRangeSlider.sapMSlider .sapMSliderInner .sapMSliderHandle:not(.sapMSliderHandlePressed):not(.sapMRangeSlider.sapMSlider .sapMSliderInner:not(.sapMSliderInnerDisabled) .sapMSliderHandle:focus):after {
		top: 2px;
		right: 0.25rem;
	}

	.sapMSliderLabels {
		margin: 0.625rem -0.875rem 0 -0.875rem;
	}
}

html.sap-desktop .sapMSliderProgress:focus:before {
	border: @sapUiContentFocusWidth @sapUiContentFocusStyle @sapUiContentFocusColor;
	border-radius: 0.5rem;
	content: "";
	display: block;
	position: absolute;
	height: ~"calc(@{_sap_m_RangeSlider_Handle_Height} + 0.375rem)";
	width: ~"calc(100% + ((@{_sap_m_RangeSlider_Handle_Width}) + 0.375rem))";
	top: ~"calc(-1 * ((@{_sap_m_RangeSlider_Handle_Height} / 2) + 0.1875rem))";
	left: ~"calc(-1 * ((@{_sap_m_RangeSlider_Handle_Width} / 2) + 0.3125rem))";
}

html.sap-desktop .sapUiSizeCompact .sapMSliderProgress:focus:before {
	height: ~"calc(@{_sap_m_RangeSlider_Handle_Height_Compact} + 0.375rem)";
	width: ~"calc(100% + ((@{_sap_m_RangeSlider_Handle_Width_Compact}) + 0.375rem))";
	top: ~"calc(-1 * ((@{_sap_m_RangeSlider_Handle_Height_Compact} / 2) + 0.1875rem))";
	left: ~"calc(-1 * ((@{_sap_m_RangeSlider_Handle_Width_Compact} / 2) + 0.3125rem))";
}