/* WC Advanced Product Search - front-end styles */

/* ------------------------------------------------------------------
 * Brand tokens - matched to the Kudekla header (peach search button,
 * brick-red accent, charcoal text). Adjust these to re-theme
 * everything below in one place.
 * ------------------------------------------------------------------ */
.wcaps-search-form,
.wcaps-search-results-wrap {
	--wcaps-accent: #f6e2d0;         /* peach button background */
	--wcaps-accent-hover: #efd3ba;   /* peach button hover/active */
	--wcaps-text: #262626;           /* charcoal button/body text */
	--wcaps-brand-red: #bf3131;      /* logo red, used sparingly */
	--wcaps-border: #d9d9d9;         /* input border */
	--wcaps-border-focus: #b8b8b8;   /* input border on focus */
	--wcaps-muted: #8a8a8a;          /* placeholder / secondary text */
	--wcaps-radius: 2px;
	--wcaps-font: -apple-system, BlinkMacSystemFont, 'Segoe UI', Poppins, Lato, Helvetica, Arial, sans-serif;
	font-family: var( --wcaps-font );
}

.wcaps-search-results-wrap {
	max-width: 1200px;
	margin: 0 auto;
	padding: 2rem 1rem;
}

.wcaps-search-header {
	margin-bottom: 1.5rem;
}

.wcaps-search-title {
	font-size: 1.5rem;
	font-weight: 600;
	color: var( --wcaps-text );
}

.wcaps-search-layout {
	display: flex;
	gap: 2rem;
	align-items: flex-start;
}

.wcaps-search-sidebar {
	flex: 0 0 240px;
}

.wcaps-search-content {
	flex: 1 1 auto;
	min-width: 0;
}

/* Filter form */

.wcaps-filters {
	display: flex;
	flex-direction: column;
	gap: 1rem;
	padding: 1rem;
	border: 1px solid #e2e2e2;
	border-radius: 6px;
	background: #fafafa;
}

.wcaps-filter-field {
	display: flex;
	flex-direction: column;
	gap: 0.35rem;
}

.wcaps-filter-field label {
	font-size: 0.85rem;
	font-weight: 600;
	color: #333;
}

.wcaps-filter-field select,
.wcaps-price-inputs input {
	padding: 0.6rem 0.65rem;
	border: 1px solid var( --wcaps-border );
	border-radius: var( --wcaps-radius );
	font-size: 0.9rem;
	font-family: inherit;
	color: var( --wcaps-text );
	background: #fff;
	transition: border-color 0.15s ease;
}

.wcaps-filter-field select:focus,
.wcaps-price-inputs input:focus {
	outline: none;
	border-color: var( --wcaps-border-focus );
}

.wcaps-price-inputs {
	display: flex;
	align-items: center;
	gap: 0.4rem;
}

.wcaps-price-inputs input {
	width: 0;
	flex: 1 1 auto;
}

.wcaps-filter-submit {
	padding: 0.65rem 1.25rem;
	border: 1px solid var( --wcaps-accent );
	border-radius: var( --wcaps-radius );
	background: var( --wcaps-accent );
	color: var( --wcaps-text );
	font-weight: 600;
	font-size: 0.85rem;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	cursor: pointer;
	transition: background-color 0.15s ease, border-color 0.15s ease;
}

.wcaps-filter-submit:hover {
	background: var( --wcaps-accent-hover );
	border-color: var( --wcaps-accent-hover );
}

.wcaps-filter-clear {
	text-align: center;
	font-size: 0.8rem;
	color: var( --wcaps-muted );
	text-decoration: underline;
}

.wcaps-filter-clear:hover {
	color: var( --wcaps-brand-red );
}

/* No results */

.wcaps-no-results {
	padding: 2rem 0;
	font-size: 1rem;
	color: #555;
}

/* Search box shortcode - styled to match the site header: a plain
 * bordered input beside a solid peach "SEARCH" button, uppercase,
 * no rounded pill shapes, no drop shadows. */

.wcaps-search-form {
	display: flex;
	gap: 0;
	max-width: 480px;
}

.wcaps-search-input {
	flex: 1 1 auto;
	min-width: 0;
	padding: 0.75rem 1rem;
	border: 1px solid var( --wcaps-border );
	border-right: none;
	border-radius: var( --wcaps-radius ) 0 0 var( --wcaps-radius );
	font-size: 0.95rem;
	font-family: inherit;
	color: var( --wcaps-text );
	background: #fff;
}

.wcaps-search-input::placeholder {
	color: var( --wcaps-muted );
}

.wcaps-search-input:focus {
	outline: none;
	border-color: var( --wcaps-border-focus );
}

.wcaps-search-submit {
	flex: 0 0 auto;
	padding: 0.75rem 1.75rem;
	border: 1px solid var( --wcaps-accent );
	border-radius: 0 var( --wcaps-radius ) var( --wcaps-radius ) 0;
	background: var( --wcaps-accent );
	color: var( --wcaps-text );
	font-weight: 600;
	font-size: 0.85rem;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	cursor: pointer;
	white-space: nowrap;
	transition: background-color 0.15s ease, border-color 0.15s ease;
}

.wcaps-search-submit:hover {
	background: var( --wcaps-accent-hover );
	border-color: var( --wcaps-accent-hover );
}

/* Responsive: stack sidebar above results on small screens */

@media (max-width: 782px) {
	.wcaps-search-layout {
		flex-direction: column;
	}

	.wcaps-search-sidebar {
		flex: 1 1 auto;
		width: 100%;
	}
}
