/*!
  *  Copyright (C) 2018 Robert Bosch GmbH Copyright (C) 2018 Robert Bosch Manufacturing Solutions GmbH, Germany. All rights reserved.
 */

@import '@bci-web-core/common-styles/sass/bci/bci-variables';
@import '@bci-web-core/common-styles/sass/bci/mixins';

@mixin make-commandbar-item {
  display: inline-flex;
  vertical-align: middle;
  align-items: center;
  height: 6 * $grid-size;
}

@mixin make-commandbar-mat-input-base {
  ::placeholder,
  :-ms-input-placeholder {
    color: $boschBlack;
  }

  mat-form-field.mat-mdc-form-field {
    &.mat-focused:not(:hover) {
      .mat-mdc-form-field-icon-prefix,
      .mat-mdc-form-field-icon-suffix {
        background-color: unset;
      }
    }

    &:hover {
      .mat-mdc-form-field-infix .input,
      .input,
      .mat-mdc-select-trigger,
      .mat-mdc-floating-label,
      .mat-mdc-form-field-icon-prefix,
      .mat-mdc-form-field-icon-suffix {
        background-color: $form-field-default-theme-hovered-background-color !important;
      }
    }

    &.mat-focused {
      .mat-mdc-form-field-infix .input,
      .input,
      .mat-mdc-select-trigger,
      .mat-mdc-floating-label,
      .mat-mdc-form-field-icon-prefix,
      .mat-mdc-form-field-icon-suffix {
        background-color: $form-field-default-theme-focused-background-color !important;
      }

      .mat-mdc-form-field-icon-prefix .mat-mdc-icon-button,
      .mat-mdc-form-field-icon-suffix .mat-mdc-icon-button {
        background-color: $boschGray90 !important;
      }

      .mat-mdc-form-field-icon-prefix:hover .mat-mdc-icon-button,
      .mat-mdc-form-field-icon-suffix:hover .mat-mdc-icon-button {
        background-color: $boschGray80 !important;
      }

      .mat-mdc-form-field-icon-prefix:active .mat-mdc-icon-button,
      .mat-mdc-form-field-icon-suffix:active .mat-mdc-icon-button {
        background-color: $boschGray80 !important;
      }
    }

    &:active,
    &.active {
      .mat-mdc-form-field-infix .input,
      .input,
      .mat-mdc-select-trigger,
      .mat-mdc-select + span .mat-mdc-floating-label {
        background-color: $form-field-default-theme-pressed-background-color !important;
      }
    }

    &:disabled,
    &:hover:disabled,
    &.disabled,
    &[readonly] {
      .mat-mdc-form-field-infix .input,
      .input,
      .mat-mdc-floating-label,
      .mat-mdc-select-trigger {
        background-color: $form-field-default-theme-disabled-background-color !important;
      }
    }
  }
}

@mixin make-commandbar-mat-input {
  @include make-commandbar-mat-input-base;
}

@mixin make-commandbar-mat-select {
  @include make-commandbar-mat-input-base;

  mat-form-field.mat-mdc-form-field {
    &.mat-mdc-form-field-type-mat-select {
      .mat-mdc-form-field-wrapper > .mat-mdc-form-field-flex {
        top: unset;
      }
    }
  }
}
