Cannot apply text-align to Material UI Input Component, but everything else works

When I inspect, it seems like all the input styles I've created actually go to the outside div Material UI creates that wraps the Input. But the other styles work so I'm not sure what's going on?

const useStyles = makeStyles(theme => ({
  formControl: {
    ...
  },
  label: {
    ...
  },
  input: {
    color: "black",
    '&:after': {
      borderColor: 'black',
      textAlign: 'center'
    },
    fontSize: getFontSize(),
    display: 'flex',
    alignItems: 'center'  // this is the only thing that does NOT work
  }
}));

const classes = useStyles();

<FormControl className={classes.formControl}>
  {
    labelText &&
    <InputLabel
      className={classes.label}
      htmlFor="component-helper"
    >
      {labelText}
    </InputLabel>
  }
  <Input
    className={classes.input}
    classes={{textAlign: 'center'}}  // this does NOT work either
    id={"component-helper"}
    value={text}
    onBlur={handleBlur}
    onChange={handleChange}
    aria-describedby="component-helper-text"
  />
</FormControl>