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

@_sap_m_Token_TokenPadding: 0.5rem;
@_sap_m_Token_TokenCompactPadding: 0.25rem;
@_sap_m_Token_LeftPadding: 0.3125rem;
@_sap_m_Token_TokenSize: @sapMFontSmallSize + (2 * @_sap_m_Token_TokenPadding) - @_sap_m_Token_LeftPadding;
@_sap_m_Token_TokenCompactSize: @sapMFontSmallSize  + @_sap_m_Token_TokenCompactPadding;

.sapMToken {
	padding-left: @_sap_m_Token_LeftPadding;
	border-radius: 0.25rem;
	color: @sapTextColor;
	font-size: @sapFontSize;
}

html.sap-desktop .sapMToken:not(.sapMTokenReadOnly):hover {
	border: @sapUiButtonBorderWidth solid @sapUiButtonHoverBorderColor;
	background: @sapUiButtonHoverBackground;
}

html.sap-desktop .sapMToken.sapMTokenSelected:not(.sapMTokenReadOnly):hover {
	background: @sapUiButtonSelectedHoverBackground;
	border: @sapUiButtonBorderWidth solid @sapUiButtonSelectedBorderColor;
}

html.sap-desktop .sapMToken:focus {
	outline: @sapUiContentFocusWidth @sapUiContentFocusStyle @sapUiContentFocusColor;
	outline-offset: -0.1875rem;
}

html.sap-desktop .sapMToken {
	&.sapMTokenReadOnly,
	&.sapMTokenReadOnly:hover,
	&.sapMTokenReadOnly.sapMTokenSelected,
	&.sapMTokenReadOnly.sapMTokenSelected:hover {
		color: @sapUiContentLabelColor;
		background: @sapUiFieldReadOnlyBackground;
		border: @sapUiButtonBorderWidth solid @sapUiFieldReadOnlyBorderColor;
	}
}

.sapMToken.sapMTokenReadOnly {
	padding: 0.25rem 0.3125rem;
	color: @sapUiContentLabelColor;

	.sapMTokenText {
		line-height: 1rem;
	}
}

.sapUiSizeCompact .sapMToken.sapMTokenReadOnly {
	padding: 0.125rem 0.25rem;

	.sapMTokenText {
		line-height: 0.875rem;
	}
}