/* ============================================================================
   COMMUNITY / WUNSCHLISTE
   Gilt nur für /community und /community-post. Nutzt die globalen CI-Variablen
   aus style.css (--prime, --card-back, --page-back, ...) statt eigener Farben.
   ============================================================================ */

/* Formular: neuer Beitrag / neuer Kommentar */
.community-composer {
    padding: 1.25rem 1.5rem;
    margin-bottom: 2rem;
    }
.community-composer textarea,
.community-composer input[type="text"] {
    resize: vertical;
    }
.community-hint {
    font-size: 0.85em;
    color: darkgrey;
    margin-top: 0.4rem;
    }
[data-bs-theme="dark"] .community-hint {
    color: rgb(140, 140, 140);
    }
.community-char-counter {
    font-size: 0.85em;
    color: darkgrey;
    text-align: right;
    margin-top: 0.25rem;
    }
.community-char-counter.is-warning {
    color: #b5860b;
    }
.community-char-counter.is-over {
    color: #c0392b;
    font-weight: 600;
    }
[data-bs-theme="dark"] .community-char-counter {
    color: rgb(140, 140, 140);
    }

/* Login-Hinweis für nicht eingeloggte Besucher */
.community-login-hint {
    padding: 1.25rem 1.5rem;
    margin-bottom: 2rem;
    }
.community-login-hint a {
    font-weight: 600;
    }

/* Beitrags-Karte (Übersicht + Permalink-Seite) */
.community-post-card {
    padding: 1.25rem 1.5rem;
    margin-bottom: 1.25rem;
    }
.community-post-title {
    font-size: 1.15em;
    font-weight: 600;
    margin-bottom: 0.15rem;
    }
.community-post-title a,
.community-post-title a:visited {
    color: var(--page-text);
    text-decoration: none;
    }
.community-post-title a:hover {
    color: var(--prime);
    text-decoration: underline;
    }
.community-meta {
    font-size: 0.85em;
    color: darkgrey;
    margin-bottom: 0.75rem;
    }
[data-bs-theme="dark"] .community-meta {
    color: rgb(140, 140, 140);
    }
.community-meta a {
    color: inherit;
    text-decoration: underline;
    }
.community-body {
    line-height: 1.5;
    }
.community-body p:last-child {
    margin-bottom: 0;
    }
.community-body code {
    background-color: rgba(0, 0, 0, 0.06);
    border-radius: 0.25rem;
    padding: 0.1em 0.35em;
    }
[data-bs-theme="dark"] .community-body code {
    background-color: rgba(255, 255, 255, 0.1);
    }

.community-comment-count {
    display: inline-flex;
    align-items: center;
    gap: 0.3em;
    font-size: 0.85em;
    color: var(--prime);
    font-weight: 600;
    margin-top: 0.5rem;
    text-decoration: none;
    }
.community-comment-count:hover {
    text-decoration: underline;
    }

.community-permalink {
    font-size: 0.8em;
    color: darkgrey;
    text-decoration: none;
    margin-left: 0.5em;
    }
.community-permalink:hover {
    color: var(--prime);
    }

/* Kommentare (nur auf der Permalink-Seite) */
.community-comments {
    margin-top: 2rem;
    }
.community-comment-card {
    padding: 1rem 1.25rem;
    margin-bottom: 1rem;
    }
.community-comment-card:target {
    outline: 2px solid var(--prime);
    outline-offset: 2px;
    }

/* Pagination – auf --prime statt Bootstrap-Blau umgestellt */
.community-pagination .page-link {
    color: var(--prime);
    }
.community-pagination .page-item.active .page-link {
    background-color: var(--prime-back);
    border-color: var(--prime-back);
    color: #ffffff;
    }
.community-pagination .page-link:hover {
    color: var(--prime);
    }