.widget {
	margin: 0 0 20px;
	padding-bottom: 20px;

	// Make sure select elements fit in widgets.
	select {
		max-width: 100%;
	}

	p:last-of-type {
		margin-bottom: 0;
	}

	.widget-title {
		margin: 0 0 20px;
		@include font-size(18);
	}

	a {
		color: $color__text-main;

		&:hover {
			color: $color__primary;
		}
	}

	ul {
		padding-left: 0;
		list-style: none;
		margin: 0;

		li {
			padding-bottom: 10px;

			&:last-of-type {
				padding-bottom: 0;
			}
		}

		li > ul,
		.children {
			padding-left: 20px;
		}
	}	

	&.widget_product_search,
	&.widget_search {
		.search-field {
			width: 100%;
		}
	}
	
}

.search-submit {
	svg {
		fill: #fff;
	}
}

.widget-area {
	max-width: 300px;
	width: 300px;
	padding-right: 15px;

	.widget {
		border-bottom: 1px solid #eee;

		&:last-of-type {
			border-bottom: 0;
		}
	}
}
.widget_product_search,
.widget_search {
	form {
		display: flex;
	}
	.search-field {
		width: 100%;
	}
	button {
		fill: #fff;
	}
}