Remove @mui/styles legacy package

package.json

@@ -88,7 +88,6 @@
     "@mui/icons-material": "^5.15.10",
     "@mui/lab": "^5.0.0-alpha.56",
     "@mui/material": "5.13.x",
-    "@mui/styles": "^5.2.0",
     "@mui/x-data-grid": "^5.0.1",
     "@mui/x-date-pickers": "^5.0.16",
     "@ory/kratos-client": "^0.10.1",

src/core/auth/authentication/pages/AuthRequiredPage.tsx

@@ -1,12 +1,11 @@
+import { _AUTH_LOGIN_PATH, AUTH_SIGN_UP_PATH } from '@/core/auth/authentication/constants/authentication.constants';
+import { useQueryParams } from '@/core/routing/useQueryParams';
+import { buildReturnUrlParam } from '@/main/routing/urlBuilders';
+import AuthenticationLayout from '@/main/ui/layout/AuthenticationLayout';
 import ErrorOutline from '@mui/icons-material/ErrorOutline';
+import { Box, Button, Typography } from '@mui/material';
 import { useTranslation } from 'react-i18next';
 import { Link } from 'react-router-dom';
-import WrapperTypography from '@/core/ui/typography/deprecated/WrapperTypography';
-import { useQueryParams } from '@/core/routing/useQueryParams';
-import AuthenticationLayout from '@/main/ui/layout/AuthenticationLayout';
-import { _AUTH_LOGIN_PATH, AUTH_SIGN_UP_PATH } from '@/core/auth/authentication/constants/authentication.constants';
-import { Box, Button } from '@mui/material';
-import { buildReturnUrlParam } from '@/main/routing/urlBuilders';
 
 export const AuthRequiredPage = () => {
   const returnUrl = useQueryParams().get('returnUrl') ?? undefined;
@@ -26,12 +25,14 @@ export const AuthRequiredPage = () => {
 
   return (
     <AuthenticationLayout>
-      <Box textAlign={'center'}>
-        <WrapperTypography variant={'h2'}>
-          <ErrorOutline color={'primary'} fontSize={'large'} />
-        </WrapperTypography>
-        <WrapperTypography variant={'h2'}>{t('pages.authentication-required.header')}</WrapperTypography>
-        <WrapperTypography variant={'h3'}>{t('pages.authentication-required.subheader')}</WrapperTypography>
+      <Box textAlign="center">
+        <ErrorOutline color="primary" fontSize="large" sx={{ mb: 1 }} />
+        <Typography variant="h2" mb={1} fontWeight="medium" textTransform="uppercase">
+          {t('pages.authentication-required.header')}
+        </Typography>
+        <Typography variant="h3" fontWeight="medium">
+          {t('pages.authentication-required.subheader')}
+        </Typography>
       </Box>
       <Box display="flex" marginTop={4} gap={2} justifyContent="center">
         <Button component={Link} to={loginUrl} variant="outlined" color="primary">

src/core/help/dialog/HelpDialog.tsx

@@ -1,18 +1,17 @@
-import { Trans, useTranslation } from 'react-i18next';
-import { Box, Grid, Link, styled } from '@mui/material';
-import QuizOutlinedIcon from '@mui/icons-material/QuizOutlined';
-import ForumOutlinedIcon from '@mui/icons-material/ForumOutlined';
-import FiberNewTwoToneIcon from '@mui/icons-material/FiberNewTwoTone';
-import { DialogContent } from '@/core/ui/dialog/deprecated';
-import WrapperMarkdown from '@/core/ui/markdown/WrapperMarkdown';
-import { useConfig } from '@/domain/platform/config/useConfig';
 import DialogHeader from '@/core/ui/dialog/DialogHeader';
-import { TopLevelRoutePath } from '@/main/routing/TopLevelRoutePath';
-import useServerMetadata from '@/domain/platform/metadata/useServerMetadata';
 import DialogWithGrid from '@/core/ui/dialog/DialogWithGrid';
 import Gutters from '@/core/ui/grid/Gutters';
+import WrapperMarkdown from '@/core/ui/markdown/WrapperMarkdown';
 import { Caption } from '@/core/ui/typography';
+import { useConfig } from '@/domain/platform/config/useConfig';
+import useServerMetadata from '@/domain/platform/metadata/useServerMetadata';
+import { TopLevelRoutePath } from '@/main/routing/TopLevelRoutePath';
 import { buildWelcomeSpaceUrl } from '@/main/routing/urlBuilders';
+import FiberNewTwoToneIcon from '@mui/icons-material/FiberNewTwoTone';
+import ForumOutlinedIcon from '@mui/icons-material/ForumOutlined';
+import QuizOutlinedIcon from '@mui/icons-material/QuizOutlined';
+import { Box, DialogContent, Grid, Link, styled } from '@mui/material';
+import { Trans, useTranslation } from 'react-i18next';
 
 interface HelpDialogProps {
   open: boolean;