@use '@talend/bootstrap-theme/src/theme/guidelines' as *;
@use '@talend/design-tokens/lib/tokens' as tokens;

// MultiSelect styles
.container {
	color: tokens.$coral-color-neutral-text;
	position: relative;

	// this is the overlaytrigger span
	:global(.tc-action-button-positionned) {
		width: 100%;
	}

	:global(.tc-list-list) {
		padding: 0;
	}
}

.clearall:global(.btn-link.btn-icon-only) {
	position: absolute;
	right: 25px;
	top: 7px;
	padding: 0;
	color: tokens.$coral-color-danger-text;
}

.caret {
	// add this selector to force override of width defined in Icon
	&:global(.tc-svg-icon) {
		position: absolute;
		color: tokens.$coral-color-neutral-icon;
		top: 10px;
		right: 0;
		width: $padding-larger;
		height: $padding-small;
	}
}