/// Simple uploader theme.
///
/// @group uploaders
///
/// @example scss - usage
///
///   @include k-SimpleUploader;
///
/// @example html
///
///   <div class="k-SimpleUploader">
///     <button class="k-SimpleUploader__button">…</button>
///     <div class="k-SimpleUploader__link">
///       <span class="k-SimpleUploader__text">…</span>
///     </div>
///   </div>

@mixin k-SimpleUploader {
  .k-SimpleUploader {
    display: flex;
    align-items: center;
    text-align: left;

    @include k-media-max('s') {
      flex-direction: column;
      align-items: flex-start;
    }
  }

  .k-SimpleUploader__button {
    flex-shrink: 0;
    cursor: pointer;
  }

  .k-SimpleUploader__link {
    display: flex;
    align-items: center;
    margin-left: k-px-to-rem(10px);

    @include k-media-max('s') {
      margin-left: 0;
      margin-top: k-px-to-rem(5px);
    }
  }

  .k-SimpleUploader__text {
    overflow: hidden;
    max-width: k-px-to-rem(140px);

    @include k-typographyFont('light');
    @include k-typographyFontSize(-1, normal);
    text-overflow: ellipsis;
    white-space: nowrap;

    @include k-media-max('s') {
      max-width: k-px-to-rem(260px);
    }
  }

  .k-SimpleUploader__buttonIcon {
    margin-left: k-px-to-rem(10px);
  }
}