Update DesktopNavigationBuefy and Viewport layout logic for better responsiveness

- Removed unnecessary visibility check for `DesktopNavigationBuefy`.
- Introduced `watch` in `Viewport` to dynamically update header height on state changes.
- Adjusted grid column spans to handle hidden states and ultra-wide screen devices.

src/components/viewport/Viewport.vue

@@ -4,7 +4,7 @@ import ViewportHeader from "@/components/viewport/page/headers/ViewportHeader.vu
 import ViewportContent from "@/components/viewport/page/content/ViewportContent.vue";
 import { backgroundColor } from "./page/headers/ViewportHeaderSettings.vue";
 import DesktopNavigationBuefy from "@/components/viewport/page/headers/DesktopNavigationBuefy.vue";
-import { ref, onMounted, computed } from "vue";
+import { ref, onMounted, computed, watch, nextTick } from "vue";
 import SessionUser from "@/components/session/token/SessionUser.vue";
 import ViewportFooter from "@/components/viewport/page/footers/ViewportFooter.vue";
 import {useRouter} from "vue-router";
@@ -35,6 +35,12 @@ onMounted(() => {
   window.addEventListener('resize', updateHeaderHeight);
 });
 
+watch(isHidden, () => {
+  nextTick(() => {
+    updateHeaderHeight();
+  });
+});
+
 const isFooterInContent = computed(() => {
   if (!showFooterInContent.value) {
     return false;
@@ -60,7 +66,15 @@ const isFooterInContent = computed(() => {
             <DesktopNavigationBuefy />
           </div>
         </div>
-          <div class="cell is-col-span-9-desktop is-col-span-12-mobile is-col-span-8-tablet" :class="{'is-col-span-10-widescreen': SessionUser.functions.device.isUltraWideScreen()}">
+        <div class="cell is-col-span-12-mobile"
+             :class="{
+               'is-col-span-9-desktop': !isHidden,
+               'is-col-span-12-desktop': isHidden,
+               'is-col-span-8-tablet': !isHidden,
+               'is-col-span-12-tablet': isHidden,
+               'is-col-span-10-widescreen': !isHidden && SessionUser.functions.device.isUltraWideScreen(),
+               'is-col-span-12-widescreen': isHidden && SessionUser.functions.device.isUltraWideScreen()
+             }">
           <div class="independent-scroll slick-scroll-layout" :style="{ maxHeight: independentScrollMaxHeight }">
             <ViewportContent>
               <slot />

src/components/viewport/page/headers/DesktopNavigationBuefy.vue

@@ -40,8 +40,7 @@ const visibleChildren = (item: any) => {
 </script>
 
 <template>
-  <div class="section pl-3 pr-1 pt-0" v-show="getDepartmentSelectionVisibility()">
-    {{ getDepartmentSelectionVisibility() }}
+  <div class="section pl-3 pr-1 pt-0">
     <b-menu ref="menuList">
       <b-menu-list label="">
         <template