/* ============================================================
   WISO Community — Oberflaeche
   ------------------------------------------------------------
   Farben kommen aus den Tokens der Lernplattform (--wlt-*), mit
   eigenen Werten als Rueckfall. Dadurch passt die Community
   optisch zum Rest, uebernimmt den Dark Mode automatisch und
   bleibt ohne die anderen Plugins lauffaehig.
   ============================================================ */

.wiso-community {
    --c-primary: var(--wlt-primary, #0071E3);
    --c-primary-hover: var(--wlt-primary-hover, #0077ED);
    --c-primary-soft: var(--wlt-primary-soft, #F0F6FF);
    --c-text: var(--wlt-text, #1D1D1F);
    --c-muted: var(--wlt-muted, #6E6E73);
    --c-subtle: var(--wlt-gray-3, #A1A1A6);
    --c-surface: var(--wlt-surface, #FFFFFF);
    --c-bg: var(--wlt-bg, #F5F5F7);
    --c-line: var(--wlt-line, #D2D2D7);
    --c-line-soft: var(--wlt-line-soft, #E8E8ED);
    --c-hairline: var(--wlt-hairline, rgba(0,0,0,.10));
    --c-success: var(--wlt-success, #248A3D);
    --c-success-soft: var(--wlt-success-soft, #EAF9F0);
    --c-danger: var(--wlt-error, #D70015);
    --c-danger-soft: var(--wlt-error-soft, #FDF0F0);
    --c-radius: var(--wlt-radius-card, 18px);
    --c-radius-sm: 12px;
    --c-shadow: var(--wlt-shadow, 0 1px 2px rgba(0,0,0,.04), 0 8px 24px rgba(0,0,0,.05));
    --c-shadow-lift: var(--wlt-shadow-hover, 0 2px 4px rgba(0,0,0,.05), 0 16px 40px rgba(0,0,0,.10));
    --c-ease: var(--wlt-ease, cubic-bezier(.4,0,.2,1));

    /* Volle Breite wie die Lernseiten. Der Brotkruemelpfad
       laeuft von Rand zu Rand, der Inhalt steht in einer Spalte
       darunter - genau die Anordnung von /start/. */
    position: relative;
    left: 50%;
    width: 100vw;
    max-width: none;
    margin-left: -50vw;
    margin-right: 0;
    padding: 0 0 72px;
    background: var(--c-bg);
    color: var(--c-text);
    font-family: var(--wlt-font, -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", Roboto, sans-serif);
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}

.wiso-community__shell {
    width: min(calc(100% - 48px), 1320px);
    margin: 0 auto;
}

/* ---- Brotkruemelpfad --------------------------------------- */
/* Dieselbe Leiste wie auf den Lernseiten: 52px hoch, Haarlinie
   unten, milchige Flaeche. Sie ist das erste, was man sieht -
   dort entscheidet sich, ob die Community dazugehoert. */

.wiso-community__crumb {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    column-gap: 10px;
    height: 52px;
    margin: 0 0 15px;
    padding: 0 24px;
    border-bottom: 1px solid var(--c-line-soft);
    background: var(--wlt-veil, rgba(255,255,255,.95));
    box-sizing: border-box;
    color: var(--c-subtle);
    font-size: 12px;
}
.wiso-community__crumb > ol {
    display: flex;
    align-items: center;
    min-width: 0;
    margin: 0;
    padding: 0;
    list-style: none;
    overflow: hidden;
}
.wiso-community__crumb li {
    display: inline-flex;
    align-items: center;
    min-width: 0;
    margin: 0;
    white-space: nowrap;
}
.wiso-community__crumb li > span {
    padding: 0 7px;
    color: var(--c-subtle);
}
.wiso-community__crumb a {
    color: var(--c-muted);
    text-decoration: none;
}
.wiso-community__crumb a:hover { color: var(--c-text); }
.wiso-community__crumb strong {
    overflow: hidden;
    color: var(--c-text);
    font-weight: 600;
    text-overflow: ellipsis;
}

.wiso-community *,
.wiso-community *::before,
.wiso-community *::after { box-sizing: border-box; }

.wiso-community h1,
.wiso-community h2,
.wiso-community h3 { letter-spacing: -.02em; color: var(--c-text); }

/* ---- Navigation als Segmentleiste -------------------------- */

/* Einzelne Pillen statt eines gefuellten Balkens - dieselbe
   Form wie die Segmente im Lernmaterial. Der graue Kasten
   darunter zog vorher mehr Aufmerksamkeit auf sich als der
   Inhalt. Der aktive Punkt wird umgekehrt eingefaerbt, nicht
   blau: Blau bleibt der Handlung vorbehalten. */
.wiso-community__nav {
    display: flex;
    gap: 18px;
    align-items: center;
    margin: 4px 0 26px;
    padding: 0;
    flex-wrap: wrap;
}
.wiso-community__nav-group {
    display: flex;
    gap: 6px;
    padding: 0;
    background: none;
    border-radius: 0;
    overflow-x: auto;
    scrollbar-width: none;
    max-width: 100%;
}
.wiso-community__nav-group::-webkit-scrollbar { display: none; }
.wiso-community__nav-group.is-personal { margin-left: auto; }
.wiso-community__nav a {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-height: 36px;
    padding: 0 14px;
    border: 1px solid var(--c-line);
    border-radius: 999px;
    background: var(--c-surface);
    font-size: 14px;
    font-weight: 500;
    text-decoration: none;
    color: var(--c-muted);
    white-space: nowrap;
    transition: background .16s var(--c-ease), border-color .16s var(--c-ease), color .16s var(--c-ease);
}
.wiso-community__nav a:hover { background: var(--c-bg); border-color: var(--c-subtle); color: var(--c-text); }
.wiso-community__nav a[aria-current="page"] {
    background: var(--c-text);
    border-color: var(--c-text);
    color: var(--c-surface);
    font-weight: 600;
    box-shadow: none;
}
.wiso-community__nav a[aria-current="page"] .wiso-community__nav-badge {
    background: var(--c-surface);
    color: var(--c-text);
}
/* Auf schmalen Fenstern umbrechen statt seitlich scrollen: eine
   abgeschnittene Pille am Rand sieht nach Fehler aus, und dass
   man dort wischen kann, sieht man ihr nicht an. */
@media (max-width: 760px) {
    .wiso-community__nav { gap: 6px; }
    .wiso-community__nav-group { flex-wrap: wrap; overflow-x: visible; }
    .wiso-community__nav-group.is-personal { margin-left: 0; }
    .wiso-community__filters { flex-wrap: wrap; overflow-x: visible; }
}
.wiso-community__nav-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 18px;
    height: 18px;
    padding: 0 5px;
    border-radius: 999px;
    background: var(--c-primary);
    color: #fff;
    font-size: 11px;
    font-weight: 600;
    line-height: 1;
}

/* ---- Kopfbereiche ------------------------------------------ */

.wiso-community__page-header,
.wiso-community__header {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 24px;
    flex-wrap: wrap;
    margin: 0 0 22px;
}
.wiso-community__page-header h1,
.wiso-community__header h1 {
    margin: 0;
    font-size: clamp(26px, 4vw, 34px);
    font-weight: 700;
    letter-spacing: -.03em;
    line-height: 1.15;
}
.wiso-community__page-header p,
.wiso-community__header p {
    margin: 8px 0 0;
    font-size: 15px;
    line-height: 1.55;
    color: var(--c-muted);
    max-width: 58ch;
}
.wiso-community__eyebrow {
    margin: 0 0 6px;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: .07em;
    text-transform: uppercase;
    color: var(--c-muted);
}

/* Der Einstieg ist kein Kasten mehr. Auf den Lernseiten steht
   der Seitenkopf frei auf dem Grund - eine Karte um die
   Ueberschrift wirkt daneben wie ein Fremdkoerper und liess die
   Seite leer aussehen. */
.wiso-community__hero {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 28px;
    flex-wrap: wrap;
    padding: 0;
    margin: 0 0 26px;
    border: 0;
    border-radius: 0;
    background: none;
    box-shadow: none;
}
.wiso-community__hero h1 {
    margin: 0;
    font-size: clamp(30px, 4.4vw, 44px);
    font-weight: 650;
    letter-spacing: -.04em;
    line-height: 1.06;
}
.wiso-community__hero p { margin: 10px 0 0; font-size: 16px; line-height: 1.55; color: var(--c-muted); max-width: 52ch; }
.wiso-community__page-header h1,
.wiso-community__header h1 {
    font-size: clamp(30px, 4vw, 44px);
    font-weight: 650;
    letter-spacing: -.04em;
    line-height: 1.06;
}
/* Rubrik ueber der Ueberschrift, wie auf allen anderen Seiten. */
.wiso-community__eyebrow {
    display: block;
    margin: 0 0 8px;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: .09em;
    text-transform: uppercase;
    color: var(--c-subtle);
}
.wiso-community__page-actions { display: flex; gap: 10px; flex-wrap: wrap; }

/* ---- Layout ------------------------------------------------ */

.wiso-community__layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 280px;
    gap: 26px;
    align-items: start;
}
@media (max-width: 900px) {
    .wiso-community__layout { grid-template-columns: 1fr; }
}
.wiso-community__main { min-width: 0; }
.wiso-community__sidebar { display: flex; flex-direction: column; gap: 14px; }

/* ---- Karten ------------------------------------------------ */

.wiso-community__feed { display: flex; flex-direction: column; gap: 14px; }

.wiso-community__card {
    padding: 22px 24px;
    border: 1px solid var(--c-hairline);
    border-radius: var(--c-radius);
    background: var(--c-surface);
    box-shadow: var(--c-shadow);
    transition: box-shadow .2s var(--c-ease), transform .2s var(--c-ease);
}
.wiso-community__card:hover { box-shadow: var(--c-shadow-lift); transform: translateY(-1px); }
.wiso-community__card h2 { margin: 0 0 6px; font-size: 18px; font-weight: 600; line-height: 1.3; }
.wiso-community__card h2 a { color: var(--c-text); text-decoration: none; }
.wiso-community__card h2 a:hover { color: var(--c-primary); }
.wiso-community__card p { margin: 0; font-size: 14px; line-height: 1.6; color: var(--c-muted); }
.wiso-community__card img { max-width: 100%; height: auto; border-radius: var(--c-radius-sm); }
.wiso-community__card footer {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    margin-top: 16px;
    padding-top: 14px;
    border-top: 1px solid var(--c-line-soft);
    font-size: 13px;
    color: var(--c-muted);
}

.wiso-community__author { display: flex; align-items: center; gap: 10px; margin: 0 0 12px; font-size: 13px; }
.wiso-community__author img { width: 34px; height: 34px; border-radius: 50%; display: block; flex: 0 0 auto; }
.wiso-community__author span { display: flex; flex-direction: column; min-width: 0; }
.wiso-community__author strong { font-size: 14px; font-weight: 600; color: var(--c-text); }
.wiso-community__author small { font-size: 12px; color: var(--c-subtle); }

/* ---- Filter ------------------------------------------------ */

/* Dieselben Pillen wie in der Segmentleiste - eine Seite, eine
   Form. Der gefuellte Balken darunter ist weg. */
.wiso-community__filters {
    display: flex;
    gap: 6px;
    padding: 0;
    margin: 0 0 18px;
    background: none;
    border-radius: 0;
    overflow-x: auto;
    scrollbar-width: none;
}
.wiso-community__filters::-webkit-scrollbar { display: none; }
.wiso-community__filters a {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    min-height: 34px;
    padding: 0 14px;
    border: 1px solid var(--c-line);
    border-radius: 999px;
    background: var(--c-surface);
    font-size: 13.5px;
    font-weight: 500;
    color: var(--c-muted);
    text-decoration: none;
    white-space: nowrap;
    transition: background .16s var(--c-ease), border-color .16s var(--c-ease), color .16s var(--c-ease);
}
.wiso-community__filters a:hover { background: var(--c-bg); border-color: var(--c-subtle); color: var(--c-text); }
.wiso-community__filters a[aria-current="page"] {
    background: var(--c-text);
    border-color: var(--c-text);
    color: var(--c-surface);
    font-weight: 600;
    box-shadow: none;
}

/* ---- Schaltflaechen ---------------------------------------- */

/* Hoehe 44 wie alle Bedienelemente der Plattform. Vorher waren
   es 40 und daneben ein Suchknopf mit 44 - nebeneinander sah das
   nach Zufall aus. */
.wiso-community__button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    min-height: var(--wlt-control, 44px);
    padding: 0 22px;
    border: 1px solid var(--c-primary);
    border-radius: 999px;
    background: var(--c-primary);
    color: #fff;
    font-size: 14.5px;
    font-weight: 600;
    font-family: inherit;
    text-decoration: none;
    cursor: pointer;
    transition: background .18s var(--c-ease), border-color .18s var(--c-ease);
}
.wiso-community__button:hover { background: var(--c-primary-hover); border-color: var(--c-primary-hover); color: #fff; }
.wiso-community__button:focus-visible { outline: 3px solid rgba(0,113,227,.28); outline-offset: 2px; }
.wiso-community__button.is-secondary {
    background: var(--c-surface);
    color: var(--c-text);
    border: 1px solid var(--c-line);
}
.wiso-community__button.is-secondary:hover { border-color: var(--c-subtle); }
.wiso-community__button.is-secondary:hover { background: var(--c-bg); color: var(--c-text); }

.wiso-community__text-button {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 34px;
    padding: 0 10px;
    border: 0;
    border-radius: 8px;
    background: none;
    color: var(--c-muted);
    font-size: 13px;
    font-family: inherit;
    cursor: pointer;
    transition: background .15s var(--c-ease), color .15s var(--c-ease);
}
.wiso-community__text-button:hover { background: var(--c-bg); color: var(--c-text); }

.wiso-community__inline-form { display: inline-flex; margin: 0; }

/* ---- Formulare --------------------------------------------- */

.wiso-community__form-card {
    padding: 28px 30px;
    border: 1px solid var(--c-hairline);
    border-radius: var(--c-radius);
    background: var(--c-surface);
    box-shadow: var(--c-shadow);
}
.wiso-community__form-card h1 { margin: 0 0 20px; font-size: 24px; font-weight: 700; }
.wiso-community label { display: block; margin: 0 0 16px; font-size: 13px; font-weight: 600; color: var(--c-text); }
.wiso-community input[type=text],
.wiso-community input[type=search],
.wiso-community input[type=email],
.wiso-community select,
.wiso-community textarea {
    display: block;
    width: 100%;
    margin-top: 6px;
    padding: 11px 14px;
    border: 1px solid var(--c-line);
    border-radius: var(--c-radius-sm);
    background: var(--c-surface);
    color: var(--c-text);
    font: inherit;
    font-size: 15px;
    font-weight: 400;
    transition: border-color .18s var(--c-ease), box-shadow .18s var(--c-ease);
}
.wiso-community textarea { min-height: 130px; resize: vertical; line-height: 1.6; }
.wiso-community :is(input, select, textarea):focus {
    outline: 0;
    border-color: var(--c-primary);
    box-shadow: 0 0 0 3px rgba(0,113,227,.16);
}
.wiso-community label input[type=checkbox] { display: inline-block; width: auto; margin: 0 8px 0 0; }

/* ---- Seitenleiste ------------------------------------------ */

.wiso-community__sidebar > section,
.wiso-community__category-grid > article {
    padding: 18px 20px;
    border: 1px solid var(--c-hairline);
    border-radius: var(--c-radius);
    background: var(--c-surface);
}
.wiso-community__sidebar h2 {
    margin: 0 0 12px;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: .05em;
    text-transform: uppercase;
    color: var(--c-muted);
}
.wiso-community__category-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
    gap: 14px;
}
.wiso-community__category-grid h2 { margin: 0 0 6px; font-size: 17px; font-weight: 600; }
.wiso-community__category-grid h2 a { color: var(--c-text); text-decoration: none; }
.wiso-community__category-grid p { margin: 0 0 10px; font-size: 13.5px; line-height: 1.55; color: var(--c-muted); }
.wiso-community__category-grid span { font-size: 12px; color: var(--c-subtle); }

/* ---- Hinweise und Leerzustaende ---------------------------- */

.wiso-community__notice {
    padding: 14px 18px;
    margin: 0 0 18px;
    border-radius: var(--c-radius-sm);
    background: var(--c-primary-soft);
    color: var(--c-primary);
    font-size: 14px;
    font-weight: 500;
}
.wiso-community__notice.is-error { background: var(--c-danger-soft); color: var(--c-danger); }
.wiso-community__notice.is-success { background: var(--c-success-soft); color: var(--c-success); }

.wiso-community__empty {
    padding: 56px 28px;
    text-align: center;
    border: 1px dashed var(--c-line);
    border-radius: var(--c-radius);
    background: var(--c-surface);
}
.wiso-community__empty h2,
.wiso-community__empty h3 { margin: 0 0 8px; font-size: 19px; font-weight: 600; }
.wiso-community__empty p { margin: 0 0 18px; font-size: 14px; line-height: 1.6; color: var(--c-muted); }

/* Zugangsschranke
   ------------------------------------------------------------
   Die Grundregel stellt .wiso-community ueber die volle Breite:
   position:relative, left:50%, width:100vw und ein negativer
   Rand, der das wieder ausgleicht. Hier wurde frueher nur der
   Rand ueberschrieben - left:50% blieb stehen und schob die
   Karte eine halbe Bildschirmbreite nach rechts. Wer angemeldet
   war, merkte davon nichts; wer es nicht war, sah nur einen
   Rest am rechten Rand.

   Deshalb setzt diese Regel die ganze Anordnung neu und nicht
   nur ein Stueck davon. */
.wiso-community--locked {
    position: static;
    left: auto;
    width: auto;
    max-width: 620px;
    margin: 56px auto;
    padding: 0 20px;
}

/* ---- Einzelbeitrag ----------------------------------------- */

.wiso-community__post {
    padding: 30px 32px;
    border: 1px solid var(--c-hairline);
    border-radius: var(--c-radius);
    background: var(--c-surface);
    box-shadow: var(--c-shadow);
}
.wiso-community__post h1 {
    margin: 0 0 16px;
    font-size: clamp(24px, 3.4vw, 31px);
    font-weight: 700;
    letter-spacing: -.03em;
    line-height: 1.18;
}
.wiso-community__post > img { width: 100%; height: auto; border-radius: var(--c-radius-sm); margin: 0 0 20px; }
.wiso-community__body { font-size: 16px; line-height: 1.72; color: var(--c-text); }
.wiso-community__body > * + * { margin-top: 1em; }
.wiso-community__body a { color: var(--c-primary); }
.wiso-community__body ul, .wiso-community__body ol { padding-left: 22px; }

/* ---- Kommentare -------------------------------------------- */

.wiso-community__comments { margin-top: 30px; padding-top: 24px; border-top: 1px solid var(--c-line-soft); }
.wiso-community__comments h2 { margin: 0 0 16px; font-size: 18px; font-weight: 600; }
.wiso-community__comment {
    padding: 16px 18px;
    margin: 0 0 10px;
    border: 1px solid var(--c-line-soft);
    border-radius: var(--c-radius-sm);
    background: var(--c-surface);
}
.wiso-community__comment p { margin: 8px 0 0; font-size: 14.5px; line-height: 1.6; }
.wiso-community__comment.is-reply {
    margin: 10px 0 0 26px;
    background: var(--c-bg);
    border-color: transparent;
}

.wiso-community__report {
    margin-top: 12px;
    padding: 16px 18px;
    border: 1px solid var(--c-line-soft);
    border-radius: var(--c-radius-sm);
    background: var(--c-bg);
}

/* ---- Chat -------------------------------------------------- */

.wiso-community__chat {
    display: grid;
    grid-template-columns: 300px minmax(0, 1fr);
    gap: 16px;
    align-items: start;
}
@media (max-width: 820px) {
    .wiso-community__chat { grid-template-columns: 1fr; }
    .wiso-community__chat.has-active .wiso-community__chat-sidebar { display: none; }
    .wiso-community__chat:not(.has-active) .wiso-community__chat-main { display: none; }
}

.wiso-community__chat-sidebar {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 16px;
    border: 1px solid var(--c-hairline);
    border-radius: var(--c-radius);
    background: var(--c-surface);
}
.wiso-community__chat-sidebar-head h2 { margin: 0; font-size: 17px; font-weight: 700; }
.wiso-community__member-search { display: flex; flex-direction: column; gap: 8px; }
.wiso-community__member-search label { margin: 0; }
.wiso-community__member-results { display: flex; flex-direction: column; gap: 8px; }
.wiso-community__member-result {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px;
    border-radius: var(--c-radius-sm);
    background: var(--c-bg);
}
.wiso-community__member-result img { width: 34px; height: 34px; border-radius: 50%; }
.wiso-community__member-result span { display: flex; flex-direction: column; min-width: 0; flex: 1; }
.wiso-community__member-result strong { font-size: 14px; font-weight: 600; }
.wiso-community__member-result small { font-size: 12px; color: var(--c-muted); }

.wiso-community__conversation-list { display: flex; flex-direction: column; gap: 2px; max-height: 52vh; overflow-y: auto; }
.wiso-community__conversation {
    display: flex;
    align-items: center;
    gap: 11px;
    padding: 10px;
    border-radius: var(--c-radius-sm);
    text-decoration: none;
    color: var(--c-text);
}
.wiso-community__conversation:hover { background: var(--c-bg); }
.wiso-community__conversation[aria-current="page"] { background: var(--c-primary-soft); }
.wiso-community__conversation img { width: 40px; height: 40px; border-radius: 50%; flex: 0 0 auto; }
.wiso-community__conversation span { display: flex; flex-direction: column; min-width: 0; flex: 1; }
.wiso-community__conversation strong { font-size: 14px; font-weight: 600; }
.wiso-community__conversation small {
    font-size: 12px;
    color: var(--c-muted);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.wiso-community__conversation b {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 20px;
    height: 20px;
    padding: 0 6px;
    border-radius: 999px;
    background: var(--c-primary);
    color: #fff;
    font-size: 11px;
    font-weight: 600;
}

.wiso-community__chat-main {
    display: flex;
    flex-direction: column;
    border: 1px solid var(--c-hairline);
    border-radius: var(--c-radius);
    background: var(--c-surface);
    overflow: hidden;
    min-height: 58vh;
}
.wiso-community__conversation-head {
    display: flex;
    align-items: center;
    gap: 11px;
    padding: 14px 18px;
    border-bottom: 1px solid var(--c-line-soft);
}
.wiso-community__conversation-head img { width: 40px; height: 40px; border-radius: 50%; }
.wiso-community__conversation-head div { display: flex; flex-direction: column; min-width: 0; }
.wiso-community__conversation-head strong { font-size: 15px; font-weight: 600; }
.wiso-community__conversation-head a { font-size: 12.5px; color: var(--c-primary); text-decoration: none; }
.wiso-community__chat-back { margin-right: 4px; font-size: 13px; }

.wiso-community__messages {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 18px;
    overflow-y: auto;
    max-height: 52vh;
}
.wiso-community__message {
    max-width: 74%;
    padding: 10px 14px;
    border-radius: 18px;
    background: var(--c-bg);
    color: var(--c-text);
    align-self: flex-start;
}
.wiso-community__message p { margin: 0; font-size: 15px; line-height: 1.5; }
.wiso-community__message small { display: block; margin-top: 4px; font-size: 11px; opacity: .68; }
.wiso-community__message.is-own { align-self: flex-end; background: var(--c-primary); color: #fff; }

.wiso-community__chat-compose {
    display: flex;
    gap: 10px;
    align-items: flex-end;
    padding: 14px 18px;
    border-top: 1px solid var(--c-line-soft);
}
.wiso-community__chat-compose label { margin: 0; }
.wiso-community__chat-compose textarea { min-height: 44px; max-height: 140px; margin-top: 0; }
.wiso-community__chat-compose button { flex: 0 0 auto; }

.screen-reader-text {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
}

/* ---- Mobil ------------------------------------------------- */

@media (max-width: 640px) {
    .wiso-community { padding: 0 14px 84px; }
    .wiso-community__hero { padding: 24px 20px; }
    .wiso-community__card { padding: 18px; }
    .wiso-community__post,
    .wiso-community__form-card { padding: 20px; }
    .wiso-community__button,
    .wiso-community__text-button { min-height: 44px; }
    .wiso-community__nav a { min-height: 40px; }
    .wiso-community__nav { gap: 10px; }
    .wiso-community__nav-group.is-personal { margin-left: 0; }
    .wiso-community__comment.is-reply { margin-left: 14px; }
    .wiso-community__message { max-width: 86%; }
}

@media (prefers-reduced-motion: reduce) {
    .wiso-community *,
    .wiso-community *::before,
    .wiso-community *::after { transition: none !important; }
}

/* ---- Weitere vom Markup genutzte Bausteine ------------------ */

.wiso-community__content { min-width: 0; }
.wiso-community__page-head { margin: 0 0 22px; }
.wiso-community__header-actions,
.wiso-community__actions { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }

.wiso-community__meta { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; font-size: 13px; color: var(--c-muted); }
.wiso-community__meta strong { font-weight: 600; color: var(--c-text); }
.wiso-community__hint { margin: 6px 0 0; font-size: 12.5px; line-height: 1.5; color: var(--c-subtle); font-weight: 400; }

.wiso-community__badges { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.wiso-community__badges span {
    display: inline-flex;
    align-items: center;
    height: 24px;
    padding: 0 10px;
    border-radius: 999px;
    background: var(--c-bg);
    color: var(--c-muted);
    font-size: 12px;
    font-weight: 500;
}

/* Fragen und Antworten */
.wiso-community__question-list { display: flex; flex-direction: column; gap: 14px; }
.wiso-community__question-card,
.wiso-community__question {
    padding: 22px 24px;
    border: 1px solid var(--c-hairline);
    border-radius: var(--c-radius);
    background: var(--c-surface);
    box-shadow: var(--c-shadow);
}
.wiso-community__question h1 { margin: 0 0 14px; font-size: clamp(22px, 3.2vw, 28px); font-weight: 700; letter-spacing: -.03em; line-height: 1.2; }
.wiso-community__question-card h2 { margin: 0 0 6px; font-size: 18px; font-weight: 600; line-height: 1.3; }
.wiso-community__question-card h2 a { color: var(--c-text); text-decoration: none; }
.wiso-community__question-card h2 a:hover { color: var(--c-primary); }

.wiso-community__answers { display: flex; flex-direction: column; gap: 12px; margin-top: 26px; }
.wiso-community__answers > h2 { margin: 0; font-size: 18px; font-weight: 600; }
.wiso-community__answer {
    padding: 18px 20px;
    border: 1px solid var(--c-line-soft);
    border-radius: var(--c-radius-sm);
    background: var(--c-surface);
}
.wiso-community__answer p { margin: 8px 0 0; font-size: 15px; line-height: 1.65; }

.wiso-community__card-body { margin-top: 10px; font-size: 14px; line-height: 1.6; color: var(--c-muted); }

/* Suche */
.wiso-community__search { display: flex; gap: 10px; align-items: flex-end; margin: 0 0 20px; flex-wrap: wrap; }
.wiso-community__search label { margin: 0; flex: 1; min-width: 220px; }

/* Profil, Statistik, Benachrichtigungen */
.wiso-community__profile {
    display: flex;
    align-items: center;
    gap: 18px;
    padding: 24px 26px;
    margin: 0 0 18px;
    border: 1px solid var(--c-hairline);
    border-radius: var(--c-radius);
    background: var(--c-surface);
    box-shadow: var(--c-shadow);
    flex-wrap: wrap;
}
.wiso-community__profile img { width: 68px; height: 68px; border-radius: 50%; }
.wiso-community__profile h1 { margin: 0; font-size: 24px; font-weight: 700; }

.wiso-community__stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 12px; margin: 0 0 18px; }
.wiso-community__stats > div {
    padding: 18px 20px;
    border: 1px solid var(--c-hairline);
    border-radius: var(--c-radius);
    background: var(--c-surface);
}
.wiso-community__stats span { display: block; font-size: 12.5px; color: var(--c-muted); }
.wiso-community__stats strong { display: block; margin-top: 4px; font-size: 24px; font-weight: 700; letter-spacing: -.02em; color: var(--c-text); }

.wiso-community__notifications { display: flex; flex-direction: column; gap: 8px; }
.wiso-community__notifications > article {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 14px 18px;
    border: 1px solid var(--c-line-soft);
    border-radius: var(--c-radius-sm);
    background: var(--c-surface);
}
.wiso-community__notifications > article.is-unread { background: var(--c-primary-soft); border-color: transparent; }
.wiso-community__notifications strong { font-size: 14px; font-weight: 600; }
.wiso-community__notifications small { font-size: 12px; color: var(--c-subtle); }

.wiso-community__side-card {
    padding: 18px 20px;
    border: 1px solid var(--c-hairline);
    border-radius: var(--c-radius);
    background: var(--c-surface);
}
.wiso-community__side-card h2 {
    margin: 0 0 12px;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: .05em;
    text-transform: uppercase;
    color: var(--c-muted);
}

@media (max-width: 640px) {
    .wiso-community__question-card,
    .wiso-community__question { padding: 18px; }
    .wiso-community__profile { padding: 18px; gap: 14px; }
    .wiso-community__profile img { width: 56px; height: 56px; }
}

/* ---- Seitenkarten mit Linkliste ----------------------------- */
/* Die Kategorien im Seitenbereich stehen als blanke <a> direkt in
   der Section, ohne Liste. Sie brauchen daher eine eigene Regel,
   sonst stapeln sie sich unformatiert untereinander. */

.wiso-community__side-card a,
.wiso-community__sidebar > section a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 9px 10px;
    margin: 0 -10px;
    border-radius: 9px;
    color: var(--c-text);
    text-decoration: none;
    font-size: 14px;
    line-height: 1.4;
    transition: background .15s var(--c-ease), color .15s var(--c-ease);
}
.wiso-community__side-card a + a,
.wiso-community__sidebar > section a + a { margin-top: 1px; }
.wiso-community__side-card a:hover,
.wiso-community__sidebar > section a:hover { background: var(--c-bg); color: var(--c-primary); }
.wiso-community__side-card a > span,
.wiso-community__sidebar > section a > span {
    flex: 0 0 auto;
    min-width: 22px;
    padding: 1px 7px;
    border-radius: 999px;
    background: var(--c-bg);
    color: var(--c-subtle);
    font-size: 12px;
    font-weight: 500;
    text-align: center;
    font-variant-numeric: tabular-nums;
}
.wiso-community__side-card a:hover > span,
.wiso-community__sidebar > section a:hover > span { background: var(--c-surface); }

/* ---- Suchfeld ---------------------------------------------- */

.wiso-community__search input[type=search] { margin-top: 0; }
.wiso-community__search button {
    flex: 0 0 auto;
    min-height: 44px;
    padding: 0 20px;
    border: 0;
    border-radius: 999px;
    background: var(--c-primary);
    color: #fff;
    font-size: 14px;
    font-weight: 600;
    font-family: inherit;
    cursor: pointer;
}
.wiso-community__search button:hover { background: var(--c-primary-hover); }

/* ---- Blaetternavigation ------------------------------------ */

.wiso-community__pagination {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 6px;
    margin: 28px 0 0;
    flex-wrap: wrap;
}
.wiso-community__pagination .page-numbers {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 40px;
    min-height: 40px;
    padding: 0 12px;
    border-radius: 999px;
    background: var(--c-surface);
    border: 1px solid var(--c-line);
    color: var(--c-text);
    font-size: 14px;
    font-weight: 500;
    text-decoration: none;
    transition: background .15s var(--c-ease), border-color .15s var(--c-ease);
}
.wiso-community__pagination .page-numbers:hover { background: var(--c-bg); border-color: var(--c-text); }
.wiso-community__pagination .page-numbers.current {
    background: var(--c-primary);
    border-color: var(--c-primary);
    color: #fff;
    font-weight: 600;
}
.wiso-community__pagination .page-numbers.dots { border-color: transparent; background: none; }

/* ---- Bewertung als Auf-Ab-Schalter -------------------------- */
/* Punktestand in der Mitte, Pfeile darueber und darunter. Die
   eigene Stimme ist eingefaerbt; ein zweiter Klick nimmt sie
   zurueck. Ein Knopf "Stimme entfernen" entfaellt dadurch. */

/* Die Antwortzahl stand mittig, weil drei Kinder mit
   space-between genau das ergeben. Sie gehoert aber neben die
   Bewertung; nach rechts geschoben wird nur die rechte Gruppe. */
.wiso-community__actionbar {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 12px;
    flex-wrap: wrap;
    margin-top: 20px;
    padding-top: 16px;
    border-top: 1px solid var(--c-line-soft);
}
.wiso-community__actionbar-right {
    display: flex;
    align-items: center;
    gap: 4px;
    flex-wrap: wrap;
}

.wiso-community__vote {
    display: inline-flex;
    align-items: center;
    gap: 2px;
    padding: 3px;
    border: 1px solid var(--c-line);
    border-radius: 999px;
    background: var(--c-surface);
}
.wiso-community__vote .wiso-community__inline-form { display: inline-flex; margin: 0; }

.wiso-community__vote-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: none;
    color: var(--c-muted);
    cursor: pointer;
    transition: background .15s var(--c-ease), color .15s var(--c-ease);
}
.wiso-community__vote-btn svg { width: 20px; height: 20px; fill: currentColor; display: block; }
.wiso-community__vote-btn:hover { background: var(--c-bg); color: var(--c-text); }
.wiso-community__vote-btn.is-up.is-active { color: var(--c-success); background: var(--c-success-soft); }
.wiso-community__vote-btn.is-down.is-active { color: var(--c-danger); background: var(--c-danger-soft); }
.wiso-community__vote-btn:focus-visible { outline: 3px solid rgba(0,113,227,.28); outline-offset: 1px; }
.wiso-community__vote-btn[disabled] { opacity: .35; cursor: default; }
.wiso-community__vote-btn[disabled]:hover { background: none; color: var(--c-muted); }

.wiso-community__vote-score {
    min-width: 30px;
    padding: 0 4px;
    text-align: center;
    font-size: 15px;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    color: var(--c-text);
}
.wiso-community__vote-score.is-voted { color: var(--c-primary); }
.wiso-community__vote.is-static { border-color: transparent; background: none; padding: 0; }

/* Titel der Einzelseite kommt aus der Community-Karte; die
   zusaetzliche Theme-Ueberschrift waere eine Dopplung. */
body.single-wiso_c_question .entry-title,
body.single-wiso_c_post .entry-title,
body.single-wiso_c_question .entry-hero h1,
body.single-wiso_c_post .entry-hero h1 { display: none; }

@media (max-width: 640px) {
    .wiso-community__actionbar { gap: 12px; }
    .wiso-community__vote-btn { width: 40px; height: 40px; }
}

/* ---- Korrekturen aus der Sichtpruefung --------------------- */

/* Suchfeld: die allgemeine Regel macht Suchfelder 100 % breit,
   dadurch rutschte der Knopf in die naechste Zeile. Hier zaehlt
   die verfuegbare Breite, nicht die volle. */
.wiso-community__search input[type="search"] {
    flex: 1 1 240px;
    width: auto;
    min-width: 0;
    margin-top: 0;
}
.wiso-community__search label.screen-reader-text { flex: 0 0 auto; }

/* Fragenkarte: Text links, Kennzahlen rechts kompakt.
   .wiso-community__stats stammt von der Profilseite und brachte
   dort gedachte Kachelgroessen mit. */
.wiso-community__question-card:has(.wiso-community__stats) {
    display: flex;
    align-items: flex-start;
    gap: 22px;
}
.wiso-community__question-card:has(.wiso-community__stats) .wiso-community__card-body { flex: 1; min-width: 0; }
.wiso-community__question-card .wiso-community__card-body h2 { margin: 8px 0 6px; }
.wiso-community__question-card .wiso-community__card-body p {
    margin: 0 0 10px;
    font-size: 14px;
    line-height: 1.6;
    color: var(--c-muted);
}
.wiso-community__question-card .wiso-community__card-body small {
    font-size: 12.5px;
    color: var(--c-subtle);
}
.wiso-community__question-card .wiso-community__stats {
    display: flex;
    flex-direction: column;
    gap: 8px;
    flex: 0 0 auto;
    margin: 0;
    padding: 0;
    grid-template-columns: none;
}
.wiso-community__question-card .wiso-community__stats > span {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-width: 62px;
    padding: 9px 10px;
    border: 1px solid var(--c-line-soft);
    border-radius: var(--c-radius-sm);
    background: var(--c-surface);
    font-size: 11px;
    color: var(--c-muted);
    line-height: 1.3;
    text-align: center;
}
.wiso-community__question-card .wiso-community__stats strong {
    font-size: 17px;
    font-weight: 600;
    color: var(--c-text);
    font-variant-numeric: tabular-nums;
}

/* Marken in der Karte einheitlich */
.wiso-community__badges span,
.wiso-community__badges a {
    display: inline-flex;
    align-items: center;
    height: 22px;
    padding: 0 9px;
    border-radius: 999px;
    background: var(--c-bg);
    color: var(--c-muted);
    font-size: 11.5px;
    font-weight: 500;
    text-decoration: none;
    letter-spacing: .01em;
}
.wiso-community__badges a:hover { color: var(--c-primary); background: var(--c-primary-soft); }

@media (max-width: 600px) {
    .wiso-community__question-card:has(.wiso-community__stats) { flex-direction: column; gap: 14px; }
    .wiso-community__question-card .wiso-community__stats { flex-direction: row; }
    .wiso-community__question-card .wiso-community__stats > span { flex: 1; }
}

/* Knoepfe ohne eigene Klasse innerhalb von Karten und Formularen.
   "Kategorie folgen" etwa steht als blanker <button> im Markup und
   uebernahm sonst die Gestaltung des Themes. */
.wiso-community__card form button:not([class]),
.wiso-community__category-grid form button:not([class]),
.wiso-community__report button:not([class]),
.wiso-community__form-card form button:not([class]) {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 38px;
    padding: 0 16px;
    border: 1px solid var(--c-line);
    border-radius: 999px;
    background: var(--c-surface);
    color: var(--c-text);
    font: inherit;
    font-size: 13.5px;
    font-weight: 500;
    cursor: pointer;
    transition: background .15s var(--c-ease), border-color .15s var(--c-ease);
}
.wiso-community__card form button:not([class]):hover,
.wiso-community__category-grid form button:not([class]):hover {
    background: var(--c-bg);
    border-color: var(--c-text);
}

/* Kategoriekarte: leere Beschreibung soll keine Luecke reissen */
.wiso-community__category-grid article { display: flex; flex-direction: column; gap: 8px; }
.wiso-community__category-grid p:empty { display: none; }
.wiso-community__category-grid form { margin-top: 4px; }

/* Leerzustand ohne Ueberschrift lesbar halten */
.wiso-community__empty { font-size: 15px; line-height: 1.6; color: var(--c-muted); }

/* Mitgliedersuche in der schmalen Spalte */
.wiso-community__member-search label { display: flex; flex-direction: column; gap: 6px; margin: 0; }
.wiso-community__member-search input { margin-top: 0; }
.wiso-community__member-search .wiso-community__button { align-self: flex-start; }

/* ---- Korrekturen Chat und Aktionsleiste -------------------- */

/* Der Absatz einer Nachricht bekam vom Theme 32 px Aussenabstand
   nach unten - gleiche Spezifitaet, spaeter geladen, also
   gewann das Theme. Mit dem zusaetzlichen Vorfahren gewinnt hier
   wieder die Community. */
.wiso-community .wiso-community__message p { margin: 0; }
.wiso-community .wiso-community__message small {
    display: flex;
    flex-direction: column;
    gap: 1px;
    margin: 5px 0 0;
    font-size: 11px;
    line-height: 1.35;
    opacity: .72;
}
.wiso-community .wiso-community__message small em { font-style: normal; opacity: .8; }

/* Mitgliedersuche: ein ruhiges Feld statt Beschriftung ueber
   nacktem Eingabefeld. */
.wiso-community__member-search { display: flex; flex-direction: column; gap: 10px; }
.wiso-community .wiso-community__member-search label {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin: 0;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: .03em;
    text-transform: uppercase;
    color: var(--c-muted);
}
.wiso-community .wiso-community__member-search input {
    width: 100%;
    height: 42px;
    margin: 0;
    padding: 0 15px;
    border: 1px solid var(--c-line);
    border-radius: 999px;
    background: var(--c-bg);
    color: var(--c-text);
    font-size: 15px;
    font-weight: 400;
    text-transform: none;
    letter-spacing: normal;
}
.wiso-community .wiso-community__member-search input:focus {
    background: var(--c-surface);
    border-color: var(--c-primary);
    box-shadow: 0 0 0 3px rgba(0,113,227,.16);
    outline: 0;
}
.wiso-community__member-search .wiso-community__button { align-self: stretch; }

/* Suchergebnis: Name und Schaltflaeche untereinander. In der
   schmalen Spalte wurde der Name sonst Buchstabe fuer Buchstabe
   umbrochen. */
.wiso-community__member-result {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
    padding: 12px;
}
.wiso-community__member-result img { flex: 0 0 auto; }
.wiso-community__member-result span {
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    flex-direction: column;
}
.wiso-community__member-result strong {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.wiso-community__member-result small:empty { display: none; }
.wiso-community__member-result form { flex: 1 0 100%; margin: 0; }
.wiso-community__member-result .wiso-community__button { width: 100%; }

/* Verstecktes bleibt versteckt.

   Das Meldeformular traegt das Attribut "hidden". Die Regel
   darunter setzte pauschal display:flex auf jedes Formular in
   der Leiste und hob es damit wieder auf: das Formular stand
   offen da, streckte die Leiste auf 207px und zog die
   Nachbarknoepfe mit in die Hoehe - daher die verzerrten
   Schaltflaechen an der Frage. */
.wiso-community [hidden] { display: none !important; }

/* Beide Aktionen auf gleicher Hoehe: das Lesezeichen steckt in
   einem Formular, "Melden" nicht - dadurch standen sie versetzt.
   Zentriert statt gestreckt, sonst wachsen sie mit dem hoechsten
   Nachbarn mit. */
.wiso-community__actionbar-right { align-items: center; }
.wiso-community__actionbar-right > form:not([hidden]),
.wiso-community__actionbar-right > .wiso-community__inline-form { display: flex; align-items: center; margin: 0; }
.wiso-community__actionbar-right .wiso-community__text-button { min-height: 36px; }

/* Ist das Meldeformular offen, bekommt es eine eigene Zeile. */
.wiso-community__actionbar-right > .wiso-community__report {
    flex: 1 0 100%;
    flex-direction: column;
    gap: 12px;
    margin-top: 12px;
    padding: 16px;
    border: 1px solid var(--c-line-soft);
    border-radius: var(--c-radius-sm);
    background: var(--c-bg);
}
.wiso-community__actionbar-right > .wiso-community__report .wiso-community__button { align-self: flex-start; }

/* ============================================================
   Feinschliff
   ------------------------------------------------------------
   Die Regeln hier arbeiten mit !important, und zwar aus einem
   Grund: community.css wird vor den Stilen des Themes und vor
   den Bloecken der Lernplattform geladen. Bei gleicher
   Gewichtung gewinnt, wer spaeter kommt - deshalb hat das Theme
   der Ueberschrift 51px Abstand nach oben gegeben, und genau
   das war die "Leerzeile" zwischen Rubrik und Ueberschrift.
   ============================================================ */

/* ---- Brotkruemelpfad ausrichten ---------------------------- */
/* Auf den Lernseiten steht links im Pfad eine leere Spalte von
   48px (dort sitzt sonst ein Zurueck-Knopf). Ohne sie faengt der
   Pfad der Community 22px weiter links an als ueberall sonst -
   beim Wechsel zwischen den Bereichen springt die Zeile. */
.wiso-community__crumb {
    grid-template-columns: 48px minmax(0, 1fr) auto;
    column-gap: 10px;
    padding: 0 12px;
}
.wiso-community__crumb > ol { grid-column: 2; }
.wiso-community__crumb-tools {
    grid-column: 3;
    display: flex;
    align-items: center;
    gap: 4px;
}

/* ---- Glocke ------------------------------------------------ */
/* Ein Zeichen, kein Zaehler. Der Punkt sagt "da ist etwas" -
   die Zahl steht auf der Seite selbst. */
.wiso-community__bell {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    color: var(--c-subtle);
    text-decoration: none;
    transition: background .16s var(--c-ease), color .16s var(--c-ease);
}
.wiso-community__bell svg { width: 17px; height: 17px; display: block; }
.wiso-community__bell:hover,
.wiso-community__bell.is-current { background: var(--c-bg); color: var(--c-text); }
.wiso-community__bell.has-new { color: var(--c-text); }
.wiso-community__bell-dot {
    position: absolute;
    top: 6px;
    right: 6px;
    width: 7px;
    height: 7px;
    border: 1.5px solid var(--wlt-veil, #fff);
    border-radius: 50%;
    background: var(--c-primary);
}
body.wiso-dark .wiso-community__bell-dot { border-color: var(--wlt-header, #18191B); }

/* ---- Ueberschriften ---------------------------------------- */
.wiso-community__hero h1,
.wiso-community__page-header h1,
.wiso-community__header h1 {
    margin: 0 0 8px !important;
    font-size: clamp(30px, 4vw, 44px) !important;
    font-weight: 650 !important;
    letter-spacing: -.04em !important;
    line-height: 1.06 !important;
}
.wiso-community__eyebrow { margin: 0 0 8px !important; }
.wiso-community__hero p,
.wiso-community__page-header p,
.wiso-community__header p { margin: 0 !important; }
.wiso-community__content h2 { margin-top: 0 !important; }
.wiso-community__section-title {
    margin: 30px 0 14px !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    letter-spacing: .06em !important;
    text-transform: uppercase !important;
    color: var(--c-subtle) !important;
}

/* ---- Ganze Karte anklickbar -------------------------------- */
/* Der Verweis bleibt der Titel - das ist es, was Vorlesehilfen
   ansagen. Sein Pseudoelement legt sich unsichtbar ueber die
   ganze Karte, sodass jeder Punkt darauf trifft. Textauswahl und
   die uebrigen Verweise in der Karte bleiben bedienbar. */
.wiso-community__card,
.wiso-community__question-card,
.wiso-community__post-card { position: relative; }
.wiso-community__card h2 > a::after,
.wiso-community__question-card h2 > a::after,
.wiso-community__post-card h2 > a::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    border-radius: inherit;
}
/* Alles, was selbst anklickbar ist, muss darueber liegen. */
.wiso-community__card :is(a, button, input, label, form),
.wiso-community__question-card :is(a, button, input, label, form),
.wiso-community__post-card :is(a, button, input, label, form) { position: relative; z-index: 2; }
.wiso-community__card h2 > a,
.wiso-community__question-card h2 > a,
.wiso-community__post-card h2 > a { position: static; z-index: auto; }
.wiso-community__card:hover,
.wiso-community__question-card:hover { border-color: var(--c-line) !important; background: var(--c-bg) !important; }
body.wiso-dark .wiso-community__card:hover,
body.wiso-dark .wiso-community__question-card:hover { background: var(--wlt-raised) !important; }

/* ---- Profil ------------------------------------------------ */
.wiso-community__profile {
    display: flex;
    align-items: flex-start;
    gap: 20px;
    margin: 0 0 26px;
}
.wiso-community__profile > img,
.wiso-community__profile .avatar {
    flex: 0 0 auto;
    width: 88px;
    height: 88px;
    border-radius: 50%;
}
.wiso-community__profile > div { min-width: 0; }
.wiso-community__profile-bio {
    max-width: 62ch;
    margin: 10px 0 0 !important;
    font-size: 15px;
    line-height: 1.6;
    color: var(--c-text);
}
.wiso-community__profile-meta {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    margin: 12px 0 0 !important;
    font-size: 13px;
    color: var(--c-muted);
}
.wiso-community__profile-meta a { color: var(--c-primary); text-decoration: none; }
.wiso-community__profile-meta span[aria-hidden] { color: var(--c-subtle); }

/* ---- Formular fuer Vorstellung und Einstellungen ----------- */
.wiso-community__account-form h2 {
    margin: 0 0 14px !important;
    font-size: 17px !important;
    font-weight: 600 !important;
    letter-spacing: -.015em !important;
}
.wiso-community__account-form h2 + form > label:first-of-type { margin-top: 0; }
.wiso-community__account-form form > h2 { margin: 26px 0 12px !important; padding-top: 22px; border-top: 1px solid var(--c-line-soft); }
.wiso-community__form-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.wiso-community__check {
    display: grid !important;
    grid-template-columns: 18px minmax(0, 1fr);
    align-items: start;
    gap: 10px;
    margin: 0 0 10px !important;
    font-size: 14px !important;
    font-weight: 400 !important;
    color: var(--c-text);
    cursor: pointer;
}
.wiso-community__check input { width: 18px; height: 18px; margin: 0; accent-color: var(--c-primary); }
@media (max-width: 640px) {
    .wiso-community__form-row { grid-template-columns: 1fr; }
    .wiso-community__profile { gap: 14px; }
    .wiso-community__profile > img,
    .wiso-community__profile .avatar { width: 64px; height: 64px; }
}

/* ---- Nachrichten ------------------------------------------- */
/* Zwischen Rubrik und Ueberschrift stand hier mehr Luft als auf
   den uebrigen Seiten, weil der Seitenkopf zusaetzlich zur
   Ueberschrift einen eigenen Abstand mitbrachte. */
.wiso-community__page-header { margin: 0 0 20px !important; }
.wiso-community__page-header > div > p { margin-top: 6px !important; }

/* ---- Abstand ueber der Community ---------------------------- */
/* Das Theme setzt ueber dem Inhalt Abstaende: 16px am
   Inhaltsbereich, 32px an der Huelle, 32px am Inhalt selbst. Auf
   der Einzelfrage summierte sich das auf 80px zwischen Kopfzeile
   und Brotkruemelpfad. Die Community beginnt jetzt ueberall
   direkt unter der Kopfzeile. */
body.wiso-community-page :is(#primary, .content-area, .content-container, .site-main, .content-wrap, article.entry, .entry-content-wrap, .entry-content) {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* ---- Brotkruemelpfad: Flaeche und Ausrichtung --------------- */
/* Im Dunkeln derselbe Ton wie der Grund - nur die Haarlinie
   trennt. Und: die Liste brachte vom Theme 32px Abstand nach
   unten mit. Beim senkrechten Ausrichten zaehlt der Rand mit,
   deshalb klebte der Pfad oben, waehrend Glocke und Schalter
   mittig sassen. */
.wiso-community__crumb > ol,
.wiso-community__crumb li,
.wiso-community__crumb ol li { margin: 0 !important; padding: 0 !important; }
.wiso-community__crumb { background: var(--wlt-veil, rgba(255,255,255,.95)); }
body.wiso-dark .wiso-community__crumb {
    background: var(--wlt-bg) !important;
    border-bottom-color: var(--wlt-line-soft) !important;
}

/* ---- Eingabefelder ohne Typangabe --------------------------- */
/* Die Regeln oben greifen ueber input[type=text] und Geschwister.
   Ein Feld ohne type-Angabe und eines mit type="url" fielen
   durch - genau die beiden im Profil. Sie standen dann in der
   Gestalt des Themes da, ohne Abstand zur Beschriftung. */
.wiso-community input:not([type=checkbox]):not([type=radio]):not([type=file]):not([type=submit]):not([type=button]):not([type=hidden]) {
    display: block;
    width: 100%;
    margin-top: 8px;
    padding: 11px 14px;
    border: 1px solid var(--c-line);
    border-radius: var(--c-radius-sm);
    background: var(--c-surface);
    color: var(--c-text);
    font: inherit;
    font-size: 15px;
    font-weight: 400;
}
.wiso-community textarea { margin-top: 8px; }
.wiso-community__account-form label > small,
.wiso-community__avatar-field small {
    display: block;
    margin-top: 6px;
    font-size: 12px;
    font-weight: 400;
    color: var(--c-muted);
}

/* ---- Profilbild -------------------------------------------- */
.wiso-community__avatar-field {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    margin: 0 0 22px;
    padding: 0 0 22px;
    border-bottom: 1px solid var(--c-line-soft);
}
.wiso-community__avatar-preview img,
.wiso-community__avatar-preview .avatar {
    display: block;
    width: 72px;
    height: 72px;
    border-radius: 50%;
    object-fit: cover;
}
.wiso-community__field-label {
    display: block;
    margin-bottom: 8px;
    font-size: 13px;
    font-weight: 600;
    color: var(--c-text);
}
.wiso-community__avatar-field input[type=file] {
    font-size: 13px;
    color: var(--c-muted);
}
.wiso-community__avatar-field .wiso-community__check { margin-top: 10px !important; font-size: 13px !important; }

/* ---- Profilkopf enger --------------------------------------- */
/* Ueber dem Namen stand mehr Luft als noetig: die Rubrik brachte
   den Abstand einer Ueberschrift mit. */
.wiso-community__profile .wiso-community__eyebrow { margin: 0 0 4px !important; }
.wiso-community__profile h1 { margin: 0 !important; line-height: 1.1 !important; }
.wiso-community__profile > div { padding-top: 2px; }

/* ---- Antworten --------------------------------------------- */
/* Uhrzeit in eigenen Nachrichten: die Blase ist blau, die
   Zeitangabe stand in Grau darauf und war praktisch unsichtbar. */
.wiso-community__message.is-own small { color: #fff; opacity: .78; }

/* Name, Datum und Uhrzeit in einer ruhigen Zeile. */
.wiso-community__meta {
    display: flex;
    align-items: center;
    gap: 7px;
    flex-wrap: wrap;
    margin: 10px 0 0 !important;
    font-size: 13px;
    color: var(--c-muted);
}
.wiso-community__meta span[aria-hidden] { color: var(--c-subtle); }
.wiso-community__author-link {
    color: var(--c-text);
    font-weight: 600;
    text-decoration: none;
}
.wiso-community__author-link:hover { color: var(--c-primary); }

/* Zwischen Text und Bedienleiste stand zu viel Luft. */
.wiso-community__answer .wiso-community__actionbar { margin-top: 10px; padding-top: 10px; border-top: 1px solid var(--c-line-soft); }
body.wiso-dark .wiso-community__answer .wiso-community__actionbar { border-top-color: var(--c-line); }
.wiso-community__answer { padding-bottom: 16px; }

/* Zahl der Antworten in derselben Zeile wie die Bewertung. */
.wiso-community__actionbar-meta {
    margin-left: 4px;
    color: var(--c-muted);
    font-size: 13px;
    white-space: nowrap;
}

/* Antwortfeld: halb so hoch, waechst mit dem Text. */
.wiso-community textarea[data-wachsen] {
    min-height: 68px;
    max-height: 50vh;
    overflow-y: auto;
    resize: none;
}

/* ---- Weniger Luft ueber dem Inhalt -------------------------- */
/* Auf jeder Seite musste man erst scrollen, bis der eigentliche
   Inhalt kam. Die Leiste und der Seitenkopf ruecken zusammen. */
.wiso-community__nav { margin: 4px 0 16px !important; }
.wiso-community__page-header { margin: 0 0 16px !important; }
.wiso-community__hero { margin: 0 0 18px !important; }

/* ---- Nachrichten fuellen den Bildschirm --------------------- */
/* Vorher stand die Liste der Unterhaltungen unter dem Falz -
   man musste scrollen, bevor man einen Chat oeffnen konnte. Die
   Hoehe kommt aus dem Skript, damit sie zur tatsaechlichen
   Kopfzeile passt; der Wert hier ist nur der Rueckfall. */
.wiso-community__chat {
    align-items: stretch;
    height: calc(100vh - 300px);
    min-height: 440px;
}
.wiso-community__chat-sidebar { overflow: hidden; min-height: 0; }
.wiso-community__conversation-list { flex: 1; min-height: 0; max-height: none; }
.wiso-community__chat-main { display: flex; flex-direction: column; min-height: 0; }
.wiso-community__messages { flex: 1; min-height: 0; }
.wiso-community__chat .wiso-community__empty { margin: auto; }
.wiso-community__chat-sidebar-head h2 { font-size: 15px !important; }

/* Auf der Nachrichtenseite traegt die Ueberschrift wenig bei -
   der Chat selbst sagt, wo man ist. */
.wiso-community__page-header:has(+ .wiso-community__content .wiso-community__chat) h1 { font-size: 28px !important; }

@media (max-width: 820px) {
    .wiso-community__chat { height: auto; min-height: 0; }
    .wiso-community__conversation-list { max-height: none; }
}

/* ---- Profil ------------------------------------------------- */
.wiso-community__section-title { margin: 26px 0 12px !important; }
.wiso-community__account-form + .wiso-community__section-title { margin-top: 30px !important; }

/* ============================================================
   Karten in den Uebersichten
   ------------------------------------------------------------
   Die Rubrik steht ganz oben und dicht am Rand - sie hilft beim
   Ueberfliegen als Erstes. Die Vorschau ist auf zwei Zeilen
   begrenzt, damit alle Karten gleich hoch bleiben, auch wenn
   ein Beitrag mit einem sehr langen Wort anfaengt.
   ============================================================ */

.wiso-community__question-card .wiso-community__badges {
    margin: 0 0 8px;
    gap: 6px;
}
.wiso-community__question-card .wiso-community__card-body { padding-top: 2px; }

.wiso-community__art {
    background: var(--c-primary-soft);
    color: var(--c-primary);
    border-color: transparent;
}

.wiso-community__question-card p {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* ============================================================
   Meldeformular
   ------------------------------------------------------------
   Steht jetzt als eigener Block hinter der Aktionszeile. Als
   Kind der rechten Gruppe bekam es nur deren Breite und schob
   beim Aufklappen die ganze Zeile auseinander.
   ============================================================ */

.wiso-community__actionbar-right { margin-left: auto; }
.wiso-community__actionbar-meta { margin: 0; color: var(--c-muted); font-size: 13.5px; }

.wiso-community__report:not([hidden]) {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin: 14px 0 0;
    padding: 16px;
    border: 1px solid var(--c-line-soft);
    border-radius: var(--c-radius-sm);
    background: var(--c-bg);
}
.wiso-community__report label {
    display: flex;
    flex-direction: column;
    gap: 6px;
    font-size: 13.5px;
    font-weight: 600;
}
.wiso-community__report select,
.wiso-community__report textarea {
    width: 100%;
    box-sizing: border-box;
    padding: 9px 12px;
    border: 1px solid var(--c-line);
    border-radius: 10px;
    background: var(--c-surface);
    color: var(--c-text);
    font: inherit;
    font-size: 14px;
    font-weight: 400;
}
.wiso-community__report textarea { resize: vertical; min-height: 76px; }
.wiso-community__report .wiso-community__button { align-self: flex-start; }

/* ============================================================
   Einspruch
   ------------------------------------------------------------
   Steht nur dort, wo jemand gemeldet hat und eine Entscheidung
   vorliegt. Ruhig gehalten: es ist kein Aufruf, sondern ein
   Angebot.
   ============================================================ */

.wiso-community__einspruch {
    margin: 18px 0 0;
    padding: 16px 18px;
    border: 1px solid var(--c-line-soft);
    border-left: 3px solid var(--c-primary);
    border-radius: var(--c-radius-sm);
    background: var(--c-bg);
}
.wiso-community__einspruch h3 { margin: 0 0 6px; font-size: 15px; }
.wiso-community__einspruch p { margin: 0 0 8px; font-size: 14px; }
.wiso-community__einspruch form { display: flex; flex-direction: column; gap: 10px; margin: 12px 0 0; }
.wiso-community__einspruch label {
    display: flex;
    flex-direction: column;
    gap: 6px;
    font-size: 13.5px;
    font-weight: 600;
}
.wiso-community__einspruch textarea {
    width: 100%;
    box-sizing: border-box;
    padding: 9px 12px;
    border: 1px solid var(--c-line);
    border-radius: 10px;
    background: var(--c-surface);
    color: var(--c-text);
    font: inherit;
    font-size: 14px;
    font-weight: 400;
    resize: vertical;
}
.wiso-community__einspruch button { align-self: flex-start; }
.wiso-community__einspruch small { color: var(--c-muted); font-size: 12.5px; }
.wiso-community__einspruch-fehler { color: var(--c-danger); }

/* ============================================================
   Dateiauswahl
   ------------------------------------------------------------
   Das nackte Dateifeld sieht in jedem Browser anders aus und
   passt zu keinem. Hier steckt es unsichtbar in einem eigenen
   Knopf; der Dateiname erscheint daneben, sobald etwas gewaehlt
   ist.
   ============================================================ */

.wiso-community__datei-knopf {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 9px 16px 9px 14px;
    border: 1px dashed var(--c-line);
    border-radius: var(--c-radius-sm);
    background: var(--c-bg);
    cursor: pointer;
    transition: border-color .15s var(--c-ease), background .15s var(--c-ease);
}
.wiso-community__datei-knopf:hover {
    border-color: var(--c-primary);
    background: var(--c-primary-soft);
}
.wiso-community__datei-knopf input[type="file"] {
    position: absolute;
    width: 1px; height: 1px;
    margin: -1px; padding: 0;
    overflow: hidden; clip: rect(0 0 0 0);
    white-space: nowrap; border: 0;
}
.wiso-community__datei-knopf > span { display: flex; flex-direction: column; gap: 1px; }
.wiso-community__datei-knopf b { font-size: 14px; font-weight: 500; }
.wiso-community__datei-knopf small { font-size: 12px; color: var(--c-muted); }

.wiso-community__datei-name {
    display: block;
    margin-top: 8px;
    color: var(--c-muted);
    font-size: 13px;
}

/* ============================================================
   Hinweisbalken
   ------------------------------------------------------------
   Oben, schmal, ueber allem - und nach fuenf Sekunden wieder
   fort. Er sitzt fest am Fensterrand, weil er auch dann zu
   sehen sein soll, wenn man beim Melden weit unten stand.
   ============================================================ */
.wiso-community__balken {
    position: fixed;
    z-index: 9999;
    top: 14px;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    align-items: center;
    gap: 10px;
    max-width: min(560px, calc(100vw - 32px));
    padding: 11px 12px 11px 16px;
    border: 1px solid var(--wlt-line-soft);
    border-radius: 14px;
    background: var(--wlt-raised);
    color: var(--wlt-text);
    font: 500 14px/1.4 var(--wlt-font);
    box-shadow: 0 8px 28px rgba(0, 0, 0, .16);
    opacity: 1;
    transition: opacity .35s var(--wlt-ease, ease), transform .35s var(--wlt-ease, ease);
}
/* Ein abgelehnter Kommentar ist kein Erfolg - der Balken sagt das
   auch farblich, bleibt aber stehen statt nach fuenf Sekunden zu
   verschwinden: man soll den Grund in Ruhe lesen koennen. */
.wiso-community__balken.is-warnung {
    border-color: var(--wlt-error-border, #e5c7c7);
    background: var(--wlt-error-soft, #fdf2f2);
    color: var(--wlt-error-text, #96302f);
}
.wiso-community__balken.ist-weg {
    opacity: 0;
    transform: translateX(-50%) translateY(-8px);
}
.wiso-community__balken-zu {
    flex: 0 0 auto;
    width: 24px;
    height: 24px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: transparent;
    color: var(--wlt-muted);
    font-size: 17px;
    line-height: 1;
    cursor: pointer;
    transition: background .2s var(--wlt-ease, ease), color .2s var(--wlt-ease, ease);
}
.wiso-community__balken-zu:hover {
    background: var(--wlt-surface);
    color: var(--wlt-text);
}

@media (prefers-reduced-motion: reduce) {
    .wiso-community__balken { transition: none; }
}

/* ============================================================
   Einspruch im Gespraech
   ============================================================ */

/* Der Knopf sitzt unter der Nachricht, nicht daneben: er gehoert
   zur Entscheidung und soll ihre Breite nicht sprengen. */
.wiso-community__einspruch-knopf {
    display: inline-block;
    margin-top: 8px;
    padding: 5px 12px;
    border: 1px solid var(--wlt-line);
    border-radius: 999px;
    background: var(--wlt-surface);
    color: var(--wlt-text);
    font: 500 12.5px/1.3 var(--wlt-font);
    cursor: pointer;
    transition: background .2s var(--wlt-ease, ease), border-color .2s var(--wlt-ease, ease);
}
.wiso-community__einspruch-knopf:hover {
    background: var(--wlt-raised);
    border-color: var(--wlt-line-2);
}

.wiso-community__message.ist-einspruch {
    border-left: 3px solid var(--wlt-primary);
}
.wiso-community__message-marke {
    display: block;
    margin-bottom: 4px;
    color: var(--wlt-primary);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .05em;
    text-transform: uppercase;
}

/* Der Streifen ueber dem Eingabefeld, solange die naechste
   Nachricht als Einspruch zaehlt. Ohne ihn waere der Zustand
   unsichtbar - man saehe nur den vorgeschriebenen Satz. */
.wiso-community__einspruch-hinweis {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    margin-bottom: 8px;
    padding: 8px 12px;
    border: 1px solid var(--wlt-line-soft);
    border-radius: 10px;
    background: var(--wlt-surface);
    font-size: 12.5px;
    color: var(--wlt-ink-2);
}
.wiso-community__einspruch-hinweis strong {
    color: var(--wlt-primary);
    font-size: 11px;
    letter-spacing: .05em;
    text-transform: uppercase;
}
.wiso-community__einspruch-ab {
    margin-left: auto;
    padding: 0;
    border: 0;
    background: none;
    color: var(--wlt-muted);
    font-size: 12.5px;
    text-decoration: underline;
    cursor: pointer;
}
.wiso-community__einspruch-ab:hover { color: var(--wlt-text); }

/* ============================================================
   Kommentare
   ------------------------------------------------------------
   Unter jeder Antwort, eine Ebene tief, zusammengeklappt.
   Bewusst schmaler und leiser als die Antwort darueber: ein
   Kommentar ist eine Nachfrage, keine zweite Antwort.
   ============================================================ */
.wiso-community__kommentare { margin-top: 10px; }

.wiso-community__kommentar-schalter {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 10px 4px 8px;
    border: 0;
    border-radius: 999px;
    background: transparent;
    color: var(--wlt-muted);
    font: 500 12.5px/1.4 var(--wlt-font);
    cursor: pointer;
    transition: background .2s var(--wlt-ease, ease), color .2s var(--wlt-ease, ease);
}
.wiso-community__kommentar-schalter:hover {
    background: var(--wlt-surface);
    color: var(--wlt-text);
}
.wiso-community__kommentar-zeichen { font-size: 12px; opacity: .8; }

.wiso-community__kommentar-baum {
    margin-top: 8px;
    padding-left: 14px;
    border-left: 2px solid var(--wlt-line-soft);
}

.wiso-community__kommentar { padding: 10px 0; }
.wiso-community__kommentar + .wiso-community__kommentar { border-top: 1px solid var(--wlt-line-soft); }
/* Das Theme gibt jedem Absatz 32px nach unten mit. Im Kommentar
   sieht das aus wie eine Leerzeile zwischen Text und Knoepfen.
   Die Regel hier muss deshalb spezifischer sein als die des Themes. */
.wiso-community .wiso-community__kommentar > p,
.wiso-community__kommentar p {
    margin: 4px 0 0;
    font-size: 14px;
    line-height: 1.6;
    color: var(--wlt-text);
}

.wiso-community__kommentar-kopf {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 12.5px;
    color: var(--wlt-muted);
}
.wiso-community__kommentar-kopf img {
    width: 24px;
    height: 24px;
    border-radius: 50%;
}
.wiso-community__kommentar-kopf a {
    color: var(--wlt-ink-2);
    font-weight: 600;
    text-decoration: none;
}
.wiso-community__kommentar-kopf a:hover { text-decoration: underline; }
.wiso-community__kommentar-kopf time { margin-left: auto; }

.wiso-community__kommentar-antworten {
    margin-top: 6px;
    padding: 0;
    border: 0;
    background: none;
    color: var(--wlt-muted);
    font: 500 12.5px/1.4 var(--wlt-font);
    cursor: pointer;
}
.wiso-community__kommentar-antworten:hover { color: var(--wlt-primary); }

/* Die zweite Ebene rueckt ein und bekommt keine dritte. */
.wiso-community__kommentar-kinder {
    margin-top: 8px;
    padding-left: 14px;
    border-left: 2px solid var(--wlt-line-soft);
}
.wiso-community__kommentar.is-antwort { padding: 8px 0; }

.wiso-community__kommentar-form {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 10px;
}
.wiso-community__kommentar-form.is-antwort { margin-left: 0; }
.wiso-community__kommentar-form textarea {
    flex: 1 1 auto;
    min-height: 38px;
    padding: 9px 12px;
    border: 1px solid var(--wlt-line-soft);
    border-radius: 12px;
    background: var(--wlt-surface);
    color: var(--wlt-text);
    font: 400 14px/1.5 var(--wlt-font);
    resize: vertical;
}
.wiso-community__kommentar-form textarea:focus {
    outline: none;
    border-color: var(--wlt-primary);
}
.wiso-community__kommentar-form button { flex: 0 0 auto; }

.wiso-community__kommentar-hinweis {
    margin: 8px 0 0;
    color: var(--wlt-muted);
    font-size: 13px;
}

/* Der Antwortknopf soll wie ein Knopf aussehen - als blosser
   Text las er sich wie eine Ueberschrift fuer das, was folgte. */
.wiso-community__kommentar-antworten,
.wiso-community__kommentar-melden {
    display: inline-flex;
    align-items: center;
    margin-top: 0;
    height: 26px;
    padding: 0 12px;
    border: 1px solid var(--wlt-line-soft);
    border-radius: 999px;
    background: transparent;
    color: var(--wlt-muted);
    font: 500 12.5px/1 var(--wlt-font);
    cursor: pointer;
}
.wiso-community__kommentar-antworten:hover {
    border-color: var(--wlt-line-2);
    background: var(--wlt-surface);
}

/* Zwei Spalten statt Flexlauf: so steht der Einspruchsstreifen
   verlaesslich ueber dem Feld, und Feld und Knopf bleiben
   nebeneinander. Im Flexlauf klemmte sich der Streifen daneben
   und nahm dem Schreibfeld die halbe Breite. */
.wiso-community__chat-compose {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: end;
}
.wiso-community__chat-compose .wiso-community__einspruch-hinweis {
    grid-column: 1 / -1;
    margin-bottom: 0;
}

/* Solange eine Begruendung geschrieben wird, darf das Feld
   groesser sein - zwei Zeilen reichen fuer einen Satz, nicht
   fuer eine Erklaerung. */
.wiso-community__chat-compose.ist-einspruch textarea {
    min-height: 96px;
    max-height: 220px;
}

/* [hidden] kommt aus dem Browser und verliert gegen jede
   Klassenregel mit display. Ohne diese Zeile stand der
   Einspruchsstreifen dauerhaft da. */
.wiso-community__einspruch-hinweis[hidden],
.wiso-community__kommentar-form[hidden],
.wiso-community__kommentar-baum[hidden] { display: none; }

/* Auf der eigenen, eingefaerbten Blase braucht die Marke eine
   Farbe, die darauf zu sehen ist. */
.wiso-community__message.is-own .wiso-community__message-marke { color: #fff; opacity: .85; }
.wiso-community__message.is-own.ist-einspruch { border-left-color: #fff; }

/* ============================================================
   Die verschlossene Seite
   ------------------------------------------------------------
   Eine richtige Karte, kein gestrichelter Platzhalter: wer hier
   landet, hat nichts falsch gemacht. Der gestrichelte Rahmen
   liess die Seite aussehen, als fehle der Inhalt.
   ============================================================ */
.wiso-community--locked .wiso-community__shell {
    display: flex;
    justify-content: center;
    padding-top: 48px;
    padding-bottom: 96px;
}

.wiso-community__schranke {
    width: 100%;
    max-width: 520px;
    padding: 40px 36px 36px;
    border: 1px solid var(--wlt-line-soft);
    border-radius: 18px;
    background: var(--wlt-surface);
    text-align: center;
}

.wiso-community__schranke-rubrik {
    display: block;
    margin-bottom: 14px;
    color: var(--wlt-muted);
    font-size: 11.5px;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
}

.wiso-community__schranke h2 {
    margin: 0 0 10px;
    font-size: 25px;
    font-weight: 700;
    letter-spacing: -.015em;
    color: var(--wlt-text);
}

.wiso-community__schranke p {
    margin: 0 auto 24px;
    max-width: 38ch;
    color: var(--wlt-ink-2);
    font-size: 15px;
    line-height: 1.65;
}

.wiso-community__schranke .wiso-community__button {
    min-width: 200px;
    justify-content: center;
}

.wiso-community__schranke-fuss {
    margin: 20px 0 0;
    font-size: 13.5px;
    color: var(--wlt-muted);
}
.wiso-community__schranke-fuss a { color: inherit; text-decoration: underline; text-underline-offset: 3px; }
.wiso-community__schranke-fuss a:hover { color: var(--wlt-text); }

@media (max-width: 560px) {
    .wiso-community__schranke { padding: 32px 22px 28px; border-radius: 14px; }
    .wiso-community--locked .wiso-community__shell { padding-top: 28px; }
}

/* Antworten-Knopf und Feld unter der Frage.
   Das Feld bekommt Abstand nach oben, damit es nicht an der
   Frage klebt, und dieselbe Breite wie die Antworten darunter. */
.wiso-community__antwort-zeile {
    display: flex;
    justify-content: flex-start;
    margin-top: 14px;
    padding-top: 14px;
    border-top: 1px solid var(--wlt-line-soft);
}

.wiso-community__antwort-feld {
    margin-top: 18px;
    margin-bottom: 26px;
}
.wiso-community__antwort-feld[hidden] { display: none; }

/* Antworten und Melden am Kommentar nebeneinander. */
.wiso-community__kommentar-aktionen {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin-top: 8px;
}

/* Die Huelle eines geloeschten Kommentars: sichtbar, aber leise. */
.wiso-community__kommentar-weg {
    margin: 4px 0 0;
    color: var(--wlt-gray-3);
    font: italic 13.5px/1.6 var(--wlt-font);
}
.wiso-community__kommentar-weg-form { display: inline; margin: 0; }

/* Loeschen ist eine stille Handlung - kein Knopf, der zum Klicken einlaedt. */
.wiso-community__loeschen { display: inline-block; margin: 10px 0 0; }
.wiso-community__loeschen button {
    padding: 5px 12px;
    border: 1px solid var(--wlt-line-soft);
    border-radius: 999px;
    background: none;
    color: var(--wlt-gray-3);
    font: 500 12.5px/1.4 var(--wlt-font);
    cursor: pointer;
}
.wiso-community__loeschen button:hover {
    border-color: var(--wlt-error-border, #e5c7c7);
    color: var(--wlt-error-text, #96302f);
}

.wiso-community__kommentar-melden:hover {
    border-color: var(--wlt-line-2);
    background: var(--wlt-surface);
    color: var(--wlt-text);
}
.wiso-community__kommentar .wiso-community__report { margin-top: 10px; }
.wiso-community__kommentar .wiso-community__report[hidden] { display: none; }

/* ============================================================
   Der weisse Balken unter dem Beitrag
   ------------------------------------------------------------
   Kadence legt einen Einzelbeitrag in eine weisse Karte
   (.entry.content-bg) und gibt ihr unten 32px Innenabstand.
   Unsere Seite fuellt die Karte, der Abstand bleibt - und stand
   als heller Streifen unter dem Inhalt. Im Dunkeln fiel es nicht
   auf, weil die Dunkelregeln des Lerntrainers solche Flaechen
   ohnehin umfaerben.

   Die Community bringt ihren Grund selbst mit; die Karte des
   Themes darf deshalb ganz verschwinden.
   ============================================================ */
body.wiso-community-page .entry.content-bg,
body.wiso-community-page .content-bg.entry {
    background: transparent;
    box-shadow: none;
    border: 0;
}
body.wiso-community-page .entry-content-wrap {
    padding-top: 0;
    padding-bottom: 0;
}
body.wiso-community-page .site-main,
body.wiso-community-page .content-area { padding-bottom: 0; }

/* Eine geschlossene Frage sagt das dort, wo sonst der Knopf
   steht - und nicht erst nach dem Absenden. */
.wiso-community__zu {
    margin: 0;
    color: var(--wlt-muted);
    font-size: 14px;
}
.wiso-community__zu strong { color: var(--wlt-text); }

/* ---- Beitraege bearbeiten ---------------------------------- */
.wiso-community__bearbeiten { margin: 14px 0 0; }
.wiso-community__bearbeiten > summary {
    display: inline-block; padding: 5px 12px;
    border: 1px solid var(--wlt-line-soft); border-radius: 999px;
    background: none; color: var(--wlt-gray-3);
    font: 500 12.5px/1.4 var(--wlt-font); cursor: pointer;
}
.wiso-community__bearbeiten > summary:hover { border-color: var(--wlt-primary); color: var(--wlt-primary); }
.wiso-community__bearbeiten[open] > summary { margin-bottom: 12px; }
.wiso-community__bearbeiten-frist {
    margin: 0 0 12px; padding: 10px 14px;
    border: 1px solid var(--wlt-line-soft); border-radius: 10px;
    background: var(--wlt-raised); color: var(--wlt-ink-3);
    font: 400 13px/1.6 var(--wlt-font);
}
.wiso-community__bearbeiten label { display: block; margin: 0 0 12px; font-weight: 600; font-size: 13px; }
.wiso-community__bearbeiten input,
.wiso-community__bearbeiten textarea {
    display: block; width: 100%; box-sizing: border-box; margin-top: 5px;
    border: 1px solid var(--wlt-line); border-radius: 10px; padding: 10px 12px;
    background: var(--wlt-surface); color: var(--wlt-text);
    font: 400 14px/1.6 var(--wlt-font);
}
/* Was aus den eigenen Aenderungsvorschlaegen geworden ist. Steht im
   Bearbeitungsfeld, weil man genau dort hinsieht, wenn man wissen
   will, ob die Aenderung durchging. */
.wiso-community__vorschlaege { margin: 16px 0 0; padding-top: 12px; border-top: 1px solid var(--wlt-line-soft); }
.wiso-community__vorschlaege > strong { display: block; margin-bottom: 8px; font-size: 12.5px; color: var(--wlt-muted); }
.wiso-community__vorschlag { margin: 0 0 10px; padding: 10px 12px; border: 1px solid var(--wlt-line-soft);
  border-radius: 10px; background: var(--wlt-surface); }
.wiso-community__vorschlag p { margin: 0; font-size: 13px; line-height: 1.55; }
.wiso-community__vorschlag-text { margin-top: 6px !important; color: var(--wlt-ink-2); }
.wiso-community__vorschlag-stand { display: inline-block; padding: 1px 8px; border-radius: 999px;
  font-size: 11.5px; font-weight: 600; background: var(--wlt-bg); color: var(--wlt-muted); }
.wiso-community__vorschlag.ist-angenommen .wiso-community__vorschlag-stand { color: var(--wlt-success); }
.wiso-community__vorschlag.ist-abgelehnt .wiso-community__vorschlag-stand { color: var(--wlt-error); }
.wiso-community__vorschlag.ist-einspruch { border-color: var(--wlt-primary); }
.wiso-community__einspruch { margin-top: 10px; }
.wiso-community__einspruch label { display: block; font-size: 12.5px; color: var(--wlt-muted); }
.wiso-community__einspruch textarea { width: 100%; margin-top: 4px; }

.wiso-community__fassungen { margin: 16px 0 0; padding-top: 12px; border-top: 1px solid var(--wlt-line-soft); }
.wiso-community__fassungen strong { display: block; margin-bottom: 8px; font-size: 12.5px; color: var(--wlt-muted); }
.wiso-community__fassungen details { margin: 0 0 6px; }
.wiso-community__fassungen summary { cursor: pointer; font-size: 12.5px; color: var(--wlt-primary); }
.wiso-community__fassungen div {
    margin-top: 6px; padding: 10px 12px; border-radius: 8px;
    background: var(--wlt-raised); font-size: 13px; line-height: 1.6; color: var(--wlt-ink-3);
}