// Material Design Text Input
// --------------------------------------------------

$text-input-highlight-color:      map-get($colors, primary) !default;
$input-label-md-color:            #999 !default;


.list[mode=md],
ion-card[mode=md] {

  .text-input {
    margin: $item-md-padding-top ($item-md-padding-right / 2) $item-md-padding-bottom ($item-md-padding-left / 2);
    padding: 0;
  }

  ion-input[inset] .text-input {
    margin: ($item-md-padding-top / 2) $item-md-padding-right ($item-md-padding-bottom / 2) $item-md-padding-left;
    padding: ($item-md-padding-top / 2) ($item-md-padding-right / 2) ($item-md-padding-bottom / 2) ($item-md-padding-left / 2);
  }

  ion-label {
    margin: $item-md-padding-top ($item-md-padding-right / 2) $item-md-padding-bottom ($item-md-padding-left / 2);
    color: $input-label-md-color;
  }

  ion-input.has-focus:after {
    border-top: 2px solid $text-input-highlight-color;
  }

  ion-input.has-focus + ion-input:before {
    border-top-color: $text-input-highlight-color;
  }

}