update import steps design (#12463)

closes https://github.com/twentyhq/core-team-issues/issues/916

![Screenshot 2025-06-05 at 10 52
58](https://github.com/user-attachments/assets/ba5b6d65-0c1f-4d63-a197-e61816ec2d55)
![Screenshot 2025-06-05 at 10 53
09](https://github.com/user-attachments/assets/4aed579e-5e0e-4570-9518-b6e8ac604ea6)
![Screenshot 2025-06-05 at 10 53
24](https://github.com/user-attachments/assets/6f716306-ba08-468c-875a-4279991c1abd)

packages/twenty-front/src/modules/spreadsheet-import/components/MatchColumnToFieldSelect.tsx

@@ -9,7 +9,9 @@ import { MatchColumnSelectSubFieldSelectDropdownContent } from '@/spreadsheet-im
 import { DO_NOT_IMPORT_OPTION_KEY } from '@/spreadsheet-import/constants/DoNotImportOptionKey';
 import { Dropdown } from '@/ui/layout/dropdown/components/Dropdown';
 import { useDropdown } from '@/ui/layout/dropdown/hooks/useDropdown';
+import styled from '@emotion/styled';
 import { isDefined } from 'twenty-shared/utils';
+import { IconChevronDown } from 'twenty-ui/display';
 import { SelectOption } from 'twenty-ui/input';
 import { MenuItem } from 'twenty-ui/navigation';
 
@@ -21,6 +23,11 @@ interface MatchColumnToFieldSelectProps {
   placeholder?: string;
 }
 
+const StyledMenuItem = styled(MenuItem)`
+  background-color: ${({ theme }) => theme.background.transparent.lighter};
+  border: 1px solid ${({ theme }) => theme.border.color.medium};
+  border-radius: ${({ theme }) => theme.border.radius.sm};
+`;
 export const MatchColumnToFieldSelect = ({
   onChange,
   value,
@@ -112,10 +119,11 @@ export const MatchColumnToFieldSelect = ({
       }}
       dropdownPlacement="bottom-start"
       clickableComponent={
-        <MenuItem
+        <StyledMenuItem
           LeftIcon={value?.Icon}
           text={value?.label ?? placeholder ?? ''}
           accent={value?.label ? 'default' : 'placeholder'}
+          RightIcon={IconChevronDown}
         />
       }
       dropdownComponents={