/**
 * Search form styling
 *
 * Styles the SearchWP form ([searchwp_form id=1]) rendered in the header search
 * modal so it matches the site's previous Bootstrap input-group search field
 * (white input flush against an orange "Search" button).
 *
 * SearchWP's own form CSS is not loaded, so its markup (.swp-flex--row,
 * .swp-input, .swp-button) arrives unstyled. These rules target those
 * SearchWP-specific classes only, so the Bootstrap search form still used in
 * the mobile slideout menu is left untouched.
 */

/* Layout: lay the input and button out in a single flush row. */
.searchwp-form .swp-flex--col,
#searchform .swp-flex--col {
	display: flex;
	flex-direction: column;
	width: 100%;
}

.searchwp-form .swp-flex--row,
#searchform .swp-flex--row {
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	gap: 0; /* sit the button flush against the input, like the input-group */
	width: 100%;
}

/* The input wrapper grows to fill the row; the button keeps its natural size. */
.searchwp-form .searchwp-form-input-container,
#searchform .searchwp-form-input-container {
	display: flex;
	flex: 1 1 auto;
	min-width: 0;
}

/* Text input — mirrors the previous Bootstrap .form-control. */
.searchwp-form .swp-input--search,
#searchform .swp-input--search {
	width: 100%;
	height: 38px;
	padding: 6px 12px;
	border: 1px solid #ced4da;
	border-right: 0;
	border-radius: 0;
	background-color: #fff;
	color: #495057;
	font-size: 16px;
	line-height: 24px;
	box-shadow: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
}

.searchwp-form .swp-input--search::placeholder,
#searchform .swp-input--search::placeholder {
	color: #6c757d;
}

.searchwp-form .swp-input--search:focus,
#searchform .swp-input--search:focus {
	outline: 0;
	border-color: #f48f24;
	box-shadow: none;
}

/* Submit button — mirrors the previous .btn.btn-primary (brand orange). */
.searchwp-form .swp-button,
.searchwp-form .search-submit,
#searchform .swp-button,
#searchform .search-submit {
	flex: 0 0 auto;
	height: 38px;
	padding: 6px 24px;
	border: 0;
	border-radius: 0 4px 4px 0;
	background-color: #f48f24;
	color: #fff;
	font-size: 16px;
	font-weight: 700;
	line-height: 24px;
	cursor: pointer;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	transition: background-color 0.15s ease-in-out;
}

.searchwp-form .swp-button:hover,
.searchwp-form .search-submit:hover,
#searchform .swp-button:hover,
#searchform .search-submit:hover,
.searchwp-form .swp-button:focus,
.searchwp-form .search-submit:focus,
#searchform .swp-button:focus,
#searchform .search-submit:focus {
	background-color: #d97b16;
	outline: 0;
}