
/* Stamboul Smart Filters 2.1.0 — Unified Light
   All filter rows share one visual grammar:
   control + visual + label + count.
*/
.widget_stamboul_smart_filters,
.ssf2 {
	--ssf2-ink:#1b1d21;
	--ssf2-muted:#6f7580;
	--ssf2-faint:#9aa1ab;
	--ssf2-line:#e5e8ed;
	--ssf2-blue:#2f63ff;
	--ssf2-blue-soft:#f2f6ff;
	--ssf2-soft:#f8f9fb;
	color:var(--ssf2-ink);
}

.scl-native-category-widget {
	display:none !important;
}

/* WoodMart owns the sidebar width. We only make the widget sticky + scrollable. */
.widget_stamboul_smart_filters {
	position:sticky;
	top:94px;
	max-height:calc(100vh - 112px);
	margin:0 !important;
	padding:0 22px 0 0 !important;
	border:0 !important;
	border-right:1px solid var(--ssf2-line);
	background:#fff !important;
}

.ssf2 {
	display:flex;
	flex-direction:column;
	max-height:calc(100vh - 112px);
	background:#fff;
}

.ssf2-top {
	flex:0 0 auto;
	display:flex;
	align-items:center;
	justify-content:space-between;
	gap:12px;
	padding:0 0 16px;
}

.ssf2-top strong {
	display:block;
	font-size:17px;
	line-height:1.1;
	font-weight:680;
	letter-spacing:-.2px;
}

.ssf2-top small {
	display:block;
	margin-top:4px;
	color:var(--ssf2-muted);
	font-size:11px;
	line-height:1;
}

.ssf2-clear {
	padding:4px 0;
	border:0;
	background:transparent;
	color:var(--ssf2-blue);
	font-size:11px;
	font-weight:650;
	text-decoration:underline;
	text-underline-offset:3px;
	cursor:pointer;
}

.ssf2-scroll {
	min-height:0;
	flex:1 1 auto;
	overflow-y:auto;
	overscroll-behavior:contain;
	padding:0 18px 18px 0;
	scrollbar-width:thin;
	scrollbar-color:#d7dbe1 transparent;
}

.ssf2-scroll::-webkit-scrollbar { width:4px; }
.ssf2-scroll::-webkit-scrollbar-track { background:transparent; }
.ssf2-scroll::-webkit-scrollbar-thumb { background:#d7dbe1;border-radius:99px; }

/* Store discovery — compact, optional, never dominates filters. */
.ssf2-discover {
	margin:0 0 22px;
}

.ssf2-departments-toggle {
	width:100%;
	min-height:48px;
	display:flex;
	align-items:center;
	justify-content:space-between;
	gap:12px;
	padding:0 12px;
	border:1px solid var(--ssf2-line);
	border-radius:10px;
	background:#fff;
	color:var(--ssf2-ink);
	text-align:left;
	cursor:pointer;
}

.ssf2-departments-toggle > span {
	min-width:0;
}

.ssf2-departments-toggle strong {
	display:block;
	font-size:12px;
	font-weight:680;
	line-height:1.1;
}

.ssf2-departments-toggle small {
	display:block;
	margin-top:3px;
	color:var(--ssf2-muted);
	font-size:10px;
	line-height:1;
}

.ssf2-departments-toggle > i {
	width:22px;
	height:22px;
	display:flex;
	align-items:center;
	justify-content:center;
	border-radius:50%;
	background:var(--ssf2-soft);
	color:var(--ssf2-muted);
	font-style:normal;
	font-size:15px;
}

.ssf2-departments-list {
	margin-top:7px;
	padding:5px 0;
	border-top:1px solid var(--ssf2-line);
}

.ssf2-department-row {
	min-height:38px;
	display:grid;
	grid-template-columns:30px minmax(0,1fr) auto;
	align-items:center;
	gap:9px;
	padding:3px 4px;
	border-radius:7px;
	color:var(--ssf2-ink) !important;
	text-decoration:none !important;
}

.ssf2-department-row:hover,
.ssf2-department-row.is-current {
	background:var(--ssf2-soft);
}

.ssf2-department-row > span:not(.ssf2-row-visual) {
	font-size:12px;
	font-weight:520;
	line-height:1.2;
}

.ssf2-department-row > i {
	color:var(--ssf2-faint);
	font-style:normal;
	font-size:16px;
}

.ssf2-section {
	margin:0 0 26px;
}

.ssf2-section h3 {
	margin:0 0 10px;
	padding:0;
	color:var(--ssf2-ink);
	font-size:14px;
	line-height:1.15;
	font-weight:700;
	letter-spacing:-.08px;
}

.ssf2-back {
	display:inline-block;
	margin:0 0 8px;
	color:var(--ssf2-blue) !important;
	text-decoration:none !important;
	font-size:11px;
	font-weight:600;
}

/* Unified filter row */
.ssf2-unified-row {
	position:relative;
	width:100%;
	min-height:42px;
	display:grid;
	grid-template-columns:18px 30px minmax(0,1fr) 30px;
	align-items:center;
	gap:8px;
	padding:4px 4px;
	border-radius:7px;
	color:var(--ssf2-ink);
	text-decoration:none !important;
	cursor:pointer;
	transition:background .12s ease;
}

.ssf2-unified-row:hover {
	background:var(--ssf2-soft);
}

.ssf2-unified-row.is-selected {
	background:var(--ssf2-blue-soft);
}

.ssf2-unified-row > input {
	position:absolute;
	opacity:0;
	pointer-events:none;
}

.ssf2-option-name {
	min-width:0;
	color:var(--ssf2-ink);
	font-size:12px;
	line-height:1.2;
	font-weight:500;
	overflow:hidden;
	text-overflow:ellipsis;
}

.ssf2-unified-row small {
	width:30px;
	min-width:30px;
	margin:0;
	color:var(--ssf2-faint);
	font-size:10px;
	font-variant-numeric:tabular-nums;
	text-align:right;
}

.ssf2-row-visual {
	width:30px;
	height:30px;
	display:flex;
	align-items:center;
	justify-content:center;
	overflow:hidden;
	border:1px solid #e1e5eb;
	border-radius:7px;
	background:#fff;
}

.ssf2-row-visual img {
	width:100%;
	height:100%;
	display:block;
	object-fit:contain;
	padding:2px;
}

.ssf2-row-visual b {
	color:#737a84;
	font-size:9px;
	font-weight:700;
	letter-spacing:.05px;
}

.ssf2-color-dot {
	width:18px;
	height:18px;
	display:block;
	border:1px solid rgba(0,0,0,.08);
	border-radius:50%;
}

/* Radio (category navigation) */
.ssf2-radio {
	width:18px;
	height:18px;
	display:block;
	border:1px solid #cbd1dc;
	border-radius:50%;
	background:#fff;
}

.ssf2-radio.is-on {
	border:5px solid var(--ssf2-blue);
}

/* Checkbox */
.ssf2-check {
	width:18px;
	height:18px;
	display:block;
	border:1px solid #cbd1dc;
	border-radius:5px;
	background:#fff;
}

.ssf2-unified-row input:checked + .ssf2-check {
	border-color:var(--ssf2-blue);
	background:var(--ssf2-blue);
	box-shadow:inset 0 0 0 4px #fff;
}

/* Categories */
.ssf2-category-list,
.ssf2-brand-list,
.ssf2-options {
	display:grid;
	gap:1px;
}

.ssf2-category-root {
	margin-bottom:2px;
}

.ssf2-category-root .ssf2-option-name {
	font-weight:650;
}

/* Search */
.ssf2-search {
	height:38px;
	display:flex;
	align-items:center;
	gap:7px;
	margin:0 0 8px;
	padding:0 10px;
	border:1px solid var(--ssf2-line);
	border-radius:7px;
	background:#fff;
	color:#8b9199;
}

.ssf2-search:focus-within {
	border-color:#bcc9e6;
	box-shadow:0 0 0 2px rgba(47,99,255,.06);
}

.ssf2-search input {
	width:100%;
	height:34px !important;
	padding:0 !important;
	border:0 !important;
	outline:0 !important;
	background:transparent !important;
	box-shadow:none !important;
	font-size:12px !important;
	color:var(--ssf2-ink) !important;
}

.ssf2-brand-row.is-search-hidden {
	display:none !important;
}

/* Price remains purpose-built but follows the same light system. */
.ssf2-price-inputs {
	display:grid;
	grid-template-columns:1fr 1fr;
	gap:10px;
	margin-bottom:10px;
}

.ssf2-price-inputs input {
	width:100%;
	height:40px !important;
	padding:0 11px !important;
	border:1px solid #d8dde7 !important;
	border-radius:7px !important;
	background:#fff !important;
	color:var(--ssf2-ink) !important;
	font-size:12px !important;
	box-shadow:none !important;
}

.ssf2-range {
	position:relative;
	height:29px;
	--pct-a:calc((var(--a) - var(--min)) / (var(--max) - var(--min)) * 100%);
	--pct-b:calc((var(--b) - var(--min)) / (var(--max) - var(--min)) * 100%);
}

.ssf2-range-track {
	position:absolute;
	left:8px;
	right:8px;
	top:13px;
	height:3px;
	border-radius:99px;
	background:
		linear-gradient(
			to right,
			#cbd3df 0 var(--pct-a),
			var(--ssf2-blue) var(--pct-a) var(--pct-b),
			#cbd3df var(--pct-b) 100%
		);
}

.ssf2-range input[type="range"] {
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:29px;
	margin:0;
	background:transparent;
	pointer-events:none;
	appearance:none;
	-webkit-appearance:none;
}

.ssf2-range input[type="range"]::-webkit-slider-thumb {
	width:19px;
	height:19px;
	border:1px solid #c7ced9;
	border-radius:50%;
	background:#fff;
	box-shadow:0 2px 6px rgba(30,42,60,.13);
	pointer-events:auto;
	appearance:none;
	-webkit-appearance:none;
	cursor:pointer;
}

.ssf2-range input[type="range"]::-moz-range-thumb {
	width:17px;
	height:17px;
	border:1px solid #c7ced9;
	border-radius:50%;
	background:#fff;
	box-shadow:0 2px 6px rgba(30,42,60,.13);
	pointer-events:auto;
	cursor:pointer;
}

.ssf2-more {
	margin:7px 0 0;
	padding:0;
	border:0;
	background:transparent;
	color:var(--ssf2-ink);
	font-size:11px;
	font-weight:650;
	text-decoration:underline;
	text-underline-offset:3px;
	cursor:pointer;
}

.ssf2-extra {
	display:none;
}

.ssf2-section.is-expanded .ssf2-extra,
.ssf2-category-list.is-expanded .ssf2-extra,
.ssf2-brand-list.is-expanded .ssf2-extra,
.ssf2-options.is-expanded .ssf2-extra {
	display:grid;
}

.ssf2-empty {
	padding:42px 18px;
	border:1px solid var(--ssf2-line);
	border-radius:8px;
	text-align:center;
}

.ssf2-empty strong { display:block;font-size:15px; }
.ssf2-empty p { margin:5px 0 0;color:var(--ssf2-muted);font-size:11px; }

/* Mobile: undo the old cramped sidebar padding. WoodMart owns drawer width. */
@media (max-width:1024px) {
	.widget_stamboul_smart_filters {
		position:static;
		max-height:none;
		padding:14px 18px 26px !important;
		border-right:0;
	}

	.ssf2 {
		max-height:none;
	}

	.ssf2-scroll {
		overflow:visible;
		padding:0;
	}

	.ssf2-unified-row {
		min-height:48px;
		grid-template-columns:20px 34px minmax(0,1fr) 34px;
		gap:10px;
		padding:5px 4px;
	}

	.ssf2-row-visual {
		width:34px;
		height:34px;
		border-radius:8px;
	}

	.ssf2-option-name {
		font-size:14px;
	}

	.ssf2-unified-row small {
		width:34px;
		min-width:34px;
		font-size:12px;
	}

	.ssf2-section h3 {
		font-size:16px;
		margin-bottom:10px;
	}

	.ssf2-departments-toggle {
		min-height:52px;
	}

	.ssf2-departments-toggle strong {
		font-size:14px;
	}

	.ssf2-departments-toggle small {
		font-size:11px;
	}
}

@media (max-width:767px) {
	.ssf2-top strong {
		font-size:18px;
	}
}
