$deviceWidth: 750;

@function vmin($rpx) {
    @return #{$rpx * 100 / $deviceWidth}vmin;
}

.share-reward-invite-popup {
    overflow: visible !important;
}

.van-popup {
    margin: 0 auto;
}

@mixin share-reward-invited-card {
    .detail {
        width: vmin(578);
        height: vmin(732);
        background: url('https://wechatapppro-1252524126.cdn.xiaoeknow.com/app1lkpevip1011/image/b_u_5b2225aa46488_oGKN7IvA/kwxg6nz20w8s.png');
        background-size: 100%;
        background-repeat: no-repeat;
        border-radius: vmin(20);

        &.end {
            background: white;
        }

        .title {
            display: flex;
            align-items: center;
            justify-content: center;
            flex-direction: column;
            padding: vmin(48) 0 vmin(30) 0;

            .title-img {
                width: 100%;
                height: vmin(50);
                background-repeat: no-repeat;
                background-position: center;
                background-size: auto 100%;
            }
        }

        .late-tips {
            color: rgba(255, 141.41, 54.19, 1);
            font-size: vmin(28);
            font-weight: 400;
            font-family: "PingFang SC";
            margin-bottom: vmin(10);
            margin-top: -vmin(10);
        }

        .reward-content-swiper {
            width: vmin(576);
            height: vmin(308);
            // overflow-x: hidden;
        }

        .reward {
            .empty {
                margin-top: vmin(100);
                display: flex;
                flex-direction: column;
                justify-content: center;
                align-items: center;

                image {
                    width: vmin(176);
                    height: vmin(176);
                }

                text {
                    margin-top: vmin(18);
                    color: rgba(153, 153, 153, 1);
                    font-size: vmin(28);
                    font-weight: 400;
                    font-family: "PingFang SC";
                }
            }
        }

        .content {
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;

            .tips {
                font-size: vmin(28);
                font-weight: 400;
                font-family: "PingFang SC";
                position: absolute;
                bottom: vmin(156);
                color: #333333;
            }

            .button {
                display: flex;
                align-items: center;
                justify-content: center;
                width: vmin(508);
                height: vmin(80);
                border-radius: vmin(74);
                background: linear-gradient(270deg, rgba(255, 115.7, 56, 1) 0%, rgba(255, 142, 56, 1) 100%);
                font-size: vmin(28);
                font-family: "PingFang SC";
                font-weight: 500;
                color: rgba(255, 255, 255, 1);
                position: absolute;
                bottom: vmin(48);
            }
        }
    }

    .close-icon {
        position: absolute;
        display: flex;
        justify-content: center;
        align-items: center;
        width: 100%;
        margin-top: vmin(32);

        image {
            width: vmin(48);
            height: vmin(48);
        }
    }

    .van-popup--center {
        border-radius: vmin(20);
    }

}

.share-reward-invited-card {
    @include share-reward-invited-card;
}

// 竖屏pad
@media screen and (min-width: 768px) and (orientation: portrait) {
    $deviceWidth: 1536 !global;
    .share-reward-invited-card {
        @include share-reward-invited-card;
    }
}
// 横屏pad
@media screen and (min-height: 768px) and (orientation: landscape) {
    $deviceWidth: 1536 !global;
    .share-reward-invited-card {
        @include share-reward-invited-card;
    }
}
