// Custom input file upload
.inputfile {
  height: 0.1px;
  opacity: 0;
  overflow: hidden;
  position: absolute;
  width: 0.1px;
  z-index: -1;
}

.inputfile + label {
  border: 1px solid $input-border-color;
  border-radius: $input-border-radius;
  cursor: pointer;
  display: table;
  font-weight: $font-weight-normal;
  height: 32px;

  line-height: 19px; //Puts text in vertical center
  margin-bottom: 0;
  overflow: hidden;
  position: relative;

  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%;


  div.text {
    color: $color-gray-60;
    display: table-cell;
    float: left;
    font-size: 14px;
    letter-spacing: normal;
    margin-top: -1px;
    overflow: hidden;
    padding: 6px 8px;
    padding-bottom: 5px;
    padding-top: 7px;
    width: 100%;
  }

  div.icon {
    border-left: 1px solid $input-border-color;
    display: table-cell;
    line-height: 1;
    padding: 5px;
    vertical-align: middle;
    white-space: nowrap;
    width: 1%;

    svg {
      color: $icon-color;
      fill: $icon-color;
      height: 20px;
      width: 20px;
    }
  }


  &.file-selected .text {
    color: $text-color;
  }
}

.inputfile:focus + label,
.inputfile.has-focus + label {
  box-shadow: $outline-box-shadow rgba($file-upload-focus-color, $outline-border-opacity);
  outline: 0;
}
//Custom file input end