$deviceWidth: 750;

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

@mixin share-reward-more {
    height: vmin(990);
    overflow: visible !important;
    // justify-content: space-around;
    background: url('https://wechatapppro-1252524126.cdn.xiaoeknow.com/app1lkpevip1011/image/b_u_5b2225aa46488_oGKN7IvA/kwvm6fsu0w8i.png');
    background-size: 100% 100%;
    background-repeat: no-repeat;
    border-radius: vmin(24) vmin(24) 0 0;
}

@mixin more-invite-target-info {
    display: flex;
    flex-direction: column;
    align-items: center;
    height: 100%;

    .target-title {
        color: rgba(255, 255, 255, 1);
        font-size: vmin(32);
        font-weight: 500;
        font-family: "PingFang SC";
        display: flex;
        align-items: center;
        justify-content: center;
        position: relative;
        width: 100%;
        height: vmin(96);

        image {
            width: vmin(32);
            height: vmin(32);
            object-fit: contain;

            &:nth-of-type(1) {
                position: absolute;
                left: vmin(32);
                top: vmin(32);
            }

            &:nth-of-type(2) {
                position: absolute;
                right: vmin(32);
                top: vmin(32);
            }
        }

        text {
            padding: vmin(20) 0;
        }
    }

    .target-info {
        display: flex;
        border-radius: vmin(24);
        margin: vmin(16) vmin(32);
        width: vmin(686);
        justify-content: flex-start;
        flex-wrap: wrap;
        background: linear-gradient(180deg, rgba(255, 151.75, 72.25, 1) 0%, rgba(255, 128.29, 30.81, 1) 100%);
        max-height: vmin(760);
        overflow-y: scroll;

        &::-webkit-scrollbar {
            width: vmin(8);
        }

        &::-webkit-scrollbar-thumb {
            border-radius: vmin(8);
            height: vmin(128);
            background: #FFD1A7;
        }

        .info {
            display: flex;
            flex-direction: column;
            align-items: center;
            width: vmin(100);
            margin: vmin(24) 0 vmin(24) vmin(30);

            .invite-bg {
                width: vmin(84);
                height: vmin(84);
                border-radius: 50%;
                opacity: 1;
                background: linear-gradient(180deg, rgba(255, 212.84, 189.13, 1) 0%, rgba(255, 177.94, 134.94, 1) 100%);
                display: flex;
                align-items: center;
                justify-content: center;
            }

            .invite-content {
                border-radius: 50%;
                display: flex;
                align-items: center;
                justify-content: center;
                width: vmin(72);
                height: vmin(72);
                background: rgba(255, 255, 255, 1);

                .icon {
                    width: vmin(40);
                    height: vmin(40);
                }

                &.invited {
                    image {
                        border-radius: 50%;
                        width: vmin(72);
                        height: vmin(72);
                    }
                }

                &.activity-over {
                    width: vmin(84);
                    height: vmin(84);
                    box-sizing: border-box;
                    border: vmin(8) solid #CCCCCC;
                }
            }

            .tips {
                color: rgba(255, 255, 255, 1);
                font-size: vmin(25);
                zoom: 0.9;
                font-family: "PingFang SC";
                width: vmin(100);
                overflow: hidden;
                text-overflow: ellipsis;
                white-space: nowrap;
                text-align: center;
            }
        }
    }
}

.more-invite-target-info {
    @include more-invite-target-info;
}

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

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