Make profile editing collapsible

app/templates/profile.html

@@ -42,7 +42,12 @@
         .patch-dialog-reason { padding-top:10px; border-top:1px solid var(--border); color:var(--muted); }
         .patch-dialog-preview { max-width:150px; max-height:150px; object-fit:contain; }
         .patch-dialog-close { float:right; margin:0; }
-        .profile-edit { margin-top: 24px; }
+        .profile-edit { margin-top: 24px; padding: 0; overflow: hidden; }
+        .profile-edit-summary { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:16px 22px; color:#fca5a5; cursor:pointer; list-style:none; font-size:1.15rem; font-weight:700; }
+        .profile-edit-summary::-webkit-details-marker { display:none; }
+        .profile-edit-summary::after { content:"+"; color:var(--muted); font-size:1.4rem; line-height:1; }
+        .profile-edit[open] > .profile-edit-summary::after { content:"−"; }
+        .profile-edit-content { padding:0 22px 22px; }
         .account-actions { display:flex; align-items:flex-start; justify-content:space-between; gap:20px; margin-top:22px; padding-top:16px; border-top:1px solid var(--border); }
         .account-delete { flex:1; color:var(--muted); }
         .account-delete summary { color:#fca5a5; cursor:pointer; font-weight:700; }
@@ -228,8 +233,9 @@
         </section>
     {% endif %}
     {% if is_own_profile %}
-        <section class="profile-edit">
-            <h2>{{ _('Profil bearbeiten') }}</h2>
+        <details class="profile-edit"{% if form_error or form_success %} open{% endif %}>
+            <summary class="profile-edit-summary">{{ _('Profil bearbeiten') }}</summary>
+            <div class="profile-edit-content">
             {% if form_error %}<p class="profile-error" role="alert">{{ form_error | t }}</p>{% endif %}
             {% if form_success %}<p class="profile-success" role="status">{{ form_success }}</p>{% endif %}
             <form method="post" action="/profile" enctype="multipart/form-data" id="profile-form">
@@ -271,7 +277,8 @@
                 </details>
                 <p class="data-export"><a href="/profile/export">{{ _('Meine gespeicherten Daten exportieren (JSON)') }}</a></p>
             </div>
-        </section>
+            </div>
+        </details>
     {% endif %}
 </main>
 <script>