@import '../../stylesheets/_variables.scss';

.woocommerce-marketplace__search {
	grid-area: mktpl-search;
	background: $gutenberg-gray-100;
	border-radius: 2px;
	display: flex;
	height: 40px;
	padding: 4px 8px 4px 12px;

	input[type='search'] {
		all: unset;
		flex-grow: 1;
	}

	&:focus-within {
		background: #fff;
		border: 1.5px solid var(--wp-admin-theme-color, #3858e9);
	}

	@media (width <= $breakpoint-medium) {
		margin: $content-spacing-small;
	}
}

.woocommerce-marketplace__search-button {
	all: unset;
	cursor: pointer;
}