.ds-filter-widget {
	--ds-accent: #e0201f;
	--ds-text: #111111;
	--ds-muted: #777777;
	--ds-border: #e5e5e5;
	color: var(--ds-text);
	max-width: 320px;
}

.ds-filter-section {
	border-bottom: 1px solid var(--ds-border);
	padding: 18px 0;
}
.ds-filter-section:first-child {
	padding-top: 0;
}

/* Search */
.ds-search-input {
	width: 100%;
	padding: 10px 12px;
	border: 1px solid var(--ds-border);
	border-radius: 6px;
	font-size: 14px;
	box-sizing: border-box;
}

/* Section title */
.ds-filter-title {
	display: flex;
	justify-content: space-between;
	align-items: center;
	font-weight: 700;
	font-size: 18px;
	cursor: pointer;
	margin-bottom: 14px;
}
.ds-arrow {
	transition: transform 0.2s;
	font-size: 14px;
}
.ds-filter-section.collapsed .ds-filter-body {
	display: none;
}
.ds-filter-section.collapsed .ds-arrow {
	transform: rotate(180deg);
}

/* Category checkboxes */
.ds-cat-row {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 6px 0;
	font-size: 15px;
	cursor: pointer;
}
.ds-cat-row input {
	margin-right: 10px;
	accent-color: var(--ds-accent);
}
.ds-cat-count {
	color: var(--ds-muted);
	font-size: 14px;
}

/* Price slider */
.ds-price-slider {
	position: relative;
	height: 34px;
}
.ds-price-slider input[type="range"] {
	position: absolute;
	width: 100%;
	pointer-events: none;
	-webkit-appearance: none;
	appearance: none;
	background: transparent;
	top: 12px;
	margin: 0;
}
.ds-price-slider input[type="range"]::-webkit-slider-thumb {
	pointer-events: all;
	-webkit-appearance: none;
	appearance: none;
	height: 16px;
	width: 16px;
	border-radius: 50%;
	background: var(--ds-accent);
	cursor: pointer;
	border: 2px solid #fff;
	box-shadow: 0 0 2px rgba(0, 0, 0, 0.4);
}
.ds-price-slider input[type="range"]::-moz-range-thumb {
	pointer-events: all;
	height: 16px;
	width: 16px;
	border-radius: 50%;
	background: var(--ds-accent);
	cursor: pointer;
	border: 2px solid #fff;
	box-shadow: 0 0 2px rgba(0, 0, 0, 0.4);
}
.ds-price-track {
	position: absolute;
	top: 16px;
	height: 4px;
	width: 100%;
	background: #ddd;
	border-radius: 2px;
}
.ds-price-track-fill {
	position: absolute;
	top: 16px;
	height: 4px;
	background: var(--ds-accent);
	border-radius: 2px;
}
.ds-price-footer {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-top: 10px;
	font-size: 14px;
}
.ds-price-filter-btn {
	background: var(--ds-accent);
	color: #fff;
	border: none;
	padding: 8px 16px;
	border-radius: 4px;
	cursor: pointer;
	font-size: 14px;
}