Update mui theme

src/components/manga/MangaDetails.tsx

@@ -200,7 +200,7 @@ const DescriptionGenre = ({
                         position: isCollapsed ? 'absolute' : null,
                         width: '100%',
                         bottom: 0,
-                        background: (theme) => `linear-gradient(transparent 1px, ${theme.palette.background.paper})`,
+                        background: (theme) => `linear-gradient(transparent 1px, ${theme.palette.background.default})`,
                     }}
                 >
                     <IconButton sx={{ color: (theme) => (theme.palette.mode === 'light' ? 'black' : 'text') }}>

src/components/navbar/DefaultNavBar.tsx

@@ -138,7 +138,7 @@ export function DefaultNavBar() {
                                 alignItems: 'center',
                             }}
                         >
-                            <IconButton color="inherit" aria-label="open drawer" onClick={() => setIsCollapsed(false)}>
+                            <IconButton aria-label="open drawer" onClick={() => setIsCollapsed(false)}>
                                 <MenuIcon />
                             </IconButton>
                         </Stack>
@@ -157,7 +157,6 @@ export function DefaultNavBar() {
                                 component="button"
                                 sx={{ marginRight: 2 }}
                                 size="large"
-                                color="inherit"
                                 aria-label="menu"
                                 onClick={handleBack}
                             >

src/components/navbar/navigation/DesktopSideBar.tsx

@@ -58,7 +58,14 @@ const NavigationBarItem = ({ path, title, IconComponent, SelectedIconComponent }
             <Tooltip title={t(title)} placement="right">
                 <ListItem sx={listItemProps}>
                     <ListItemIcon sx={listItemIconProps}>
-                        <Icon sx={{ color: isActive ? 'primary.main' : undefined }} />
+                        <Icon
+                            sx={{
+                                color: isActive ? 'primary.dark' : undefined,
+                                ...theme.applyStyles('dark', {
+                                    color: isActive ? 'primary.light' : undefined,
+                                }),
+                            }}
+                        />
                     </ListItemIcon>
                     <ListItemText
                         primary={t(title)}
@@ -69,7 +76,10 @@ const NavigationBarItem = ({ path, title, IconComponent, SelectedIconComponent }
                                 overflow: 'hidden',
                                 textOverflow: 'ellipsis',
                                 ...(isCollapsed ? theme.typography.caption : {}),
-                                color: isActive ? 'primary.main' : undefined,
+                                color: isActive ? 'primary.dark' : undefined,
+                                ...theme.applyStyles('dark', {
+                                    color: isActive ? 'primary.light' : undefined,
+                                }),
                             },
                         }}
                     />

src/components/navbar/navigation/MobileBottomBar.tsx

@@ -40,7 +40,6 @@ export const MobileBottomBar = ({ navBarItems }: { navBarItems: NavbarItem[] })
             elevation={3}
         >
             <BottomNavigation
-                sx={{ backgroundColor: 'custom.light' }}
                 showLabels
                 value={selectedNavBarItem}
                 onChange={(_, newValue: string) => {

src/components/tracker/TrackerActiveCard.tsx

@@ -257,7 +257,7 @@ export const TrackerActiveCard = ({
         <Card sx={CARD_STYLING}>
             <CardContent sx={{ padding: 0 }}>
                 <TrackerActiveHeader trackRecord={trackRecord} tracker={tracker} openSearch={onClick} />
-                <Card>
+                <Card sx={{ backgroundColor: 'background.default' }}>
                     <CardContent sx={{ padding: '0' }}>
                         <Box sx={{ padding: 1 }}>
                             <TrackerActiveCardInfoRow>

src/components/tracker/TrackerMangaCard.tsx

@@ -117,6 +117,7 @@ export const TrackerMangaCard = ({
     return (
         <Card
             sx={{
+                backgroundColor: 'background.default',
                 marginBottom: 2,
                 '&:last-child': { marginBottom: 8 },
             }}

src/components/tracker/TrackerSearch.tsx

@@ -182,7 +182,6 @@ export const TrackerSearch = ({
                         <Button
                             disabled={bindTrackerMutation.loading}
                             size="large"
-                            color="primary"
                             variant="contained"
                             onClick={trackManga}
                             sx={{ width: '75%' }}