diff --git a/lib/ui/components/UnreadBadge.tsx b/lib/ui/components/UnreadBadge.tsx
index cb62285b..1eb1009d 100644
--- a/lib/ui/components/UnreadBadge.tsx
+++ b/lib/ui/components/UnreadBadge.tsx
@@ -16,14 +16,20 @@ interface Props {
   text?: string | number;
   style?: TextProps['style'];
   variant?: 'outlined' | 'filled';
+  isNumeric?: boolean;
 }
 
-export const UnreadBadge = ({ text, style, variant = 'filled' }: Props) => {
+export const UnreadBadge = ({
+  text,
+  style,
+  variant = 'filled',
+  isNumeric = false,
+}: Props) => {
   const { t } = useTranslation();
   const { colors, palettes } = useTheme();
   const styles = useStylesheet(createStyles);
   const isOutlined = useMemo(() => variant === 'outlined', [variant]);
-  const isNumeric = isNumber(text);
+  const isDigit = isNumber(text);
 
   return (
     <Row
@@ -34,14 +40,14 @@ export const UnreadBadge = ({ text, style, variant = 'filled' }: Props) => {
       style={[
         styles.badge,
         {
-          backgroundColor: isNumeric
-            ? palettes.rose[600]
-            : palettes.orange[600],
+          backgroundColor:
+            isDigit || isNumeric ? palettes.rose[600] : palettes.orange[600],
         },
         !text && styles.dotBadge,
         isOutlined && {
           backgroundColor: colors.surface,
-          borderColor: isNumeric ? palettes.rose[600] : palettes.orange[600],
+          borderColor:
+            isDigit || isNumeric ? palettes.rose[600] : palettes.orange[600],
 
           borderWidth: 2,
         },
@@ -56,7 +62,7 @@ export const UnreadBadge = ({ text, style, variant = 'filled' }: Props) => {
           ]}
         >
           {text}
-          {isNumeric && (
+          {isDigit && (
             <VisuallyHidden>
               {t('common.newItems', { count: Number(text) })}
             </VisuallyHidden>
diff --git a/src/features/services/components/ServiceCard.tsx b/src/features/services/components/ServiceCard.tsx
index 013e9a00..3c0e3816 100644
--- a/src/features/services/components/ServiceCard.tsx
+++ b/src/features/services/components/ServiceCard.tsx
@@ -31,7 +31,7 @@ interface Props extends PropsWithChildren<TouchableCardProps> {
   onFavoriteChange: (favorite: boolean) => void;
   linkTo?: To<any>;
   onPress?: () => void;
-  unReadCount?: number;
+  unReadCount?: number | string;
 }
 
 export const ServiceCard = ({
@@ -81,7 +81,12 @@ export const ServiceCard = ({
         <Text variant="title" style={styles.title}>
           {name}
         </Text>
-        {unReadCount > 0 && !disabled && <UnreadBadge text={unReadCount} />}
+        {typeof unReadCount === 'number' && unReadCount > 0 && !disabled && (
+          <UnreadBadge text={unReadCount} />
+        )}
+        {typeof unReadCount === 'string' && !disabled && (
+          <UnreadBadge text={unReadCount} isNumeric={true} />
+        )}
       </Row>
       {children}
     </TouchableCard>
diff --git a/src/features/services/screens/ServicesScreen.tsx b/src/features/services/screens/ServicesScreen.tsx
index c5e93d62..860b0012 100644
--- a/src/features/services/screens/ServicesScreen.tsx
+++ b/src/features/services/screens/ServicesScreen.tsx
@@ -143,7 +143,7 @@ export const ServicesScreen = () => {
         icon: faEnvelope,
         disabled: isOffline,
         unReadCount: unreadEmailsQuery.data
-          ? parseInt(unreadEmailsQuery.data.unreadEmails, 10)
+          ? unreadEmailsQuery.data.unreadEmails
           : 0,
         onPress: () => {
           queryClient