.bz-attachments {
  border-top: 1px solid $bz-neutral-300;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  max-height: 230px;
  overflow-y: scroll;
  padding: $bz-space-inset-xs;
  width: 100%;

  .bz-attachment {
    align-items: center;
    background: $bz-neutral-200;
    border: 1px solid $bz-neutral-300;
    border-radius: $bz-border-radius-m;
    display: flex;
    justify-content: space-between;
    margin: $bz-space-stack-xs auto;
    min-height: 65px;
    min-width: 65px;
    position: relative;


    &__check {
      top: 0;
      right: 0;
      position: absolute;
      padding: $bz-space-stack-xs;
    }

    & > svg {
      vertical-align: middle;
      width: 100%;
    }

    & > img {
      max-width: 64px;
      max-height: 64px;
      vertical-align: middle;
      width: 100%;

    }

    &-item--hidden {
      display: none;
    }

  }

}


.bz-attachment-list {
  border-top: 1px solid $bz-neutral-300;
  display: flex;
  justify-content: space-between;
  padding: $bz-space-inset-xs $bz-space-inset-s;

  &--hidden {
    display: none;
  }

  .bz-btn.bz-btn--xs {
    font-size: $bz-font-size-body-small;
    line-height: 16px;
    margin: $bz-space-inset-xs;
    padding: $bz-space-inset-squish-xs;

  }

}
