@include body-class(true) {

	// This styles work with Select2
	.fui-multi-select {

		+ .select2 {
			width: 100% !important;
			display: block;

			* {
				display: block;
			}

			.fui-multi-select {
				min-height: 40px;
				margin: 0;
				padding: 6px 14px;
				border: 1px solid palette( gray, lighter );
				border-radius: $border-radius;
				background-color: palette( silver, light );

				.select2-selection__rendered {
					display: block;
					margin: -2px;
					padding: 0;

					.select2-selection__clear {
						display: none;
					}

					li {
						display: inline-flex;
						margin: 2px;
						font: 500 15px/24px $font;

						&:before, &:after {
							content: none;
						}
					}

					.select2-selection__choice {
						padding: 0 8px;
						border: 1px solid palette( gray, lighter );
						border-radius: $border-radius;
						background-color: palette( silver, light );
						color: palette( gray, dark );
						line-height: 24px;

						.select2-selection__choice__remove {
							margin-right: 4px;
							color: palette( gray, medium );
							transition: 0.2s ease;

							&:hover {
								color: palette( red, default );
							}
						}
					}

					.select2-search--inline {

						.select2-search__field {
							width: 100% !important;
							display: block;
							margin: 0;
							padding: 0;
							color: palette( gray, dark );
							font: 500 15px/26px $font;
							transition: 0.2s ease;
						}
					}
				}
			}
		}
	}
}