/**
 * Barra de filtros activos acima da grelha da loja.
 *
 * Visual alinhado com o "Display Active Filters" do Astra
 * (widget_layered_nav_filters): chips em pill com o × da font WooCommerce.
 *
 * @package ParkDosTecidos
 */

.pdt-active-filters {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.5em;
	width: 100%;
	margin: 0 0 1.5rem;
}

.pdt-active-filters__title {
	font-weight: 600;
	font-size: 0.85em;
	text-transform: uppercase;
	letter-spacing: 0.03em;
	opacity: 0.7;
	margin-right: 0.25em;
}

.pdt-active-filters__list {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5em;
	margin: 0;
	padding: 0;
	list-style: none;
}

.pdt-active-filters__chip {
	margin: 0;
	padding: 0;
	list-style: none;
}

/* Pill idêntico ao layered_nav_filters do Astra. */
.pdt-active-filters__remove {
	display: inline-flex;
	align-items: center;
	padding: 0.25em 0.75em;
	background: rgba(245, 245, 245, 0.75);
	border-radius: 20px;
	font-size: 1em;
	line-height: 1.6;
	text-decoration: none;
	color: inherit;
	transition: background-color 0.15s ease;
}

.pdt-active-filters__remove:hover,
.pdt-active-filters__remove:focus {
	background-color: #ececec;
}

/* × da font WooCommerce (o mesmo glifo \e013 que o Astra usa). */
.pdt-active-filters__remove::before {
	font-family: "WooCommerce";
	content: "\e013";
	speak: none;
	font-weight: 400;
	font-variant: normal;
	text-transform: none;
	-webkit-font-smoothing: antialiased;
	margin-right: 0.5em;
	line-height: 1;
	position: relative;
	top: 1px;
	color: #d65d67;
	transition: color 0.15s ease;
}

.pdt-active-filters__remove:hover::before,
.pdt-active-filters__remove:focus::before {
	color: #b3323d;
}

.pdt-active-filters__clear {
	font-size: 0.85em;
	text-decoration: underline;
	color: inherit;
	opacity: 0.75;
	margin-left: 0.25em;
}

.pdt-active-filters__clear:hover,
.pdt-active-filters__clear:focus {
	opacity: 1;
}