feat: ajout de la gestion de l'auto-hide du header et amélioration de la réactivité des composants en fonction de la taille de la fenêtre, ainsi que des optimisations CSS pour une meilleure expérience utilisateur sur mobile.

assets/vue/app/shared/components/layout/Sidebar.vue

@@ -2,7 +2,8 @@
     <aside
         :class="[
             'fixed top-16 left-0 w-60 bg-gray-600 text-white transform transition-transform duration-300 ease-in-out z-40 h-full',
-            isOpen ? 'translate-x-0' : '-translate-x-full md:translate-x-0'
+            isOpen ? 'translate-x-0' : '-translate-x-full',
+            !forceMobileBehavior ? 'md:translate-x-0' : ''
         ]"
         role="navigation"
         aria-label="Menu principal">
@@ -23,22 +24,26 @@
 
 <script setup>
     import {
-        BookOpenIcon,
-        PlusIcon,
-        ArrowDownTrayIcon,
-        GlobeAltIcon,
-        ArrowsRightLeftIcon,
-        CalendarIcon,
-        ClockIcon,
-        Cog6ToothIcon,
-        ComputerDesktopIcon
-    } from '@heroicons/vue/24/solid';
-    import MenuGroup from './sidebar/MenuGroup.vue';
+    ArrowDownTrayIcon,
+    ArrowsRightLeftIcon,
+    BookOpenIcon,
+    CalendarIcon,
+    ClockIcon,
+    Cog6ToothIcon,
+    ComputerDesktopIcon,
+    GlobeAltIcon,
+    PlusIcon
+} from '@heroicons/vue/24/solid';
+import MenuGroup from './sidebar/MenuGroup.vue';
 
     const props = defineProps({
         isOpen: {
             type: Boolean,
             required: true
+        },
+        forceMobileBehavior: {
+            type: Boolean,
+            default: false
         }
     });