/*
 * Restyle @wordpress/components' ComboboxControl to match the settings
 * design system, and float its suggestions list instead of letting it push
 * the (sticky) header taller — WP's own suggestions-list is a normal flex
 * child of the input's wrapper, not position: absolute.
 *
 * The :focus-within override below cancels the box-shadow ring WP's own
 * input-style__focus mixin adds, leaving just a border-color change —
 * outline stays for forced-colors/high-contrast mode (it's invisible
 * otherwise, so shadow-none doesn't affect it).
 */

.advads-settings-search {
	.components-combobox-control__suggestions-container {
		@apply relative rounded border border-border bg-gray-50 p-0 shadow-none transition-colors;

		&:focus-within {
			@apply border-primary bg-white shadow-none;
		}
	}

	input.components-combobox-control__input {
		@apply w-full bg-transparent py-2 pr-8 pl-9 text-sm;
	}

	.components-form-token-field__suggestions-list {
		@apply absolute top-full right-0 left-0 z-40 mt-1 max-h-96 min-w-0 flex-none overflow-y-auto rounded border border-border bg-white shadow-lg;
	}

	.components-form-token-field__suggestion {
		@apply m-0 min-h-0 p-0;

		&.is-selected {
			@apply bg-gray-50 text-inherit;
		}
	}
}