title: Setting text color, outline, and padding on Material-ui Autocomplete component
body: <p>We'd like to change the text color, outline, and padding on a Material-ui Autocomplete component.</p>
  
  <p>The code looks like this:</p>
  
  <pre><code>              &lt;FormControlLabel
                  label="Please enter desired service:"
                  labelPlacement="start"
                  control={
                    &lt;Autocomplete
                      id="services"
                      options={props.serviceTypes}
                      getOptionLabel={option =&gt; option.name}
                      className={classes.inputRoot}
                      style={{ width: 400, paddingLeft: 20 }}
                      renderInput={params =&gt; (
                        &lt;TextField
                          {...params}
                          label=""
                          className={classes.inputRoot}
                          variant="outlined"
                          fullWidth
                        /&gt;
                      )}
                      onChange={setService}
                    /&gt;
                  }
                /&gt;
  </code></pre>
  
  <p>We are able to change the TextInput color via code like this</p>
  
  <pre><code>                        InputProps={{
                            className: classes.inputColor
                          }}
  </code></pre>
  
  <p>but applying a style this way impacts the AutoComplete functionality (it loses the autocomplete functionality and behaves like a normal TextField).</p>
  
  <p>We've tried a number of style and className options to no avail.</p>
  
  <p>Appreciate any advice.</p>