@import "../../base/fn.less";

.weui-btn{
    margin-top: @weuiBtnDefaultGap;
    &:first-child{
        margin-top: 0;
    }
}
.weui-btn-area{
    margin: @weuiCellsMarginTop @weuiBtnDefaultGap .3em;
}

button {
    @colorButton: #FE6A0F;

    display: flex;
    justify-content:center;
    align-content:center;
    align-items:center;
    line-height: initial;

    border-radius: 4em;
    background-image: -webkit-gradient(
        linear,
        5% 0%,
        80% 100%,
        from(#FE6A0F),
        to(#FE6A0F)
        // from(#4AF3F9),
        // to(#2475F1)
        );

    color: #fff;
    font-weight: bold;

    &:not([size='mini']){
        font-weight: bold;
        height: 80rpx;
    }
   
    // box-shadow: 2rpx 2rpx 10rpx 0 rgba(#2475F1, .53);

    // 取除微信默认描边
    &:after{ border: none; }
    
    &,
    &[type=primary]{
        &[plain] {
            color: #F16E24;
            border: 1rpx solid currentColor;
            background-color: transparent;
        }
    }
    &[type=default]{
        color: #fff;
        &[plain] {
            color: #33393E;
            border: 1rpx solid #B9BEC2;
            background: transparent;

            &.button-hover{
                // border-color: darken( #B9BEC2, 10% )
                border-color: lighten(#B9BEC2, 5% )
            }
        }
    }
    // &[size=mini]{
    //     font-size: 12px;
    //     font-weight: lighter;
    // }
    &[disabled]{
        background-image: -webkit-gradient(
            linear,
            22% 0%,
            30% 100%,
            from(#edeff3),
            to(#d6dbe2)
        );
        &:not([plain]){
            color: #fff!important;
        }

        &[plain] {
            color: #B9BEC2;
            border-color: lighten(#B9BEC2, 5% )
        }

        // box-shadow: 2rpx 2rpx 10rpx 0 rgba(214, 219, 226, .53);
    }


    &.button-hover{
        border-color: currentColor;
        opacity: .5;

        &[plain]{
            color: @colorButton;
            border-color: currentColor;
        }
    }

    &[plain]{
        background: transparent;
    }
}