/* ====================================== */
/* CSS for control sap.m/RatingIndicator  */
/* Horizon High Contrast White theme      */
/* ====================================== */

.sapMRI {

	& {
		margin: 0.75rem 0;
	}

	&:not(.sapMRIDisabled):not(.sapMRIDisplayOnly):not(.sapMRIReadOnly):hover {
		opacity: 0.9;
	}

	.sapMRIUnsel {
		color: var(--sapContent_UnratedColor);
	}

	.sapMRISel {
		color: var(--sapContent_RatedColor);
	}
}

.sapMRI.sapMRIDisplayOnly,
.sapMRI.sapMRIReadOnly {

	.sapMRIIconSel {
		color: var(--sapContent_RatedColor);
	}
	.sapMRIUnsel {
		color: var(--sapContent_UnratedColor);
	}
}

.sapMRIDisabled {
	opacity: 0.4;
}

/* Custom focus outline */
html.sap-desktop .sapMRI:focus:not(.sapMRIDisabled):not(.sapMRIDisplayOnly) {
	outline: var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--sapContent_FocusColor);
	outline-offset: 0.0625rem;
}

.sapMRIIconSel,
.sapMRIIconUnsel,
.sapMRIIconHov,
.sapMRIIconReadOnly {
	font-size: 1.5rem;
}

.sapMRIIconSel,
.sapMRIIconUnsel {
	text-shadow: var(--sapContent_TextShadow);
}

/* As font-size is set as an inline style, we need to override it for horizon only using important */
.sapMRIReadOnly .sapMRIUnsel .sapMRIunratedIcon,
.sapMRIDisplayOnly .sapMRIUnsel .sapMRIunratedIcon,
.sapMRIDisabled .sapMRIUnsel .sapMRIunratedIcon {
	font-size: 75% !important;
	vertical-align: baseline;
}

.sapUiSizeCompact {

	&.sapMRIReadOnly .sapMRIUnsel .sapMRIunratedIcon,
	&.sapMRIReadOnly .sapMRIIconSel .sapMRIunratedIcon,
	&.sapMRIDisplayOnly .sapMRIUnsel .sapMRIunratedIcon,
	&.sapMRIDisplayOnly .sapMRIIconSel .sapMRIunratedIcon,
	&.sapMRIDisabled .sapMRIUnsel .sapMRIunratedIcon,
	&.sapMRIDisabled .sapMRIIconSel .sapMRIunratedIcon {
		font-size: 75% !important;
		vertical-align: baseline;
	}

	& .sapMRISel,
	& .sapMRIUnselWrapper {
		height: 100%;
	}
}