Enhance child management features in Falukant module

- Added new translations for gender, baptism status, and child details in both German and English localization files, improving user experience.
- Integrated ChildDetailsDialog component into FamilyView for displaying detailed information about children.
- Updated the showChildDetails method to utilize the new dialog for better user interaction.
- Modified button styles for improved visual feedback when setting heirs.

frontend/src/views/falukant/FamilyView.vue

@@ -168,6 +168,7 @@
             </div>
 
         </div>
+        <ChildDetailsDialog ref="childDetailsDialog" />
     </div>
 </template>
 
@@ -175,6 +176,7 @@
 import StatusBar from '@/components/falukant/StatusBar.vue'
 import MessageDialog from '@/dialogues/standard/MessageDialog.vue'
 import ErrorDialog from '@/dialogues/standard/ErrorDialog.vue'
+import ChildDetailsDialog from '@/dialogues/falukant/ChildDetailsDialog.vue'
 
 import apiClient from '@/utils/axios.js'
 import { mapState } from 'vuex'
@@ -184,7 +186,8 @@ export default {
     components: {
         StatusBar,
         MessageDialog,
-        ErrorDialog
+        ErrorDialog,
+        ChildDetailsDialog
     },
     data() {
         return {
@@ -245,7 +248,7 @@ export default {
         },
 
         showChildDetails(child) {
-            console.log('Show details for child:', child);
+            this.$refs.childDetailsDialog?.open(child);
         },
 
         async setAsHeir(child) {
@@ -494,7 +497,7 @@ h2 {
 
 .set-heir-button {
     padding: 4px 8px;
-    background-color: #2196F3;
+    background-color: #28a745;
     color: white;
     border: none;
     border-radius: 4px;
@@ -503,6 +506,6 @@ h2 {
 }
 
 .set-heir-button:hover {
-    background-color: #1976D2;
+    background-color: #218838;
 }
 </style>