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

@section('title', __($deposit->txn_id.' | Complete Deposit'))

@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="page-dw wide-xs m-auto">
                <div class="nk-pps-apps">
                    <div class="nk-pps-title text-center">
                        <h3 class="title">Make Your Payment</h3>
                        <p class="caption-text">
                            Your deposit <strong class="text-dark">{{$deposit->txn_id}}</strong> has been placed successfully. To complete, please send the exact amount of <strong class="text-dark">0.01 BTC</strong> to the address below.
                        </p>
                    </div>
                    <div class="nk-pps-card card card-bordered popup-inside">
                        <div class="card-inner-group">
                            <div class="card-inner card-inner-sm">
                                <div class="card-head mb-0">
                                    <h6 class="title mb-0">Pay Bitcoin</h6>
                                    <div class="card-opt"><span class="counter" data-countdown-second="10799" data-countdown-text="Expire in">Expire in 2:59:29</span></div>
                                </div>
                            </div>
                            <div class="card-inner">
                                <div class="qr-media mx-auto mb-3 w-max-100px">
                                    <!--?xml version="1.0" encoding="UTF-8"?-->
                                    <svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="100" height="100" viewBox="0 0 100 100">
                                        <rect x="0" y="0" width="100" height="100" fill="#ffffff"></rect>
                                        <g transform="scale(3.03)">
                                            <g transform="translate(0,0)">
                                                <path
                                                    fill-rule="evenodd"
                                                    d="M9 0L9 1L8 1L8 2L9 2L9 3L8 3L8 4L10 4L10 7L11 7L11 4L12 4L12 5L13 5L13 4L14 4L14 5L15 5L15 6L14 6L14 7L15 7L15 8L16 8L16 9L17 9L17 11L16 11L16 10L15 10L15 9L14 9L14 8L13 8L13 6L12 6L12 9L14 9L14 10L15 10L15 11L14 11L14 12L15 12L15 13L16 13L16 14L14 14L14 13L12 13L12 11L13 11L13 10L11 10L11 11L10 11L10 9L11 9L11 8L6 8L6 9L9 9L9 10L8 10L8 11L7 11L7 10L4 10L4 9L5 9L5 8L0 8L0 9L2 9L2 10L0 10L0 11L1 11L1 13L0 13L0 14L2 14L2 15L1 15L1 17L0 17L0 18L1 18L1 19L0 19L0 25L1 25L1 20L2 20L2 19L3 19L3 20L4 20L4 19L3 19L3 18L5 18L5 19L9 19L9 18L10 18L10 19L11 19L11 20L10 20L10 22L6 22L6 21L8 21L8 20L6 20L6 21L3 21L3 22L5 22L5 25L8 25L8 27L9 27L9 28L8 28L8 33L9 33L9 31L10 31L10 30L11 30L11 29L12 29L12 30L13 30L13 31L12 31L12 33L13 33L13 32L14 32L14 33L16 33L16 31L18 31L18 29L19 29L19 30L21 30L21 32L20 32L20 31L19 31L19 32L20 32L20 33L21 33L21 32L22 32L22 33L28 33L28 32L31 32L31 33L32 33L32 32L31 32L31 30L33 30L33 27L32 27L32 26L33 26L33 25L32 25L32 26L31 26L31 25L30 25L30 26L31 26L31 27L29 27L29 24L31 24L31 23L32 23L32 24L33 24L33 23L32 23L32 22L33 22L33 20L32 20L32 18L33 18L33 17L32 17L32 16L31 16L31 15L32 15L32 14L33 14L33 13L32 13L32 14L28 14L28 15L27 15L27 13L26 13L26 11L25 11L25 10L27 10L27 11L28 11L28 10L27 10L27 9L28 9L28 8L27 8L27 9L26 9L26 8L25 8L25 5L24 5L24 4L23 4L23 3L25 3L25 2L22 2L22 1L24 1L24 0L21 0L21 3L19 3L19 4L18 4L18 3L16 3L16 1L14 1L14 0L13 0L13 1L11 1L11 2L10 2L10 0ZM19 0L19 1L17 1L17 2L19 2L19 1L20 1L20 0ZM12 2L12 4L13 4L13 3L14 3L14 4L15 4L15 5L17 5L17 4L15 4L15 2ZM10 3L10 4L11 4L11 3ZM21 3L21 4L20 4L20 5L19 5L19 7L18 7L18 6L17 6L17 8L18 8L18 9L20 9L20 8L21 8L21 11L20 11L20 10L19 10L19 11L17 11L17 12L18 12L18 13L17 13L17 14L16 14L16 15L14 15L14 16L13 16L13 17L12 17L12 15L13 15L13 14L12 14L12 13L11 13L11 12L10 12L10 13L11 13L11 14L10 14L10 17L11 17L11 18L13 18L13 19L12 19L12 21L11 21L11 22L10 22L10 25L11 25L11 26L13 26L13 27L12 27L12 29L15 29L15 30L16 30L16 29L17 29L17 28L18 28L18 26L19 26L19 27L21 27L21 25L23 25L23 26L22 26L22 28L19 28L19 29L21 29L21 30L22 30L22 31L23 31L23 32L26 32L26 30L27 30L27 32L28 32L28 31L30 31L30 30L28 30L28 29L26 29L26 30L25 30L25 29L24 29L24 28L23 28L23 26L24 26L24 24L26 24L26 23L27 23L27 24L29 24L29 23L31 23L31 22L32 22L32 20L30 20L30 19L31 19L31 16L29 16L29 15L28 15L28 16L27 16L27 15L26 15L26 14L25 14L25 13L24 13L24 14L22 14L22 15L24 15L24 16L21 16L21 15L20 15L20 14L21 14L21 13L22 13L22 12L23 12L23 11L24 11L24 10L25 10L25 8L23 8L23 7L24 7L24 5L23 5L23 7L22 7L22 6L21 6L21 4L22 4L22 3ZM8 5L8 7L9 7L9 5ZM15 6L15 7L16 7L16 6ZM20 6L20 7L21 7L21 8L22 8L22 10L24 10L24 9L23 9L23 8L22 8L22 7L21 7L21 6ZM29 8L29 12L28 12L28 13L29 13L29 12L33 12L33 11L32 11L32 10L33 10L33 9L32 9L32 8L31 8L31 9L32 9L32 10L31 10L31 11L30 11L30 8ZM4 11L4 16L3 16L3 15L2 15L2 16L3 16L3 17L2 17L2 18L3 18L3 17L4 17L4 16L5 16L5 15L6 15L6 16L7 16L7 17L6 17L6 18L9 18L9 16L7 16L7 15L6 15L6 14L9 14L9 11L8 11L8 13L6 13L6 12L7 12L7 11ZM19 11L19 12L20 12L20 13L18 13L18 14L17 14L17 15L16 15L16 16L17 16L17 17L16 17L16 18L15 18L15 19L14 19L14 20L15 20L15 21L12 21L12 22L13 22L13 23L12 23L12 25L13 25L13 24L14 24L14 25L15 25L15 24L14 24L14 23L16 23L16 24L17 24L17 25L16 25L16 26L15 26L15 27L14 27L14 28L17 28L17 26L18 26L18 24L20 24L20 25L19 25L19 26L20 26L20 25L21 25L21 24L22 24L22 23L23 23L23 22L24 22L24 23L25 23L25 22L27 22L27 23L28 23L28 22L27 22L27 21L30 21L30 20L27 20L27 21L25 21L25 22L24 22L24 20L26 20L26 19L27 19L27 17L26 17L26 16L24 16L24 17L21 17L21 16L19 16L19 15L18 15L18 14L20 14L20 13L21 13L21 12L22 12L22 11L21 11L21 12L20 12L20 11ZM2 12L2 13L3 13L3 12ZM5 13L5 14L6 14L6 13ZM17 15L17 16L18 16L18 17L19 17L19 16L18 16L18 15ZM14 16L14 17L15 17L15 16ZM28 16L28 17L29 17L29 18L30 18L30 17L29 17L29 16ZM20 17L20 18L19 18L19 20L18 20L18 19L17 19L17 20L18 20L18 21L20 21L20 22L19 22L19 23L20 23L20 24L21 24L21 23L22 23L22 22L23 22L23 21L22 21L22 20L24 20L24 19L26 19L26 18L25 18L25 17L24 17L24 18L21 18L21 17ZM20 19L20 21L21 21L21 20L22 20L22 19ZM15 21L15 22L16 22L16 21ZM17 22L17 24L18 24L18 22ZM3 23L3 25L4 25L4 23ZM6 23L6 24L7 24L7 23ZM8 24L8 25L9 25L9 24ZM25 25L25 28L28 28L28 25ZM26 26L26 27L27 27L27 26ZM10 27L10 29L9 29L9 30L10 30L10 29L11 29L11 27ZM31 27L31 28L30 28L30 29L31 29L31 28L32 28L32 27ZM22 28L22 30L23 30L23 31L25 31L25 30L24 30L24 29L23 29L23 28ZM14 31L14 32L15 32L15 31ZM10 32L10 33L11 33L11 32ZM17 32L17 33L18 33L18 32ZM0 0L0 7L7 7L7 0ZM1 1L1 6L6 6L6 1ZM2 2L2 5L5 5L5 2ZM26 0L26 7L33 7L33 0ZM27 1L27 6L32 6L32 1ZM28 2L28 5L31 5L31 2ZM0 26L0 33L7 33L7 26ZM1 27L1 32L6 32L6 27ZM2 28L2 31L5 31L5 28Z"
                                                    fill="#000000"
                                                ></path>
                                            </g>
                                        </g>
                                    </svg>
                                </div>
                                <div class="pay-info text-center">
                                    <h5 class="title text-dark mb-0 clipboard-init" data-clipboard-text="0.01">0.01 BTC <em class="click-to-copy icon ni ni-copy-fill nk-tooltip" title="" data-original-title="Click to Copy"></em></h5>
                                    <p class="text-soft">0.1305 ETH</p>
                                </div>
                                <div class="form-group">
                                    <div class="form-label overline-title-alt lg text-center">Bitcoin Address</div>
                                    <div class="form-control-wrap">
                                        <div class="form-clip clipboard-init nk-tooltip" data-clipboard-target="#wallet-address" title="" data-original-title="Copy">
                                            <em class="click-to-copy icon ni ni-copy"></em>
                                        </div>
                                        <div class="form-icon"><em class="icon ni ni-sign-btc-alt"></em></div>
                                        <input readonly="" type="text" class="form-control form-control-lg" id="wallet-address" value="btctestqxy2kgdygjrsqtzq2n0yrf2493p83kkfjhx" />
                                    </div>
                                </div>

                                <div class="nk-pps-action">
                                    <a href="#crypto-paid" class="btn btn-block btn-primary popup-open"><span>Paid Bitcoin</span></a>
                                </div>
                                <div class="nk-pps-action pt-2 text-center">
                                    <a href="https://app.investorm.xyz/transactions" class="link link-btn link-primary">Pay Later</a>
                                </div>
                                <div id="crypto-paid" class="popup">
                                    <div class="popup-content">
                                        <h6 class="mb-2">Confirm your payment</h6>
                                        <p>If you already paid, please provide us your payment reference to speed up verification procces.</p>
                                        <form class="form" action="https://app.investorm.xyz/crypto-wallet/deposit/reference" method="POST" id="crypto-pay-reference">
                                            <div class="form-group">
                                                <div class="form-label">Payment Reference <span class="text-danger">*</span></div>
                                                <div class="form-control-wrap">
                                                    <input name="reference" type="text" class="form-control" value="" placeholder="Enter your reference id / hash" />
                                                </div>
                                            </div>
                                            <ul class="btn-group justify-between align-center gx-4">
                                                <li><button type="button" id="confirm-payment" class="btn btn-primary btn-block">Confirm Payment</button></li>
                                                <li><a href="#" class="link link-btn link-secondary popup-close">Close</a></li>
                                            </ul>
                                            <input type="hidden" name="tnx" value="TGl6U1Y4T2R2VnFCOUxORWp2SFBLUT09" />
                                            <input type="hidden" name="_token" value="PHfCelMdqxqwSOt6btwAgGrVrf6PJDrDk59iExyS" />
                                        </form>
                                        <div class="alert-note is-plain mt-4">
                                            <em class="icon ni ni-alert-circle"></em>
                                            <p>Account will credited once we confirm that payment has been received.</p>
                                        </div>
                                    </div>
                                    <div class="popup-overlay"></div>
                                </div>
                            </div>
                            <div class="card-inner bg-lighter">
                                <ul>
                                    <li class="alert-note is-plain text-danger">
                                        <em class="icon ni ni-alert-circle"></em>
                                        <p>Be aware of that this order will be cancelled, if you send any other BTC amount.</p>
                                    </li>

                                    <li class="alert-note is-plain">
                                        <em class="icon ni ni-info"></em>
                                        <p>Account will credited once we received your payment.</p>
                                    </li>
                                </ul>
                            </div>
                        </div>
                    </div>
                    <div class="nk-pps-action mt-n2">
                        <ul class="btn-group justify-between align-center gy-3">
                            <li><a href="{{secure_url('deposit/cancel'."/".$deposit->txn_id)}}" class="link link-danger">Cancel Order</a></li>
                            <li>
                                <a href="{{secure_url('dashboard')}}" class="link link-primary"><span>Back to Dashboard</span> <em class="icon ni ni-arrow-long-right"></em></a>
                            </li>
                        </ul>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

@endsection

@section('modals')


@endsection

@section('js')

@endsection