@import "../../../styles/scss/utilities/helpers";

.mat-mdc-form-field {
  display: block !important;

  .mat-mdc-text-field-wrapper {
    padding: 0;

    .mat-mdc-form-field-flex {
      padding: 0;

      .mat-mdc-form-field-infix {
        min-height: auto;
        border: 0;
        padding-top: 0;
        padding-bottom: 0;
      }
    }
  }

  .mdc-text-field--outlined {
    --mdc-outlined-text-field-outline-width: 0;
  }

  .mdc-text-field--filled:not(.mdc-text-field--disabled) .mdc-line-ripple::before {
    border-radius: 0;
  }

  &-disabled {
    .mat-mdc-input-element {
      @extend .form-field__input--disabled;
    }
  }

  &-label {
    @extend .form-field__label;
  }

  &-invalid {
    .mat-mdc-input-element,
    mat-error,
    mat-date-range-input {
      @extend .form-field__input--invalid;
    }
  }

  &-suffix,
  [matsuffix] {
    @extend .form-field__input--suffix;
  }

  .mat-mdc-input-element {
    @extend .form-field__input;
  }

  .mat-form-field-subscript-wrapper {
    margin-top: 0;
  }
}

.mat-mdc-slide-toggle-label,
.mat-mdc-checkbox .mdc-form-field .mdc-label,
.mat-mdc-radio-button .mdc-form-field .mdc-label {
  @include fontSize($font-size-base);

  margin-bottom: 0;
  color: var(--color-black);
}

.mdc-checkbox .mdc-checkbox__native-control:enabled ~ .mdc-checkbox__background .mdc-checkbox__mixedmark {
  border-color: var(--color-white);
}

.newline-validation .form-field {
  flex-wrap: wrap;

  ecabs-validations-messages {
    flex-basis: 100%;
  }
}

ecabs-input.ecabs-input--fluid {
  display: block;
  width: 100%;
}

.form-field--required {
  .form-field__label {
    &:not([class*=mat-slide-toggle-label], [class*=mat-radio-label]) {
      &:after {
        @extend %required;
      }
    }
  }
}