diff --git a/src/CONST.ts b/src/CONST.ts
index 6517ece4276d..7d41ea7afdb5 100755
--- a/src/CONST.ts
+++ b/src/CONST.ts
@@ -200,27 +200,12 @@ const CONST = {
     // Sizes needed for report empty state background image handling
     EMPTY_STATE_BACKGROUND: {
         ASPECT_RATIO: 3.72,
+        OVERLAP: 60,
         SMALL_SCREEN: {
             IMAGE_HEIGHT: 300,
-            CONTAINER_MINHEIGHT: 200,
-            VIEW_HEIGHT: 240,
         },
         WIDE_SCREEN: {
             IMAGE_HEIGHT: 450,
-            CONTAINER_MINHEIGHT: 500,
-            VIEW_HEIGHT: 390,
-        },
-        MONEY_OR_TASK_REPORT: {
-            SMALL_SCREEN: {
-                IMAGE_HEIGHT: 300,
-                CONTAINER_MINHEIGHT: 280,
-                VIEW_HEIGHT: 240,
-            },
-            WIDE_SCREEN: {
-                IMAGE_HEIGHT: 450,
-                CONTAINER_MINHEIGHT: 280,
-                VIEW_HEIGHT: 390,
-            },
         },
     },
 
diff --git a/src/components/ReportActionItem/MoneyReportView.tsx b/src/components/ReportActionItem/MoneyReportView.tsx
index 139b5fde58b2..81d59d750284 100644
--- a/src/components/ReportActionItem/MoneyReportView.tsx
+++ b/src/components/ReportActionItem/MoneyReportView.tsx
@@ -12,7 +12,6 @@ import useLocalize from '@hooks/useLocalize';
 import useStyleUtils from '@hooks/useStyleUtils';
 import useTheme from '@hooks/useTheme';
 import useThemeStyles from '@hooks/useThemeStyles';
-import useWindowDimensions from '@hooks/useWindowDimensions';
 import * as CurrencyUtils from '@libs/CurrencyUtils';
 import Navigation from '@libs/Navigation/Navigation';
 import * as ReportUtils from '@libs/ReportUtils';
@@ -35,7 +34,6 @@ function MoneyReportView({report, policy}: MoneyReportViewProps) {
     const styles = useThemeStyles();
     const StyleUtils = useStyleUtils();
     const {translate} = useLocalize();
-    const {isSmallScreenWidth} = useWindowDimensions();
     const isSettled = ReportUtils.isSettled(report.reportID);
     const isTotalUpdated = ReportUtils.hasUpdatedTotal(report, policy);
 
@@ -60,113 +58,111 @@ function MoneyReportView({report, policy}: MoneyReportViewProps) {
     }, [policy, report]);
 
     return (
-        <View style={[StyleUtils.getReportWelcomeContainerStyle(isSmallScreenWidth, true), styles.overflowHidden]}>
+        <View style={[styles.pRelative]}>
             <AnimatedEmptyStateBackground />
-            <View style={[StyleUtils.getReportWelcomeTopMarginStyle(isSmallScreenWidth, true)]}>
-                {!ReportUtils.isClosedExpenseReportWithNoExpenses(report) && (
-                    <>
-                        {ReportUtils.reportFieldsEnabled(report) &&
-                            sortedPolicyReportFields.map((reportField) => {
-                                const isTitleField = ReportUtils.isReportFieldOfTypeTitle(reportField);
-                                const fieldValue = isTitleField ? report.reportName : reportField.value ?? reportField.defaultValue;
-                                const isFieldDisabled = ReportUtils.isReportFieldDisabled(report, reportField, policy);
-                                const fieldKey = ReportUtils.getReportFieldKey(reportField.fieldID);
+            {!ReportUtils.isClosedExpenseReportWithNoExpenses(report) && (
+                <>
+                    {ReportUtils.reportFieldsEnabled(report) &&
+                        sortedPolicyReportFields.map((reportField) => {
+                            const isTitleField = ReportUtils.isReportFieldOfTypeTitle(reportField);
+                            const fieldValue = isTitleField ? report.reportName : reportField.value ?? reportField.defaultValue;
+                            const isFieldDisabled = ReportUtils.isReportFieldDisabled(report, reportField, policy);
+                            const fieldKey = ReportUtils.getReportFieldKey(reportField.fieldID);
 
-                                return (
-                                    <OfflineWithFeedback
-                                        pendingAction={report.pendingFields?.[fieldKey]}
-                                        errors={report.errorFields?.[fieldKey]}
-                                        errorRowStyles={styles.ph5}
-                                        key={`menuItem-${fieldKey}`}
-                                        onClose={() => reportActions.clearReportFieldErrors(report.reportID, reportField)}
-                                    >
-                                        <MenuItemWithTopDescription
-                                            description={Str.UCFirst(reportField.name)}
-                                            title={fieldValue}
-                                            onPress={() => Navigation.navigate(ROUTES.EDIT_REPORT_FIELD_REQUEST.getRoute(report.reportID, report.policyID ?? '', reportField.fieldID))}
-                                            shouldShowRightIcon
-                                            disabled={isFieldDisabled}
-                                            wrapperStyle={[styles.pv2, styles.taskDescriptionMenuItem]}
-                                            shouldGreyOutWhenDisabled={false}
-                                            numberOfLinesTitle={0}
-                                            interactive
-                                            shouldStackHorizontally={false}
-                                            onSecondaryInteraction={() => {}}
-                                            hoverAndPressStyle={false}
-                                            titleWithTooltips={[]}
-                                        />
-                                    </OfflineWithFeedback>
-                                );
-                            })}
-                        <View style={[styles.flexRow, styles.pointerEventsNone, styles.containerWithSpaceBetween, styles.ph5, styles.pv2]}>
-                            <View style={[styles.flex1, styles.justifyContentCenter]}>
-                                <Text
-                                    style={[styles.textLabelSupporting]}
-                                    numberOfLines={1}
-                                >
-                                    {translate('common.total')}
-                                </Text>
-                            </View>
-                            <View style={[styles.flexRow, styles.justifyContentCenter]}>
-                                {isSettled && !isPartiallyPaid && (
-                                    <View style={[styles.defaultCheckmarkWrapper, styles.mh2]}>
-                                        <Icon
-                                            src={Expensicons.Checkmark}
-                                            fill={theme.success}
-                                        />
-                                    </View>
-                                )}
-                                <Text
-                                    numberOfLines={1}
-                                    style={[styles.taskTitleMenuItem, styles.alignSelfCenter, !isTotalUpdated && styles.offlineFeedback.pending]}
+                            return (
+                                <OfflineWithFeedback
+                                    pendingAction={report.pendingFields?.[fieldKey]}
+                                    errors={report.errorFields?.[fieldKey]}
+                                    errorRowStyles={styles.ph5}
+                                    key={`menuItem-${fieldKey}`}
+                                    onClose={() => reportActions.clearReportFieldErrors(report.reportID, reportField)}
                                 >
-                                    {formattedTotalAmount}
-                                </Text>
-                            </View>
+                                    <MenuItemWithTopDescription
+                                        description={Str.UCFirst(reportField.name)}
+                                        title={fieldValue}
+                                        onPress={() => Navigation.navigate(ROUTES.EDIT_REPORT_FIELD_REQUEST.getRoute(report.reportID, report.policyID ?? '', reportField.fieldID))}
+                                        shouldShowRightIcon
+                                        disabled={isFieldDisabled}
+                                        wrapperStyle={[styles.pv2, styles.taskDescriptionMenuItem]}
+                                        shouldGreyOutWhenDisabled={false}
+                                        numberOfLinesTitle={0}
+                                        interactive
+                                        shouldStackHorizontally={false}
+                                        onSecondaryInteraction={() => {}}
+                                        hoverAndPressStyle={false}
+                                        titleWithTooltips={[]}
+                                    />
+                                </OfflineWithFeedback>
+                            );
+                        })}
+                    <View style={[styles.flexRow, styles.pointerEventsNone, styles.containerWithSpaceBetween, styles.ph5, styles.pv2]}>
+                        <View style={[styles.flex1, styles.justifyContentCenter]}>
+                            <Text
+                                style={[styles.textLabelSupporting]}
+                                numberOfLines={1}
+                            >
+                                {translate('common.total')}
+                            </Text>
                         </View>
-                        {Boolean(shouldShowBreakdown) && (
-                            <>
-                                <View style={[styles.flexRow, styles.pointerEventsNone, styles.containerWithSpaceBetween, styles.ph5, styles.pv1]}>
-                                    <View style={[styles.flex1, styles.justifyContentCenter]}>
-                                        <Text
-                                            style={[styles.textLabelSupporting]}
-                                            numberOfLines={1}
-                                        >
-                                            {translate('cardTransactions.outOfPocket')}
-                                        </Text>
-                                    </View>
-                                    <View style={[styles.flexRow, styles.justifyContentCenter]}>
-                                        <Text
-                                            numberOfLines={1}
-                                            style={subAmountTextStyles}
-                                        >
-                                            {formattedOutOfPocketAmount}
-                                        </Text>
-                                    </View>
+                        <View style={[styles.flexRow, styles.justifyContentCenter]}>
+                            {isSettled && !isPartiallyPaid && (
+                                <View style={[styles.defaultCheckmarkWrapper, styles.mh2]}>
+                                    <Icon
+                                        src={Expensicons.Checkmark}
+                                        fill={theme.success}
+                                    />
+                                </View>
+                            )}
+                            <Text
+                                numberOfLines={1}
+                                style={[styles.taskTitleMenuItem, styles.alignSelfCenter, !isTotalUpdated && styles.offlineFeedback.pending]}
+                            >
+                                {formattedTotalAmount}
+                            </Text>
+                        </View>
+                    </View>
+                    {Boolean(shouldShowBreakdown) && (
+                        <>
+                            <View style={[styles.flexRow, styles.pointerEventsNone, styles.containerWithSpaceBetween, styles.ph5, styles.pv1]}>
+                                <View style={[styles.flex1, styles.justifyContentCenter]}>
+                                    <Text
+                                        style={[styles.textLabelSupporting]}
+                                        numberOfLines={1}
+                                    >
+                                        {translate('cardTransactions.outOfPocket')}
+                                    </Text>
                                 </View>
-                                <View style={[styles.flexRow, styles.pointerEventsNone, styles.containerWithSpaceBetween, styles.ph5, styles.pv1]}>
-                                    <View style={[styles.flex1, styles.justifyContentCenter]}>
-                                        <Text
-                                            style={[styles.textLabelSupporting]}
-                                            numberOfLines={1}
-                                        >
-                                            {translate('cardTransactions.companySpend')}
-                                        </Text>
-                                    </View>
-                                    <View style={[styles.flexRow, styles.justifyContentCenter]}>
-                                        <Text
-                                            numberOfLines={1}
-                                            style={subAmountTextStyles}
-                                        >
-                                            {formattedCompanySpendAmount}
-                                        </Text>
-                                    </View>
+                                <View style={[styles.flexRow, styles.justifyContentCenter]}>
+                                    <Text
+                                        numberOfLines={1}
+                                        style={subAmountTextStyles}
+                                    >
+                                        {formattedOutOfPocketAmount}
+                                    </Text>
+                                </View>
+                            </View>
+                            <View style={[styles.flexRow, styles.pointerEventsNone, styles.containerWithSpaceBetween, styles.ph5, styles.pv1]}>
+                                <View style={[styles.flex1, styles.justifyContentCenter]}>
+                                    <Text
+                                        style={[styles.textLabelSupporting]}
+                                        numberOfLines={1}
+                                    >
+                                        {translate('cardTransactions.companySpend')}
+                                    </Text>
                                 </View>
-                            </>
-                        )}
-                    </>
-                )}
-            </View>
+                                <View style={[styles.flexRow, styles.justifyContentCenter]}>
+                                    <Text
+                                        numberOfLines={1}
+                                        style={subAmountTextStyles}
+                                    >
+                                        {formattedCompanySpendAmount}
+                                    </Text>
+                                </View>
+                            </View>
+                        </>
+                    )}
+                </>
+            )}
         </View>
     );
 }
diff --git a/src/components/ReportActionItem/MoneyRequestView.tsx b/src/components/ReportActionItem/MoneyRequestView.tsx
index 0380780e0ccb..810857edca52 100644
--- a/src/components/ReportActionItem/MoneyRequestView.tsx
+++ b/src/components/ReportActionItem/MoneyRequestView.tsx
@@ -15,12 +15,10 @@ import ViolationMessages from '@components/ViolationMessages';
 import useLocalize from '@hooks/useLocalize';
 import useNetwork from '@hooks/useNetwork';
 import usePermissions from '@hooks/usePermissions';
-import useStyleUtils from '@hooks/useStyleUtils';
 import useTheme from '@hooks/useTheme';
 import useThemeStyles from '@hooks/useThemeStyles';
 import useViolations from '@hooks/useViolations';
 import type {ViolationField} from '@hooks/useViolations';
-import useWindowDimensions from '@hooks/useWindowDimensions';
 import * as CardUtils from '@libs/CardUtils';
 import * as CurrencyUtils from '@libs/CurrencyUtils';
 import type {MileageRate} from '@libs/DistanceRequestUtils';
@@ -97,9 +95,7 @@ function MoneyRequestView({
     const theme = useTheme();
     const styles = useThemeStyles();
     const session = useSession();
-    const StyleUtils = useStyleUtils();
     const {isOffline} = useNetwork();
-    const {isSmallScreenWidth} = useWindowDimensions();
     const {translate, toLocaleDigit} = useLocalize();
     const parentReportAction = parentReportActions?.[report.parentReportActionID ?? ''] ?? null;
     const isTrackExpense = ReportUtils.isTrackExpenseReport(report);
@@ -323,9 +319,9 @@ function MoneyRequestView({
     const shouldShowNotesViolations = !isReceiptBeingScanned && canUseViolations && ReportUtils.isPaidGroupPolicy(report);
 
     return (
-        <View style={[StyleUtils.getReportWelcomeContainerStyle(isSmallScreenWidth, true, shouldShowAnimatedBackground)]}>
+        <View style={styles.pRelative}>
             {shouldShowAnimatedBackground && <AnimatedEmptyStateBackground />}
-            <View style={shouldShowAnimatedBackground && [StyleUtils.getReportWelcomeTopMarginStyle(isSmallScreenWidth, true)]}>
+            <>
                 {!isInvoice && (
                     <ReceiptAuditHeader
                         notes={noticeTypeViolations}
@@ -551,7 +547,7 @@ function MoneyRequestView({
                         />
                     </View>
                 )}
-            </View>
+            </>
         </View>
     );
 }
diff --git a/src/pages/home/report/AnimatedEmptyStateBackground.tsx b/src/pages/home/report/AnimatedEmptyStateBackground.tsx
index 7559361ecc3d..efd8b4e3d304 100644
--- a/src/pages/home/report/AnimatedEmptyStateBackground.tsx
+++ b/src/pages/home/report/AnimatedEmptyStateBackground.tsx
@@ -1,4 +1,5 @@
 import React from 'react';
+import {View} from 'react-native';
 import Animated, {clamp, SensorType, useAnimatedSensor, useAnimatedStyle, useReducedMotion, useSharedValue, withSpring} from 'react-native-reanimated';
 import useStyleUtils from '@hooks/useStyleUtils';
 import useThemeIllustrations from '@hooks/useThemeIllustrations';
@@ -37,18 +38,18 @@ function AnimatedEmptyStateBackground() {
         xOffset.value = clamp(xOffset.value + y * CONST.ANIMATION_GYROSCOPE_VALUE, -IMAGE_OFFSET_X, IMAGE_OFFSET_X);
         yOffset.value = clamp(yOffset.value - x * CONST.ANIMATION_GYROSCOPE_VALUE, -IMAGE_OFFSET_Y, IMAGE_OFFSET_Y);
         return {
-            // On Android, scroll view sub views gets clipped beyond container bounds. Set the top position so that image wouldn't get clipped
-            top: IMAGE_OFFSET_Y,
             transform: [{translateX: withSpring(xOffset.value)}, {translateY: withSpring(yOffset.value, {overshootClamping: true})}, {scale: 1.15}],
         };
     }, [isReducedMotionEnabled]);
 
     return (
-        <Animated.Image
-            source={illustrations.EmptyStateBackgroundImage}
-            style={[StyleUtils.getReportWelcomeBackgroundImageStyle(isSmallScreenWidth), animatedStyles]}
-            resizeMode={windowWidth > maxBackgroundWidth ? 'repeat' : 'cover'}
-        />
+        <View style={StyleUtils.getReportWelcomeBackgroundContainerStyle(isSmallScreenWidth)}>
+            <Animated.Image
+                source={illustrations.EmptyStateBackgroundImage}
+                style={[StyleUtils.getReportWelcomeBackgroundImageStyle(isSmallScreenWidth), animatedStyles]}
+                resizeMode={windowWidth > maxBackgroundWidth ? 'repeat' : 'cover'}
+            />
+        </View>
     );
 }
 
diff --git a/src/pages/home/report/ReportActionItem.tsx b/src/pages/home/report/ReportActionItem.tsx
index 95bc4f5231d2..14a0f08835b6 100644
--- a/src/pages/home/report/ReportActionItem.tsx
+++ b/src/pages/home/report/ReportActionItem.tsx
@@ -783,20 +783,18 @@ function ReportActionItem({
                     message = 'parentReportAction.deletedExpense';
                 }
                 return (
-                    <View>
+                    <View style={[styles.pRelative]}>
                         <AnimatedEmptyStateBackground />
-                        <View style={[StyleUtils.getReportWelcomeTopMarginStyle(isSmallScreenWidth)]}>
-                            <OfflineWithFeedback pendingAction={parentReportAction?.pendingAction ?? null}>
-                                <ReportActionItemSingle
-                                    action={parentReportAction}
-                                    showHeader
-                                    report={report}
-                                >
-                                    <RenderHTML html={`<comment>${translate(message)}</comment>`} />
-                                </ReportActionItemSingle>
-                                <View style={styles.threadDividerLine} />
-                            </OfflineWithFeedback>
-                        </View>
+                        <OfflineWithFeedback pendingAction={parentReportAction?.pendingAction ?? null}>
+                            <ReportActionItemSingle
+                                action={parentReportAction}
+                                showHeader
+                                report={report}
+                            >
+                                <RenderHTML html={`<comment>${translate(message)}</comment>`} />
+                            </ReportActionItemSingle>
+                            <View style={styles.threadDividerLine} />
+                        </OfflineWithFeedback>
                     </View>
                 );
             }
@@ -815,27 +813,25 @@ function ReportActionItem({
         if (ReportUtils.isTaskReport(report)) {
             if (ReportUtils.isCanceledTaskReport(report, parentReportAction)) {
                 return (
-                    <View>
+                    <View style={[styles.pRelative]}>
                         <AnimatedEmptyStateBackground />
-                        <View style={[StyleUtils.getReportWelcomeTopMarginStyle(isSmallScreenWidth)]}>
-                            <OfflineWithFeedback pendingAction={parentReportAction?.pendingAction}>
-                                <ReportActionItemSingle
-                                    action={parentReportAction}
-                                    showHeader={draftMessage === undefined}
-                                    report={report}
-                                >
-                                    <RenderHTML html={`<comment>${translate('parentReportAction.deletedTask')}</comment>`} />
-                                </ReportActionItemSingle>
-                            </OfflineWithFeedback>
-                            <View style={styles.reportHorizontalRule} />
-                        </View>
+                        <OfflineWithFeedback pendingAction={parentReportAction?.pendingAction}>
+                            <ReportActionItemSingle
+                                action={parentReportAction}
+                                showHeader={draftMessage === undefined}
+                                report={report}
+                            >
+                                <RenderHTML html={`<comment>${translate('parentReportAction.deletedTask')}</comment>`} />
+                            </ReportActionItemSingle>
+                        </OfflineWithFeedback>
+                        <View style={styles.reportHorizontalRule} />
                     </View>
                 );
             }
             return (
-                <View>
+                <View style={[styles.pRelative]}>
                     <AnimatedEmptyStateBackground />
-                    <View style={[StyleUtils.getReportWelcomeTopMarginStyle(isSmallScreenWidth)]}>
+                    <View>
                         <TaskView report={report} />
                         {renderThreadDivider}
                     </View>
diff --git a/src/pages/home/report/ReportActionItemCreated.tsx b/src/pages/home/report/ReportActionItemCreated.tsx
index f446c38fb1e9..ad2b4a6770ce 100644
--- a/src/pages/home/report/ReportActionItemCreated.tsx
+++ b/src/pages/home/report/ReportActionItemCreated.tsx
@@ -7,7 +7,6 @@ import OfflineWithFeedback from '@components/OfflineWithFeedback';
 import PressableWithoutFeedback from '@components/Pressable/PressableWithoutFeedback';
 import ReportWelcomeText from '@components/ReportWelcomeText';
 import useLocalize from '@hooks/useLocalize';
-import useStyleUtils from '@hooks/useStyleUtils';
 import useThemeStyles from '@hooks/useThemeStyles';
 import useWindowDimensions from '@hooks/useWindowDimensions';
 import * as ReportUtils from '@libs/ReportUtils';
@@ -38,7 +37,6 @@ type ReportActionItemCreatedProps = ReportActionItemCreatedOnyxProps & {
 };
 function ReportActionItemCreated(props: ReportActionItemCreatedProps) {
     const styles = useThemeStyles();
-    const StyleUtils = useStyleUtils();
 
     const {translate} = useLocalize();
     const {isSmallScreenWidth, isLargeScreenWidth} = useWindowDimensions();
@@ -62,11 +60,11 @@ function ReportActionItemCreated(props: ReportActionItemCreatedProps) {
             onClose={() => navigateToConciergeChatAndDeleteReport(props.report?.reportID ?? props.reportID)}
             needsOffscreenAlphaCompositing
         >
-            <View style={StyleUtils.getReportWelcomeContainerStyle(isSmallScreenWidth)}>
+            <View style={[styles.pRelative]}>
                 <AnimatedEmptyStateBackground />
                 <View
                     accessibilityLabel={translate('accessibilityHints.chatWelcomeMessage')}
-                    style={[styles.p5, StyleUtils.getReportWelcomeTopMarginStyle(isSmallScreenWidth)]}
+                    style={[styles.p5]}
                 >
                     <PressableWithoutFeedback
                         onPress={() => ReportUtils.navigateToDetailsPage(props.report)}
diff --git a/src/pages/home/report/ReportActionItemParentAction.tsx b/src/pages/home/report/ReportActionItemParentAction.tsx
index a32900fdd502..e97c51377476 100644
--- a/src/pages/home/report/ReportActionItemParentAction.tsx
+++ b/src/pages/home/report/ReportActionItemParentAction.tsx
@@ -3,9 +3,7 @@ import {View} from 'react-native';
 import type {OnyxEntry} from 'react-native-onyx';
 import OfflineWithFeedback from '@components/OfflineWithFeedback';
 import useNetwork from '@hooks/useNetwork';
-import useStyleUtils from '@hooks/useStyleUtils';
 import useThemeStyles from '@hooks/useThemeStyles';
-import useWindowDimensions from '@hooks/useWindowDimensions';
 import Navigation from '@libs/Navigation/Navigation';
 import onyxSubscribe from '@libs/onyxSubscribe';
 import * as ReportActionsUtils from '@libs/ReportActionsUtils';
@@ -64,8 +62,6 @@ function ReportActionItemParentAction({
     shouldUseThreadDividerLine = false,
 }: ReportActionItemParentActionProps) {
     const styles = useThemeStyles();
-    const StyleUtils = useStyleUtils();
-    const {isSmallScreenWidth} = useWindowDimensions();
     const ancestorIDs = useRef(ReportUtils.getAllAncestorReportActionIDs(report));
     const [allAncestors, setAllAncestors] = useState<ReportUtils.Ancestor[]>([]);
     const {isOffline} = useNetwork();
@@ -100,9 +96,8 @@ function ReportActionItemParentAction({
     }, []);
 
     return (
-        <View style={[StyleUtils.getReportWelcomeContainerStyle(isSmallScreenWidth)]}>
+        <View style={[styles.pRelative]}>
             <AnimatedEmptyStateBackground />
-            <View style={[StyleUtils.getReportWelcomeTopMarginStyle(isSmallScreenWidth)]} />
             {allAncestors.map((ancestor) => (
                 <OfflineWithFeedback
                     key={ancestor.reportAction.reportActionID}
diff --git a/src/styles/index.ts b/src/styles/index.ts
index 45e11dbe6cb9..7947f03fece5 100644
--- a/src/styles/index.ts
+++ b/src/styles/index.ts
@@ -15,6 +15,7 @@ import colors from './theme/colors';
 import type {ThemeColors} from './theme/types';
 import addOutlineWidth from './utils/addOutlineWidth';
 import borders from './utils/borders';
+import chatContentScrollViewPlatformStyles from './utils/chatContentScrollViewPlatformStyles';
 import codeStyles from './utils/codeStyles';
 import cursor from './utils/cursor';
 import display from './utils/display';
@@ -1941,8 +1942,10 @@ const styles = (theme: ThemeColors) =>
         },
 
         chatContentScrollView: {
-            justifyContent: 'flex-end',
+            flexGrow: 1,
+            justifyContent: 'flex-start',
             paddingBottom: 16,
+            ...chatContentScrollViewPlatformStyles,
         },
 
         // Chat Item
diff --git a/src/styles/utils/chatContentScrollViewPlatformStyles/index.native.ts b/src/styles/utils/chatContentScrollViewPlatformStyles/index.native.ts
new file mode 100644
index 000000000000..ee3f566ddc27
--- /dev/null
+++ b/src/styles/utils/chatContentScrollViewPlatformStyles/index.native.ts
@@ -0,0 +1,5 @@
+import type ChatContentScrollViewPlatformStyles from './types';
+
+const chatContentScrollViewPlatformStyles: ChatContentScrollViewPlatformStyles = {};
+
+export default chatContentScrollViewPlatformStyles;
diff --git a/src/styles/utils/chatContentScrollViewPlatformStyles/index.ts b/src/styles/utils/chatContentScrollViewPlatformStyles/index.ts
new file mode 100644
index 000000000000..cef1d5e70e6e
--- /dev/null
+++ b/src/styles/utils/chatContentScrollViewPlatformStyles/index.ts
@@ -0,0 +1,7 @@
+import type ChatContentScrollViewPlatformStyles from './types';
+
+const chatContentScrollViewPlatformStyles: ChatContentScrollViewPlatformStyles = {
+    overflow: 'hidden',
+};
+
+export default chatContentScrollViewPlatformStyles;
diff --git a/src/styles/utils/chatContentScrollViewPlatformStyles/types.ts b/src/styles/utils/chatContentScrollViewPlatformStyles/types.ts
new file mode 100644
index 000000000000..3fff2ba6a14d
--- /dev/null
+++ b/src/styles/utils/chatContentScrollViewPlatformStyles/types.ts
@@ -0,0 +1,5 @@
+import type {ViewStyle} from 'react-native';
+
+type ChatContentScrollViewPlatformStyles = ViewStyle;
+
+export default ChatContentScrollViewPlatformStyles;
diff --git a/src/styles/utils/index.ts b/src/styles/utils/index.ts
index 4c2f9a180518..e90f911f699e 100644
--- a/src/styles/utils/index.ts
+++ b/src/styles/utils/index.ts
@@ -770,37 +770,40 @@ function getHorizontalStackedOverlayAvatarStyle(oneAvatarSize: AvatarSize, oneAv
 /**
  * Gets the correct size for the empty state background image based on screen dimensions
  */
-function getReportWelcomeBackgroundImageStyle(isSmallScreenWidth: boolean, isMoneyOrTaskReport = false): ImageStyle {
-    const emptyStateBackground = isMoneyOrTaskReport ? CONST.EMPTY_STATE_BACKGROUND.MONEY_OR_TASK_REPORT : CONST.EMPTY_STATE_BACKGROUND;
-
+function getReportWelcomeBackgroundImageStyle(isSmallScreenWidth: boolean): ImageStyle {
     if (isSmallScreenWidth) {
         return {
-            height: emptyStateBackground.SMALL_SCREEN.IMAGE_HEIGHT,
-            width: '100%',
             position: 'absolute',
+            bottom: 0,
+            height: CONST.EMPTY_STATE_BACKGROUND.SMALL_SCREEN.IMAGE_HEIGHT,
+            width: '100%',
         };
     }
 
     return {
-        height: emptyStateBackground.WIDE_SCREEN.IMAGE_HEIGHT,
-        width: '100%',
         position: 'absolute',
+        bottom: 0,
+        height: CONST.EMPTY_STATE_BACKGROUND.WIDE_SCREEN.IMAGE_HEIGHT,
+        width: '100%',
     };
 }
 
 /**
- * Gets the correct top margin size for the chat welcome message based on screen dimensions
+ * Gets the style for the container of the empty state background image that overlap the created report action
  */
-function getReportWelcomeTopMarginStyle(isSmallScreenWidth: boolean, isMoneyOrTaskReport = false): ViewStyle {
-    const emptyStateBackground = isMoneyOrTaskReport ? CONST.EMPTY_STATE_BACKGROUND.MONEY_OR_TASK_REPORT : CONST.EMPTY_STATE_BACKGROUND;
+function getReportWelcomeBackgroundContainerStyle(isSmallScreenWidth: boolean): ViewStyle {
     if (isSmallScreenWidth) {
         return {
-            marginTop: emptyStateBackground.SMALL_SCREEN.VIEW_HEIGHT,
+            position: 'absolute',
+            top: CONST.EMPTY_STATE_BACKGROUND.OVERLAP,
+            width: '100%',
         };
     }
 
     return {
-        marginTop: emptyStateBackground.WIDE_SCREEN.VIEW_HEIGHT,
+        position: 'absolute',
+        top: CONST.EMPTY_STATE_BACKGROUND.OVERLAP,
+        width: '100%',
     };
 }
 
@@ -822,23 +825,6 @@ function getLineHeightStyle(lineHeight: number): TextStyle {
     };
 }
 
-/**
- * Gets the correct size for the empty state container based on screen dimensions
- */
-function getReportWelcomeContainerStyle(isSmallScreenWidth: boolean, isMoneyOrTaskReport = false, shouldShowAnimatedBackground = true): ViewStyle {
-    const emptyStateBackground = isMoneyOrTaskReport ? CONST.EMPTY_STATE_BACKGROUND.MONEY_OR_TASK_REPORT : CONST.EMPTY_STATE_BACKGROUND;
-    const baseStyles: ViewStyle = {
-        display: 'flex',
-        justifyContent: 'space-between',
-    };
-
-    if (shouldShowAnimatedBackground) {
-        baseStyles.minHeight = isSmallScreenWidth ? emptyStateBackground.SMALL_SCREEN.CONTAINER_MINHEIGHT : emptyStateBackground.WIDE_SCREEN.CONTAINER_MINHEIGHT;
-    }
-
-    return baseStyles;
-}
-
 type GetBaseAutoCompleteSuggestionContainerStyleParams = {
     left: number;
     bottom: number;
@@ -1153,8 +1139,7 @@ const staticStyleUtils = {
     getHorizontalStackedAvatarStyle,
     getHorizontalStackedOverlayAvatarStyle,
     getReportWelcomeBackgroundImageStyle,
-    getReportWelcomeTopMarginStyle,
-    getReportWelcomeContainerStyle,
+    getReportWelcomeBackgroundContainerStyle,
     getBaseAutoCompleteSuggestionContainerStyle,
     getBorderColorStyle,
     getCheckboxPressableStyle,