title: How to remove the outline mat-form-filed border corner radius
body: <p>I am using the angular material outline mat-form-field to design a form. 
  I am getting the default mat-form-field outline text-box view with a border corner radius. Is there any way to remove the border corner radius of the outline mat-form-field and convert into a square text box view.</p>
  
  <p>I tried to change the default styles of the angular material mat-form-field with the following, but it's not working.</p>
  
  <p>//css</p>
  
  <pre><code>.mat-form-field-appearance-outline .mat-form-field-outline-start 
  .alignment{
  border-top-left-radius: 0px;
  border-top-right-radius: 0px;
  border-bottom-right-radius: 0px;
  border-bottom-left-radius: 0px;
  }
  </code></pre>
  
  <p>//html</p>
  
  <pre><code>&lt;mat-form-field appearance="outline" [hideRequiredMarker]="true" 
  class="alignment"&gt;
  &lt;mat-label&gt;Email Address&lt;/mat-label&gt;
  &lt;input type="text" matInput placeholder="Enter email address"&gt;
  &lt;/mat-form-field&gt;
  </code></pre>
  
  <p>I expect the outline mat-form-field with no border corner radius text box just like a square text box mat-form-field, but getting the default outline mat-form-field view.</p>