{% include 'header.twig' %}



   <!-- // page and other top info -->
                    <section id="dashboard">
    <div class="container-fluid">
        <div class="row">
            <div class="col-md-4 col-sm-6 col-12">
                <div class="card card_v2">
                    <div class="card-body">
                        <div class="user_info">
                            <div class="text_info">
                                <h5>First Name</h5>
                                <h4> {{ user["username"]  }}</h4>
                            </div>
                            <div class="icon_info">
                                <i class="fas fa-user"></i>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            
          
            <div class="col-md-4 col-sm-6 col-12">
                <div class="card card_v2">
                    <div class="card-body">
                        <div class="user_info">
                            <div class="text_info">
                                <h5>Last Name</h5>
                                <h4>    {{ user["last_name"]  }}</h4>
                            </div>
                            <div class="icon_info">
                                <i class="fas fa-user"></i>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            
            <div class="col-md-4 col-sm-6 col-12">
                <div class="card card_v2">
                    <div class="card-body">
                        <div class="user_info">
                            <div class="text_info">
                                <h5>User Language</h5>
                                <h4>en</h4>
                            </div>
                            <div class="icon_info">
                                <i class="far fa-language"></i>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="row">
            
            <div class="col-md-4 col-sm-6 col-12">
                <div class="card card_v2">
                    <div class="card-body">
                        <div class="user_info">
                            <div class="text_info">
                                <h5>Total Orders</h5>
                                <h4>{{ AllOrders}}</h4>
                            </div>
                            <div class="icon_info">
                                <i class="far fa-shopping-cart"></i>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
           
            <div class="col-md-4 col-sm-6 col-12">
                <div class="card card_v2">
                    <div class="card-body">
                        <div class="user_info">
                            <div class="text_info">
                                <h5>Spend</h5>
                                <h4>{{ currency["symbol"]  }} {{ (user["spent"]*currency["value"]) |round(7, 'floor') }}</h4>
                            </div>
                            <div class="icon_info">
                                <i class="far fa-money-bill"></i>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
          
            <div class="col-md-4 col-sm-6 col-12">
                <div class="card card_v2">
                    <div class="card-body">
                        <div class="user_info">
                            <div class="text_info">
                                <h5>ID</h5>
                                <h4>{{ user["client_id"]  }}</h4>
                            </div>
                            <div class="icon_info">
                                <i class="fas fa-address-book"></i>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="row">
            
            <div class="col-md-4 col-sm-6 col-12">
                <div class="card card_v2">
                    <div class="card-body">
                        <div class="user_info">
                            <div class="text_info">
                                <h5>Email</h5>
                                <h4>{{ user['email'] }}</h4>
                            </div>
                            <div class="icon_info">
                                <i class="far fa-envelope"></i>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
           
            <div class="col-md-4 col-sm-6 col-12">
                <div class="card card_v2">
                    <div class="card-body">
                        <div class="user_info">
                            <div class="text_info">
                                <h5>Unread Tickets</h5>
                                <h4>{% if ticketCount %} <span class="badge" style="background-color: #000000">{{ ticketCount }}</span></span>  {% endif %}</h4>
                            </div>
                            <div class="icon_info">
                                <i class="far fa-ticket-alt"></i>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
          
            <div class="col-md-4 col-sm-6 col-12">
                <div class="card card_v2">
                    <div class="card-body">
                        <div class="user_info">
                            <div class="text_info">
                                <h5>Skype user</h5>
                                <h4>{{ user["telephone"]  }}</h4>
                            </div>
                            <div class="icon_info">
                                <i class="fab fa-skype"></i>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="ac_benefits">
        <div class="container-fluid">
            <div class="row">
                <div class="col-md-6">
                    <div class="card card_v2">
                        <div class="card-body">
                            <div class="acc_benefit_cont">
                                <h3 class="mt-1">Account Benefits</h3>
                                <div class="benifit_name">
                                   <h4>Current Status :                                       <span id="accStats">  {% if user['spent'] >= 100000 %}
                                                <h3>{{ lang['smmspot.neworder.status.1'] }}</h3>
                                                {% elseif user['spent'] >= 8000 %}
                                                <h3>{{ lang['smmspot.neworder.status.2'] }}</h3>
                                                {% elseif user['spent'] >= 4000 %}
                                                <h3>{{ lang['smmspot.neworder.status.3'] }} </h3>
                                                {% else %}
                                                <h3>{{ lang['smmspot.neworder.status.4'] }}   </h3>
                                                {% endif %}</span>
                                  </h4>
                                </div>
                                <br>
                                                              <p>👍24/7 ticket support</p>
                              <p>👍 Each 100 points = 1.00$</p>
                                                          </div>
                           
                        </div>
                        <button type="button" class="btn_ac_benefit" data-bs-toggle="modal" data-bs-target="#GGstaticBackdrop">
                            <i class="fas fa-caret-circle-right"></i> <span class="text-sm details_txt">More User </span>
                        </button>
                    </div>
                </div>
                <div class="col-md-6">
                    <div class="card card_v2">
                        <div class="card-body">
                            <div class="acc_benefit_cont">
                                <h3 class="mt-1 mb-4">Account Spending </h3>
                                <div class="acc_spend_status">
                                    <span>New</span>
                                    <span>==></span>
                                    <span>0$ to 249$</span>
                                </div>
                                <div class="acc_spend_status">
                                    <span>Junior</span>
                                    <span>==></span>
                                    <span>250$ to 1,999$</span>
                                </div>
                                <div class="acc_spend_status">
                                    <span>Regular</span>
                                    <span>==></span>
                                    <span>2,000$ to 4,999$</span>
                                </div>
                                <div class="acc_spend_status">
                                    <span>Frequent</span>
                                    <span>==></span>
                                    <span>5,000$ to 9,999$</span>
                                </div>
                                <div class="acc_spend_status">
                                    <span>Elite</span>
                                    <span>==></span>
                                    <span>10,000$ to 24,999$</span>
                                </div>
                                <div class="acc_spend_status">
                                    <span>VIP</span>
                                    <span>==></span>
                                    <span>25,000$ to 49,999$</span>
                                </div>
                                <div class="acc_spend_status">
                                    <span>Master</span>
                                    <span>==></span>
                                    <span>50,000+$</span>
                                </div>

                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div class="point_benifits">
        <div class="container-fluid">
            <div class="row">
                <div class="col-md-12">
                    <div class="card card_v2">
                        <div class="card-body">
                            <div class="acc_benefit_cont">
                                <h3 class="mt-1">Account Points </h3>
                                <!-- <div class="alert alert-warning">Due to software maintance we disabled point system. It will back soon..</div> -->
                                <div class="benifit_name">
                                    <h4><i class="fad fa-crown"></i> <span id="points">{{ (user["balance"]*currency["value"]) |round(2, 'floor') }} </span> ≈ <span id="point_balance">N/A</span>$</h4>
                                </div>
                                <br>
                                <div class="more_about_points">
                                   <p>
                                    1. You earn points by ordering. Each 1$ spent by you = 1 point.
                                        <br> <br>
                                    2. Each 100 points = 1$ up to 2$ depending on your Account status.
                                    <br> <br>
                                    3. You cannot redeem less than 500 points.
                                    <br> <br>
                                    4. To convert your point into funds, you must open a ticket and choose the subject "Points" and write down "Redeem All".
                                    <br> <br>
                                    5. To prevent spam, it will take a minimum of 3 days to convert your points into funds, and up to 7 days!
                                   </p>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</section>


                </div>
            </div>
        </main>



{% include 'footer.twig' %}