////
/// @group form-file-input
////

@import '@react-md/states/dist/scss/mixins';
@import '@react-md/utils/dist/scss/mixins';

/// @access private
@mixin react-md-file-input {
  .rmd-file-input {
    @include rmd-states-focus-shadow('&:focus + .rmd-file-input-label');
    @include rmd-utils-keyboard-only {
      &:focus + .rmd-file-input-label {
        @include rmd-states-theme-update-var(
          background-color,
          rmd-states-theme-var(focus-color)
        );
      }

      &:hover {
        @include rmd-states-theme-update-var(
          background-color,
          rmd-states-theme-var(hover-color)
        );
      }
    }

    height: 0.1px;
    opacity: 0;
    overflow: hidden;
    position: absolute;
    width: 0.1px;
    z-index: -1;
  }
}