/* ============================================================
   Beamtenstarter — Forum (nur auf den Forenseiten geladen)
   Farben ausschließlich über die Tokens aus style.css.
   Bei Änderungen ASSET_VERSION in netlify/forum/seiten.mjs hochzählen.
   ============================================================ */

.forum-seite [hidden]{display:none!important}

/* ---------- Kopfbereich ---------- */
.fo-hero{padding-bottom:56px}
.fo-hero-klein h1{font-size:clamp(28px,3.6vw,42px);overflow-wrap:break-word;hyphens:auto}
.fo-hero .hero-ctas{display:flex;flex-wrap:wrap;gap:14px}
.fo-stats{margin-top:22px;font-size:15px;color:var(--ink2)}
.fo-stats b{color:var(--ink)}
.fo-hero-meta{color:var(--ink2);font-size:16px;margin:0}

/* ---------- Abschnitte ---------- */
.fo-sec{padding:64px 0}
.fo-schmal{max-width:880px}
.fo-hinweis{margin-top:0}
.fo-chips{margin:8px 0 28px}
.fo-chips .chip{text-decoration:none;display:inline-flex;align-items:center;gap:8px}
.fo-chipzahl{display:inline-block;min-width:22px;padding:1px 7px;border-radius:999px;background:var(--sky-soft);color:var(--blue-deep);font-size:12px;text-align:center}
.chip.on .fo-chipzahl{background:#fff;color:var(--blue-deep)}

/* ---------- Themenliste ---------- */
.fo-liste{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.fo-zeile{display:grid;grid-template-columns:minmax(0,1fr) 104px 128px;gap:18px;align-items:center;background:var(--card);border:1px solid var(--line);border-radius:var(--radius-s);padding:18px 22px;transition:box-shadow .25s var(--ease),border-color .25s}
.fo-zeile:hover{border-color:var(--sky);box-shadow:var(--shadow-s)}
.fo-zeile-team{border-left:4px solid var(--sky)}
.fo-zeile-haupt{min-width:0}
.fo-liste li a.fo-zeile-titel{display:block;font-family:var(--font-head);font-weight:700;font-size:18px;line-height:1.35;color:var(--ink);text-decoration:none;margin:6px 0 4px;overflow-wrap:break-word}
.fo-liste li a.fo-zeile-titel:hover{color:var(--blue-deep);text-decoration:underline;text-underline-offset:3px}
.fo-zeile-meta{font-size:13.5px;color:var(--ink3)}
.fo-zeile-meta b{color:var(--ink2);font-weight:600}
.fo-zeile-zahl{text-align:center;font-size:13px;color:var(--ink3);line-height:1.2}
.fo-zeile-zahl b{display:block;font-family:var(--font-head);font-size:24px;color:var(--ink)}
.fo-zeile-letzte{font-size:13px;color:var(--ink3);text-align:right;line-height:1.4}
.fo-neu{display:inline-block;padding:3px 10px;border-radius:999px;background:#e9f6ef;color:#1d6b47;font-weight:700;font-size:12.5px}
.fo-leer{background:var(--card);border:1px dashed var(--sky);border-radius:var(--radius);padding:40px 28px;text-align:center}
.fo-leer h2{font-size:24px;margin-bottom:8px}
.fo-leer p{color:var(--ink2);margin:0 auto 20px;max-width:520px}
.fo-blaettern{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:24px;font-size:14px;color:var(--ink3)}

/* ---------- Abzeichen ---------- */
.fo-badge{display:inline-block;vertical-align:middle;padding:2px 9px;border-radius:999px;background:var(--sky-soft);color:var(--blue-deep);font-family:var(--font-head);font-weight:700;font-size:11.5px;letter-spacing:.02em}
.fo-badge-start{background:#fcf3e7;color:#8a5414}

/* ---------- Beiträge ---------- */
.fo-beitraege{list-style:none;margin:0 0 28px;padding:0;display:grid;gap:16px}
.fo-beitrag article{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:22px 24px 14px;box-shadow:var(--shadow-s)}
.fo-start article{border-color:var(--sky-line);border-left:4px solid var(--blue)}
.fo-team article{border-color:var(--sky);background:linear-gradient(180deg,#f6fbff 0%,#fff 60%)}
.fo-beitrag:target article,.fo-beitrag.fo-frisch article{box-shadow:0 0 0 3px var(--sky),var(--shadow-s)}
.fo-kopf{display:flex;gap:12px;align-items:center;margin-bottom:12px}
.fo-avatar{flex:0 0 40px;width:40px;height:40px;border-radius:50%;background:var(--sky-soft);color:var(--blue-deep);display:flex;align-items:center;justify-content:center;font-family:var(--font-head);font-weight:800;font-size:17px;overflow:hidden}
.fo-avatar img{width:40px;height:40px;object-fit:cover;display:block}
.fo-wer{min-width:0;line-height:1.45}
.fo-name{font-family:var(--font-head);font-weight:700;color:var(--ink)}
.fo-name a{color:var(--ink);text-decoration:none}
.fo-name a:hover{color:var(--blue-deep);text-decoration:underline}
.fo-beitrag a.fo-zeit{display:block;font-size:13px;color:var(--ink3);text-decoration:none}
.fo-beitrag a.fo-zeit:hover{text-decoration:underline}
.fo-text{font-size:16px;line-height:1.7;color:var(--ink);overflow-wrap:anywhere}
.fo-text p{margin:0 0 12px}
.fo-geloescht{color:var(--ink3);font-style:italic}
.fo-team-hinweis{font-size:13px;color:var(--ink3);border-top:1px solid var(--line);padding-top:10px;margin:4px 0 0}
.fo-aktionen{display:flex;justify-content:flex-end;gap:6px;margin-top:6px}
.fo-link{display:inline-flex;align-items:center;min-height:32px;padding:4px 10px;border:0;background:none;border-radius:8px;font:inherit;font-size:13px;color:var(--ink3);cursor:pointer}
.fo-link:hover{color:var(--blue-deep);background:var(--sky-soft)}
.fo-link:focus-visible{outline:3px solid var(--blue);outline-offset:2px}
.fo-admin{color:#b0412f}
.fo-noch-keine{color:var(--ink2);text-align:center;margin:0 0 24px}
.fo-kontext{margin-top:24px;font-size:15px}
.fo-kontext .chip-bar{margin-top:10px}
.fo-kontext .chip{text-decoration:none}
.fo-entfernen-panel{display:grid;gap:10px;margin-top:10px;padding:14px;border:1px solid #f2cec5;background:#faeae7;border-radius:var(--radius-s)}
.fo-entfernen-panel label{font-size:13px;font-weight:700;color:var(--ink)}
.fo-entfernen-panel .fo-knopfreihe{display:flex;gap:10px;flex-wrap:wrap}

/* ---------- Formulare ---------- */
.fo-form{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:30px;box-shadow:var(--shadow-s);margin-top:24px}
.fo-form .field{margin-bottom:20px}
.fo-opt{font-weight:400;color:var(--ink3);font-size:13px}
.fo-form .hint{font-size:13px;color:var(--ink3);margin-top:6px}
.fo-form [aria-invalid="true"]{border-color:#b0412f;box-shadow:0 0 0 3px rgba(176,65,47,.12)}
.fo-feldfehler{color:#b0412f;font-size:13.5px;font-weight:600;margin-top:6px}
.fo-schutz{margin:4px 0 18px;font-size:14.5px}
.fo-regeln{margin:6px 0 10px}
.consent.fo-fehlt{color:#b0412f}
.consent.fo-fehlt input{outline:2px solid #b0412f;outline-offset:2px}
.fo-form .ds-hinweis{font-size:13px;color:var(--ink3);margin:0 0 18px}
.fo-hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}
.fo-status{margin:14px 0 0;font-size:15px;min-height:1px}
.fo-status.ok{color:#1d6b47;font-weight:600}
.fo-status.fehler{color:#b0412f;font-weight:600}
.fo-team-nur{margin:0 0 18px}
.fo-form button[aria-busy="true"]{opacity:.7;cursor:progress}

/* ---------- Melde-Dialog ---------- */
.fo-dialog{position:fixed;inset:0;margin:auto;width:min(640px,calc(100% - 32px));height:fit-content;max-height:calc(100vh - 32px);overflow:auto;border:0;border-radius:var(--radius);padding:0;background:var(--card);box-shadow:var(--shadow-l);color:var(--ink)}
.fo-dialog::backdrop{background:rgba(60,66,71,.6)}
.fo-dialog h2{margin-top:0}
.fo-dialog .fo-form{margin:0;border:0;box-shadow:none}
.fo-dialog h2{font-size:24px;margin-bottom:8px}
.fo-dialog p{color:var(--ink2);font-size:15px;margin:0 0 18px}
.fo-dialog-knoepfe{display:flex;justify-content:flex-end;gap:12px;flex-wrap:wrap;margin-top:8px}

/* ---------- Aktionsseiten ---------- */
.fo-aktion-form{display:flex;flex-wrap:wrap;gap:14px;margin-top:24px}

/* ---------- Moderation ---------- */
.fo-mod-leiste{display:flex;justify-content:space-between;align-items:center;gap:14px;flex-wrap:wrap;background:var(--sky-soft);border:1px solid var(--sky-line);border-radius:var(--radius-s);padding:14px 18px}
.fo-mod-liste{list-style:none;padding:0;margin:0 0 40px;display:grid;gap:12px}
.fo-mod-eintrag{background:var(--card);border:1px solid var(--line);border-radius:var(--radius-s);padding:16px 18px}
.fo-mod-eintrag.fo-offen{border-left:4px solid #c94f3d}
.fo-mod-kopf{font-size:13.5px;color:var(--ink3);margin-bottom:6px}
.fo-mod-kopf a{font-weight:700}
.fo-mod-text{white-space:pre-wrap;overflow-wrap:anywhere;font-size:15px;margin:6px 0 10px}
.fo-mod-aktionen{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.fo-mod-aktionen select{width:auto;min-width:220px;padding:10px 40px 10px 12px;font-size:14px}

/* ---------- Abschluss ---------- */
.fo-cta{padding-top:24px}

@media(max-width:760px){
  .fo-sec{padding:44px 0}
  .fo-zeile{grid-template-columns:auto 1fr;gap:6px 14px;padding:16px 18px}
  .fo-zeile-haupt{grid-column:1/-1}
  .fo-zeile-zahl{text-align:left;display:flex;align-items:baseline;gap:6px}
  .fo-zeile-zahl b{display:inline;font-size:18px}
  .fo-zeile-letzte{text-align:right}
  .fo-zeile-letzte br{display:none}
  .fo-form{padding:22px 18px}
  .fo-beitrag article{padding:18px 18px 10px}
  .fo-blaettern{flex-wrap:wrap;justify-content:center}
  .fo-dialog-knoepfe .btn{flex:1 1 100%}
}
@media(prefers-reduced-motion:reduce){
  .fo-zeile{transition:none}
}