title: Style Select underline
body: <p>I'm trying to use style-components to style the underline of a select component.
  I sucessfully styled the underline of an Input component.
  I'm aware that Select is a wrapper of Input but for some reason the same code does not work for Select.</p>
  
  <pre><code>import Select from "@material-ui/core/Select";
  import styled from "styled-components";
  
  const StyledSelect = styled(Select)`
    &amp;&amp; {
      &amp;&amp; .MuiInput-underline {
        border-bottom: 2px solid green;
      }
      /* default */
      .MuiInput-underline:before {
        border-bottom: 2px solid green;
      }
      /* hover (double-ampersand needed for specificity reasons. */
      &amp;&amp; .MuiInput-underline:hover:before {
        border-bottom: 2px solid lightblue;
      }
      /* focused */
      .MuiInput-underline:after {
        border-bottom: 2px solid red;
      }
    }
  `;
  
  export default StyledSelect;
  </code></pre>
  
  <p><a href="https://codesandbox.io/s/textfield-underline-styled-components-fe0jk" rel="nofollow noreferrer">codesandbox</a></p>