.gs-multiselect {
	width: 100%;

	& > div {
		width: 100%;
	}

	.gs-modal & {
		.components-base-control__label {
			color: #3c434a;
			text-transform: none;
			font-size: 14px;
			font-weight: 500;
		}

		.components-combobox-control__suggestions-container {
			position: relative;
			border: 1px solid #ced3d9;
			border-radius: 7px;
			box-shadow: 0 3px 3px 0 #0000000a;

			&:has(.components-form-token-field__suggestions-list) {
				border-bottom-left-radius: 0;
				border-bottom-right-radius: 0;
			}

			.components-flex {
				height: 36px;
				padding: 0 12px;
			}

			.components-combobox-control__input {
				color: #353a40;
				font-size: 14px;
			}

			.components-form-token-field__suggestion {
				min-height: 36px;
				padding: 10px 12px;
				font-size: 14px;
			}
		}

		.components-form-token-field__suggestions-list {
			position: absolute;
			top: 100%;
			left: 0;
			width: calc( 100% + 2px );
			margin-top: 1px;
			margin-left: -1px;
			z-index: 10;
			background-color: #ffffff;
			border: 1px solid #ced3d9;
			border-top: 0;
			border-bottom-left-radius: 7px;
			border-bottom-right-radius: 7px;
			box-shadow: none;
		}

		.gs-multiselect__selected {
			margin-bottom: 8px;

			&:has(button) {
				margin-bottom: 16px;
				padding: 5px;
				border-radius: 7px;
				border: 1px solid #ced3d9;
			}
		}

		.gs-multiselect__selected-option {
			border-radius: 4px;
		}
	}

	&__selected-options {
		display: flex;
		flex-wrap: wrap;
		gap: .3125rem;
	}

	&__selected-option {
		display: inline-flex;
		gap: 3px;
		align-items: center;
		height: auto;
	}

	&__selected-option-icon {
		line-height: 0;

		svg {
			width: 1.1em;
			height: 1.1em;
		}
	}

	&.is-loading {
		.components-combobox-control__suggestions-container {
			// pulse animation
			animation: gs-rule-picker-skeleton 1s ease-in-out infinite;
			pointer-events: none !important;
		}
	}
}