/* Knowledge base: filter form + results grid. Class names match the original
 * [kennisbank_filters] / [kennisbank_results] markup so existing theme styling and
 * page content keep working. */

/* --- Filters --- */
form#filter-form fieldset.taxonomy-group { padding-left: 20px; }
.kb-divider { border: none; border-bottom: 1px solid #ddd; margin: 1.2em 0; }
.desktop-filter-heading { font-size: 26px; font-weight: 600; margin: 0 0 1em 20px; display: block; }
.mobile-filter-toggle { background-color: #f0ebeb; border: none; font-size: 16px; padding: .4em 1em; font-weight: 500; display: none; align-items: center; width: 100%; }

.taxonomy-group .term-list { display: block; }
form#filter-form fieldset.taxonomy-group .term-list .kb-filter-option { display: block; width: 100%; margin: 0 0 .6em; line-height: 1.4; white-space: normal; float: none; clear: both; }
.taxonomy-group .kb-filter-option input { margin-right: .5em; vertical-align: middle; }

.taxonomy-group .show-more { display: block; margin: .25em 0 0; color: #0073aa; font-size: 15px; text-decoration: none; clear: both; }
.taxonomy-group .show-more:hover { text-decoration: underline; }

@media (max-width: 768px) {
	#filter-form { display: none; margin-top: 1em; }
	.mobile-filter-toggle { display: inline-flex; }
	.desktop-filter-heading { display: none; }
}

/* --- Buttons (submit + load more) --- */
form#filter-form .kb-submit,
button#load-more {
	background-color: #005e90;
	color: #fff;
	border: 1px solid #005e90;
	padding: 20px;
	font-size: 16px;
}
form#filter-form .kb-submit { margin: 0 5%; width: 90%; }
button#load-more { width: 50%; margin: 2em auto !important; display: block; }
form#filter-form .kb-submit:hover,
button#load-more:hover { background-color: transparent; color: #232323; cursor: pointer; }

/* --- Results --- */
.kb-results { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 1.5em; }
.kb-results article {
	background-color: #e2f1fd;
	text-align: center;
	opacity: 0;
	transform: translateY(10px);
	animation: kb-fadeInUp .4s ease-out forwards;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}
.kb-results article.artikeltype-whitepapers { background-color: #faab4b; }
.kb-results img { max-width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; width: 100%; }
.kb-results h3 {
	font-size: 17px;
	font-weight: 500;
	margin: 0;
	padding: 12px 20px;
	min-height: 4.8em;
	display: flex;
	align-items: center;
	justify-content: center;
	line-height: 22px;
}

@keyframes kb-fadeInUp { to { opacity: 1; transform: translateY(0); } }