:root {
	--color-danger: #D92D20;
	--color-danger-title: #7A2525;
	--color-danger-meta: #7A3E3E;
	--color-danger-surface: #FFF7F7;
	--color-danger-border: #F7C7C7;
}

html[data-ips-scheme="dark"] {
	--color-danger: #FF9A94;
	--color-danger-title: #FFB4AB;
	--color-danger-meta: #E0A9A4;
	--color-danger-surface: #33222A;
	--color-danger-border: #5C3238;
}

body[data-pagename="forum-alle-vragen"] .ipsWidget {
    background: transparent;
    box-shadow: unset;
}

@media screen and (min-width: 1024px) {
	body[data-pagename="forum-alle-vragen"] .ipsLayout__secondary-sticky-inner {
		margin-top: 131px;
	}	
}

.hl-forum-header {
	margin-bottom: var(--space-8);
}


@media screen and (max-width: 1024px) {
  #cSidebarToggle_hide,
  #cSidebarToggle_show {
    display: none !important;
  }
}


.hl-breadcrumb {
	display: flex;
	align-items: center;
	gap: var(--space-2);
	margin-bottom: var(--space-3);
	color: var(--color-text-secondary);
	font-size: 13px;
	line-height: 18px;
}

.hl-breadcrumb a {
	color: var(--color-text-secondary);
	text-decoration: none;
}

.hl-breadcrumb a:hover {
	color: var(--color-primary);
}

.hl-forum-header h1 {
	margin: 0;
	color: var(--color-text);
	font-size: 32px;
	line-height: 40px;
	font-weight: 600;
	letter-spacing: -0.03em;
}

.hl-forum-header p {
	display: flex;
	align-items: center;
	gap: var(--space-2);
	margin: var(--space-2) 0 0;
	color: var(--color-text-secondary);
	font-size: 14px;
	line-height: 20px;
}

.hl-section-head {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: var(--space-6);
}

.hl-current-filters {
	display: flex;
	align-items: center;
	gap: var(--space-2);
	flex-wrap: wrap;
	margin-left: auto;
}

.hl-current-filters a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: var(--space-1) var(--space-4);
	border-radius: var(--radius-pill);
	background: var(--color-tag-bg);
	color: var(--color-tag-text);
	font-size: 12px;
	line-height: 18px;
	font-weight: 500;
	text-decoration: none;
	transition: 0.3s;
}

.hl-current-filters a:hover {
	background: color-mix(in srgb, var(--color-primary) 10%, var(--color-tag-bg));
	color: var(--color-primary);
	box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--color-primary) 28%, transparent);
}

.hl-current-filters a:focus-visible {
	outline: 2px solid color-mix(in srgb, var(--color-primary) 45%, transparent);
	outline-offset: 2px;
}

.hl-current-filters a.is-active:hover {
	background: var(--color-text-muted);
	color: var(--color-surface);
	box-shadow: none;
	transform: none;
}

.hl-current-filters a.is-active {
	background: var(--color-text-muted);
	color: var(--color-surface);
}

.hl-current-pagination {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--space-4);
	padding-top: var(--space-6);
	margin-top: var(--space-6);
	border-top: 1px solid var(--color-border-soft);
}

.hl-current-pagination-left {
	display: flex;
	align-items: center;
	gap: var(--space-2);
	flex-wrap: wrap;
}

.hl-page,
.hl-page-next {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 40px;
	height: 40px;
	padding: 0 var(--space-4);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-md);
	background: var(--color-surface);
	color: var(--color-text);
	font-size: 13px;
	line-height: 18px;
	font-weight: 600;
	text-decoration: none;
}

.hl-page.is-active {
	border-color: var(--color-primary);
	background: var(--color-primary);
	color: var(--color-surface);
}

.hl-page-dots {
	display: inline-flex;
	align-items: center;
	height: 40px;
	padding: 0 var(--space-2);
	color: var(--color-text-muted);
	font-size: 13px;
	font-weight: 700;
}

.hl-page-next {
	min-width: auto;
}

.hl-current-pagination-jump {
	position: relative;
	margin-left: auto;
}

.hl-current-pagination-jump > button {
	display: inline-flex;
	align-items: center;
	gap: var(--space-2);
	padding: 0;
	border: 0;
	background: transparent;
	color: var(--color-text-secondary);
	font-size: 13px;
	line-height: 18px;
	font-weight: 700;
	cursor: pointer;
}

.hl-page-jump-form {
	display: flex;
	align-items: center;
	gap: var(--space-2);
	padding: var(--space-2);
}

.hl-page-jump-form .ipsInput {
	width: 190px;
}

/* Verborgen topics: duidelijk voor moderators, maar visueel rustiger */
/* Verborgen topics — subtieler en zonder overlap */
.hl-topic-hidden {
	position: relative;
	margin-inline: 0;
	margin-top: 10px;
	padding: var(--space-6) !important;
	border: 1px solid var(--color-danger-border) !important;
	border-radius: var(--radius-lg);
	background: var(--color-danger-surface);
	box-shadow: none;
}

.hl-topic-hidden + .hl-topic {
	border-top-color: var(--color-border-soft);
}

.hl-topic-hidden .hl-topic-content h3 a {
	color: var(--color-danger-title);
}

.hl-topic-hidden .hl-topic-content p,
.hl-topic-hidden .hl-topic-meta {
	color: var(--color-danger-meta);
}

.hl-topic-badge--hidden {
	background: color-mix(in srgb, var(--color-danger) 15%, var(--color-surface));
	color: var(--color-danger);
	box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--color-danger) 30%, transparent);
}

/* Oude label uitschakelen */
.hl-topic-hidden::after {
	content: none;
}

.hl-topic-hidden .hl-topic-meta {
	align-items: flex-end;
	gap: var(--space-2);
}

@media (max-width: 768px) {
	.hl-section-head,
	.hl-current-pagination {
		flex-direction: column;
		align-items: flex-start;
	}

	.hl-current-pagination-jump {
		margin-left: 0;
	}
}

/* TAGS FILTER */
.hl-tag-filter-card{
	padding:var(--space-6);
}

.hl-tag-filter-card h2{
	margin:0 0 var(--space-2);
    font-size: 20px;
    line-height: 28px;
    font-weight: 600;
    color: var(--color-text);
}

.hl-tag-filter-card > p{
	margin:0 0 var(--space-6);
	font-size:14px;
	line-height:20px;
	color:var(--color-text-secondary);
}

.hl-tag-search{
	display:flex;
	align-items:center;
	gap:var(--space-3);
	height:36px;
	margin-bottom:var(--space-6);
	padding:0 var(--space-4);
	border:1px solid var(--color-border);
	border-radius:8px;
	background:#F8FAFC;
}

.hl-tag-search img{
	width:22px;
	height:22px;
	object-fit:contain;
}

.hl-tag-search input{
	width:100%;
	border:0;
	outline:0;
	background:transparent;
	font:inherit;
	font-size:13px;
	color:#3A4F67;
}

.hl-tag-filter-list{
	display:flex;
	flex-direction:column;
	gap:var(--space-3);
}

.hl-tag-filter-item{
	display:none;
	align-items:center;
	gap:var(--space-3);
	cursor:pointer;
}

.hl-tag-filter-item input{
	display:none;
}

.hl-tag-checkbox{
	width:16px;
	height:16px;
	border:2px solid var(--color-text-muted);
	border-radius:var(--radius-sm);
	background:var(--color-surface);
	position:relative;
	flex-shrink:0;
}

.hl-tag-filter-item input:checked + .hl-tag-checkbox{
	background:var(--color-primary);
	border-color:var(--color-primary);
}

.hl-tag-filter-item input:checked + .hl-tag-checkbox::after{
	content:"✓";
	position:absolute;
	inset:0;
	display:flex;
	align-items:center;
	justify-content:center;
	color:#fff;
	font-size:13px;
	font-weight:800;
}

.hl-tag-name{
	flex:1;
	font-size:13px;
	line-height:18px;
	color:var(--color-text);
	font-weight: normal;
}

.hl-tag-filter-item input:checked ~ .hl-tag-name{
	font-weight:800;
}

.hl-tag-count{
	font-size:12px;
	color:var(--color-text-secondary);
}

.hl-tag-filter-all{
	display:flex;
	justify-content:flex-end;
	margin-top:var(--space-8);
	color:var(--color-primary);
	font-size:14px;
	font-weight:800;
	text-decoration:none;
}

#hlForumResults.is-loading {
	opacity: .45;
	pointer-events: none;
	transition: opacity .15s ease;
}

.hl-feed-card {
	padding: var(--space-6);
}

.hl-feed-card .ipsTime__short {
	display: none;
}

.hl-feed-card h2{
    margin: 0;
    font-size: 20px;
    line-height: 28px;
    font-weight: 600;
    color: var(--color-text);
}

.hl-feed-section{
	margin-top:18px;
}

.hl-feed-section h3{
	margin:0 0 8px;
	font-size:11px;
	line-height:16px;
	font-weight:500;
	letter-spacing:1.2px;
	text-transform:uppercase;
	color:var(--color-text);
}

.hl-feed-item{
	display:block;
	padding:var(--space-4);
	border:1px solid var(--color-border);
	border-radius:var(--radius-md);
	background:var(--color-surface);
	color:var(--color-text);
	text-decoration:none;
}

.hl-feed-item:hover{
	border-color:var(--color-primary);
}

.hl-feed-item strong{
	display:block;
	margin:0;
	font-size:14px;
	line-height:18px;
	font-weight:600;
	color:var(--color-text);
}

.hl-feed-item a {
	color: var(--color-text);
}

.hl-feed-item > span{
	display:block;
	margin:8px 0 14px;
	font-size:12px;
	line-height:16px;
	color:var(--color-text-secondary);
}

.hl-feed-meta{
	display:flex;
	align-items:center;
	gap:18px;
	font-size:12px;
	line-height:16px;
	color:var(--color-text-secondary);
}

.hl-feed-meta span:nth-child(2),
.hl-feed-meta span:nth-child(3) {
	font-weight: 500;
}

.hl-feed-meta span{
	display:inline-flex;
	align-items:center;
	gap:5px;
}

.hl-feed-link{
	display:block;
	margin-top:18px;
	text-align:right;
	color:var(--color-primary);
	font-size:16px;
	font-weight:700;
	text-decoration:none;
}

.hl-feed-link:hover{
	text-decoration:underline;
}

.hl-feed-empty{
	margin-top:18px;
	padding:var(--space-4);
	border:1px solid var(--color-border);
	border-radius:var(--radius-md);
	background:var(--color-surface);
	font-size:12px;
	line-height:16px;
	color:var(--color-text-secondary);
}

#showMoreTags {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	justify-content: end;
}

#showMoreTags i {
	font-size: 12px;
	transition: transform .2s ease;
}

#hlForumResults {
	position: relative;
}

.hl-forum-loading {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: flex-start;
	justify-content: center;
	padding-top: 40px;
	background: color-mix(in srgb, var(--i-background, #fff) 70%, transparent);
	backdrop-filter: blur(2px);
	z-index: 20;
	font-size: 26px;
}

.hl-forum-loading i {
	color: var(--i-primary);
}

/* =============================
   MOBILE TAG FILTER
================================ */

.hl-mobile-tag-filter-card {
	display: none;
}

@media screen and (max-width: 1024px) {
	section[data-widget-area-id="2"] {
		display: none;
	}

	.hl-mobile-tag-filter-card {
		display: block;
		margin-bottom: var(--space-4);
	}

	.hl-mobile-filter-details {
		border: 1px solid var(--color-border-soft);
		border-radius: var(--border-radius);
		background: #F8FAFC;
		overflow: hidden;
		box-shadow: none;
	}

	html[data-ips-scheme="dark"] .hl-mobile-filter-details {
		background: var(--topic-post-container-secondary);
	}

	.hl-mobile-filter-details summary {
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: var(--space-3);
		padding: 14px 16px;
		cursor: pointer;
		list-style: none;
		color: var(--color-text);
		font-size: 14px;
		line-height: 18px;
		font-weight: 800;
	}

	.hl-mobile-filter-details summary::-webkit-details-marker {
		display: none;
	}

	.hl-mobile-filter-details summary span {
		display: inline-flex;
		align-items: center;
		gap: var(--space-2);
	}

	.hl-mobile-filter-details summary i {
		color: var(--color-primary);
		font-size: 14px;
		transition: transform .2s ease;
	}

	.hl-mobile-filter-details[open] summary > i {
		transform: rotate(180deg);
	}

	.hl-mobile-filter-details summary em {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		min-width: 22px;
		height: 22px;
		padding: 0 7px;
		border-radius: var(--radius-pill);
		background: var(--color-primary);
		color: #fff;
		font-size: 11px;
		line-height: 1;
		font-style: normal;
		font-weight: 800;
	}

	.hl-mobile-tag-filter-form {
		padding: 0 16px 16px;
	}

	.hl-mobile-tag-filter-list {
		display: flex;
		flex-direction: column;
		gap: 0;
		max-height: 320px;
		overflow-y: auto;
		padding: 4px 0 12px;
		border-top: 1px solid var(--color-border-soft);
	}

	.hl-mobile-tag-filter-item {
		display: flex;
		align-items: center;
		gap: var(--space-3);
		width: 100%;
		padding: 16px 0;
		border-bottom: 1px solid var(--color-border-soft);
		color: var(--color-text);
		cursor: pointer;
	}

	.hl-mobile-tag-filter-item:last-child {
		border-bottom: 0;
	}

	.hl-mobile-tag-filter-item input {
		position: absolute;
		opacity: 0;
		pointer-events: none;
	}

	.hl-mobile-tag-filter-item .hl-tag-checkbox {
		width: 18px;
		height: 18px;
		flex: 0 0 18px;
		border: 2px solid var(--color-border-soft);
		border-radius: var(--radius-sm);
		background: #fff;
	}

	html[data-ips-scheme="dark"] .hl-mobile-tag-filter-item .hl-tag-checkbox {
		background: var(--topic-post-container);
	}

	.hl-mobile-tag-filter-item input:checked + .hl-tag-checkbox {
		background: var(--color-primary);
		border-color: var(--color-primary);
		box-shadow: inset 0 0 0 3px #fff;
	}

	.hl-mobile-tag-filter-item .hl-tag-name {
		flex: 1 1 auto;
		min-width: 0;
		font-size: 13px;
		line-height: 18px;
		font-weight: 700;
		color: var(--color-text);
	}

	.hl-mobile-tag-filter-item .hl-tag-count {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		min-width: 26px;
		height: 22px;
		padding: 0 8px;
		border-radius: var(--radius-pill);
		background: var(--light-blue-border);
		color: var(--color-tag-text);
		font-size: 11px;
		line-height: 1;
		font-weight: 700;
	}

	html[data-ips-scheme="dark"] .hl-mobile-tag-filter-item .hl-tag-count {
		background: var(--color-border-soft);
		color: var(--color-tag-text);
	}

	.hl-mobile-tag-filter-actions {
		display: flex;
		align-items: center;
		gap: var(--space-3);
		padding-top: 14px;
		border-top: 1px solid var(--color-border-soft);
	}

	.hl-mobile-tag-filter-actions button,
	.hl-mobile-filter-reset {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		height: 38px;
		padding: 0 16px;
		border-radius: var(--radius-sm);
		font-size: 13px;
		line-height: 1;
		font-weight: 800;
		text-decoration: none;
	}

	.hl-mobile-tag-filter-actions button {
		flex: 1 1 auto;
		border: 0;
		background: var(--color-primary);
		color: #fff;
		cursor: pointer;
	}

	.hl-mobile-tag-filter-actions button:hover {
		background: var(--color-primary-hover);
	}

	.hl-mobile-filter-reset {
		flex: 0 0 auto;
		background: var(--color-primary-soft);
		color: var(--color-primary);
	}

	.hl-mobile-filter-reset:hover {
		color: var(--color-primary-hover);
		text-decoration: none;
	}
}

html[data-ips-guest] .ipsLayout__secondary-sticky-inner section[data-widget-area-id="1"] {
	display: none;
}

body[data-pageapp="forums"] .ipsLayout__secondary-sticky-inner {
	margin-top: 20px;
}

html[data-ips-path="/forums/forum/15-admin-board/"] div[data-controller="forums.front.forum.forumPage"] .ipsButtons,
html[data-ips-path="/forums/forum/33-admin-temp/"] div[data-controller="forums.front.forum.forumPage"] .ipsButtons,
html[data-ips-path="/forums/forum/52-herbouw-van-ons-forum/"] div[data-controller="forums.front.forum.forumPage"] .ipsButtons,
html[data-ips-path="/forums/forum/57-issue-tracker/"] div[data-controller="forums.front.forum.forumPage"] .ipsButtons {
	display: block !important;
}

[data-controller="forums.front.forum.forumPage"] .ipsButtons {
	display: none;
}

.ipsAnnouncement {
	background-color: #ff7b00;
}

.ipsAnnouncement a {
	padding: 10px 0 !important;
}