/* P13 (30 september): de filters boven het raster en de knop Meer laden (planner/p13-catalogus.js).
   Een filter is een pil met de naam van het kenmerk en een keuzelijst; een gekozen filter krijgt de kleur van
   een gekozen knop. Op een telefoon twee naast elkaar. */
.p13fwrap{margin:0 0 16px}
.p13fwrap>summary{display:none}
.p13filters{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.p13filters .p13f{display:inline-flex;align-items:center;gap:4px;min-width:0;max-width:100%;
  border:1px solid var(--line);border-radius:var(--rond-vol);background:#fff;padding:0 4px 0 12px;cursor:pointer}
.p13filters .p13f:hover{border-color:var(--acc)}
.p13filters .p13f.on{border-color:var(--acc);box-shadow:inset 0 0 0 1px var(--acc)}
.p13filters .p13fkop{font-size:var(--tekst-s);color:var(--mid);font-weight:600;white-space:nowrap}
.p13filters .p13f select{width:auto;min-width:0;max-width:200px;border:0;background:transparent;padding:6px 4px;
  font-size:var(--tekst-m);color:var(--ink);cursor:pointer;min-height:32px}
.p13filters .p13f select:focus{outline:none}
.p13filters .p13f:focus-within{outline:2px solid var(--acc);outline-offset:1px}
.p13filters .p13f.on select{font-weight:600}
.p13meer{display:flex;flex-direction:column;align-items:center;gap:6px;padding:18px 8px 10px}
.p13meer .wispil{padding:8px 18px;font-size:var(--tekst-m)}
.p13stand{font-variant-numeric:tabular-nums}
@media (max-width:600px){
  .p13fwrap>summary{display:inline-flex;align-items:center;gap:6px;list-style:none;cursor:pointer;
    border:1px solid var(--line);border-radius:var(--rond-vol);padding:6px 14px;font-size:var(--tekst-m);font-weight:600;background:#fff}
  .p13fwrap>summary::-webkit-details-marker{display:none}
  .p13fwrap>summary::after{content:"";width:7px;height:7px;border-right:1.6px solid currentColor;border-bottom:1.6px solid currentColor;
    transform:translateY(-2px) rotate(45deg);margin-left:2px}
  .p13fwrap[open]>summary{margin-bottom:10px}
  .p13fwrap[open]>summary::after{transform:translateY(2px) rotate(-135deg)}
  .p13fwrap>summary .n{opacity:.6;font-variant-numeric:tabular-nums}
  .p13filters{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .p13filters .p13f{padding:0 2px 0 10px}
  .p13filters .p13f select{max-width:none;flex:1 1 auto;width:100%}
  .p13filters .p13wis{grid-column:1/-1;justify-self:start}
}