/**
 * Bara de filtre. Culorile vin din paleta Blocksy, deci se adaptează singure
 * la ce alegi în Customizer — nimic hardcodat.
 */

.fu-filtre {
	margin-bottom: 2.5rem;
}

.fu-filtre__grup {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
	margin-bottom: 1rem;
}

/*
 * ⚠️ `display: flex` bate atributul `hidden`, care e doar `display: block` din
 * foaia de stil a browserului. Fără regula asta explicită, JS-ul ar ascunde
 * rândurile de subdomenii fără niciun efect vizibil — aceeași capcană ca la
 * `li[hidden]` din masonry.
 */
.fu-filtre__grup[hidden] {
	display: none;
}

.fu-filtre__buton {
	appearance: none;
	background: transparent;
	border: 1px solid var(--theme-border-color, currentColor);
	border-radius: 2rem;
	color: inherit;
	cursor: pointer;
	font: inherit;
	font-size: 0.875rem;
	line-height: 1.2;
	padding: 0.5rem 1rem;
	transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

.fu-filtre__buton:hover {
	border-color: var(--theme-palette-color-1, currentColor);
	color: var(--theme-palette-color-1, inherit);
}

.fu-filtre__buton.is-activ {
	background: var(--theme-palette-color-4, currentColor);
	border-color: var(--theme-palette-color-4, currentColor);
	color: var(--theme-palette-color-8, #fff);
}

/*
 * Rândul de subdomenii. Vine după rândul de domenii, cu butoane vizibil mai
 * mici: ierarhia trebuie citită dintr-o privire, nu dedusă din poziție.
 */
.fu-filtre__grup--sub {
	margin-top: -0.5rem;
}

.fu-filtre__buton--sub {
	border-style: dashed;
	font-size: 0.8125rem;
	opacity: 0.85;
	padding: 0.35rem 0.85rem;
}

.fu-filtre__buton--sub:hover,
.fu-filtre__buton--sub.is-activ {
	opacity: 1;
}

.fu-filtre__buton--sub.is-activ {
	border-style: solid;
}

.fu-filtre__randul-doi {
	align-items: end;
	display: flex;
	flex-wrap: wrap;
	gap: 1rem;
}

.fu-filtre__camp {
	display: inline-flex;
	flex-direction: column;
	gap: 0.25rem;
}

.fu-filtre__eticheta {
	font-size: 0.75rem;
	letter-spacing: 0.06em;
	opacity: 0.65;
	text-transform: uppercase;
}

.fu-filtre__camp select {
	font: inherit;
	font-size: 0.875rem;
	max-width: 16rem;
	padding: 0.45rem 0.6rem;
}

.fu-filtre__reset {
	appearance: none;
	background: none;
	border: 0;
	color: inherit;
	cursor: pointer;
	font: inherit;
	font-size: 0.8125rem;
	opacity: 0.7;
	padding: 0.5rem 0;
	text-decoration: underline;
	text-underline-offset: 0.2em;
}

.fu-filtre__reset:hover {
	opacity: 1;
}

.fu-filtre__numar {
	font-size: 0.8125rem;
	margin: 1rem 0 0;
	opacity: 0.65;
}

/* Aliniere centrată — comutabilă din „Portofoliu → Afișare". */

.fu-filtre--centru .fu-filtre__grup,
.fu-filtre--centru .fu-filtre__randul-doi {
	justify-content: center;
}

.fu-filtre--centru .fu-filtre__numar {
	text-align: center;
}

/* Fără JS bara n-are ce filtra — ascundem controalele, grila rămâne întreagă. */
.no-js .fu-filtre {
	display: none;
}