Fix tenant merge review layout

frontend/pages/administration/tenant-imports/[importId].vue

@@ -115,15 +115,31 @@ onMounted(async () => {
 </script>
 
 <template>
-  <div class="space-y-4">
-    <div class="flex flex-wrap items-center justify-between gap-3">
-      <div>
-        <h1 class="text-2xl font-semibold">Tenant-Import prüfen</h1>
-        <p class="text-sm text-gray-500">Dry-Run {{ importId }}</p>
-      </div>
-      <UButton color="neutral" variant="soft" icon="i-heroicons-arrow-left" @click="router.push(`/administration/tenants/${tenantId}`)">
-        Zurück zum Tenant
+  <UDashboardNavbar title="Tenant-Import prüfen">
+    <template #left>
+      <UButton
+        color="neutral"
+        variant="outline"
+        icon="i-heroicons-chevron-left"
+        @click="router.push(`/administration/tenants/${tenantId}`)"
+      >
+        Tenant
       </UButton>
+    </template>
+    <template #right>
+      <UBadge color="neutral" variant="soft" class="hidden sm:inline-flex">
+        Dry-Run {{ importId.slice(0, 8) }}
+      </UBadge>
+    </template>
+  </UDashboardNavbar>
+
+  <UDashboardPanelContent>
+    <div class="mx-auto w-full max-w-screen-2xl space-y-6 pb-8">
+      <div>
+        <h1 class="text-2xl font-semibold text-highlighted">Import prüfen und zusammenführen</h1>
+        <p class="mt-1 text-sm text-muted">
+          Prüfe neue, vorhandene und abweichende Datensätze, bevor Änderungen am Tenant ausgeführt werden.
+        </p>
       </div>
 
     <UAlert
@@ -245,4 +261,5 @@ onMounted(async () => {
       </div>
     </UCard>
     </div>
+  </UDashboardPanelContent>
 </template>