/* Filter button */
#wrapper .store-filter-btn
{
	display: flex;
	line-height: 50px;
	color: #222;
	background-color: #fff;
	border-radius: 5px;
	box-shadow: 0 1px 5px rgba(0, 0, 0, .1);
}

#wrapper .store-filter-btn-reverse
{
	color: #fff;
	background-color: var(--theme-color);
}

#wrapper .store-filter-btn:hover { color: var(--theme-color); }

#wrapper .store-filter-btn-reverse:hover
{
	color: #fff;
	background-color: var(--theme-light-color);
}

#wrapper .store-filter-btn span { color: var(--theme-color); }
#wrapper .store-filter-btn-reverse span { color: #fff; }

/* Submit */
#wrapper .store-submit-filters { width: calc(100% - 130px); }

/* Show */
#wrapper .store-show-filters { margin-bottom: 15px; }

/* Close */
#wrapper .store-close-filters { width: 120px; }
#wrapper .store-close-filters span { color: #b71c1c; }
#wrapper .store-close-filters:hover span { color: #f44336; }

/* Disabled */
#wrapper .store-filter-btn[disabled]
{
	color: #888;
	background-color: #d5d5d5;
}

@media (max-width: 47.9375em)
{
	html.show-filters { overflow: hidden; }

	#wrapper .store-filters
	{
		display: none;
		visibility: hidden;
		opacity: 0;
		width: 100%;
		height: 100%;
		position: fixed;
		top: 0;
		background-color: #fff;
		-webkit-transition: all .3s ease;
		transition: all .3s ease;
		z-index: 3000;
	}
	
	[dir="rtl"] #wrapper .store-filters { right: 0; }
	[dir="ltr"] #wrapper .store-filters { left: 0; }

	#wrapper .store-filters.show
	{
		display: inline-block;
		visibility: visible;
		opacity: 1;
	}

	.store-filters-items
	{
		height: 100%;
		padding: 20px;
		overflow: auto;
	}

	#wrapper .store-filter-buttons
	{
		padding: 10px 20px;
		position: absolute;
		bottom: 0;
		left: 0;
		background-color: #fff;
		z-index: 1;
	}

	.store-filter-buttons:before
	{
		content: "";
		width: 100%;
		height: 20px;
		position: absolute;
		top: -20px;
		left: 0;
		background-image: -webkit-linear-gradient(rgba(255, 255, 255, 0), #fff);
		background-image: -moz-linear-gradient(rgba(255, 255, 255, 0), #fff);
		background-image: linear-gradient(rgba(255, 255, 255, 0), #fff);
		z-index: 1;
	}
}

@media (min-width: 48em)
{
	#wrapper .store-filters
	{
		position: -webkit-sticky;
		position: sticky;
		top: 20px;
	}
}