.filterflow-sidebar{

    width:280px;
    background:#fff;
    border:1px solid #ddd;
    border-radius:8px;
    padding:20px;
    margin-bottom:30px;

}

.filterflow-title{

    font-size:24px;
    font-weight:700;
    margin-bottom:20px;

}

.filterflow-group{

    margin-bottom:20px;

}

.filterflow-group label{

    display:block;
    font-weight:600;
    margin-bottom:8px;

}

.filterflow-group input{

    width:100%;
    padding:10px;
    border:1px solid #ccc;
    border-radius:6px;

}

.filterflow-clear{

    width:100%;
    padding:12px;
    border:none;
    border-radius:6px;
    cursor:pointer;

}

.filterflow-layout{
    display:flex;
    gap:30px;
    align-items:flex-start;
}

.filterflow-products{
    flex:1;
}

.filterflow-sidebar{
    width:280px;
    flex-shrink:0;
    position:sticky;
    top:20px;
}
.filterflow-divider{

    border-bottom:1px solid #ececec;
    margin:20px 0;

}

/* FilterFlow Color Swatches */

.filterflow-swatches {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-top: 12px;
}


.filterflow-swatch {
	width: 32px;
	height: 32px;
	border-radius: 50%;
	border: 1px solid #ddd;
	background: #fff;
	cursor: pointer;
	padding: 0;
	font-size: 0;
	position: relative;
}


/* FilterFlow Size Buttons */

.filterflow-size-buttons {
	display:flex;
	flex-wrap:wrap;
	gap:8px;
	margin-top:12px;
}


/* FilterFlow Size Circles */

.filterflow-size-buttons {
	display:flex;
	flex-wrap:wrap;
	gap:10px;
	margin-top:12px;
}


.filterflow-size-button {

	width:38px;
	height:38px;

	display:flex;
	align-items:center;
	justify-content:center;

	border-radius:50%;
	border:1px solid #ddd;

	background:#fff;

	cursor:pointer;

	font-size:13px;
	font-weight:500;

	padding:0;

	transition:all .2s ease;

}


.filterflow-size-button:hover {

	border:2px solid #D4AF37;

	transform:scale(1.08);

}


.filterflow-size-button.active {

	background:#D4AF37;

	color:#fff;

	border-color:#D4AF37;

}


/* ======================================
   FilterFlow Category Buttons
====================================== */

.filterflow-category-list {

	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-top: 12px;

}

.filterflow-category-button {

	background: #fff;
	border: 1px solid #ddd;
	border-radius: 20px;

	padding: 8px 14px;

	font-size: 14px;
	font-weight: 500;

	cursor: pointer;

	transition: all .2s ease;

}

.filterflow-category-button:hover {

	border-color: #D4AF37;
	background: #FFF8E8;

}

.filterflow-category-button.active {

	background: #D4AF37;
	border-color: #D4AF37;
	color: #fff;

}