.crm-field-item-selector__scope {
	--color-background: rgba(82,92,105,.08);
	--color-hover: rgba(82,92,105,.1);
	--color-text: var(--ui-color-text-subtle, #A8ADB4);
	--font-size: var(--ui-font-size-xs, 12px);
	--font-weight: var(--ui-font-weight-semi-bold, 600);
}

.crm-field-item-selector {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: horizontal;
	-webkit-box-direction: normal;
	    -ms-flex-direction: row;
	        flex-direction: row;
	-webkit-box-align: start;
	    -ms-flex-align: start;
	        align-items: flex-start;
	width: 100%;
}

.crm-field-item-selector__values {
	min-height: 21px;
	line-height: var(--ui-font-line-height-xl, 1.62);
}

.crm-field-item-selector__value {
	position: relative;
	display: -webkit-inline-box;
	display: -ms-inline-flexbox;
	display: inline-flex;
	-webkit-box-orient: horizontal;
	-webkit-box-direction: normal;
	    -ms-flex-direction: row;
	        flex-direction: row;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
	padding-right: 10px;
	color: var(--color-text);
	font-size: var(--font-size);
	font-weight: var(--font-weight);
}

.crm-field-item-selector__value:first-child {
	padding-left: 0;
}

.crm-field-item-selector__value.--hidden {
	display: none;
}

.crm-field-item-selector__value.--adding {
	-webkit-animation: crm-field-item-selector__fade-in 450ms linear 0s 1 alternate both;
	        animation: crm-field-item-selector__fade-in 450ms linear 0s 1 alternate both;
}

.crm-field-item-selector__value.--removing {
	-webkit-animation: crm-field-item-selector__fade-out 450ms linear 0s 1 alternate both;
	        animation: crm-field-item-selector__fade-out 450ms linear 0s 1 alternate both;
}

.crm-field-item-selector__value-title {
	padding-right: 4px;
}

.crm-field-item-selector__value-clear-icon {
	position: relative;
	width: 12px;
	height: 12px;
	padding-left: 1px;
	-webkit-mask-image: none;
	        mask-image: none;
	background-color: transparent;
	background-image: url('/bitrix/js/crm/images/crm-cross-gray.svg');
	background-repeat: no-repeat;
	cursor: pointer;
}

/* region Add button */
.crm-field-item-selector__add-btn {
	height: 21px;
	line-height: var(--ui-font-line-height-xl, 1.62);
	border-radius: 64px;
	margin-top: 1px;
	background-color: var(--ui-color-base-04, #F1F4F8);
}

.crm-field-item-selector__add-btn .ui-btn-text {
	padding-left: 5px;
	text-transform: lowercase;
	color: var(--color-text);
	font-size: var(--font-size);
	font-weight: var(--font-weight);
}

.crm-field-item-selector__add-btn .ui-btn-counter {
	margin: 0;
	padding: 0 4px;
	text-transform: lowercase;
	background-color: transparent;
	color: var(--color-text);
	font-size: var(--font-size);
	font-weight: var(--font-weight);
}

.crm-field-item-selector__add-btn.ui-btn.ui-btn-dropdown:before {
	border-color: rgba(var(--ui-color-text-subtle-rgb, var(--crm-timeline__date-pill_caret-color)), 0.54)
}

.crm-field-item-selector-compact-icon {
	display: block;
	width: 20px;
	height: 20px;
	cursor: pointer;
	background-size: contain;
}

.crm-field-item-selector-compact-icon:hover {
	opacity: var(--ui-opacity-80);
}

.crm-field-item-selector-compact-icon.--bell {
	background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='24' height='24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M10.026 18.185l-.003.03a1.991 1.991 0 003.981 0l-.003-.03h-3.975zm6.946-8.483c0-1.74-1.349-4.206-4.027-4.67v-.045A.99.99 0 0011.958 4a.99.99 0 00-.987.987v.046c-2.673.468-4.018 2.932-4.018 4.669 0 1.928.019 3.301.019 4.186 0 .698-1.275 1.624-1.813 1.983a.522.522 0 00-.235.432v.308a.5.5 0 00.5.5H18.5a.5.5 0 00.5-.5v-.308a.522.522 0 00-.235-.432c-.537-.36-1.811-1.285-1.811-1.983 0-.885.018-2.258.018-4.186z' fill='%23959CA4'/%3E%3C/svg%3E");
}

.crm-field-item-selector-compact-icon.--bell.--empty {
	background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='24' height='24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M10.024 18.201l-.001.015a1.991 1.991 0 003.981 0l-.001-.015a.109.109 0 01-.002-.016h-3.975c0 .005 0 .01-.002.016zm6.948-8.5c0-.357-.057-.744-.17-1.14l-8.55 8.55H18.5a.5.5 0 00.5-.5v-.308a.522.522 0 00-.235-.432c-.537-.36-1.811-1.285-1.811-1.983 0-.357.003-.794.006-1.315.006-.77.012-1.722.012-2.871zM15.03 5.943l1.835-1.834a.3.3 0 01.425 0l.796.796a.3.3 0 010 .424L5.513 17.901a.3.3 0 01-.424 0l-.797-.796a.3.3 0 010-.425l2.667-2.666a.646.646 0 00.013-.126c0-.357-.003-.794-.007-1.315-.005-.77-.012-1.722-.012-2.871 0-1.737 1.345-4.2 4.018-4.669v-.046A.99.99 0 0111.958 4a.99.99 0 01.988.987v.044c.82.142 1.514.472 2.085.911z' fill='%23959CA4'/%3E%3C/svg%3E");
}

/* endregion*/

/* region Animations */
@-webkit-keyframes crm-field-item-selector__fade-out {
	0% {
		opacity: 1;
	}

	100% {
		opacity: 0;
	}
}
@keyframes crm-field-item-selector__fade-out {
	0% {
		opacity: 1;
	}

	100% {
		opacity: 0;
	}
}

@-webkit-keyframes crm-field-item-selector__fade-in {
	0% {
		opacity: 0;
	}

	100% {
		opacity: 1;
	}
}

@keyframes crm-field-item-selector__fade-in {
	0% {
		opacity: 0;
	}

	100% {
		opacity: 1;
	}
}
/* endregion*/