/* =============================================================================
   RDH Advanced Search — Frontend Filter UI Enhancement Layer
   Version: 2.0.0
   Strategy: Additive-only; existing selectors extended, never replaced.
   ============================================================================= */

/* -----------------------------------------------------------------------------
   1. FILTER LABEL — BASE STATE
   Refined from plain text to a tappable pill-style interactive control.
   ----------------------------------------------------------------------------- */
.search-page .search-list .filters ul li label {
	background: transparent;
	padding: 5px 12px 5px 6px;
	display: inline-flex;
	align-items: center;
	color: #374151;
	cursor: pointer;
	position: relative;
	font-size: 13.5px;
	font-weight: 500;
	border-radius: 999px;
	transition:
		color 140ms cubic-bezier(.4,0,.2,1),
		background 140ms cubic-bezier(.4,0,.2,1);
	gap: 0;
	line-height: 1.4;
}

/* Subtle hover background to reinforce clickability */
/* .search-page .search-list .filters ul li label:hover {
	color: #111827;
	background: rgba(0,0,0,.04);
} */

/* -----------------------------------------------------------------------------
   2. ACTIVE / SELECTED STATE
   ----------------------------------------------------------------------------- */
.search-page .search-list .filters ul li label.active {
	color: #db5e21;
	/* background: rgba(219,94,33,.06); */
	font-weight: 600;
}

.search-page .search-list .filters ul li label.active:hover {
	color: #db5e21;
	/* background: rgba(219,94,33,.1); */
}

/* -----------------------------------------------------------------------------
   3. CHEVRON SVG ICON
   Smooth rotation + color inheritance
   ----------------------------------------------------------------------------- */
.search-page .search-list .filters ul li label svg {
	transform: rotate(-90deg);
	margin: 2px 8px 0 0;
	flex-shrink: 0;
	transition: transform 140ms cubic-bezier(.4,0,.2,1);
}

.search-page .search-list .filters ul li label svg path {
	stroke: currentColor;
	transition: stroke 140ms cubic-bezier(.4,0,.2,1);
}

/* Rotate arrow when active to indicate selection */
.search-page .search-list .filters ul li label.active svg {
	transform: rotate(-90deg) scale(1.1);
}

.search-page .search-list .filters ul li label.active svg path,
.search-page .search-list .filters ul li label:hover svg path {
	stroke: currentColor;
}

/* -----------------------------------------------------------------------------
   4. HIDDEN CHECKBOX/RADIO INPUT (preserved functionality)
   ----------------------------------------------------------------------------- */
.search-page .search-list .filters ul li label input[type='checkbox'],
.search-page .search-list .filters ul li label input[type='radio'] {
	position: absolute;
	opacity: 0;
	pointer-events: none;
}

/* -----------------------------------------------------------------------------
   5. FOCUS-VISIBLE — keyboard nav support
   ----------------------------------------------------------------------------- */
.search-page .search-list .filters ul li label:focus-within {
	outline: 2px solid #2271b1;
	outline-offset: 2px;
}