@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">
                            <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.service_provider.image_url || record.user_placeholder}}">
                    <p class="lead font-500 margin-b-0">{{ record.service_provider.name }}</p>
                    <p class="text-muted">Service Provider</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.service_provider.name }}</span>
                        </li>
                        <li class="col-4">
                            <p class="text-muted text-sm margin-b-0">Email</p>
                            <span class="font-600">{{ record.service_provider.email }}</span>
                        </li>
                        <li class="col-4">
                            <p class="text-muted text-sm margin-b-0">Phone no</p>
                            <span class="font-600">{{ record.service_provider.mobile_no }}</span>
                        </li>
                    </ul>
                </div>
            </div>
        </div>
        <div class="col-sm-12">
            <div class="widget white-bg">
                
                            <ul class="list-unstyled margin-b-0 text-center row">
                                <li class="col-4">
                                    <p class="text-muted text-sm margin-b-0">Profession</p>
                                    <span class="font-600">{{ record.profession.title }}</span>
                                </li>
                                @if(record.event_type)
                                <li class="col-4">
                                    <p class="text-muted text-sm margin-b-0">Title</p>
                                    <span class="font-600">{{ record.event_type }}</span>
                                </li>
                                @endif
                                @if(record.no_of_people)
                                <li class="col-4">
                                    <p class="text-muted text-sm margin-b-0">No of People</p>
                                    <span class="font-600">{{ record.no_of_people }}</span>
                                </li>
                                @endif
                                @if(record.additional_information)
                                <li class="col-4">
                                    <p class="text-muted text-sm margin-b-0">Additional Info</p>
                                    <span class="font-600">{{ record.additional_information }}</span>
                                </li>
                                @endif
                                @if(record.meal_type)
                                <li class="col-4">
                                    <p class="text-muted text-sm margin-b-0">Meal Type</p>
                                    <span class="font-600">{{ record.meal_type }}</span>
                                </li>
                                @endif
                                @if(record.meal_time)
                                <li class="col-4">
                                    <p class="text-muted text-sm margin-b-0">Meal Time</p>
                                    <span class="font-600">{{ record.meal_time }}</span>
                                </li>
                                @endif
                                @if(record.others)
                                <li class="col-4">
                                    <p class="text-muted text-sm margin-b-0">Others</p>
                                    <span class="font-600">{{ record.others }}</span>
                                </li>
                                @endif
                                @if(record.booking_venue)
                                <li class="col-4">
                                    <p class="text-muted text-sm margin-b-0">Venue</p>
                                    <span class="font-600">{{ record.booking_venue }}</span>
                                </li>
                                @endif
                                @if(record.estimated_minutes)
                                <li class="col-4">
                                    <p class="text-muted text-sm margin-b-0">Minutes</p>
                                    <span class="font-600">{{ record.estimated_minutes }}</span>
                                </li>
                                @endif
                                @if(record.estimated_distance)
                                <li class="col-4">
                                    <p class="text-muted text-sm margin-b-0">Distance</p>
                                    <span class="font-600">{{ record.estimated_distance }}</span>
                                </li>
                                @endif
                                @if(record.over_time)
                                <li class="col-4">
                                    <p class="text-muted text-sm margin-b-0">Over Time</p>
                                    <span class="font-600">{{ record.over_time }}</span>
                                </li>
                                @endif
                                @if(record.start_time)
                                <li class="col-4">
                                    <p class="text-muted text-sm margin-b-0">Start Time</p>
                                    <span class="font-600">{{ record.start_time }}</span>
                                </li>
                                @endif
                                @if(record.end_time)
                                <li class="col-4">
                                    <p class="text-muted text-sm margin-b-0">End Time</p>
                                    <span class="font-600">{{ record.end_time }}</span>
                                </li>
                                @endif
                                <li class="col-4">
                                    <p class="text-muted text-sm margin-b-0">Address</p>
                                    <span class="font-600">{{ record.address }}</span>
                                </li>
                            </ul>
            </div>
        </div>
        <div class="col-sm-12">
            <div class="widget white-bg">
                            <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">Total Fare = </p> 
                                        <span class="font-600">${{ record.total_cost_usd }} </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.stripe_fee_usd }} </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">App Fee = </p>
                                    <span class="font-600">${{ record.app_fee_amount_usd }} </span>
                                    </div>
                                </li>
                                <li class="col-4">
                                    <div class="row">
                                    <p class="text-muted text-sm margin-b-0">Admin Share = </p>
                                    <span class="font-600">${{ record.admin_share_amount_usd }} </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">Admin Share + App Fee - Stripe Fee= </p>
                                    <span class="font-600">${{ ((record.admin_share_amount_usd + record.app_fee_amount_usd) - record.stripe_fee_usd).toFixed(2)}} </span>
                                    <div>
                                </li>
                                <li class="col-4">
                                    <div class="row">
                                    <p class="text-muted text-sm margin-b-0">Vendor Share = </p>
                                    <span class="font-600">${{ record.vendor_share_amount_usd }} </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">Vendor Share - App Fee = </p>
                                    <span class="font-600">${{ record.vendor_share_amount_usd - record.app_fee_amount_usd }} </span> 
                                    {{--  <span style="font-size: 0.8em;">{{ record.vendor_share_percentage }}%</span>  --}}
                                    <div>
                                </li>
                            </ul>
            </div>
        </div>
    </div>
    @include('admin.footer')
  </section>
@endsection