diff --git a/CHANGELOG.md b/CHANGELOG.md
index a08acaa2d..f00a115db 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -10,6 +10,7 @@ and this project adheres to
 
 - ✨(frontend) create skeleton component for DocEditor #1491
 - ✨(frontend) add an EmojiPicker in the document tree and title #1381
+- ✨(frontend) improve mobile UX by showing subdocs count #1540
 
 ### Changed
 
diff --git a/src/frontend/apps/impress/src/features/docs/doc-header/components/DocHeader.tsx b/src/frontend/apps/impress/src/features/docs/doc-header/components/DocHeader.tsx
index 90a2a8034..8e3b0cd33 100644
--- a/src/frontend/apps/impress/src/features/docs/doc-header/components/DocHeader.tsx
+++ b/src/frontend/apps/impress/src/features/docs/doc-header/components/DocHeader.tsx
@@ -1,23 +1,20 @@
 import { useTranslation } from 'react-i18next';
 
-import { Box, HorizontalSeparator, Text } from '@/components';
-import { useConfig } from '@/core';
+import { Box, HorizontalSeparator } from '@/components';
 import { useCunninghamTheme } from '@/cunningham';
 import {
   Doc,
   LinkReach,
-  Role,
   getDocLinkReach,
   useIsCollaborativeEditable,
-  useTrans,
 } from '@/docs/doc-management';
-import { useDate } from '@/hook';
 import { useResponsiveStore } from '@/stores';
 
 import { AlertNetwork } from './AlertNetwork';
 import { AlertPublic } from './AlertPublic';
 import { AlertRestore } from './AlertRestore';
 import { BoutonShare } from './BoutonShare';
+import { DocHeaderInfo } from './DocHeaderInfo';
 import { DocTitle } from './DocTitle';
 import { DocToolBox } from './DocToolBox';
 
@@ -29,27 +26,11 @@ export const DocHeader = ({ doc }: DocHeaderProps) => {
   const { spacingsTokens } = useCunninghamTheme();
   const { isDesktop } = useResponsiveStore();
   const { t } = useTranslation();
-  const { transRole } = useTrans();
   const { isEditable } = useIsCollaborativeEditable(doc);
   const docIsPublic = getDocLinkReach(doc) === LinkReach.PUBLIC;
   const docIsAuth = getDocLinkReach(doc) === LinkReach.AUTHENTICATED;
-  const { relativeDate, calculateDaysLeft } = useDate();
-  const { data: config } = useConfig();
   const isDeletedDoc = !!doc.deleted_at;
 
-  let dateToDisplay = t('Last update: {{update}}', {
-    update: relativeDate(doc.updated_at),
-  });
-
-  if (config?.TRASHBIN_CUTOFF_DAYS && doc.deleted_at) {
-    const daysLeft = calculateDaysLeft(
-      doc.deleted_at,
-      config.TRASHBIN_CUTOFF_DAYS,
-    );
-
-    dateToDisplay = `${t('Days remaining:')} ${daysLeft} ${t('days', { count: daysLeft })}`;
-  }
-
   return (
     <>
       <Box
@@ -80,33 +61,8 @@ export const DocHeader = ({ doc }: DocHeaderProps) => {
           >
             <Box $gap={spacingsTokens['3xs']} $overflow="auto">
               <DocTitle doc={doc} />
-
               <Box $direction="row">
-                {isDesktop && (
-                  <>
-                    <Text
-                      $variation="600"
-                      $size="s"
-                      $weight="bold"
-                      $theme={isEditable ? 'greyscale' : 'warning'}
-                    >
-                      {transRole(
-                        isEditable
-                          ? doc.user_role || doc.link_role
-                          : Role.READER,
-                      )}
-                      &nbsp;·&nbsp;
-                    </Text>
-                    <Text $variation="600" $size="s">
-                      {dateToDisplay}
-                    </Text>
-                  </>
-                )}
-                {!isDesktop && (
-                  <Text $variation="400" $size="s">
-                    {dateToDisplay}
-                  </Text>
-                )}
+                <DocHeaderInfo doc={doc} />
               </Box>
             </Box>
             {!isDeletedDoc && <DocToolBox doc={doc} />}
diff --git a/src/frontend/apps/impress/src/features/docs/doc-header/components/DocHeaderInfo.tsx b/src/frontend/apps/impress/src/features/docs/doc-header/components/DocHeaderInfo.tsx
new file mode 100644
index 000000000..934c97ba2
--- /dev/null
+++ b/src/frontend/apps/impress/src/features/docs/doc-header/components/DocHeaderInfo.tsx
@@ -0,0 +1,98 @@
+import { useTreeContext } from '@gouvfr-lasuite/ui-kit';
+import { t } from 'i18next';
+import React from 'react';
+
+import { Text } from '@/components';
+import { useConfig } from '@/core';
+import { useDate } from '@/hook';
+import { useResponsiveStore } from '@/stores';
+
+import {
+  Doc,
+  Role,
+  useIsCollaborativeEditable,
+  useTrans,
+} from '../../doc-management';
+import { useDocChildren, useDocTree } from '../../doc-tree';
+
+interface DocHeaderInfoProps {
+  doc: Doc;
+}
+
+export const DocHeaderInfo = ({ doc }: DocHeaderInfoProps) => {
+  const { data: tree } = useDocTree({ docId: doc.id });
+  const { isDesktop } = useResponsiveStore();
+  const treeContext = useTreeContext<Doc | null>();
+  const { transRole } = useTrans();
+  const { isEditable } = useIsCollaborativeEditable(doc);
+  const { relativeDate, calculateDaysLeft } = useDate();
+  const { data: config } = useConfig();
+
+  const { data: childrenPage } = useDocChildren(
+    { docId: doc.id, page_size: 1 },
+    { enabled: true },
+  );
+  const countFromTreeContext =
+    treeContext?.root?.id === doc.id
+      ? treeContext?.treeData?.nodes?.length
+      : undefined;
+
+  const childrenCount =
+    countFromTreeContext ??
+    childrenPage?.count ??
+    doc.numchild ??
+    tree?.children?.length ??
+    0;
+
+  let dateToDisplay = t('Last update: {{update}}', {
+    update: relativeDate(doc.updated_at),
+  });
+  const relativeOnly = relativeDate(doc.updated_at);
+
+  if (config?.TRASHBIN_CUTOFF_DAYS && doc.deleted_at) {
+    const daysLeft = calculateDaysLeft(
+      doc.deleted_at,
+      config.TRASHBIN_CUTOFF_DAYS,
+    );
+
+    dateToDisplay = `${t('Days remaining:')} ${daysLeft} ${t('days', { count: daysLeft })}`;
+  }
+
+  const hasChildren = childrenCount > 0;
+  return (
+    <>
+      {isDesktop ? (
+        <>
+          <Text
+            $variation="600"
+            $size="s"
+            $weight="bold"
+            $theme={isEditable ? 'greyscale' : 'warning'}
+          >
+            {transRole(
+              isEditable ? doc.user_role || doc.link_role : Role.READER,
+            )}
+            &nbsp;·&nbsp;
+          </Text>
+          <Text $variation="600" $size="s">
+            {dateToDisplay}
+          </Text>
+        </>
+      ) : (
+        <>
+          <Text $variation="400" $size="s">
+            {hasChildren ? relativeOnly : dateToDisplay}
+          </Text>
+          {hasChildren ? (
+            <Text $variation="400" $size="s">
+              &nbsp;•&nbsp;
+              {t('Contains {{count}} sub-documents', {
+                count: childrenCount,
+              })}
+            </Text>
+          ) : null}
+        </>
+      )}
+    </>
+  );
+};