Enhance navigation and UI components for improved user experience

- Added new AppHeader and BottomNav components for better navigation across the application.
- Introduced AreaTabs for product area navigation and integrated RoleSwitcher for user role management.
- Created CartButton component to display cart status and item count.
- Implemented UserMenu with login/logout functionality and user greeting.
- Added Badge component for notifications and status indicators.
- Updated layout to accommodate new navigation components and ensure mobile responsiveness.
- Created product detail demo page to showcase design patterns and features.
- Enhanced existing components with improved styling and functionality.

app/pages/products/[id].vue

@@ -181,10 +181,8 @@ const handleAddToCart = () => {
               >
                 {{ product.stockQuantity > 0 ? 'In den Warenkorb' : 'Nicht verfügbar' }}
               </Button>
-              <NuxtLink to="/products" class="flex-1">
-                <Button variant="outline" size="experimenta" class="w-full">
-                  Weitere Produkte ansehen
-                </Button>
+              <NuxtLink to="/products" class="btn-secondary flex-1 text-center">
+                Weitere Produkte ansehen
               </NuxtLink>
             </div>
           </div>