@import '../core/style/variables';


// The width/height of the icon element.
$mat-icon-size: 24px !default;

.mat-icon {
  background-repeat: no-repeat;
  display: inline-block;
  fill: currentColor;
  height: $mat-icon-size;
  width: $mat-icon-size;

  &.mat-icon-inline {
    font-size: inherit;
    height: inherit;
    line-height: inherit;
    width: inherit;
  }
}

// Icons that will be mirrored in RTL.
[dir='rtl'] .mat-icon-rtl-mirror {
  transform: scale(-1, 1);
}

.mat-form-field:not(.mat-form-field-appearance-legacy) {
  .mat-form-field-prefix,
  .mat-form-field-suffix {
    .mat-icon {
      display: block;
    }

    .mat-icon-button .mat-icon {
      margin: auto;
    }
  }
}