/* Bezirkswahl unter der H1 der Gebietsseite (06.10.2026, Freigabe Max, Vorschau
   design-vorschau/berlin-bezirke, Variante "Auswahl"). Rechner: Liste klappt unter dem
   Feld auf (Ursprung oben links). Handy (< 640 px): Blatt von unten mit Schleier.
   Bewegung nur transform/opacity; reduzierte Bewegung = nur Einblenden. */
.bza{--bza-ease:cubic-bezier(.23,1,.32,1);--bza-drawer:cubic-bezier(.32,.72,0,1);position:relative;margin:4px 0 20px}
.bza-nurlesen{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.bza-feld{display:flex;align-items:center;gap:12px;width:100%;max-width:420px;min-height:56px;padding:8px 16px;border:1px solid #cbd5e1;border-radius:14px;background:#fff;color:#1e293b;font:inherit;text-align:left;cursor:pointer;box-shadow:0 1px 2px rgba(15,23,42,.05);transition:border-color 150ms ease,box-shadow 150ms ease,transform 120ms ease-out;-webkit-tap-highlight-color:transparent}
.bza-feld>svg{width:20px;height:20px;flex:0 0 auto;color:#2563eb}
.bza-feld>.bza-feld-pfeil{width:18px;height:18px;color:#64748b;transition:transform 200ms var(--bza-ease)}
.bza-feld[aria-expanded="true"]>.bza-feld-pfeil{transform:rotate(180deg)}
.bza-feld-text{display:flex;flex-direction:column;flex:1;min-width:0;line-height:1.25}
.bza-feld-text small{font-size:12px;color:#475569}
.bza-feld-text b{font-size:16px;font-weight:600;color:#0f172a}
.bza-feld-mehr{font-size:14px;font-weight:500;color:#2563eb}
.bza-feld:active{transform:scale(.98)}
.bza-feld:focus-visible{outline:2px solid #2563eb;outline-offset:2px}
.bza-blatt{position:absolute;z-index:50;top:calc(100% + 8px);left:0;width:min(420px,100%);max-height:min(70vh,560px);overflow:auto;overscroll-behavior:contain;background:#fff;border:1px solid #e2e8f0;border-radius:16px;padding:8px 12px 12px;box-shadow:0 12px 32px rgba(15,23,42,.16),0 2px 6px rgba(15,23,42,.06);transform-origin:top left;opacity:1;transform:none;transition:opacity 180ms var(--bza-ease),transform 180ms var(--bza-ease)}
.bza-blatt[hidden]{display:block;visibility:hidden;opacity:0;transform:scale(.96) translateY(-4px);pointer-events:none;transition:opacity 120ms ease-out,transform 120ms ease-out,visibility 0s 120ms}
.bza-kopf{display:flex;align-items:center;justify-content:space-between;padding:4px 4px 8px}
.bza-kopf h2{margin:0;font-size:16px;line-height:1.3;font-weight:600;letter-spacing:0;color:#0f172a}
.bza-zu{display:flex;align-items:center;justify-content:center;width:44px;height:44px;margin:-6px -10px -6px 0;border:0;background:transparent;border-radius:999px;color:#475569;cursor:pointer}
.bza-zu svg{width:20px;height:20px}
.bza-zu:focus-visible{outline:2px solid #2563eb}
.bza-liste{list-style:none;margin:0;padding:0}
.bza-e{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:48px;padding:12px 16px;border-radius:10px;background:#fff;color:#1e293b!important;font-size:15px;line-height:1.3;font-weight:500;text-decoration:none!important;transition:background-color 150ms ease,color 150ms ease;-webkit-tap-highlight-color:transparent}
.bza-e svg{flex:0 0 auto;width:16px;height:16px;color:#94a3b8}
.bza-ganz .bza-e{font-weight:600}
.bza-e[aria-current]{background:#eff6ff;color:#1e3a8a!important;font-weight:600}
.bza-e[aria-current] svg{color:#1e3a8a}
a.bza-e:active{background:#eff6ff}
a.bza-e:focus-visible{outline:2px solid #2563eb;outline-offset:-2px}
.bza-griff,.bza-schleier{display:none}
@media (hover:hover) and (pointer:fine){
  .bza-feld:hover{border-color:#2563eb;box-shadow:0 2px 8px rgba(37,99,235,.12)}
  a.bza-e:hover{background:#eff6ff;color:#1e3a8a!important}
  a.bza-e:hover svg{color:#2563eb}
}
@media (max-width:639px){
  .bza-feld{max-width:none}
  .bza-schleier{display:block;position:fixed;inset:0;z-index:2147483000;background:rgba(15,23,42,.4);opacity:1;transition:opacity 250ms ease}
  .bza-schleier[hidden]{display:block;opacity:0;pointer-events:none;visibility:hidden;transition:opacity 200ms ease,visibility 0s 200ms}
  .bza-blatt{position:fixed;z-index:2147483001;top:auto;left:0;right:0;bottom:0;width:auto;max-height:82vh;border-radius:20px 20px 0 0;border:0;padding:6px 16px calc(16px + env(safe-area-inset-bottom));transform-origin:bottom center;transition:transform 300ms var(--bza-drawer)}
  .bza-blatt[hidden]{opacity:1;transform:translateY(100%);transition:transform 200ms ease-out,visibility 0s 200ms}
  .bza-griff{display:block;width:36px;height:5px;border-radius:3px;background:#cbd5e1;margin:2px auto 8px}
  .bza-liste{border:1px solid #e2e8f0;border-radius:12px;overflow:hidden}
  .bza-liste li+li{border-top:1px solid #e2e8f0}
  .bza-e{border-radius:0}
}
@media (prefers-reduced-motion:reduce){
  .bza-feld:active{transform:none}
  .bza-blatt,.bza-blatt[hidden]{transform:none!important;transition:opacity 150ms ease,visibility 0s 150ms}
  .bza-blatt[hidden]{opacity:0}
}
