Move VerticalCreditCards MenuItem inline with other section items

Remove the special background color and custom icon sizing from the
company cards MenuItem. Wrap it in a View with the same negative
margin and padding styles as the other MenuItems in the section.
Remove centralPaneContainerStyle that zeroed out bottom padding
when no cards were assigned.

Co-authored-by: parasharrajat <parasharrajat@users.noreply.github.com>

Author: MelvinBot

src/pages/settings/Wallet/WalletPage/index.tsx

@@ -680,7 +680,6 @@ function WalletPage() {
                                 title={translate('walletPage.assignedCards')}
                                 isCentralPane
                                 subtitleMuted
-                                centralPaneContainerStyle={!hasAssignedCard ? styles.pb0 : undefined}
                                 titleStyles={styles.accountSettingsSectionTitle}
                             >
                                 <>
@@ -716,21 +715,20 @@ function WalletPage() {
                                         />
                                     </View>
                                 )}
-                                {!hasAssignedCard ? (
-                                    <MenuItem
-                                        iconHeight={48}
-                                        iconWidth={48}
-                                        containerStyle={styles.hoveredComponentBG}
-                                        shouldShowRightIcon
-                                        icon={illustrations.VerticalCreditCards}
-                                        displayInDefaultIconColor
-                                        wrapperStyle={styles.sectionMenuItemTopDescription}
-                                        title={translate('personalCard.lookingForCompanyCards')}
-                                        description={translate('personalCard.lookingForCompanyCardsDescription')}
-                                        titleStyle={styles.textStrong}
-                                        onPress={openCompanyCardFlow}
-                                    />
-                                ) : null}
+                                {!hasAssignedCard && (
+                                    <View style={[styles.mt5, shouldUseNarrowLayout ? styles.mhn5 : styles.mhn8]}>
+                                        <MenuItem
+                                            shouldShowRightIcon
+                                            icon={illustrations.VerticalCreditCards}
+                                            displayInDefaultIconColor
+                                            wrapperStyle={[styles.paymentMethod, shouldUseNarrowLayout ? styles.ph5 : styles.ph8]}
+                                            title={translate('personalCard.lookingForCompanyCards')}
+                                            description={translate('personalCard.lookingForCompanyCardsDescription')}
+                                            titleStyle={styles.textStrong}
+                                            onPress={openCompanyCardFlow}
+                                        />
+                                    </View>
+                                )}
                             </Section>
                         )}