.container {
	display: grid;
	grid-template-columns: minmax(300px, 1fr) 4fr;
	grid-template-rows: auto 1fr;
	row-gap: 20px;
	grid-template-areas:
		"sidebar topbar"
		"sidebar main";
}

.content {
	grid-area: main;
	align-self: start;
}

.sidebar {
	grid-area: sidebar;
}

.banners {
	grid-area: topbar;
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 20px;
	text-align: center;
}

.banner {
	height: 125px;
	background-size: cover;
	background-position: center;
}

aside h3 {
	font-weight: 800; /* black */
	text-transform: uppercase;
	color: var(--title-accent);
	margin-bottom: 0;
}

aside h4 {
	font-weight: 400;
	text-transform: uppercase;
	color: var(--discreet-accent);
	margin: 0;
}

aside input[type=radio] {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
}

aside input[type=radio] + label {
	cursor: pointer;
	display: inline-block;
	filter: grayscale(0.2) opacity(0.8);
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
	width: 50px;
	height: 60px;
	font-weight: 500; /* medium */
	font-size: 6pt;
	text-align: center;
	text-transform: uppercase;
	word-break: break-all;
	white-space: pre-line;
	margin: 4px;
}

aside input[type=radio] + label::before {
	content: "";
	display: block;
	margin-top: 65px;
}

aside input[type=radio]:checked + label {
	filter: none;
	font-weight: 800; /* black */
	border: 2px solid var(--border-accent);
	margin: 2px;
}

aside input[type=radio]:hover + label {
	filter: none;
}

aside fieldset {
	border: none;
}

.form-category {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
}

.form-item {
	text-align: center;
}

.hr-btn {
	text-align: center;
	margin-top: 20px;
}

.dashed {
	border: none;
	border-top: 1px dashed #009de1;
	margin: 0;
}

.btn-small {
	display: inline-block;
	position: relative;
	top: -15px;
	font-weight: 600;
	padding: 5px 10px;
	font-size: 8pt;
	border-radius: 20px;
}

#formtoggler {
	width: 100%;
}

@media (max-width: 992px) {
	.products, .banners {
		grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
	}
	.banner {
		height: 75px;
	}
}

@media (max-width: 600px) {
	.container {
		grid-template-columns: 1fr;
		grid-template-areas:
			"topbar"
			"sidebar"
			"main";
	}
	#wtfack-form, .remove-filters:first-of-type {
		display: none;
	}
}

@media (min-width: 600px) {
	#formtoggler {
		display: none;
	}
}