Apply unreported badge selected color to mobile/narrow layout

The buttonHoveredBG color for selected unreported badges was only
applied in StatusCell (wide/desktop layout). On mobile/narrow screens,
UserInfoAndActionButtonRow renders StatusBadge directly and was missing
the isSelected-based color logic. Pass isSelected through from all
three callers and apply the same conditional background.

Co-authored-by: Jayesh Mangwani <jayeshmangwani@users.noreply.github.com>

Author: MelvinBot

src/components/Search/SearchList/ListItem/ExpenseReportListItem.tsx

@@ -299,6 +299,7 @@ function ExpenseReportListItem<TItem extends ListItem>({
                             shouldShowUserInfo={!!reportItem?.from}
                             stateNum={reportItem.stateNum}
                             statusNum={reportItem.statusNum}
+                            isSelected={!!reportItem.isSelected}
                         />
                     )}
                     {!isLargeScreenWidth && (

src/components/Search/SearchList/ListItem/ReportListItemHeader.tsx

@@ -251,6 +251,7 @@ function ReportListItemHeader<TItem extends ListItem>({
                 containerStyles={[styles.pr3, styles.mb2]}
                 stateNum={reportItem.stateNum}
                 statusNum={reportItem.statusNum}
+                isSelected={!!reportItem.isSelected}
             />
             <HeaderFirstRow
                 report={reportItem}

src/components/Search/SearchList/ListItem/TransactionListItem.tsx

@@ -237,6 +237,7 @@ function TransactionListItem<TItem extends ListItem>({
                                 shouldShowUserInfo={!isDeletedTransaction && !!transactionItem?.from}
                                 stateNum={transactionItem.report?.stateNum}
                                 statusNum={transactionItem.report?.statusNum}
+                                isSelected={!!transactionItem.isSelected}
                             />
                         )}
                         <TransactionItemRow

src/components/Search/SearchList/ListItem/UserInfoAndActionButtonRow.tsx

@@ -20,18 +20,22 @@ function UserInfoAndActionButtonRow({
     containerStyles,
     stateNum,
     statusNum,
+    isSelected,
 }: {
     item: TransactionReportGroupListItemType | TransactionListItemType | ExpenseReportListItemType;
     shouldShowUserInfo: boolean;
     containerStyles?: StyleProp<ViewStyle>;
     stateNum: ExpenseReportListItemType['stateNum'];
     statusNum: ExpenseReportListItemType['statusNum'];
+    isSelected?: boolean;
 }) {
     const styles = useThemeStyles();
     const theme = useTheme();
     const {translate} = useLocalize();
     const statusText = getReportStatusTranslation({stateNum, statusNum, translate});
     const reportStatusColorStyle = getReportStatusColorStyle(theme, stateNum, statusNum);
+    const isUnreported = stateNum === undefined && statusNum === undefined;
+    const badgeBackgroundColor = isSelected && isUnreported ? theme.buttonHoveredBG : reportStatusColorStyle?.backgroundColor;
     const participantFromDisplayName = item.formattedFrom ?? item?.from?.displayName ?? '';
     return (
         <View style={[styles.pt0, styles.flexRow, styles.alignItemsCenter, shouldShowUserInfo ? styles.justifyContentBetween : styles.justifyContentEnd, styles.gap2, containerStyles]}>
@@ -53,7 +57,7 @@ function UserInfoAndActionButtonRow({
             {!!statusText && !!reportStatusColorStyle && (
                 <StatusBadge
                     text={statusText}
-                    backgroundColor={reportStatusColorStyle.backgroundColor}
+                    backgroundColor={badgeBackgroundColor}
                     textColor={reportStatusColorStyle.textColor}
                 />
             )}