/* ================================ */
/* CSS for control sap.m/Tokenizer  */
/* Horizon theme                    */
/* ================================ */

@_sap_m_Tokenizer_OutlineOffset: 0.3125rem;

.sapMTokenizer {
	padding-left: 0.3125rem;
	position: relative;
	display: inline-block;
	white-space: nowrap;
	overflow: hidden;
	box-sizing: border-box;
}

.sapMTokenizer .sapMToken {
	margin-right: 0.3125rem;
	max-width: calc(~"100% - 0.3125rem");
	margin-top: 0.25rem;
}

html.sap-desktop .sapMTokenizer:focus {
	outline: 2px solid @sapContent_FocusColor;
	outline-offset: -0.125rem;
	border-radius: @sapField_BorderCornerRadius;
}

/* editable tokens in read-only tokenizer */
.sapMTokenizer.sapMTokenizerReadonly .sapMToken {
		color: @sapUiContentLabelColor;
}

.sapMTokenizer.sapMTokenizerReadonly .sapMToken.sapMTokenReadOnly {
	padding: 0.25rem 0.3125rem;
}

.sapUiSizeCompact {
	.sapMTokenizer {
		padding-left: 0.25rem;
		&.sapMTokenizerReadonly .sapMToken.sapMTokenReadOnly {
			padding: 0.125rem 0.25rem;
		}
		.sapMToken {
			margin-right: 0.25rem;
		}
	}
}

/* ------------------------------ */
/* Disabled                       */
/* ------------------------------ */

.sapMTokenizer.sapMTokenizerDisabled .sapMToken  {
	&:hover,
	&:focus,
	&.sapMTokenSelected,
	&.sapMTokenSelected:focus,
	&.sapMToken.sapMTokenSelected:hover,
	&.sapMToken:not(.sapMTokenSelected):not(:focus):hover {
		background: @sapButton_TokenBackground;
		cursor: default;
		color: @sapUiBaseText;
		outline: none;
		border: 1px solid @sapButton_TokenBorderColor;
		border-radius: @sapButton_BorderCornerRadius;
		box-shadow: none;
	}

	&:focus:after {
		content: none;
	}

	.sapMTokenText,
	.sapMTokenIcon {
		color: @sapUiBaseText;
	}

	.sapMTokenIcon {
		cursor: default;
	}

}

.sapMTokenizer.sapMTokenizerDisabled .sapMTokenizerIndicator {
	cursor: default;
}

.sapMTokenizer.sapMTokenizerReadonly .sapMTokenizerIndicator,
.sapMTokenizer .sapMTokenizerIndicator {
	color: @sapLinkColor;
}