/* CD-A3c (17.09.2026): externalisiert aus pages/community/messages.tpl — 1:1, unlayered wie der
   Inline-Block. Voraussetzung fuer CSP style-src-elem (siehe
   docs/CSS_AUFGABENLISTE_2026-09-17.md §CD-A3c). */
/* CD-A3b (18.09.2026): zusaetzlich die 4 style="-Attribute des Templates auf
   cmsg-*-Klassen (Werte 1:1). */
.cmsg-main { max-width: 1000px; }
/* SOC17 (29.09.): --color-text-link flippt theme-aware (#38bdf8 Dark ↔
   #075985 Light, default.css) — das Fixliteral lag im DARK Theme auf der
   dunklen alert-info-Fläche bei ~2.3:1 (WCAG 1.4.3-Fail). */
.cmsg-auth-link { color: var(--color-text-link, #075985); }
.cmsg-sticky-head { background: #1e293b; }
/* MF2 (03.09.): dvh statt nur vh — Mobile-URL-Bar-Resize folgt; Fallback
       zuerst (Browser ohne dvh nehmen die vh-Zeile). */
    .dm-shell { background: rgba(30, 41, 59, .7); border: 1px solid rgba(255, 255, 255, .08); border-radius: 1rem; height: calc(100vh - 220px); height: calc(100dvh - 220px); min-height: 420px; }
    /* MF2 (03.09.): <992px läuft der Mobile-Bottom-Dock (d-lg-none, 72px) —
       Shell dort um Dock + Safe-Area verkürzen. Der DM-Toast heißt jetzt
       .md-toast (SWOT CH8.1, community_chat.css) und erbt dort den
       Dock-Offset aus der Mediengruppe — hier keine Sonderregel mehr nötig. */
    @media (max-width: 991.98px) {
        .dm-shell { height: calc(100vh - 292px); height: calc(100dvh - 292px); min-height: 380px; }
    }
    .dm-inbox-item { border-bottom: 1px solid rgba(255, 255, 255, .06); cursor: pointer; }
    /* SOC17: Aktiv/Hover im Marken-Cyan (ehem. Indigo-Tint — dieselbe
       Fremdlicht wie die Bubble). */
    .dm-inbox-item:hover, .dm-inbox-item.active { background: rgba(14, 116, 144, .14); }
    .dm-bubble { max-width: 78%; border-radius: 1rem; padding: .55rem .9rem; font-size: .93rem; word-wrap: break-word; }
    /* SOC17 (29.09.): Marken-Gradient statt Indigo-Fremdlicht — der gesamte
       Chat-Brand trägt linear-gradient(135deg, #0e7490, #075985) (FAB,
       Senden, aktiver Kanal-Chip, aktiver Tab); die eigene DM-Nachricht
       leuchtete im Indigo-Gradient = Marken-Bruch. Offene O6/TB1-
       Brand-Token-Entscheidung bleibt unberührt. */
    .dm-bubble.mine { background: linear-gradient(135deg, #0e7490, #075985); }
    .dm-bubble.theirs { background: rgba(255, 255, 255, .08); }
    /* SM7 (18.09.2026): ✓/✓✓ Read-Receipt an eigenen Nachrichten. */
    .dm-read-receipt { display: block; font-size: .62rem; text-align: right; opacity: .8; margin-top: .15rem; letter-spacing: .04em; }
    .dm-thread { overflow-y: auto; }
    .unread-dot { width: 9px; height: 9px; background: #f472b6; border-radius: 50%; display: inline-block; }
    .dm-report-btn { background: none; border: none; color: #94a3b8; opacity: .55; font-size: .8rem; padding: 0 .25rem; cursor: pointer; align-self: center; }
    .dm-report-btn:hover { opacity: 1; color: #f59e0b; }
    /* MT4 (04.09.): Touch-Geräte haben keinen Hover — Report-Button dort
       voll sichtbar statt Hover-Offenbarung. */
    @media (hover: none) { .dm-report-btn { opacity: 1; } }
    /* SOC17 (29.09.): 44px-Touch-Norm (Parität zum Drawer-Report/Edit/Delete) —
       Negativ-Margins halten die Sichtfläche klein. */
    @media (pointer: coarse) {
        .dm-report-btn { min-width: 44px; min-height: 44px; margin: -12px -6px; }
    }
    /* MF1 (03.09.): iOS-Zoom-Guard — DM-Suchfeld + Thread-Composer (JS-erzeugter
       form-control-sm) auf 16px; der mobile.css-Guard (:41) greift hier nicht,
       da die Seite kein .cms-module-box umschließt. <16px zoomt Safari bei Fokus. */
    .dm-shell .form-control { font-size: 16px; }
    /* MF16 (03.09.): Report-Menü nie über die Viewport-Kante hinaus — hier im
       Tpl-Scope statt in mobile.css (Dx-Parallel-WIP in den CSS-Dateien). */
    /* MF15 (03.09.): Phone-Master-Detail — Liste und Thread sind zwei Zustände
       statt untereinander gestapelter Spalten in der fixen Shell. >=768px
       unverändert (col-md-Verhalten). */
    #dm-thread-back { display: none; }
    @media (max-width: 767.98px) {
        .dm-shell .dm-col-thread { display: none; }
        .dm-shell.dm-show-thread .dm-col-thread { display: flex; flex-direction: column; }
        .dm-shell.dm-show-thread .dm-col-inbox { display: none !important; }
        .dm-shell.dm-show-thread #dm-thread-back { display: inline-flex; }
    }