/*
 * Hilfe und Support (support.js) und Zahlungsmittel (zahlungsmittel.js), Ausbau Member-Konto.
 * Nur was die gemeinsamen Klassen aus app.css nicht schon koennen: FAQ-Aufklapper und Verlauf.
 */
.sp-faq { display:block; cursor:pointer; }
.sp-faq summary { list-style:none; padding:2px 0; }
.sp-faq summary::-webkit-details-marker { display:none; }
.sp-faq summary::after { content:'\203A'; float:right; color:var(--muted); transition:transform .15s; }
.sp-faq[open] summary::after { transform:rotate(90deg); }
.sp-faq-a { margin-top:8px; font-size:13px; line-height:1.5; color:var(--text, inherit); }

.sp-verlauf { display:flex; flex-direction:column; gap:10px; margin:14px 0; }
.sp-msg { max-width:88%; padding:10px 12px; border-radius:14px; font-size:14px; line-height:1.45; word-wrap:break-word; }
.sp-msg.sp-ich { align-self:flex-end; background:rgba(21,119,155,.12); border-bottom-right-radius:4px; }
.sp-msg.sp-team { align-self:flex-start; background:var(--card, #fff); border:1px solid var(--line); border-bottom-left-radius:4px; }
.sp-wer { font-size:11px; font-weight:700; color:var(--muted); margin-bottom:4px; }
.sp-anhang { display:inline-block; margin-top:6px; font-size:13px; font-weight:600; color:var(--teal); }