<?php $__env->startSection('content'); ?>
    <style>
        html,


        .team-wrap {
            padding: 0 0 1.6rem 0;
            background: -webkit-gradient(linear, left top, left bottom, from(#E7EFFD), to(#FFFFFF));
            background: linear-gradient(180deg, #E7EFFD 0%, #FFFFFF 100%);
        }

        .team-wrap .tbg {
            height: 3.2rem;
            background: -webkit-gradient(linear, left top, right top, from(#5795FF), to(#3ADDC8));
            background: linear-gradient(90deg, #5795FF 0%, #3ADDC8 100%);
        }

        .team-wrap .tbg h2 {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-pack: end;
            -ms-flex-pack: end;
            justify-content: flex-end;
            position: relative;
            padding-right: 0.32rem;
            padding-top: 0.75rem;
        }

        .team-wrap .tbg h2 .clicktis {
            width: 0.64rem;
            height: 0.64rem;
            cursor: pointer;
        }

        .team-wrap .tbg h2 .clicktis img {
            width: 100%;
            height: 100%;
        }

        .team-wrap .tbg h2 .tis {
            position: absolute;
            display: none;
            right: 0.3rem;
            top: 110%;
            background: rgba(0, 0, 0, 0.7);
            border-radius: 0.05rem;
            color: #fff;
            font-size: 0.25rem;
            width: 5rem;
            padding: 0.15rem 0.25rem;
            z-index: 2;
        }

        .team-wrap .tbg h2 .tis::after {
            position: absolute;
            right: 0.24rem;
            bottom: 100%;
            content: "";
            border: 0.1rem solid transparent;
            border-bottom: 0.1rem solid rgba(0, 0, 0, 0.7);
        }

        .team-wrap .box {
            background: -webkit-gradient(linear, left top, left bottom, from(#E7EFFD), to(#FFFFFF));
            background: linear-gradient(180deg, #E7EFFD 0%, #FFFFFF 100%);
            border-radius: 0.28rem 0.28rem 0 0;
            margin-top: -1.2rem;
            position: relative;
        }

        .team-wrap .box::before {
            border-radius: 0.28rem 0.28rem 0 0;
            content: "";
            position: absolute;
            left: 0;
            width: 100%;
            top: 0;
            height: 5.1rem;
            background: -webkit-gradient(linear, left top, left bottom, from(#E7EFFD), to(#FFFFFF));
            background: linear-gradient(180deg, #E7EFFD 0%, #FFFFFF 100%);
        }

        .team-wrap .box .user {
            width: 1.2rem;
            height: 1.2rem;
            margin: 0 auto;
            border-radius: 100%;
            border: 0.04rem solid #fff;
            background: rgb(130, 210, 254);
            -webkit-transform: translateY(-0.6rem);
            -ms-transform: translateY(-0.6rem);
            transform: translateY(-0.6rem);
        }

        .team-wrap .box .user img {
            width: 100%;
            height: 100%;
        }

        .team-wrap .box .name {
            font-size: 0.36rem;
            font-weight: bold;
            color: #2A2A2A;
            text-align: center;
            margin-top: -0.5rem;
        }

        .team-wrap .box .card {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -ms-flex-wrap: wrap;
            flex-wrap: wrap;
            -webkit-box-pack: center;
            -ms-flex-pack: center;
            justify-content: center;
            position: relative;
            padding: 0 0.32rem;
        }

        .team-wrap .box .card li {
            width: calc(50% - 0.1rem);
            height: 1.28rem;
            background: #FFFFFF;
            -webkit-box-shadow: 0px 0.04rem 0.08rem 0.02rem rgba(0, 147, 185, 0.1);
            box-shadow: 0px 0.04rem 0.08rem 0.02rem rgba(0, 147, 185, 0.1);
            border-radius: 0.16rem;
            margin-top: 0.2rem;
            padding: 0 0.1rem 0 0.22rem;
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-align: center;
            -ms-flex-align: center;
            align-items: center;
        }

        .team-wrap .box .card li:nth-child(2),
        .team-wrap .box .card li:nth-child(4) {
            margin-left: 0.2rem;
        }

        .team-wrap .box .card li img {
            width: 0.6rem;
        }

        .team-wrap .box .card li div {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -ms-flex-wrap: wrap;
            flex-wrap: wrap;
            -ms-flex-line-pack: center;
            align-content: center;
            padding-left: 0.22rem;
        }

        .team-wrap .box .card li div p {
            width: 100%;
            font-size: 0.24rem;
            font-weight: 400;
            color: #2A2A2A;
        }

        .team-wrap .box .card li div h5 {
            width: 100%;
            margin-top: 0.08rem;
            font-size: 0.36rem;
            font-weight: bold;
            color: #1A70F5;
        }

        .team-wrap .box .total {
            padding: 0 0.32rem;
            margin-top: 0.32rem;
            font-size: 0.24rem;
            color: #585858;
            position: relative;
            line-height: 0.3rem;
        }

        .team-wrap .box .list {
            padding: 0 0.32rem;
        }

        .team-wrap .box .list li {
            height: 2.2rem;
            background-size: 100% 100%;
            margin-top: 0.76rem;
            position: relative;
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -ms-flex-wrap: wrap;
            flex-wrap: wrap;
            -ms-flex-line-pack: end;
            align-content: flex-end;
            padding-bottom: 0.32rem;
        }

        .team-wrap .box .list li .lv {
            font-size: 0.9rem;
            position: absolute;
            left: 0.26rem;
            top: -0.45rem;
            font-weight: bold;
            color: var(--color);
            -webkit-transform-origin: center bottom;
            -ms-transform-origin: center bottom;
            transform-origin: center bottom;
            -webkit-transform: skew(-7deg);
            -ms-transform: skew(-7deg);
            transform: skew(-7deg);
        }

        .team-wrap .box .list li i {
            position: absolute;
            right: 0.4rem;
            bottom: 0.6rem;
            width: 0.28rem;
            height: 0.28rem;
            background-image: url(../img/next.png);
            background-size: 100% 100%;
        }

        .team-wrap .box .list li img {
            position: absolute;
            right: 0;
            bottom: 1rem;
            width: 1.96rem;
            height: 1.96rem;
        }

        .team-wrap .box .list li .text {
            width: 100%;
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            padding-left: 0.4rem;
            padding-right: 1.4rem;
            -webkit-box-align: center;
            -ms-flex-align: center;
            align-items: center;
        }

        .team-wrap .box .list li .text span {
            -webkit-box-flex: 1;
            -ms-flex: 1;
            flex: 1;
            font-size: 0.36rem;
            font-weight: 400;
            color: #333333;
        }

        .team-wrap .box .list li .text2 {
            margin-top: 0.1rem;
        }

        .team-wrap .box .list li .text2 span {
            font-size: 0.28rem;
            color: #585858;
        }

        .team-wrap .box .list li:nth-child(1) {
            background-image: url(https://freelancerawais.online/pro2/core/img);
        }

        =.team-wrap .box .list li:nth-child(2) {
            background-image: url(https://freelancerawais.online/pro2/core/img/lv2bg.png);
        }

        .team-wrap .box .list li:nth-child(3) {
            background-image: url(../img/lv3bg.png);
        }
    </style>


    <body>
        <div class="team-wrap">
            <div class="tbg">
                <h2>
                    <div class="clicktis">
                        <img src="<?php echo e(asset('core/img/sm.png')); ?>" alt="">
                    </div>
                    <p class="tis">You obtain 20% of Level 1's recharge amount, 4% ofLevel 2's, 1% of Level 3's.
                        The bonus is givenimmediately right after referrals make a paymentrather than registration</p>
                </h2>
            </div>
            <div class="box">
                <div class="user">
                    <img src="<?php echo e(asset('core/img/user2.png')); ?>" alt="">
                </div>
                <p class="name">ID:<?php echo e($user->mobile); ?></p>
                <ul class="card">
                    <li>
                        <img src="<?php echo e(asset('core/img/t4.png')); ?>" alt="">
                        <div>
                            <p>Total Referral</p>
                            <h5> <?php echo e($referral_count); ?>

                            </h5>
                        </div>
                    </li>
                    <li>
                        <img src="<?php echo e(asset('core/img/t3.png')); ?>" alt="">
                        <div>
                            <p>Team Recharge</p>
                            <h5> <?php echo e($general->cur_sym); ?><?php echo e(showAmount(refTotalDeposit($user->id))); ?></h5>
                        </div>
                    </li>
                    <li>
                        <img src="<?php echo e(asset('core/img/t2.png')); ?>" alt="">
                        <div>
                            <p>Team Withdraw</p>
                            <h5><?php echo e($general->cur_sym); ?><?php echo e(showAmount(refTotalWithdraw($user->id))); ?></h5>
                        </div>
                    </li>
                    <li>
                        <img src="<?php echo e(asset('core/img/t1.png')); ?>" alt="">
                        <div>
                            <p>Today Team</p>
                            <h5><?php echo e(refTodayCount($user->id)); ?></h5>
                        </div>
                    </li>
                </ul>
                <p class="total">
                    <!-- Total number of valid invitations 0 <br> -->
                </p>
                <ul class="list">
                    <li onclick="onJump('/user/grade/level/1.html')" style="color:#12B1D5">

                        <div class="lv">

                            LV1
                        </div>
                        <i style="background-image: url('https://freelancerawais.online/pro2/core/img/lv2bg.png');"></i>
                        <img src="<?php echo e(asset('core/img/lv1r.png')); ?>" alt="">
                        <p class="text">
                            <span> ₦<?php echo e(showAmount(teamDeposit($user->id, 1))); ?></span>
                            <span> <?php echo e(teamSize($user->id, 1)); ?></span>

                        </p>
                        <p class="text text2">
                            <span>Bonus</span>
                            <span>People</span>

                        </p>
                    </li>
                    <li onclick="onJump('/user/grade/level/2.html')" style="--color:#8F5CE5">
                        <div class="lv">
                            LV2
                        </div>
                        <i></i>
                        <img src="<?php echo e(asset('core/img/lv2r.png')); ?>" alt="">
                        <p class="text">
                            <span> ₦<?php echo e(showAmount(teamDeposit($user->id, 2))); ?></span>
                            <span> <?php echo e(teamSize($user->id, 2)); ?></span>

                        </p>
                        <p class="text text2">
                            <span>Bonus</span>
                            <span>People</span>

                        </p>
                    </li>
                    <li onclick="onJump('/user/grade/level/3.html')" style="--color:#E9674D">
                        <div class="lv">
                            LV3
                        </div>
                        <i></i>
                        <img src="<?php echo e(asset('core/img/lv3r.png')); ?>" alt="">
                        <p class="text">
                            <span> ₦<?php echo e(showAmount(teamDeposit($user->id, 3))); ?></span>
                            <span> <?php echo e(teamSize($user->id, 3)); ?></span>

                        </p>
                        <p class="text text2">
                            <span>Bonus</span>
                            <span>People</span>

                        </p>
                    </li>

                </ul>
            </div>
        </div>
    </body>
<?php $__env->stopSection(); ?>

<?php echo $__env->make('layouts.users', \Illuminate\Support\Arr::except(get_defined_vars(), ['__data', '__path']))->render(); ?><?php /**PATH /Applications/AMPPS/www/forge/core/resources/views/templates/basic/user/referrals.blade.php ENDPATH**/ ?>