/* PINS Spaces — filter pills + mobile filter UX (collapse/expand + clear) */

/* Filter pill styling. Carries !important to beat the legacy Customizer rule
   `button { background:#CDB264 !important; width:150px; ... }` that hits every
   button element site-wide. */
button.e-filter-item {
	background-color: #ffffff !important;
	width: auto !important;
	height: auto !important;
	margin-top: 0 !important;
	font-family: "Futura", sans-serif !important;
	font-style: normal !important;
	font-size: 14px !important;
	line-height: 1.4 !important;
	letter-spacing: 1px;
	padding: 7px 18px !important;
	color: #39472a !important;
	border-radius: 25px !important;
}

button.e-filter-item:hover:not( [aria-pressed="true"] ) {
	background-color: #dde0d6 !important;
}

button.e-filter-item[aria-pressed="true"] {
	background-color: #39472a !important;
	color: #edeeeb !important;
}

.pins-filter-bar {
	display: none;
}

@media ( max-width: 767px ) {
	.pins-filter-bar {
		display: flex;
		gap: 10px;
		justify-content: center;
		align-items: center;
		width: 100%;
	}

	/* both rules below carry !important to beat the legacy global
	   `button { background:#CDB264 !important; width:150px; ... }`
	   rule in the Customizer's Additional CSS */
	.pins-filter-toggle,
	.pins-filter-clear {
		font-family: "Futura", sans-serif !important;
		font-style: normal !important;
		font-size: 14px !important;
		line-height: 1.4 !important;
		letter-spacing: 1px;
		text-transform: uppercase;
		border-radius: 25px !important;
		padding: 9px 24px !important;
		width: auto !important;
		height: auto !important;
		margin: 0 !important;
		cursor: pointer;
	}

	.pins-filter-toggle {
		background: #39472a !important;
		color: #edeeeb !important;
		border: 1px solid #39472a !important;
	}

	.pins-filter-toggle::after {
		content: " \25BE"; /* ▾ */
	}

	.pins-filter-card.is-open .pins-filter-toggle::after {
		content: " \25B4"; /* ▴ */
	}

	.pins-filter-clear {
		background: transparent !important;
		color: #39472a !important;
		border: 1px solid rgba( 57, 71, 42, 0.45 ) !important;
	}

	.pins-filter-card .pins-filter-group {
		display: none;
	}

	.pins-filter-card.is-open .pins-filter-group {
		display: flex;
	}

	/* wrap pills instead of hiding them behind a sideways scroll */
	.pins-filter-card .e-filter {
		--e-filter-white-space: normal;
		--e-filter-wrap: wrap;
		--e-filter-overflow-x: visible;
	}
}

/* whole space card is clickable */
.e-loop-item {
	cursor: pointer;
	transition: transform 0.25s ease;
}

@media ( hover: hover ) {
	.e-loop-item:hover {
		transform: translateY( -4px );
	}
}