/* -------------------------------------------------------------------------
 * Search bar field ([hec_search_field])
 *
 * !important throughout this file (including the mobile-only rules) is
 * deliberate: Elementor's global Site Settings styles and its element-level
 * resets on button/a/select/ul load after this file and win on cascade
 * order for bare tags even without higher specificity.
 * ---------------------------------------------------------------------- */

.hec-search-widget {
	position: relative !important;
	width: 100% !important;
}

.hec-search-widget__toggle {
	display: none !important;
	align-items: center !important;
	justify-content: center !important;
	width: 40px !important;
	height: 40px !important;
	padding: 0 !important;
	border: 0 !important;
	border-radius: 0 !important;
	background: transparent !important;
	cursor: pointer !important;
	line-height: 0 !important;
}
.hec-searchbar__icon-svg path {
	fill: #1C1C1B !important;
}
.hec-search-widget__toggle:hover .hec-searchbar__icon-svg path {
	fill: #1f5c3d !important;
}

.hec-search-widget__drawer {
	width: 100% !important;
}

.hec-searchbar {
	display: flex !important;
	align-items: center !important;
	gap: 12px !important;
	width: 100% !important;
	background: #fff !important;
	border: 1px solid #d7dcd7 !important;
	border-radius: 10px !important;
	padding: 0 14px !important;
	height: 46px !important;
	box-sizing: border-box !important;
}

.hec-searchbar:focus-within {
	border-color: #1f5c3d !important;
	box-shadow: 0 0 0 3px rgba(31, 92, 61, .12) !important;
}

.hec-searchbar__icon {
	display: inline-flex !important;
	flex: 0 0 auto !important;
	line-height: 0 !important;
}

.hec-searchbar__icon-svg {
	display: block !important;
	width: 20px !important;
	height: 20px !important;
}

.hec-searchbar__divider {
	flex: 0 0 auto !important;
	width: 1px !important;
	height: 24px !important;
	background: #d7dcd7 !important;
}

.hec-searchbar__input {
	flex: 1 1 auto !important;
	border: 0 !important;
	outline: 0 !important;
	background: none !important;
	font-size: 15px !important;
	color: #1f2a24 !important;
	min-width: 0 !important;
	padding: 0 !important;
}

.hec-searchbar__input::placeholder {
	color: #9aa49d !important;
}

.hec-searchbar__input::-webkit-search-cancel-button {
	-webkit-appearance: none !important;
	appearance: none !important;
}

.hec-searchbar__input::-webkit-search-decoration {
	-webkit-appearance: none !important;
	appearance: none !important;
}

.hec-searchbar__close {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	flex: 0 0 auto !important;
	width: 32px !important;
	height: 32px !important;
	padding: 0 !important;
	border: 0 !important;
	border-radius: 0 !important;
	background: transparent !important;
	cursor: pointer !important;
	line-height: 0 !important;
}

.hec-searchbar__close:hover svg path {
	fill: #1f5c3d !important;
}

/* Desktop: always show the search field */
@media (min-width: 1025px) {
	.hec-search-widget__toggle {
		display: none !important;
	}

	.hec-search-widget__drawer {
		display: block !important;
	}

	.hec-search-widget__drawer[hidden] {
		display: block !important;
	}

	.hec-searchbar__close {
		display: none !important;
	}
}

/* Tablet / mobile: icon only, drawer opens below header */
@media (max-width: 1024px) {
	.hec-search-widget {
		width: auto !important;
	}

	.hec-search-widget__toggle {
		display: inline-flex !important;
	}

	.hec-search-widget__drawer {
		position: fixed !important;
		left: 0 !important;
		right: 0 !important;
		z-index: 99997 !important;
		padding: 12px 16px !important;
		background: #fff !important;
		box-shadow: 0 8px 24px rgba(20, 40, 28, .1) !important;
		box-sizing: border-box !important;
	}

	.hec-search-widget__drawer[hidden] {
		display: none !important;
	}

	html.hec-search-open {
		overflow: hidden !important;
	}
}

/* -------------------------------------------------------------------------
 * Live product search dropdown
 * ---------------------------------------------------------------------- */

.hec-search-panel {
	position: absolute !important;
	z-index: 99999 !important;
	box-sizing: border-box !important;
	background: #fff !important;
	border: 1px solid #e6e9e6 !important;
	border-radius: 14px !important;
	box-shadow: 0 18px 48px rgba(20, 40, 28, .16) !important;
	padding: 18px !important;
	max-height: 70vh !important;
	overflow-y: auto !important;
}
.hec-search-panel[hidden] { display: none !important; }

/* Desktop: full-width drop-down panel under the header */
@media (min-width: 1025px) {
	.hec-search-panel {
		border-radius: 0 0 14px 14px !important;
		border-left: 0 !important;
		border-right: 0 !important;
		padding: 26px clamp(24px, 6vw, 120px) !important;
		max-height: 78vh !important;
	}
}

.hec-search-state {
	padding: 22px 8px !important;
	text-align: center !important;
	color: #6b756e !important;
	font-size: 14px !important;
}

.hec-search-grid {
	display: grid !important;
	grid-template-columns: repeat(4, 1fr) !important;
	gap: 18px !important;
}

.hec-search-card {
	display: flex !important;
	flex-direction: column !important;
	gap: 6px !important;
	text-decoration: none !important;
	color: #1f2a24 !important;
}
.hec-search-card__img {
	display: block !important;
	background: #ededed !important;
	border-radius: 10px !important;
	overflow: hidden !important;
	aspect-ratio: 1 / 1 !important;
}
.hec-search-card__img img {
	width: 100% !important;
	height: 100% !important;
	object-fit: cover !important;
	display: block !important;
}
.hec-search-card__title {
	font-size: 14px !important;
	font-weight: 500 !important;
	line-height: 1.3 !important;
	margin-top: 4px !important;
}
.hec-search-card__rating {
	display: flex !important;
	align-items: center !important;
	gap: 6px !important;
	font-size: 12px !important;
	color: #6b756e !important;
}
.hec-search-card__rating .star-rating { font-size: 12px !important; }
.hec-search-card__rating em { font-style: normal !important; }
.hec-search-card__price {
	font-size: 14px !important;
	font-weight: 700 !important;
	color: #1f5c3d !important;
}

.hec-search-all {
	display: inline-block !important;
	margin-top: 16px !important;
	font-size: 14px !important;
	font-weight: 600 !important;
	color: #1f5c3d !important;
	text-decoration: underline !important;
}

@media (max-width: 900px) {
	.hec-search-grid { grid-template-columns: repeat(2, 1fr) !important; }
}
@media (max-width: 520px) {
	.hec-search-grid { grid-template-columns: 1fr !important; }
}

/* -------------------------------------------------------------------------
 * Search results page
 * ---------------------------------------------------------------------- */

/* Buttons (self-contained; account.css isn't loaded here) */
.hec-results .hec-btn {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	border: 1px solid transparent !important;
	border-radius: 8px !important;
	padding: 10px 22px !important;
	font-size: 14px !important;
	cursor: pointer !important;
	background: none !important;
	color: #1f2a24 !important;
	text-decoration: none !important;
	transition: background .15s ease, border-color .15s ease !important;
}
.hec-results .hec-btn--outline { border-color: #1f5c3d !important; color: #1f5c3d !important; background: #fff !important; }
.hec-results .hec-btn--outline:hover { background: #eef4f0 !important; }

.hec-results {
	display: grid !important;
	grid-template-columns: 230px 1fr !important;
	gap: 34px !important;
	max-width: 1200px !important;
	margin: 0 auto !important;
	color: #1f2a24 !important;
}

/* Sidebar filters */
.hec-results__filters { display: flex !important; flex-direction: column !important; }
.hec-filter { border-bottom: 1px solid #e6e9e6 !important; }
.hec-filter__head {
	width: 100% !important;
	display: flex !important;
	align-items: center !important;
	justify-content: space-between !important;
	background: none !important;
	border: 0 !important;
	padding: 16px 2px !important;
	font-size: 15px !important;
	font-weight: 600 !important;
	color: #1f2a24 !important;
	cursor: pointer !important;
}
.hec-filter__toggle { position: relative !important; width: 14px !important; height: 14px !important; flex: 0 0 auto !important; }
.hec-filter__toggle::before,
.hec-filter__toggle::after {
	content: "";
	position: absolute !important;
	background: #6b756e !important;
	transition: opacity .15s ease !important;
}
.hec-filter__toggle::before { top: 6px !important; left: 0 !important; width: 14px !important; height: 2px !important; }
.hec-filter__toggle::after { top: 0 !important; left: 6px !important; width: 2px !important; height: 14px !important; }
.hec-filter__head[aria-expanded="true"] .hec-filter__toggle::after { opacity: 0 !important; }
.hec-filter__body { padding: 2px 2px 18px !important; }
.hec-filter__note { font-size: 12px !important; color: #9aa49d !important; margin: 10px 0 0 !important; }

.hec-filter__swatches { display: flex !important; flex-wrap: wrap !important; gap: 8px !important; }
.hec-filter__pills { display: flex !important; flex-wrap: wrap !important; gap: 8px !important; }

.hec-swatch {
	width: 22px !important;
	height: 22px !important;
	border-radius: 6px !important;
	/* color only — PHP sets background-image inline per swatch; a shorthand
	   `background` !important here would reset that image to none and win
	   over the (non-!important) inline style, flattening every swatch. */
	background-color: #d7dcd7 !important;
	background-size: cover !important;
	background-position: center !important;
	border: 1px solid #DCDCD8 !important;
	cursor: pointer !important;
}
.hec-swatch.is-active { outline: 2px solid #1f5c3d !important; outline-offset: 1px !important; }
.hec-swatch__more { font-size: 12px !important; color: #6b756e !important; align-self: center !important; }

.hec-filter__checks { list-style: none !important; margin: 0 !important; padding: 0 !important; }
.hec-filter__checks li { margin: 0 0 8px !important; }
.hec-filter__checks label { display: flex !important; align-items: center !important; gap: 8px !important; font-size: 13px !important; color: #46514a !important; cursor: pointer !important; }
.hec-filter__checks input { accent-color: #1f5c3d !important; }
.hec-filter__count { margin-left: auto !important; color: #9aa49d !important; font-size: 12px !important; }
.hec-filter__checks--colors { max-height: 180px !important; overflow-y: auto !important; }

.hec-results__apply { width: 100% !important; margin: 8px 0 16px !important; padding: 10px 16px !important; font-size: 16px !important; line-height: 24px !important; }

.hec-size-pill input { display: none !important; }
.hec-size-pill {
	border: 1px solid #d7dcd7 !important;
	background: #fff !important;
	border-radius: 8px !important;
	padding: 7px 12px !important;
	font-size: 13px !important;
	cursor: pointer !important;
	display: inline-flex !important;
}
.hec-size-pill.is-active { border-color: #1f5c3d !important; color: #1f5c3d !important; }

.hec-price__inputs { display: flex !important; align-items: center !important; gap: 10px !important; }
.hec-price__inputs input {
	width: 100% !important;
	box-sizing: border-box !important;
	border: 1px solid #d7dcd7 !important;
	border-radius: 8px !important;
	padding: 9px 10px !important;
	font-size: 14px !important;
}
.hec-price__range { width: 100% !important; margin: 14px 0 12px !important; accent-color: #1f5c3d !important; }
.hec-price__apply { width: 100% !important; padding: 9px 16px !important; font-size: 15px !important; line-height: 22px !important; }

/* Main column */
.hec-results__head { margin-bottom: 18px !important; }
.hec-results__title { font-size: 26px !important; font-weight: 700 !important; margin: 0 0 12px !important; }
.hec-results__bar { display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 16px !important; }
.hec-results__count { font-size: 13px !important; color: #6b756e !important; }
.hec-results__sort { display: flex !important; align-items: center !important; gap: 8px !important; font-size: 13px !important; color: #6b756e !important; }
.hec-results__sort select {
	border: 1px solid #d7dcd7 !important;
	border-radius: 8px !important;
	padding: 8px 30px 8px 12px !important;
	font-size: 13px !important;
	background: #fff !important;
	appearance: none !important;
	background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236b756e' stroke-width='2'%3e%3cpolyline points='6 9 12 15 18 9'/%3e%3c/svg%3e") !important;
	background-repeat: no-repeat !important;
	background-position: right 10px center !important;
	background-size: 14px !important;
}

.hec-results__grid {
	display: grid !important;
	grid-template-columns: repeat(3, 1fr) !important;
	gap: 26px 22px !important;
}

.hec-pcard { display: flex !important; flex-direction: column !important; gap: 7px !important; }
.hec-pcard__media {
	position: relative !important;
	display: block !important;
	background: #ededed !important;
	border-radius: 12px !important;
	overflow: hidden !important;
	aspect-ratio: 1 / 1 !important;
}
.hec-pcard__media img { width: 100% !important; height: 100% !important; object-fit: cover !important; display: block !important; }
.hec-pcard__title { font-size: 15px !important; font-weight: 500 !important; color: #1f2a24 !important; text-decoration: none !important; }
.hec-pcard__rating { display: flex !important; align-items: center !important; gap: 8px !important; font-size: 12px !important; color: #6b756e !important; }
.hec-pcard__rating .star-rating { font-size: 13px !important; color: #f5a623 !important; }

.hec-pcard__bottom { display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 10px !important; }
.hec-pcard__swatches { display: flex !important; align-items: center !important; gap: 5px !important; }
.hec-pcard__swatches .hec-swatch { width: 24px !important; height: 24px !important; border-radius: 4px !important; cursor: default !important; }
.hec-pcard__sizes {
	border: 1px solid #d7dcd7 !important;
	border-radius: 6px !important;
	padding: 3px 8px !important;
	font-size: 11px !important;
	color: #6b756e !important;
	white-space: nowrap !important;
}
.hec-pcard__price { font-size: 15px !important; font-weight: 700 !important; color: #1f5c3d !important; }
.hec-pcard__unit { font-size: 12px !important; font-weight: 400 !important; color: #6b756e !important; }

.hec-results__more { text-align: center !important; margin: 28px 0 6px !important; }
.hec-results__more .hec-btn { display: inline-flex !important; gap: 8px !important; }

.hec-results__pagination { display: flex !important; justify-content: center !important; gap: 8px !important; margin-top: 18px !important; }
.hec-results__pagination .page-numbers {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	min-width: 34px !important;
	height: 34px !important;
	padding: 0 8px !important;
	border-radius: 50% !important;
	font-size: 14px !important;
	color: #1f2a24 !important;
	text-decoration: none !important;
}
.hec-results__pagination .page-numbers.current { background: #1f5c3d !important; color: #fff !important; }
.hec-results__pagination .page-numbers.dots { color: #9aa49d !important; }

.hec-results__empty { padding: 40px 0 !important; color: #6b756e !important; }

@media (max-width: 980px) {
	.hec-results { grid-template-columns: 1fr !important; }
	.hec-results__grid { grid-template-columns: repeat(2, 1fr) !important; }
}

/* Colors smaller on phones: filter swatches + product-card swatches. */
@media (max-width: 600px) {
	.hec-filter__swatches { gap: 6px !important; }
	.hec-swatch {
		width: 18px !important;
		height: 18px !important;
		border-radius: 4px !important;
	}
	.hec-pcard__swatches .hec-swatch {
		width: 16px !important;
		height: 16px !important;
	}
}

@media (max-width: 560px) {
	.hec-results__grid { grid-template-columns: 1fr 1fr !important; }
}

/* -------------------------------------------------------------------------
 * Mobile filters drawer — shared by category archive, brand archive, and
 * this search-results page. #hec-filters-panel / data-hec-filters-* markup
 * is rendered by hec_render_filters_*() in hec-category-archive.php; the
 * open/close behavior lives in search.js (loaded site-wide).
 * ---------------------------------------------------------------------- */

.hec-filters-toggle {
	display: none !important;
	align-items: center !important;
	gap: 8px !important;
	margin: 0 0 16px !important;
	padding: 10px 18px !important;
	border: 1px solid #d7dcd7 !important;
	border-radius: 8px !important;
	background: #fff !important;
	color: #1f2a24 !important;
	font-size: 14px !important;
	font-weight: 600 !important;
	cursor: pointer !important;
}
.hec-filters-toggle::before {
	content: "";
	width: 16px !important;
	height: 12px !important;
	background: #1f2a24 !important;
	clip-path: polygon(0 0, 100% 0, 62% 45%, 62% 100%, 38% 100%, 38% 45%) !important;
}

.hec-filters-backdrop {
	display: none !important;
}

.hec-filters-mobile__head,
.hec-filters-mobile__foot {
	display: none !important;
}

@media (max-width: 900px) {
	.hec-filters-toggle {
		display: inline-flex !important;
	}

	.hec-filters-backdrop[hidden] {
		display: none !important;
	}
	.hec-filters-backdrop {
		display: block !important;
		position: fixed !important;
		inset: 0 !important;
		z-index: 99998 !important;
		background: rgba(20, 24, 20, 0.45) !important;
	}

	#hec-filters-panel {
		position: fixed !important;
		top: 0 !important;
		left: 0 !important;
		bottom: 0 !important;
		z-index: 99999 !important;
		width: min(340px, 86vw) !important;
		max-width: 86vw !important;
		height: 100vh !important;
		height: 100dvh !important;
		margin: 0 !important;
		padding: 0 18px 18px !important;
		background: #fff !important;
		overflow-y: auto !important;
		transform: translateX(-100%) !important;
		transition: transform 0.25s ease !important;
	}
	#hec-filters-panel.is-open {
		transform: translateX(0) !important;
	}

	.hec-filters-mobile__head {
		position: sticky !important;
		top: 0 !important;
		z-index: 1 !important;
		display: flex !important;
		align-items: center !important;
		justify-content: space-between !important;
		margin: 0 -18px 8px !important;
		padding: 16px 18px !important;
		background: #fff !important;
		border-bottom: 1px solid #e6e9e6 !important;
	}
	.hec-filters-mobile__title {
		font-size: 17px !important;
		font-weight: 700 !important;
		color: #1c1c1b !important;
	}
	.hec-filters-mobile__close {
		display: inline-flex !important;
		align-items: center !important;
		justify-content: center !important;
		width: 32px !important;
		height: 32px !important;
		border: none !important;
		border-radius: 50% !important;
		background: #f0ece1 !important;
		color: #1c1c1b !important;
		font-size: 20px !important;
		line-height: 1 !important;
		cursor: pointer !important;
	}

	.hec-filters-mobile__foot {
		position: sticky !important;
		bottom: 0 !important;
		display: block !important;
		margin: 16px -18px 0 !important;
		padding: 12px 18px !important;
		background: #fff !important;
		border-top: 1px solid #e6e9e6 !important;
	}
	.hec-filters-mobile__done {
		display: flex !important;
		width: 100% !important;
		align-items: center !important;
		justify-content: center !important;
		padding: 12px 18px !important;
		border: none !important;
		border-radius: 8px !important;
		background: #1f5c3d !important;
		color: #fff !important;
		font-size: 15px !important;
		font-weight: 600 !important;
		cursor: pointer !important;
	}

	/* The sticky .hec-filters-mobile__foot "Show results" button (a real
	   type="submit" here) replaces this inline one inside the drawer. */
	.hec-results__apply {
		display: none !important;
	}

	/* Colors smaller inside the mobile drawer too. */
	.hec-swatch {
		width: 18px !important;
		height: 18px !important;
	}

	html.hec-filters-open {
		overflow: hidden !important;
	}
}