{{/*
  Split-View "Explorer": links Card-Liste mit Suche & Kategorie-Filter,
  rechts sticky Karte. Aufruf: (dict "pages" <slice>)
*/}}
{{ $pages := sort .pages "Title" "asc" }}
{{ $cats := site.Data.kategorien | default dict }}
{{ $showFilter := true }}{{ if isset . "showFilter" }}{{ $showFilter = .showFilter }}{{ end }}
{{ $markerColor := .markerColor }}

<div class="op-split">

  <div class="op-split__list">
    <div class="op-listhead">
      <div class="op-listhead__count" aria-live="polite"><span data-op-count>{{ len $pages }}</span>&nbsp;{{ i18n "results" }}</div>
      <div class="op-search">
        <input type="search" data-op-search placeholder="{{ i18n "searchPlaceholder" }}" aria-label="{{ i18n "searchAria" }}">
      </div>
    </div>

    {{ if $showFilter }}
    <details class="op-filter">
      <summary class="op-filter__summary">
        <span class="op-filter__label">{{ i18n "filterToggle" }}</span>
        <span class="op-filter__state" data-op-filter-state
              data-word-all="{{ i18n "wordAll" }}" data-word-of="{{ i18n "wordOf" }}"></span>
      </summary>
      <div class="op-filter__panel">
        <div class="op-filter-actions">
          <button type="button" class="op-filter-btn" data-op-filter-all>{{ i18n "filterSelectAll" }}</button>
          <button type="button" class="op-filter-btn" data-op-filter-none>{{ i18n "filterDeselectAll" }}</button>
        </div>
        <div class="op-map-filter" data-op-map-filter role="group" aria-label="{{ i18n "filterGroupAria" }}">
          {{ range $cat, $data := $cats }}
          <label class="op-map-filter__item">
            <input type="checkbox" value="{{ $cat }}" checked>
            <span class="op-map-filter__swatch" style="background:{{ $data.color }}"></span>
            {{ partial "kat-label.html" $cat }}
          </label>
          {{ end }}
        </div>
      </div>
    </details>
    {{ end }}

    <div class="op-scards">
      {{ range $pages }}
        {{ partial "schauplatz-card.html" . }}
      {{ end }}
    </div>
  </div>

  <div class="op-split__map">
    {{ partial "karte.html" (dict "pages" $pages) }}
  </div>

</div>