Topbar auf globalen Prüf-Timer reduziert, Aktionen+Beschreibung über Tabellen, sortierbare Listen

- Topbar zeigt rechts jetzt ausschließlich den "Nächste Prüfung"-Countdown,
  konsistent auf jeder Seite (auch anonymes Dashboard) statt nur auf dem
  Dashboard. Neuer Context-Processor inject_check_timer()/get_last_run_at()
  liefert last_run/interval global, ohne dass jede Route das selbst
  berechnen muss.
- "+ Neu ..."-Buttons (Devices, Switches, Zugangsdaten, Benutzer, Gruppen)
  aus der Topbar entfernt und stattdessen in einen .section-head direkt
  über der jeweiligen Tabelle verschoben, zusammen mit einer kurzen
  Beschreibung der Seite (bisher nur bei Zugangsdaten/Gruppen vorhanden,
  jetzt auch bei Geräte/Switche/Benutzer).
- Live-Log: eigene lokale Timer-Pill entfernt (redundant zum globalen
  Timer), "Aktualisieren"-Button in denselben section-head verschoben.
  Dashboard: Suchfeld aus der Topbar in den Seiteninhalt verschoben, lokale
  Timer-Anzeige entfernt (übernimmt die globale Topbar-Pill), Reload-bei-
  Intervallende-Logik bleibt als separater, unsichtbarer Scheduler erhalten.
- Neue generische Tabellen-Sortierung (app.js: initSortableTables): Klick
  auf eine Spaltenüberschrift mit data-sort-key sortiert die Zeilen anhand
  von data-sort-<key>-Attributen. Unterstützt auch Akkordeon-Tabellen mit
  mehreren <tbody> (Gruppen: Haupt- + Detail-Zeile bleiben als Einheit
  zusammen, die virtuelle "Admin"-Zeile bleibt über data-sort-pinned immer
  oben). Angewendet auf Geräte, Switche, Zugangsdaten, Benutzer, Gruppen.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>

srv/poe_manager/templates/groups.html

@@ -2,28 +2,37 @@
 {% set active_page = "groups" %}
 {% block page_title %}Gruppen{% endblock %}
 {% block page_sub %}<div class="topbar-sub">{{ groups|length + 1 }} Gruppen · Rechteverwaltung</div>{% endblock %}
-{% block topbar_right %}
-<button type="button" class="btn btn-primary" data-open-modal="addGroupModal">
-  <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"><path d="M12 5v14M5 12h14"/></svg>
-  Neue Gruppe
-</button>
-{% endblock %}
 
 {% block content %}
 
-<p class="text-faint" style="font-size:12.5px; margin-bottom:18px; max-width:720px;">
-  Über Gruppen lassen sich einzelne Verwaltungsrechte für Devices und Switches gezielt vergeben.
-  Ein Benutzer kann mehreren Gruppen angehören — die Rechte addieren sich. Auf „Rechte“ klicken,
-  um eine Gruppe aufzuklappen und die Berechtigungen im Detail zu sehen bzw. zu ändern.
-</p>
+<div class="section-head">
+  <div>
+    <h2 style="font-size:16px;">Gruppen</h2>
+    <div class="hint">
+      Über Gruppen lassen sich einzelne Verwaltungsrechte für Devices und Switches gezielt vergeben.
+      Ein Benutzer kann mehreren Gruppen angehören — die Rechte addieren sich. Auf „Rechte“ klicken,
+      um eine Gruppe aufzuklappen und die Berechtigungen im Detail zu sehen bzw. zu ändern.
+    </div>
+  </div>
+  <button type="button" class="btn btn-primary" data-open-modal="addGroupModal">
+    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"><path d="M12 5v14M5 12h14"/></svg>
+    Neue Gruppe
+  </button>
+</div>
 
 <div class="table-wrap">
   <div style="overflow-x:auto;">
-  <table class="data-table">
-    <thead><tr><th>Gruppe</th><th>Mitglieder</th><th style="width:1%;">Aktionen</th></tr></thead>
-    <tbody>
-      <!-- Virtuelle "Admin"-Gruppe: Rechte sind fix (alles), Mitgliedschaft
-           wird direkt über is_admin gesteuert. -->
+  <table class="data-table" data-sortable>
+    <thead><tr>
+      <th data-sort-key="name">Gruppe</th>
+      <th data-sort-key="members">Mitglieder</th>
+      <th style="width:1%;">Aktionen</th>
+    </tr></thead>
+
+    <!-- Virtuelle "Admin"-Gruppe: Rechte sind fix (alles), Mitgliedschaft
+         wird direkt über is_admin gesteuert. Bleibt beim Sortieren immer
+         oben (eigenes <tbody data-sort-pinned>). -->
+    <tbody data-sort-pinned>
       <tr>
         <td class="cell-name">Admin <span class="pill admin">Systemrolle</span></td>
         <td class="text-dim">{{ admin_virtual_group.member_names|length }}</td>
@@ -58,8 +67,12 @@
           <p class="text-faint" style="font-size:11.5px; margin:12px 0 0;">Admins dürfen immer alles — diese Rechte sind fest und nicht änderbar.</p>
         </td>
       </tr>
+    </tbody>
 
-      {% for g in groups %}
+    {% for g in groups %}
+    <!-- Jede Gruppe (Haupt- + Detail-Zeile) in einem eigenen <tbody>, damit
+         die Sortierung beide Zeilen gemeinsam verschiebt. -->
+    <tbody data-sort-name="{{ g.name|lower }}" data-sort-members="{{ g.member_names|length }}">
       <tr>
         <td class="cell-name">
           {{ g.name }}
@@ -116,10 +129,12 @@
           </form>
         </td>
       </tr>
-      {% else %}
-      <tr class="empty-row"><td colspan="3">Noch keine weiteren Gruppen angelegt.</td></tr>
-      {% endfor %}
     </tbody>
+    {% else %}
+    <tbody data-sort-pinned>
+      <tr class="empty-row"><td colspan="3">Noch keine weiteren Gruppen angelegt.</td></tr>
+    </tbody>
+    {% endfor %}
   </table>
   </div>
 </div>