It seems Material Dashboard 2 React does not support a select input by looking into their docs.

But under the hood, they use TextField from @mui/material along with @mui/material/styles and TextField can be a select input. See the code in MDInputRoot.js.

1. Replace your code for select input with the following theme native component except the MenuItem which has to be imported from @mui/material:

<MDBox mb={2}>
  <MDInput
    size="large"
    select
    labelId="demo-simple-select-label"
    id="demo-simple-select"
    //value={gender}
    label="Gender"
    InputProps={{
      classes: { root: "select-input-styles" },
    }}
    fullWidth
  >
    <MenuItem value="Male">Male</MenuItem>
    <MenuItem value="Female">Female</MenuItem>
  </MDInput>
</MDBox>

We have set a new root-level CSS class for the input element by providing class using the InputProps.

2. Then create a new CSS file named inputCustomStyles.css inside src/components/MDInput directory.

.select-input-styles {
    padding: 12px 0;
}

.select-input-styles svg {
    display: block;
    width: 2em;
    height: 2em;
    top: calc(50% - 1em);
}

padding has been changed to fix the input height issue you have got and svg display set to block to make a arrow visible.

3. Now import the styles in the top of MDRootInput.js file:

...
...
import "./inputCustomStyles.css";

I have checked the changes in the src/layouts/authentication/sign-in/index.js file and it look like below: