/* wz-ladung.css — Ladungsfähigkeits-Check. Nur Klassen mit Präfix wzl-.
   Farben aus den Variablen von app.css. Die Ampel trägt immer Text-Label und
   Symbol, die Farbe ist nur Zusatz. Textfarben auf den Flächen mit Kontrast AA. */
.no-js .wzl-aus,.no-js .wzl-reset{display:none}
.wzl-sec *,.wzl-sec *::before,.wzl-sec *::after{box-sizing:border-box}
.wzl-noscript{margin-top:18px}
.wzl-grid{margin-top:26px;display:grid;gap:26px;grid-template-columns:minmax(0,1fr);align-items:start;min-width:0}
@media (min-width:980px){.wzl-grid{grid-template-columns:minmax(0,1.05fr) minmax(0,1fr)}.wzl-aus{position:sticky;top:92px}}
.wzl-form{display:grid;gap:16px;min-width:0}
.wzl-fs{border:1px solid var(--line);border-radius:12px;padding:16px 16px 18px;margin:0;min-width:0;background:var(--cream-hi)}
.wzl-fs legend{font-weight:600;font-size:16px;line-height:1.4;padding:0 6px;color:var(--ink);max-width:100%;overflow-wrap:anywhere}
.wzl-nr{display:inline-grid;place-items:center;width:26px;height:26px;border-radius:50%;background:var(--petrol);color:#fff;font-size:13px;font-weight:700;margin-right:4px;vertical-align:1px}
.wzl-hilfe{margin:4px 0 10px;font-size:14px;color:var(--ink-72);line-height:1.5}
.wzl-opts{display:grid;gap:8px;grid-template-columns:minmax(0,1fr)}
@media (min-width:560px){#wzl-f2 .wzl-opts,#wzl-f3 .wzl-opts,#wzl-f4 .wzl-opts,#wzl-f6 .wzl-opts{grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}}
.wzl-opt{display:flex;align-items:flex-start;gap:10px;min-height:44px;padding:10px 12px;border:1px solid var(--line-soft);
  border-radius:10px;background:#fff;cursor:pointer;font-size:16px;line-height:1.4;min-width:0}
.wzl-opt input{width:22px;height:22px;flex:0 0 auto;margin:0;accent-color:var(--post)}
.wzl-opt span{min-width:0;overflow-wrap:anywhere}
.wzl-opt small{display:block;font-size:13.5px;color:var(--ink-52);margin-top:2px}
.wzl-opt:has(input:checked){border-color:var(--post);box-shadow:0 0 0 1px var(--post) inset}
.wzl-opt:focus-within{outline:2px solid var(--post);outline-offset:2px}
.wzl-note{margin:12px 0 0;padding:10px 12px;border-left:3px solid var(--post);background:var(--sky);border-radius:0 8px 8px 0;font-size:14.5px;line-height:1.5}
.wzl-note[hidden]{display:none}
.wzl-reset{justify-self:start;background:none;border:0;padding:10px 0;min-height:44px;font:inherit;font-size:15px;color:var(--ink-72);text-decoration:underline;cursor:pointer}
.wzl-reset:focus-visible{outline:2px solid var(--post);outline-offset:2px}

/* Ergebnis */
.wzl-aus{display:grid;gap:12px;min-width:0}
.wzl-aus__hd{margin:0;font-size:19px}
.wzl-ergebnis{border:1px solid var(--line);border-left-width:6px;border-radius:12px;padding:16px 18px;background:#fff;min-width:0;overflow-wrap:anywhere}
.wzl-ergebnis[data-stufe="gruen"]{border-left-color:#1F6B4F;background:#EEF7F2}
.wzl-ergebnis[data-stufe="gelb"]{border-left-color:#8C5A08;background:#FCF3E3}
.wzl-ergebnis[data-stufe="rot"]{border-left-color:#9B3A17;background:#FBEDE7}
.wzl-ampel{display:flex;align-items:center;gap:10px;margin-bottom:6px}
.wzl-ampel__ic{display:inline-flex;flex:0 0 auto}
.wzl-ampel--gruen .wzl-ampel__ic{color:#1F6B4F}
.wzl-ampel--gelb .wzl-ampel__ic{color:var(--amber)}
.wzl-ampel--rot .wzl-ampel__ic{color:#9B3A17}
.wzl-ampel--offen .wzl-ampel__ic{color:var(--ink-52)}
.wzl-ampel__k{margin:0;font-size:13px;letter-spacing:.08em;text-transform:uppercase;font-weight:700;color:var(--ink)}
.wzl-ampel__k b{font-size:15px;letter-spacing:.04em}
.wzl-ampel--gruen .wzl-ampel__k b{color:#1F6B4F}
.wzl-ampel--gelb .wzl-ampel__k b{color:#7A4E06}
.wzl-ampel--rot .wzl-ampel__k b{color:#8F3A1C}
.wzl-titel{margin:0 0 10px;font-family:var(--font-display);font-size:19px;font-weight:600;line-height:1.35;color:var(--ink)}
.wzl-text p,.wzl-gruende li{font-size:15.5px;line-height:1.55;color:var(--ink)}
.wzl-text p{margin:0 0 8px}
.wzl-gruende{margin:0 0 8px;padding-left:20px;display:grid;gap:8px}
.wzl-zusatz{margin:0 0 8px;font-size:14.5px;font-weight:600}
.wzl-links{margin:10px 0 0;font-size:14.5px}
.wzl-links a{display:inline-block;padding-block:6px}
.wzl-cta{margin:14px 0 0}
.wzl-cta .btn{min-height:44px;width:auto}
.wzl-hinweis{margin:12px 0 0;font-size:13.5px;color:var(--ink-72);line-height:1.5}
.wzl-legende{margin:0;display:flex;flex-wrap:wrap;gap:6px 16px;font-size:13.5px;color:var(--ink-72)}

/* Statische Übersicht, Faktenbox, Weiterlesen */
.wzl-tab-hd{margin:44px 0 6px;font-size:19px}
.wzl-tab th[scope="row"]{font-weight:600}
.wzl-fakten ul{margin:0;padding-left:18px;display:grid;gap:8px;font-size:15.5px;line-height:1.55}
.wzl-standzeile{margin:12px 0 0;font-size:13px;color:var(--ink-52)}
.wzl-antwort{max-width:760px;margin-top:36px}
.wzl-weiter{display:grid;gap:10px;grid-template-columns:minmax(0,1fr);margin-top:18px;padding:0;list-style:none}
@media (min-width:760px){.wzl-weiter{grid-template-columns:repeat(2,minmax(0,1fr))}}
.wzl-weiter a{display:block;min-height:44px;padding:12px 14px;border:1px solid var(--line-soft);border-radius:10px;background:var(--cream-hi);
  color:var(--ink);text-decoration:none;overflow-wrap:anywhere}
.wzl-weiter a:hover,.wzl-weiter a:focus-visible{border-color:var(--post)}
.wzl-weiter small{display:block;color:var(--ink-52);font-size:13px;margin-top:2px}
