@extends('template.coin.layouts.base')

@section('title', __('Dashboard'))
@section('css')
<link href="{{getTemplateFiles('coin')}}/assets/user/css/app.css?ver=132" type="text/css" rel="stylesheet"> 
<style>
    .dark-mode .card-stats-data .amount{
        color: #fff;
    }
</style>

@endsection

@section('content')
<div class="nk-content nk-content-fluid">
                        <div class="container-xl wide-lg">
                            <div class="nk-content-body">
                                <div class="nk-block-head">
                                    <div class="nk-block-head-sub"><span>Welcome!</span></div>
                                    <div class="nk-block-between-md g-4">
                                        <div class="nk-block-head-content">
                                            <h2 class="nk-block-title fw-normal" style="text-transform:capitalize">{{$user->get_full_name()}}</h2>
                                            <div class="nk-block-des"><p>At a glance summary of your account. Have fun!</p>
                                            <p>Last login activity at <span>{{__date_parse($user->last_login)}}</span></p>
                                            </div>
                                        </div>
                                        <div class="nk-block-head-content">
                                            <ul class="nk-block-tools gx-3">
                                                <li>
                                                    <a href="{{secure_url('deposits')}}" class="btn btn-primary"><span>Deposit</span> <em class="icon ni ni-arrow-long-right"></em></a>
                                                </li>
                                                <li>
                                                    <a href="{{secure_url('withdrawals')}}" class="btn btn-white btn-light"><span>Withdrawal</span> <em class="icon ni ni-arrow-long-right d-none d-sm-inline-block"></em></a>
                                                </li>
                                               
                                            </ul>
                                        </div>
                                    </div>
                                </div>
                             
                                <div class="nk-block">
    <div class="row g-gs">
        <div class="col-md-4">
            <div class="card card-full card-bordered card-wg on-bottom is-primary">
                <div class="card-inner">
                    <div class="card-title-group">
                        <div class="card-title">
                            <h5 class="nk-wgacc-title">Available Balance</h5>
                        </div>
                        <div class="card-tools">
                            <em class="icon ni ni-info fs-13px text-soft nk-tooltip"  data-bs-toggle="tooltip" data-bs-placement="bottom" title="Main and investment account balance without locked or under progress." data-original-title="Main account balance without locked or under progress."></em>
                        </div>
                    </div>
                    <div class="card-amount mt-2 mb-1">
                        <span class="amount">{{__format_number($all_balance->count)}} <span class="currency">{{$user->user_curr()}}</span></span>
                    </div>
                    <div class="card-stats">
                        <div class="card-stats-group g-2">
                            <div class="card-stats-data">
                                <div class="title fw-bold">
                                    Bonus Account
                                    <em class="icon ni ni-info-fill fs-12px text-soft nk-tooltip" title="" data-original-title="Additional balance in your Investment account."></em>
                                </div>
                                <div class="amount fw-bold">{{__format_number($user->bonus)}} <span class="currency fw-normal">{{$user->user_curr()}}</span></div>
                            </div>
                        </div>
                        <div class="card-stats-ck sm"></div>
                    </div>
                    <div class="card-action d-md-none">
                        <ul class="nk-block-tools g-3 flex-wrap flex-sm-nowrap">
                            <li>
                                <a href="{{secure_url('deposits')}}" class="btn btn-primary"><span>Deposit</span> <em class="icon ni ni-arrow-long-right"></em></a>
                            </li>
                            <li>
                                <a href="{{secure_url('withdrawals')}}" class="btn btn-secondary"><span>Withdrawal</span> <em class="icon ni ni-arrow-long-right d-none d-sm-inline-block"></em></a>
                            </li>
                        </ul>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-md-4">
            <div class="card card-full card-bordered card-wg on-bottom is-base">
                <div class="card-inner">
                    <div class="card-title-group">
                        <div class="card-title">
                            <h5 class="nk-wgacc-title">Total Deposit</h5>
                        </div>
                        <div class="card-tools">
                            <em class="icon ni ni-info fs-13px text-soft nk-tooltip" data-bs-toggle="tooltip" data-bs-placement="bottom" title="The total Deposit amount already processed." ></em>
                        </div>
                    </div>
                    <div class="card-amount mt-2 mb-1">
                        <span class="amount">{{__format_number($tdeposit)}} <span class="currency">{{$user->user_curr()}}</span></span>
                    </div>
                    <div class="card-stats">
                        <div class="card-stats-group g-2">
                            <div class="card-stats-data">
                                <div class="title fw-bold">
                                    Pending
                                </div>
                                <div class="amount fw-bold">
                                    {{__format_number($pdeposit)}} <span class="currency fw-normal">{{$user->user_curr()}}</span>
                                   
                                </div>
                            </div>
                        </div>
                        <div class="card-stats-ck sm"></div>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-md-4">
            <div class="card card-full card-bordered card-wg on-bottom is-warning">
                <div class="card-inner">
                    <div class="card-title-group">
                        <div class="card-title">
                            <h5 class="nk-wgacc-title">Total Withdraw</h5>
                        </div>
                        <div class="card-tools">
                            <em class="icon ni ni-info fs-13px text-soft nk-tooltip" data-bs-toggle="tooltip" data-bs-placement="bottom" title="The total Withdraw amount already processed." data-original-title="The total Withdraw amount without under progress."></em>
                        </div>
                    </div>
                    <div class="card-amount mt-2 mb-1">
                        <span class="amount">{{__format_number($twithdraw)}} <span class="currency">{{$user->user_curr()}}</span></span>
                    </div>
                    <div class="card-stats">
                        <div class="card-stats-group g-2">
                            <div class="card-stats-data">
                                <div class="title fw-bold">
                                    Pending
                                </div>
                                <div class="amount fw-bold">
                                    {{__format_number($pwithdraw)}} <span class="currency fw-normal">{{$user->user_curr()}}</span>
                                   
                                </div>
                            </div>
                        </div>
                        <div class="card-stats-ck sm"></div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<div class="nk-block">
    <div class="card card-bordered card-full">
    <div class="card-inner">
        <div class="card-title-group">
            <div class="card-title">
                <h6 class="title"><span class="me-2">Trading Account</span> </h6>
            </div>
           
        </div>
    </div>
    
  
</div>

</div>


<div class="nk-block">
    
    <div class="card card-bordered card-full">
        <div class="row">
            <div class="col-xl-4 col-md-6" style="height:125px;overflow:hidden"> 
             <!-- TradingView Widget BEGIN -->
<div class="tradingview-widget-container">
  <div class="tradingview-widget-container__widget"></div>
  
  <script type="text/javascript" src="https://s3.tradingview.com/external-embedding/embed-widget-single-quote.js" async>
  {
  "symbol": "COINBASE:BTCUSD",
  "width": "100%",
  "colorTheme": "{{($user->theme_style == 'dark') ?__('dark') : __('light')}}",
  "isTransparent": false,
  "locale": "en"
}
  </script>
</div>
<!-- TradingView Widget END -->
            </div>
             <div class="col-xl-4 col-md-6" style="height:125px;overflow:hidden">
                 <!-- TradingView Widget BEGIN -->
<div class="tradingview-widget-container">
  <div class="tradingview-widget-container__widget"></div>
  
  <script type="text/javascript" src="https://s3.tradingview.com/external-embedding/embed-widget-single-quote.js" async>
  {
  "symbol": "COINBASE:ETHUSD",
  "width": "100%",
  "colorTheme": "{{($user->theme_style == 'dark') ?__('dark') : __('light')}}",
  "isTransparent": false,
  "locale": "en"
}
  </script>
</div>
<!-- TradingView Widget END -->
                  </div>
              <div class="col-xl-4 col-md-6" style="height:125px;overflow:hidden">
                     <!-- TradingView Widget BEGIN -->
<div class="tradingview-widget-container">
  <div class="tradingview-widget-container__widget"></div>
  
  <script type="text/javascript" src="https://s3.tradingview.com/external-embedding/embed-widget-single-quote.js" async>
  {
  "symbol": "COINBASE:LTCUSD",
  "width": "100%",
  "colorTheme": "{{($user->theme_style == 'dark') ?__('dark') : __('light')}}",
  "isTransparent": false,
  "locale": "en"
}
  </script>
</div>
<!-- TradingView Widget END -->
                   </div>
            </div>
            </div>
            </div>
        
                                            <div class="nk-block">
    
    <div class="card card-bordered card-full">
        <div class="row">
           
            <div class="col-sm-10">
              
                <!-- TradingView Widget BEGIN -->
	<script type="text/javascript" src="https://s3.tradingview.com/tv.js"></script>
  <script type="text/javascript">
  new TradingView.widget(
  {
  "width": "auto",
  "height": 610,
  "symbol": "FX:EURUSD",
  "timezone": "Etc/UTC",
  "theme": "{{($user->theme_style == 'dark') ?__('Dark') : __('Light')}}",
  "style": "1",
  "locale": "en",
  "toolbar_bg": "#f1f3f6",
  "enable_publishing": false,
  "withdateranges": true,
  "range": "all",
  "allow_symbol_change": true,
  "save_image": false,
  "details": true,
  "hotlist": true,
  "calendar": true,
  "news": [
    "stocktwits",
    "headlines"
  ],
  "studies": [
    "BB@tv-basicstudies",
    "MACD@tv-basicstudies",
    "MF@tv-basicstudies"
  ],
  "container_id": "tradingview_f263f"
}
  );
  </script>
<!-- TradingView Widget END -->
 
            </div>
         
        </div>
    </div>
</div>

                                 <div class="nk-block">
                                    <div class="card card-bordered">
                                        <div class="nk-refwg">
                                            <div class="nk-refwg-invite card-inner">
                                                <div class="nk-refwg-head g-3">
                                                    <div class="nk-refwg-title">
                                                        <h5 class="title">Refer Us & Earn</h5>
                                                        <div class="title-sub">Use the below link to invite your friends.</div>
                                                    </div>
                                                    <div class="nk-refwg-action"><a href="#" class="btn btn-primary">Invite</a></div>
                                                </div>
                                                <div class="nk-refwg-url">
                                                    <div class="form-control-wrap">
                                                        <div class="form-clip clipboard-init" data-clipboard-target="#refUrl" data-success="Copied" data-text="Copy Link">
                                                            <em class="clipboard-icon icon ni ni-copy"></em> <span class="clipboard-text">Copy Link</span>
                                                        </div>
                                                        <div class="form-icon"><em class="icon ni ni-link-alt"></em></div>
                                                        <input type="text" class="form-control copy-text" id="refUrl" value="{{secure_url('invite')}}/{{$user->username}}" />
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="nk-refwg-stats card-inner bg-lighter">
                                                <div class="nk-refwg-group g-3">
                                                    <div class="nk-refwg-name">
                                                        <h6 class="title">My Referral(1 month) <em class="icon ni ni-info" data-bs-toggle="tooltip" data-bs-placement="right" title="Referral Informations"></em></h6>
                                                    </div>
                                                    <div class="nk-refwg-info g-3">
                                                        <div class="nk-refwg-sub">
                                                            <div class="title">{{$total_ref}}</div>
                                                            <div class="sub-text">Total Joined</div>
                                                        </div>
                                                        <div class="nk-refwg-sub">
                                                            <div class="title">{{__format_number($ref_amt)}}</div>
                                                            <div class="sub-text">Referral Earn</div>
                                                        </div>
                                                    </div>
                                                    <div class="nk-refwg-more dropdown mt-n1 me-n1">
                                                        <a href="#" class="btn btn-icon btn-trigger" data-bs-toggle="dropdown"><em class="icon ni ni-more-h"></em></a>
                                                        <div class="dropdown-menu dropdown-menu-xs dropdown-menu-end">
                                                            <ul class="link-list-plain sm">
                                                                <li><a href="#">7 days</a></li>
                                                                <li><a href="#">15 Days</a></li>
                                                                <li><a href="#">30 Days</a></li>
                                                            </ul>
                                                        </div>
                                                    </div>
                                                </div>
                                                <div class="nk-refwg-ck"><canvas class="chart-refer-stats" id="refBarChart"></canvas></div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="nk-block">
                                    <div class="card card-bordered">
                                        <div class="card-inner card-inner-lg">
                                            <div class="align-center flex-wrap flex-md-nowrap g-4">
                                                <div class="nk-block-image w-120px flex-shrink-0">
                                                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 120 118">
                                                        <path
                                                            d="M8.916,94.745C-.318,79.153-2.164,58.569,2.382,40.578,7.155,21.69,19.045,9.451,35.162,4.32,46.609.676,58.716.331,70.456,1.845,84.683,3.68,99.57,8.694,108.892,21.408c10.03,13.679,12.071,34.71,10.747,52.054-1.173,15.359-7.441,27.489-19.231,34.494-10.689,6.351-22.92,8.733-34.715,10.331-16.181,2.192-34.195-.336-47.6-12.281A47.243,47.243,0,0,1,8.916,94.745Z"
                                                            transform="translate(0 -1)"
                                                            fill="#f6faff"
                                                        />
                                                        <rect x="18" y="32" width="84" height="50" rx="4" ry="4" fill="#fff" />
                                                        <rect x="26" y="44" width="20" height="12" rx="1" ry="1" fill="#e5effe" />
                                                        <rect x="50" y="44" width="20" height="12" rx="1" ry="1" fill="#e5effe" />
                                                        <rect x="74" y="44" width="20" height="12" rx="1" ry="1" fill="#e5effe" />
                                                        <rect x="38" y="60" width="20" height="12" rx="1" ry="1" fill="#e5effe" />
                                                        <rect x="62" y="60" width="20" height="12" rx="1" ry="1" fill="#e5effe" />
                                                        <path
                                                            d="M98,32H22a5.006,5.006,0,0,0-5,5V79a5.006,5.006,0,0,0,5,5H52v8H45a2,2,0,0,0-2,2v4a2,2,0,0,0,2,2H73a2,2,0,0,0,2-2V94a2,2,0,0,0-2-2H66V84H98a5.006,5.006,0,0,0,5-5V37A5.006,5.006,0,0,0,98,32ZM73,94v4H45V94Zm-9-2H54V84H64Zm37-13a3,3,0,0,1-3,3H22a3,3,0,0,1-3-3V37a3,3,0,0,1,3-3H98a3,3,0,0,1,3,3Z"
                                                            transform="translate(0 -1)"
                                                            fill="#798bff"
                                                        />
                                                        <path d="M61.444,41H40.111L33,48.143V19.7A3.632,3.632,0,0,1,36.556,16H61.444A3.632,3.632,0,0,1,65,19.7V37.3A3.632,3.632,0,0,1,61.444,41Z" transform="translate(0 -1)" fill="#6576ff" />
                                                        <path
                                                            d="M61.444,41H40.111L33,48.143V19.7A3.632,3.632,0,0,1,36.556,16H61.444A3.632,3.632,0,0,1,65,19.7V37.3A3.632,3.632,0,0,1,61.444,41Z"
                                                            transform="translate(0 -1)"
                                                            fill="none"
                                                            stroke="#6576ff"
                                                            stroke-miterlimit="10"
                                                            stroke-width="2"
                                                        />
                                                        <line x1="40" y1="22" x2="57" y2="22" fill="none" stroke="#fffffe" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" />
                                                        <line x1="40" y1="27" x2="57" y2="27" fill="none" stroke="#fffffe" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" />
                                                        <line x1="40" y1="32" x2="50" y2="32" fill="none" stroke="#fffffe" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" />
                                                        <line x1="30.5" y1="87.5" x2="30.5" y2="91.5" fill="none" stroke="#9cabff" stroke-linecap="round" stroke-linejoin="round" />
                                                        <line x1="28.5" y1="89.5" x2="32.5" y2="89.5" fill="none" stroke="#9cabff" stroke-linecap="round" stroke-linejoin="round" />
                                                        <line x1="79.5" y1="22.5" x2="79.5" y2="26.5" fill="none" stroke="#9cabff" stroke-linecap="round" stroke-linejoin="round" />
                                                        <line x1="77.5" y1="24.5" x2="81.5" y2="24.5" fill="none" stroke="#9cabff" stroke-linecap="round" stroke-linejoin="round" />
                                                        <circle cx="90.5" cy="97.5" r="3" fill="none" stroke="#9cabff" stroke-miterlimit="10" />
                                                        <circle cx="24" cy="23" r="2.5" fill="none" stroke="#9cabff" stroke-miterlimit="10" />
                                                    </svg>
                                                </div>
                                                <div class="nk-block-content">
                                                    <div class="nk-block-content-head px-lg-4">
                                                        <h5>We’re here to help you!</h5>
                                                        <p class="text-soft">Ask a question or file a support ticket, manage request, report an issues. Our team support team will get back to you by email.</p>
                                                        <p>You can also contact live support</p>
                                                    </div>
                                                </div>
                                                <div class="nk-block-content flex-shrink-0"><a href="{{secure_url('support')}}" class="btn btn-lg btn-outline-primary">Get Support Now</a></div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
@endsection