style: update UI component styles and structure commit

apps/backoffice/src/app/features/configuration/pages/ConfigurationPage.tsx

@@ -218,8 +218,8 @@ function ProfessionTab() {
 
   return (
     <>
-      <Group justify="space-between" mb="md">
-        <Text fw={600} size="sm">{t('configuration.professionsList')}</Text>
+      <Group justify="space-between" align="flex-end" mb="md">
+        <Title order={2}>{t('configuration.professionsList')}</Title>
         {!showProfForm && (
           <Button
             variant="light"

libs/ui/src/lib/layout/AppHeader.tsx

@@ -1,5 +1,6 @@
 import {
   Anchor,
+  Box,
   Burger,
   Group,
   Indicator,
@@ -52,7 +53,7 @@ export function AppHeader({
     <Group h="100%" px="lg" justify="space-between" wrap="nowrap">
       <Group gap="md" wrap="nowrap">
         {/* Hamburger — styled like user-management Top.tsx */}
-        <UnstyledButton
+        <Box
           onClick={isMobile ? onToggleNav : onToggleSidebar}
           style={{
             display: 'flex',
@@ -91,7 +92,7 @@ export function AppHeader({
               burger: { '--burger-color': 'currentColor' },
             }}
           />
-        </UnstyledButton>
+        </Box>
 
         {/* Breadcrumbs — card container with pill-style crumbs */}
         <Group