$deviceWidth: 750;

@function vmin($rpx) {
    @return #{$rpx * 100 / $deviceWidth}vmin;
}

@mixin share-reward-msg {
    .share-msg-card {
        padding: vmin(16);
        display: flex;
        justify-content: center;
        background: rgba(255, 255, 255, 1);
        margin: vmin(32) vmin(136);
        border-radius: vmin(16);
        .reward-img {
            width: vmin(182);
            height: vmin(156);
            border-radius: vmin(8);
            margin-right: vmin(16);
            border: vmin(1) solid #EBEBEB;
            display: flex;
            justify-content: center;
            align-items: center;
            image {
                object-fit: contain;
                width: vmin(182);
                height: 100%;
            }
        }
        .content {
            position: relative;
            .title {
                font-size: vmin(24);
                font-weight: 500;
                font-family: "PingFang SC";
            }
            .rules {
                color: rgba(153, 153, 153, 1);
                font-size: vmin(18);
                font-weight: 400;
                font-family: "PingFang SC";
                margin-top: vmin(8);
            }
            .button {
                width: vmin(112);
                height: vmin(48);
                border-radius: vmin(40);
                background: linear-gradient(270deg, rgba(254, 101, 0, 1) 0%, rgba(255, 65, 2, 1) 100%);
                font-size: vmin(24);
                font-weight: 500;
                font-family: "PingFang SC";
                bottom: 0;
                right: 0;
                position: absolute;
                color: rgba(255, 255, 255, 1);
                display: flex;
                align-items: center;
                justify-content: center;

                &.is-disable {
                    opacity: 0.4;
                }
            }
        }
    }
}

.share-reward-msg {
    @include share-reward-msg;
}

// 竖屏pad
@media screen and (min-width: 768px) and (orientation: portrait) {
    $deviceWidth: 1536 !global;
  
    .share-reward-msg {
        @include share-reward-msg;
    }
}
// 横屏pad
@media screen and (min-height: 768px) and (orientation: landscape) {
    $deviceWidth: 1536 !global;
   
    .share-reward-msg {
        @include share-reward-msg;
    }
}