title: Change angular material input style
body: <p>I am trying to change the style of a angular material input.</p>
  
  <p>So far I managed to change the <code>background-color</code> using :</p>
  
  <pre><code>md-input-container {
      padding-bottom: 5px;
      background-color: #222;
  }
  </code></pre>
  
  <p>The placeholder and label color using : </p>
  
  <pre><code>md-input-container.md-default-theme label,   
  md-input-container.md-default-theme .md-placeholder {  
      color: #FDFE67 !important; 
  } 
  </code></pre>
  
  <p>But I can't manage to change the line color under the text when we <code>focus</code> the input and the text color when we type in the input.</p>
  
  <p>Here is the html input :</p>
  
  <pre><code>&lt;md-content&gt;
      &lt;md-input-container&gt;
          &lt;label&gt;{{isEnglish ? 'Search...' : 'Recherche...'}}&lt;/label&gt;
             &lt;input ng-model="searchInput" id="sInput" 
                    ng-change="filterCartoList(searchInput)" my-enter="filterCartoList(searchInput)"&gt;
      &lt;/md-input-container&gt;
  &lt;/md-content&gt;
  </code></pre>
  
  <p><strong>Edit:</strong> I managed to change the text color when typing this way : </p>
  
  <pre><code>md-input-container .md-input {
  color: rgba(255,255,255,0.87);
  border-color: rgba(254,253,103,0.82);
  }
  </code></pre>