@mixin border-radius ($radius) {
  position: relative;
  -webkit-border-radius: $radius;
     -moz-border-radius: $radius;
      -ms-border-radius: $radius;
       -o-border-radius: $radius;
          border-radius: $radius;
}

.asset-box-input {
  width: 100%;
  height: 100%;

  // asset_box_input/attachment_as_table
  tbody.attachments {
    .attachment-image img {
      max-height: 48px;
    }
  }

  // asset_box_input/attachment_as_list
  ul.attachments {
    .attachment {
      position: relative;

      .attachment-title {
        overflow: hidden;
        word-break: keep-all;
        text-align: left;
      }

      .attachment-remove {
        position: absolute;
        top: 0px;
        right: 7px;
      }
    }
  }

  // asset_box_input/attachment_as_thumbnail
  div.attachments {
    .attachment {
      position: relative;

      .attachment-title {
        overflow: hidden;
        word-break: keep-all;
        text-align: center;
      }

      .attachment-remove {
        position: absolute;
        top: 7px;
        right: 22px;
      }
    }
  }

  .uploads {
    .upload {
      border-top: solid 1px #CCC;
      width: 100%;
      min-width: 400px;
      padding-top: 10px;
      margin-top: 10px;

      .progress {
        margin-top: 8px;
        border: solid 1px #555;
        @include border-radius(3px);

        .spinner {
          height: 20px;
          width: 20px;
        }

        .bar {
          height: 100%;
          background: #3EC144;
        }
      }
    }
  }
}