.Gallery {
  display: flex;
  gap: 13px;

  &.column {
    flex-direction: column;
    padding-top: 13px;
    max-height: 420px;
    overflow: auto;
  }

  &.row {
    flex-direction: row;
    flex-wrap: wrap;
    margin-left: 10px;
  }

  &.flex-wrap {
    flex-wrap: wrap;
  }
}

.MediaGallery {
  position: relative;

  &.row {
    display: flex;
    flex-wrap: wrap;
    gap: 13px;
    position: relative;
  }

  &.column {
    height: 100%;
    width: 200px;
  }

  &-fileSelectorBtn {
    align-items: center;
    border: 3px dashed #6583fe;
    border-radius: 0.25rem;
    color: #9597b9;
    cursor: pointer;
    display: flex;
    justify-content: center;
    padding: 15px;
    position: relative;
    text-align: center;

    &.row {
      flex-shrink: 0;
      height: 120px;
      width: 115px;

      &.mobile {
        height: 80px;
      }
    }

    &.dragging,
    &:focus,
    &:hover {
      background-color: lighten(#6583fe, 28%);
      color: darken(#9597b9, 5%);
    }

    &.dragging {
      border: 3px solid #aaa;
    }
  }

  &-fileSelectorInput {
    height: 100%;
    left: 0;
    opacity: 0;
    position: absolute;
    top: 0;
    width: 100%;
  }
}