.wp-block-academy-course-search {
	display: flex;
	align-items: stretch;
	gap: 0.5em;
	box-sizing: border-box;
	max-width: 100%;
}

/* With a width set, the box sits on the left, centre or right of its row. */
.wp-block-academy-course-search.is-justified-center {
	margin-inline: auto;
}

.wp-block-academy-course-search.is-justified-right {
	margin-inline-start: auto;
	margin-inline-end: 0;
}

.academy-course-search__input {
	flex: 1 1 auto;
	min-width: 0;
	padding: 0.6em 0.8em;
	border: 1px solid var(--academy-border-color, #d8dbe2);
	border-radius: 6px;
	background: var(--academy-surface-color, #fff);
	color: inherit;
	font: inherit;
}

.academy-course-search__button {
	flex: none;
}

/* Style presets. */
.wp-block-academy-course-search.is-style-rounded .academy-course-search__input,
.wp-block-academy-course-search.is-style-rounded .academy-course-search__button {
	border-radius: 999px;
}

.wp-block-academy-course-search.is-style-rounded .academy-course-search__input {
	padding-inline: 1.1em;
}

.wp-block-academy-course-search.is-style-underline .academy-course-search__input {
	padding-inline: 0;
	border-width: 0 0 2px;
	border-radius: 0;
	background: transparent;
}

.wp-block-academy-course-search.is-style-underline .academy-course-search__input:focus {
	border-color: var(--academy-primary-color, currentColor);
	outline: none;
}

.wp-block-academy-course-search.is-style-joined {
	gap: 0;
}

.wp-block-academy-course-search.is-style-joined.has-button .academy-course-search__input {
	border-start-end-radius: 0;
	border-end-end-radius: 0;
}

.wp-block-academy-course-search.is-style-joined .academy-course-search__button {
	border-start-start-radius: 0;
	border-end-start-radius: 0;
}

/* In the editor the preview sits inside the block's own wrapper: let it take
   the whole row so a percentage width means the same as on the page. */
.wp-block-academy-course-search > div[inert] {
	flex: 1 1 100%;
	min-width: 0;
}