/* 📱 Forum: Darstellung für Handy und schmale Fenster (Forum-Übersicht + Thread-Ansicht). Wird nach dem Seiten-Stil geladen. */
@media (max-width: 800px) {
    .forum-container { width: 100%; box-sizing: border-box; padding: 0 10px; margin: 66px auto 30px; }
    .forum-container *, .modal-content * { box-sizing: border-box; }
    .forum-container img, .forum-container video { max-width: 100%; height: auto; }

    /* Knöpfe oben: umbrechen statt überlaufen, gut mit dem Daumen zu treffen */
    .forum-container > div:first-child { flex-wrap: wrap; gap: 10px !important; margin-bottom: 18px !important; }
    .btn-tactical { padding: 12px 16px; font-size: .72rem; letter-spacing: 1px; min-height: 44px; justify-content: center; text-align: center; }
    .forum-container > div:first-child .btn-tactical { flex: 1 1 100%; }

    /* Kopf der Übersicht */
    .tactical-header { flex-direction: column; align-items: stretch; gap: 14px; margin-bottom: 22px; padding-bottom: 14px; }
    .tactical-header h1 { font-size: 1.35rem; letter-spacing: 2px; }
    .tactical-header > div:last-child { flex-wrap: wrap; gap: 10px !important; }
    .tactical-header > div:last-child > div { text-align: left !important; margin: 0 0 4px 0 !important; flex: 1 1 100%; }
    .tactical-header > div:last-child .btn-tactical { flex: 1 1 calc(50% - 5px); }
    .tactical-header > div:last-child .btn-tactical:first-of-type { flex-basis: 100%; }

    /* Kategorien + Themenliste: Symbol links, Titel rechts, Zahlen darunter */
    .category-card { margin-bottom: 20px; }
    .cat-header { padding: 12px 14px; flex-wrap: wrap; gap: 4px 12px; }
    .cat-header h2 { font-size: 1rem; letter-spacing: 1px; }
    .thread-row { grid-template-columns: 34px minmax(0, 1fr); gap: 4px 10px; padding: 14px; align-items: start; }
    .thread-row > div:first-child { font-size: 1.25rem !important; grid-row: span 3; }
    .thread-title { font-size: .95rem; line-height: 1.3; overflow-wrap: anywhere; }
    .thread-row .stat-box { grid-column: 2; display: flex; gap: 6px; align-items: baseline; text-align: left; }
    .thread-row .stat-val { display: inline; }
    .thread-row .last-post { grid-column: 2; border-left: 0; padding-left: 0; display: flex; flex-wrap: wrap; gap: 2px 10px; }

    /* Thread-Ansicht */
    .thread-header { flex-direction: column; align-items: stretch !important; gap: 12px; padding: 16px !important; }
    .thread-header h1 { font-size: 1.1rem !important; overflow-wrap: anywhere; }
    .thread-header > div:last-child { flex-wrap: wrap; }
    .post-card { grid-template-columns: minmax(0, 1fr); margin-bottom: 16px; }
    .post-sidebar { display: flex; align-items: center; gap: 12px; padding: 10px 14px; text-align: left; border-right: 0; border-bottom: 1px solid rgba(46, 204, 113, 0.12); }
    .post-sidebar img { width: 40px; height: 40px; margin: 0; border-width: 2px; flex: none; }
    .post-content-area { padding: 14px; min-width: 0; }
    .reply-badge { flex-wrap: wrap; gap: 8px; }
    .action-link { padding: 8px 14px; font-size: .68rem; }
    .post-date { margin-bottom: 12px; }
    .post-text { font-size: .95rem; overflow-wrap: anywhere; word-break: break-word; }
    .post-text a { overflow-wrap: anywhere; word-break: break-all; }
    .reply-reference { padding: 10px 12px; overflow-wrap: anywhere; }
    .poll-container { padding: 16px; margin-bottom: 24px; }
    .reply-box { padding: 14px; margin-top: 18px; }
    .reply-box textarea, #reply-text { width: 100% !important; font-size: 16px; }   /* 16 px verhindert das automatische Heranzoomen beim Tippen */

    /* Eingabefenster (Neues Thema, Bearbeiten, Verschieben) */
    .modal { overflow-y: auto; }
    .modal-content { width: calc(100% - 20px) !important; max-width: 600px; margin: 14px auto !important; padding: 18px !important; }
    .modal-input, .modal-content textarea, .modal-content select, .modal-content input { font-size: 16px; max-width: 100%; }
    .modal-content h2 { font-size: 1.05rem; margin-bottom: 18px !important; }
    .poll-opt-row { flex-wrap: nowrap; }
    .poll-opt-row input { min-width: 0; flex: 1; }
}
@media (max-width: 380px) {
    .tactical-header > div:last-child .btn-tactical { flex-basis: 100%; }
}
