.kkart-product-attributes__operator {
	.components-base-control__help {
		@include visually-hidden;
	}

	.components-base-control__label {
		margin-bottom: 0;
		margin-right: 0.5em;
	}
}

.components-panel {
	.kkart-product-attributes__operator.components-base-control {
		margin-top: $gap;

		.components-select-control__input {
			margin-left: 0;
			min-width: 100%;
		}
	}
}

.kkart-search-list__item.kkart-product-attributes__item {
	&.is-searching,
	&.is-skip-level {
		.kkart-search-list__item-prefix::after {
			content: ":";
		}
	}

	&.is-not-active {
		&:hover,
		&:active,
		&:focus {
			background: $white;
		}
	}

	&.is-loading {
		justify-content: center;

		.components-spinner {
			margin-bottom: $gap-small;
		}
	}

	&.depth-0::after {
		margin-left: $gap-smaller;
		content: "";
		height: $gap-large;
		width: $gap-large;
		background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M7.41 15.41L12 10.83l4.59 4.58L18 14l-6-6-6 6z" fill="#{encode-color($gray-700)}" /></svg>');
		background-repeat: no-repeat;
		background-position: center right;
		background-size: contain;
	}

	&.depth-0[aria-expanded="true"]::after {
		background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M7.41 8.59L12 13.17l4.59-4.58L18 10l-6 6-6-6 1.41-1.41z" fill="#{encode-color($gray-700)}" /></svg>');
	}

	&[disabled].depth-0::after {
		margin-left: 0;
		width: auto;
		background: none;
	}
}
