/* Kaartzoeker: knop naast de filters, zoeker in een pop-up */
.sd-kz:has(.sd-kz-open) { margin: 1rem 0; }
.sd-kz-open {
	font: inherit;
	font-weight: 800;
	font-size: .92rem;
	display: inline-flex;
	align-items: center;
	gap: .4rem;
	padding: .45rem .95rem;
	border: 1px solid var(--wp--preset--color--accent-1, #D4A23A);
	border-radius: 6px;
	background: var(--wp--preset--color--accent-1, #D4A23A);
	color: var(--wp--preset--color--accent-3, #0F1630);
	cursor: pointer;
}
.sd-kz-open:hover { filter: brightness(1.08); }
html.sd-kz-lock { overflow: hidden; }
.sd-kz-dialog {
	width: min(980px, calc(100vw - 2rem));
	max-width: none;
	max-height: calc(100dvh - 3rem);
	padding: 0;
	border: 0;
	border-radius: 16px;
	background: var(--wp--preset--color--base, #F4F6FA);
	color: var(--wp--preset--color--contrast, #1A1F3D);
	box-shadow: 0 24px 60px rgba(15, 22, 48, .45);
	overflow: auto;
	overscroll-behavior: contain;
}
.sd-kz-dialog::backdrop { background: rgba(15, 22, 48, .65); backdrop-filter: blur(2px); }
.sd-kz-dialog .sd-kz-form { border-radius: 0; box-shadow: none; position: sticky; top: 0; z-index: 2; padding-right: 3.5rem; }
.sd-kz-dialog .sd-kz-ai:not([hidden]), .sd-kz-dialog .sd-kz-uitkomst:not(:empty) { margin: 1rem 1.25rem; }
.sd-kz-dialog .sd-kz-uitkomst:not(:empty) { margin-bottom: 1.5rem; }
.sd-kz-sluit {
	position: absolute;
	top: .7rem;
	right: .8rem;
	z-index: 3;
	width: 2.3rem;
	height: 2.3rem;
	border-radius: 50%;
	border: 1px solid rgba(255, 255, 255, .3);
	background: transparent;
	color: #fff;
	font-size: 1.5rem;
	line-height: 1;
	cursor: pointer;
}
.sd-kz-sluit:hover { border-color: var(--wp--preset--color--accent-1, #D4A23A); color: var(--wp--preset--color--accent-1, #D4A23A); }
.sd-kz-form {
	background: var(--wp--preset--color--contrast, #1A1F3D);
	color: #fff;
	border-radius: 14px;
	padding: 1.1rem 1.25rem 1rem;
	box-shadow: 0 6px 20px rgba(15, 22, 48, .18);
}
.sd-kz-titel {
	display: block;
	font-family: var(--wp--preset--font-family--cinzel, serif);
	font-weight: 700;
	font-size: 1.25rem;
	color: var(--wp--preset--color--accent-1, #D4A23A);
	letter-spacing: .02em;
}
.sd-kz-intro { margin: .15rem 0 .7rem; font-size: .92rem; opacity: .85; }
.sd-kz-balk { display: flex; gap: .5rem; }
.sd-kz-balk input {
	flex: 1;
	min-width: 0;
	font: inherit;
	font-size: 1.05rem;
	padding: .7rem .9rem;
	border: 2px solid transparent;
	border-radius: 10px;
	background: #fff;
	color: var(--wp--preset--color--contrast, #1A1F3D);
}
.sd-kz-balk input:focus { outline: none; border-color: var(--wp--preset--color--accent-1, #D4A23A); }
.sd-kz-balk button {
	font: inherit;
	font-weight: 800;
	padding: .7rem 1.2rem;
	border: 0;
	border-radius: 10px;
	cursor: pointer;
	background: var(--wp--preset--color--accent-1, #D4A23A);
	color: var(--wp--preset--color--accent-3, #0F1630);
}
.sd-kz-balk button:hover { filter: brightness(1.08); }
.sd-kz-voorbeelden { display: flex; flex-wrap: wrap; gap: .4rem; margin: .7rem 0 0; }
.sd-kz-vb {
	font: inherit;
	font-size: .82rem;
	padding: .25rem .65rem;
	border-radius: 999px;
	border: 1px solid rgba(255, 255, 255, .3);
	background: transparent;
	color: #fff;
	cursor: pointer;
}
.sd-kz-vb:hover { border-color: var(--wp--preset--color--accent-1, #D4A23A); color: var(--wp--preset--color--accent-1, #D4A23A); }

.sd-kz-uitkomst:not(:empty), .sd-kz-ai:not([hidden]) { margin-top: 1rem; }
.sd-kz-kop { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem .8rem; margin-bottom: .6rem; }
.sd-kz-telling { margin: 0; font-weight: 800; }
.sd-kz-chips { margin: 0; display: flex; flex-wrap: wrap; gap: .3rem; align-items: center; font-size: .85rem; color: var(--wp--preset--color--accent-4, #5A5F7A); }
.sd-kz-chip { background: var(--wp--preset--color--accent-6, #E1E5EE); color: var(--wp--preset--color--contrast, #1A1F3D); border-radius: 999px; padding: .1rem .55rem; font-weight: 700; }
.sd-kz-wis { margin-left: auto; font: inherit; font-size: .85rem; background: none; border: 0; text-decoration: underline; cursor: pointer; color: var(--wp--preset--color--accent-4, #5A5F7A); }

.sd-kz-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: .8rem; }
.sd-kz-kaart {
	display: flex;
	flex-direction: column;
	gap: .15rem;
	background: #fff;
	border-radius: 10px;
	padding: .5rem;
	text-decoration: none !important;
	color: var(--wp--preset--color--contrast, #1A1F3D) !important;
	box-shadow: 0 1px 3px rgba(15, 22, 48, .12);
	transition: transform .12s, box-shadow .12s;
}
.sd-kz-kaart:hover { transform: translateY(-2px); box-shadow: 0 6px 16px rgba(15, 22, 48, .18); }
.sd-kz-kaart img, .sd-kz-geenfoto { width: 100%; aspect-ratio: 5 / 7; object-fit: cover; border-radius: 6px; background: var(--wp--preset--color--accent-6, #E1E5EE); margin-bottom: .3rem; }
.sd-kz-naam { font-weight: 800; font-size: .88rem; line-height: 1.25; }
.sd-kz-meta { font-size: .75rem; color: var(--wp--preset--color--accent-4, #5A5F7A); }
.sd-kz-labels { display: flex; flex-wrap: wrap; gap: .25rem; font-size: .7rem; font-weight: 700; }
.sd-kz-labels span { background: var(--wp--preset--color--base, #F4F6FA); border-radius: 4px; padding: 0 .35rem; }
.sd-kz-labels .sd-kz-foil { background: linear-gradient(120deg, #F2DA9B, #D4A23A); color: #0F1630; }
.sd-kz-prijs { margin-top: auto; padding-top: .25rem; font-weight: 900; font-size: 1rem; }
.sd-kz-onder { display: flex; flex-wrap: wrap; gap: .6rem; justify-content: center; margin: 1rem 0 0; }
.sd-kz-meer, .sd-kz-vraag {
	font: inherit;
	font-weight: 700;
	padding: .5rem 1rem;
	border-radius: 999px;
	cursor: pointer;
	border: 2px solid var(--wp--preset--color--contrast, #1A1F3D);
	background: #fff;
	color: var(--wp--preset--color--contrast, #1A1F3D);
}
.sd-kz-vraag { border-color: var(--wp--preset--color--accent-1, #D4A23A); }
.sd-kz-vraag::before { content: "✦ "; color: var(--wp--preset--color--accent-1, #D4A23A); }

.sd-kz-ai {
	background: #fff;
	border-left: 4px solid var(--wp--preset--color--accent-1, #D4A23A);
	border-radius: 10px;
	padding: 1rem 1.1rem;
	box-shadow: 0 1px 3px rgba(15, 22, 48, .12);
}
.sd-kz-ai-kop { margin: 0 0 .4rem; font-weight: 900; }
.sd-kz-ai-kop::before { content: "✦ "; color: var(--wp--preset--color--accent-1, #D4A23A); }
.sd-kz-ai-tekst p { margin: 0 0 .6rem; }
.sd-kz-ai .sd-kz-grid { margin-top: .6rem; }
.sd-kz-let { margin: .7rem 0 0; font-size: .75rem; color: var(--wp--preset--color--accent-4, #5A5F7A); }
.sd-kz-ai.is-fout { border-left-color: var(--wp--preset--color--ruby, #CF2A40); }
.sd-kz-ai.is-fout p { margin: 0; }
.sd-kz-denkt { display: flex; align-items: center; gap: .6rem; margin: 0; color: var(--wp--preset--color--accent-4, #5A5F7A); }
.sd-kz-spinner {
	flex: none;
	width: 1.1rem;
	height: 1.1rem;
	border: 3px solid var(--wp--preset--color--accent-6, #E1E5EE);
	border-top-color: var(--wp--preset--color--accent-1, #D4A23A);
	border-radius: 50%;
	animation: sd-kz-draai .8s linear infinite;
}
@keyframes sd-kz-draai { to { transform: rotate(360deg); } }

@media (max-width: 600px) {
	.sd-filterbar .sd-kz-open { width: 100%; justify-content: center; }
	.sd-kz-dialog { width: 100vw; height: 100dvh; max-height: 100dvh; margin: 0; border-radius: 0; }
	.sd-kz-dialog .sd-kz-form { position: static; }
	.sd-kz-dialog .sd-kz-ai:not([hidden]), .sd-kz-dialog .sd-kz-uitkomst:not(:empty) { margin: .8rem; }
	.sd-kz-form { padding: .9rem .9rem .8rem; border-radius: 12px; }
	.sd-kz-balk button { padding: .7rem .85rem; }
	.sd-kz-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .6rem; }
}

/* Zwevende balk onderaan: valt op, opent de zoeker, weg te klikken */
.sd-kz-zwevend {
	position: fixed;
	left: 50%;
	bottom: 1.1rem;
	z-index: 9980;
	display: flex;
	align-items: center;
	width: min(620px, calc(100vw - 19rem));
	translate: -50% 160%;
	opacity: 0;
	transition: translate .45s cubic-bezier(.2, .9, .3, 1.2), opacity .3s;
	font-family: var(--wp--preset--font-family--nunito, inherit);
}
.sd-kz-zwevend.is-zichtbaar { translate: -50% 0; opacity: 1; }
.sd-kz-zwevend.is-verborgen { translate: -50% 160%; opacity: 0; }
.sd-kz-zw-open {
	flex: 1;
	min-width: 0;
	display: flex;
	align-items: center;
	gap: .75rem;
	padding: .55rem .55rem .55rem 1rem;
	border: 2px solid var(--wp--preset--color--accent-1, #D4A23A);
	border-radius: 99px;
	background: var(--wp--preset--color--accent-3, #0F1630);
	color: #fff;
	font: inherit;
	text-align: left;
	cursor: pointer;
	box-shadow: 0 12px 32px -8px rgba(15, 22, 48, .6), 0 0 0 0 rgba(212, 162, 58, .55);
	animation: sd-kz-gloed 2.4s ease-out 1.4s 2;
}
.sd-kz-zw-open:hover { box-shadow: 0 14px 34px -8px rgba(15, 22, 48, .7), 0 0 0 4px rgba(212, 162, 58, .25); }
@keyframes sd-kz-gloed {
	0% { box-shadow: 0 12px 32px -8px rgba(15, 22, 48, .6), 0 0 0 0 rgba(212, 162, 58, .55); }
	70%, 100% { box-shadow: 0 12px 32px -8px rgba(15, 22, 48, .6), 0 0 0 14px rgba(212, 162, 58, 0); }
}
.sd-kz-zw-ster { flex: none; font-size: 1.3rem; color: var(--wp--preset--color--accent-1, #D4A23A); }
.sd-kz-zw-tekst { flex: 1; min-width: 0; display: flex; flex-direction: column; line-height: 1.25; }
.sd-kz-zw-tekst strong { font-weight: 800; font-size: .95rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sd-kz-zw-vb { font-size: .8rem; color: var(--wp--preset--color--accent-2, #F2DA9B); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; transition: opacity .3s; }
.sd-kz-zw-vb.is-weg { opacity: 0; }
.sd-kz-zw-zoek {
	flex: none;
	padding: .55rem 1.1rem;
	border-radius: 99px;
	background: var(--wp--preset--color--accent-1, #D4A23A);
	color: var(--wp--preset--color--accent-3, #0F1630);
	font-weight: 900;
	font-size: .9rem;
}
.sd-kz-zw-weg {
	position: absolute;
	top: -.55rem;
	right: -.35rem;
	width: 1.6rem;
	height: 1.6rem;
	display: grid;
	place-items: center;
	padding: 0;
	border: 2px solid var(--wp--preset--color--accent-1, #D4A23A);
	border-radius: 50%;
	background: #fff;
	color: var(--wp--preset--color--accent-3, #0F1630);
	font-size: 1rem;
	line-height: 1;
	cursor: pointer;
}
.sd-kz-zw-weg:hover { background: var(--wp--preset--color--accent-2, #F2DA9B); }
body.sd-kz-balk-aan { padding-bottom: 5.5rem; }
@media (max-width: 900px) {
	.sd-kz-zwevend { left: .75rem; width: auto; right: 9rem; translate: 0 160%; }
	.sd-kz-zwevend.is-zichtbaar { translate: 0 0; }
	.sd-kz-zwevend.is-verborgen { translate: 0 160%; }
	.sd-kz-zw-zoek { display: none; }
	.sd-kz-zw-open { padding: .6rem .9rem; }
}
@media (max-width: 600px) {
	.sd-kz-zwevend { right: 4.6rem; bottom: .75rem; }
}
@media (prefers-reduced-motion: reduce) {
	.sd-kz-zwevend { transition: opacity .2s; }
	.sd-kz-zw-open { animation: none; }
}

/* Andere producten in de zoekresultaten */
.sd-kz-sub { margin: 1.4rem 0 .6rem; font-weight: 900; }
.sd-kz-product img, .sd-kz-product .sd-kz-geenfoto { aspect-ratio: 1; object-fit: contain; background: #fff; }
