/* KnipBeurten.nl — suggestielijst van de zoekbalk (pakket zoeken). Lui geladen door /zoeken.js. */
.kz-paneel{position:absolute;left:0;right:0;top:calc(100% + 8px);z-index:70;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-l);
  box-shadow:var(--schaduw-2);overflow:hidden;animation:kzOp var(--rustig) var(--zacht);min-width:min(420px, calc(100vw - 32px))}
@keyframes kzOp{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}
.kz-kopje{display:none}
.kz-lijst{max-height:min(70vh, 560px);overflow-y:auto;overscroll-behavior:contain;padding:6px}
.kz-paneel.kz-bezig .kz-lijst{opacity:.6;transition:opacity var(--snel) .15s}
.kz-groep{display:flex;justify-content:space-between;align-items:center;gap:8px;font:600 .72rem var(--body);letter-spacing:.08em;text-transform:uppercase;
  color:var(--muted);padding:12px 10px 6px}
[role=group] + [role=group] .kz-groep{border-top:1px solid var(--line);margin-top:4px;padding-top:14px}
/* "Bedoel je Kerkstraat in …?" is een vraag, geen label: gewone letters */
.kz-groep:not(:empty):is([id$="-s"]){text-transform:none;letter-spacing:0;font-size:.85rem;color:var(--ink)}
.kz-wis{border:0;background:none;color:var(--muted);font:500 .8rem var(--body);text-transform:none;letter-spacing:0;cursor:pointer;padding:6px;border-radius:6px}
.kz-wis:hover{color:var(--ink);background:var(--soft)}
.kz-optie{display:flex;align-items:center;gap:12px;min-height:52px;padding:6px 10px;border-radius:var(--r-m);cursor:pointer;color:var(--ink)}
.kz-optie[aria-selected="true"]{background:var(--soft)}
.kz-optie[aria-selected="true"] .kz-ic{background:var(--surface);color:var(--accent)}
.kz-beeld{width:40px;height:40px;border-radius:10px;flex:none;object-fit:cover}
.kz-beeld.mono{font-size:.8rem}
.kz-ic{width:40px;height:40px;border-radius:10px;background:var(--soft);color:var(--muted);display:grid;place-items:center;flex:none;transition:color var(--snel)}
.kz-ic .ki{width:20px;height:20px}
.kz-tekst{display:grid;min-width:0;flex:1;line-height:1.3}
.kz-tekst b{font-weight:600;font-size:.95rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.kz-tekst small{color:var(--muted);font-size:.82rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.kz-tekst mark{background:none;color:inherit;font-weight:700;text-decoration:underline;text-decoration-color:color-mix(in srgb, var(--accent) 55%, transparent);text-decoration-thickness:2px;text-underline-offset:3px}
.kz-at{color:var(--accent)}
.kz-meta{font-size:.8rem;color:var(--muted);white-space:nowrap;flex:none}
.kz-label{font:600 .68rem var(--body);letter-spacing:.03em;padding:3px 8px;border-radius:var(--r-rond);background:var(--soft);color:var(--accent);white-space:nowrap;flex:none}
.kz-alles{display:flex;align-items:center;gap:12px;margin:4px 0 0;padding:12px 10px;min-height:48px;border-top:1px solid var(--line);color:var(--accent);text-decoration:none;font-size:.92rem;border-radius:0 0 var(--r-m) var(--r-m)}
.kz-alles span{flex:1}
.kz-alles:hover{background:var(--soft)}
.kz-alles .ki{width:18px;height:18px}
.kz-tip,.kz-leeg{display:flex;gap:12px;align-items:flex-start;padding:14px 12px;color:var(--muted);font-size:.88rem;line-height:1.45}
.kz-tip p,.kz-leeg p{margin:0}
.kz-tip b,.kz-leeg b{color:var(--ink);font-weight:600}
.kz-tip .ki,.kz-leeg .ki{width:22px;height:22px;flex:none;color:var(--accent);margin-top:1px}
.kz-bron{margin:6px 10px 8px;font-size:.75rem;color:var(--muted)}
/* Grote zoekbalk op de homepage ("Waar") */
.kz-paneel.kz-waar{top:calc(100% + 10px);left:-6px;right:auto;width:min(520px, calc(100vw - 32px))}

/* Telefoon: zoeken wordt een rustig scherm over de hele breedte, met grote rijen voor de duim */
@media (max-width:760px){
  html.kz-open,html.kz-open body{overflow:hidden}
  html.kz-open #kop{backdrop-filter:none;-webkit-backdrop-filter:none;z-index:90}
  html.kz-open #kop .kop-zoek{position:fixed;left:0;right:0;top:0;z-index:91;padding:10px 16px 10px 64px;background:var(--bg);opacity:1;visibility:visible;transform:none;
    border-bottom:1px solid var(--line);max-width:none}
  html.kz-open #kop .kz-icoon{left:78px}
  html.kz-open .kz-paneel:not(.kz-waar){position:fixed;left:0;right:0;top:67px;bottom:0;border:0;border-radius:0;box-shadow:none;min-width:0;animation:kzMob var(--rustig) var(--zacht);background:var(--bg)}
  @keyframes kzMob{from{opacity:0}to{opacity:1}}
  html.kz-open .kz-paneel:not(.kz-waar) .kz-kopje{display:block;position:fixed;left:10px;top:11px}
  .kz-terug{width:44px;height:44px;border:0;border-radius:var(--r-rond);background:var(--soft);color:var(--ink);display:grid;place-items:center;cursor:pointer}
  .kz-terug .ki{width:22px;height:22px}
  html.kz-open .kz-paneel:not(.kz-waar) .kz-lijst{max-height:none;height:100%;padding:8px 10px calc(24px + env(safe-area-inset-bottom))}
  .kz-optie{min-height:60px;padding:8px 8px}
  .kz-meta{display:none}
  .kz-paneel.kz-waar{left:0;width:calc(100vw - 32px)}
}
@media (prefers-reduced-motion:reduce){ .kz-paneel{animation:none} }
form.zoekbalk2{position:relative}
.kz-paneel.kz-waar{left:0}