el-button实现边框背景渐变样式圆角样式不生效

这种el-button的渐变效果怎么做，下面是我写css样式，发现可以实现边框渐变样式但实现不了按钮圆角
ui设计样图:

我实现的图：

代码：

<el-button class="button">导出</el-button>

.button{
    width: 70px;
    height: 32px;
    padding: 0;
    color: #ffffff;
    font-size: 14px;
    border: 1px solid;
    background: linear-gradient(0deg, rgba(6,72,149,0.50) 0%, rgba(28,125,207,0.50) 100%);
    border-image: linear-gradient(180deg, #4DAAFA 0%, #074B98 100%) 1;
    border-radius: 4px;
}

如图 , 如有帮助给个采纳谢谢 :

代码

elementui按钮不默认就是这个圆角么，你是怎么搞成直角的

这个正常按钮按照外部边框渐变背景，内部一个伪类留出边框宽度设置内部区域渐变就好了，这不是简简单单

面对要么不要外边框的渐变样式、要么不要内部的透明渐变背景，属实是进退两难，和UI设计商量了一下，打算如果他不改的话就让他多切几个图，卡了半天时间去解决这个问题快吐了，好在UI修改设计了，改成了背景不透明，我师傅说下次这种不好决断的问题要我早点请教他，他说这种情况要么不要边框渐变，要么不要背景透明，实在不行就用切图做背景，现在我正在为自己不好意思麻烦师傅这件事而尴尬的挠头，虽然另辟蹊径了，但是还是非常谢谢大家热心帮我尝试解决问题