@layout('admin/master')
@section('content')
  <section class="main-content">
    <div class="row">
        <div class="col-sm-6">
            <div class="widget white-bg">
                <div class="padding-20 text-center">
                 <img alt="Profile Picture" height="140" width="140" class="rounded-circle mar-btm margin-b-10 circle-border " src="{{ record.user.image_url  }}">
                    <p class="lead font-500 margin-b-0">{{ record.user.name }}</p>
                    <p class="text-muted">User</p>
                    <hr>
                    <ul class="list-unstyled margin-b-0 text-center row">
                        <li class="col-4">
                            <p class="text-muted text-sm margin-b-0">Name</p>
                            <span class="font-600">{{ record.user.name }}</span>
                        </li>
                        <li class="col-4" style="word-break: break-all;">
                            <p class="text-muted text-sm margin-b-0">Email</p>
                            <span class="font-600">{{ record.user.email }}</span>
                        </li>
                        <li class="col-4">
                            <p class="text-muted text-sm margin-b-0">Phone no</p>
                            <span class="font-600">{{ record.user.mobile_no }}</span>
                        </li>
                    </ul>
                </div>
            </div>
        </div>
        <div class="col-sm-6">
            <div class="widget white-bg">
                <div class="padding-20 text-center">
                 <img alt="Profile Picture" height="140" width="140" class="rounded-circle mar-btm margin-b-10 circle-border " src="{{ record.owner.image_url}}">
                    <p class="lead font-500 margin-b-0">{{ record.owner.name }}</p>
                    <p class="text-muted">Owner</p>
                    <hr>
                    <ul class="list-unstyled margin-b-0 text-center row">
                        <li class="col-4">
                            <p class="text-muted text-sm margin-b-0">Name</p>
                            <span class="font-600">{{ record.owner.name }}</span>
                        </li>
                        <li class="col-4" style="word-break: break-all;">
                            <p class="text-muted text-sm margin-b-0">Email</p>
                            <span class="font-600">{{ record.owner.email }}</span>
                        </li>
                        <li class="col-4">
                            <p class="text-muted text-sm margin-b-0">Phone no</p>
                            <span class="font-600">{{ record.owner.mobile_no }}</span>
                        </li>
                    </ul>
                </div>
            </div>
        </div>
        <div class="col-sm-12">
          <div class="widget white-bg">
            <h2 class="box-title">User Bank Detail</h2>
            <div class="col-md-4 col-md-offset-2">
                <table class="table table-striped text-left">
                    <tbody>
                        <tr>
                            <td><strong>Account Holder Name</strong></td>
                            <td>{{ record.user.bank.account_holder_name || '-' }}</td>
                        </tr>
                        <tr>
                            <td><strong>Account Number</strong></td>
                            <td>{{ record.user.bank.account_number || '-' }}</td>
                        </tr>
                        <tr>
                            <td><strong>Routing Number</strong></td>
                            <td>{{ record.user.bank.routing_number || '-' }}</td>
                        </tr>
                    </tbody>
                </table>
            </div>
          </div>
        </div>
        <div class="col-sm-12">
            <div class="widget white-bg">
            <h2 class="box-title">Charges Breakdown</h2>

                            <ul class="list-unstyled margin-b-0 text-center col">
                                <li class="col-4">
                                    <div class="row">
                                        <p class="text-muted text-sm margin-b-0">Booking Charges = </p> 
                                        <span class="font-600">${{ record.booking_summary.total_charges.booking_total }} </span>
                                    </div>
                                </li>
                                <li class="col-4">
                                    <div class="row">
                                    <p class="text-muted text-sm margin-b-0">Stripe Fee = </p>
                                    <span class="font-600">${{ record.booking_summary.total_charges.stripe_fee }} </span>
                                    {{--  <span style="font-size: 0.8em;">2.9% + 30 cents</span>  --}}
                                    </div>
                                </li>
                                <li class="col-4">
                                    <div class="row">
                                    <p class="text-muted text-sm margin-b-0">Admin Commission = </p>
                                    <span class="font-600">${{ record.booking_summary.total_charges.admin_fee }} </span>
                                     {{--  <span style="font-size: 0.8em;">{{ record.admin_share_percentage }}%</span>  --}}
                                    <div>
                                </li>
                                <li class="col-4">
                                    <div class="row">
                                    <p class="text-muted text-sm margin-b-0">Owner Commission = </p>
                                    <span class="font-600">${{ record.booking_summary.total_charges.owner_charges }} </span> 
                                    {{--  <span style="font-size: 0.8em;">{{ record.vendor_share_percentage }}%</span>  --}}
                                    <div>
                                </li>
                                <li class="col-4">
                                    <div class="row">

                                    <p class="text-muted text-sm margin-b-0">Total = </p>
                                    <span class="font-600">${{ record.booking_summary.total_charges.total_charges }} </span> 
                                    {{--  <span style="font-size: 0.8em;">{{ record.vendor_share_percentage }}%</span>  --}}
                                    <div>
                                </li>
                            </ul>
            </div>
        </div>
    </div>
    @include('admin.footer')
  </section>
@endsection
