@if(isset($order))
    <div role="dialog" class="modal fade" style="display: none;">
        <style>
            .well.nopad {
                padding: 0px;
            }

            .voyager .table>thead>tr>th {
                background: #404675;
                border-color: #404675;
                color: #fff;
            }
        </style>

        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header text-center">
                    <button type="button" class="close" data-dismiss="modal">&times;</button>
                    <h3 class="modal-title">
                        <i class="ico-cart"></i>
                        {{ __("voyager::generic.manage_order_title", ["order_ref"=>$order->id]) }}
                    </h3>
                </div>
                <div class="modal-body">

                    <h3>{{ __("voyager::generic.order_overview") }}</h3>
                    <style>
                        .order_overview b {
                            text-transform: uppercase;
                        }

                        .order_overview .col-sm-4 {
                            margin-bottom: 10px;
                        }
                    </style>
                    <div class="p0 well bgcolor-white order_overview">
                        <div class="row">
                            <div class="col-sm-6 col-xs-6">
                                <b>{{ __('voyager::seeders.data_rows.customer') }}</b><br> {{$order->customer?->name}}
                            </div>

                            <div class="col-sm-6 col-xs-6">
                                <b>{{ __('voyager::seeders.data_rows.total_price') }}</b><br>
                                {{ $order->total_price }}
                            </div>

                            <div class="col-sm-6 col-xs-6">
                                <b>{{ __("voyager::generic.order_ref") }}</b><br> {{$order->external_order_id}}
                            </div>
                            <div class="col-sm-6 col-xs-6">
                                <b>{{ __('voyager::seeders.data_rows.created_at') }}</b><br> {{$order->created_at}}
                            </div>
                            <div class="col-sm-6 col-xs-6">
                                <b>{{ __('voyager::seeders.data_rows.email') }}</b><br> {{$order->customer?->email}}
                            </div>
                            <div class="col-sm-6 col-xs-6">
                                <b>{{ __('voyager::seeders.data_rows.store') }}</b><br> {{$order->store?->store_name}}
                            </div>


                        </div>
                    </div>

                    <h3>{{ __('voyager::generic.order_items') }}</h3>
                    <div class="well nopad bgcolor-white p0">
                        <div class="table-responsive">
                            <table class="table table-hover">
                                <thead>
                                <th>{{ __('voyager::seeders.data_rows.product_name') }}</th>
                                <th>{{ __('voyager::seeders.data_rows.quantity') }}</th>
                                <th>{{ __('voyager::seeders.data_rows.price') }}</th>
                                <th>{{ __('voyager::seeders.data_rows.product_category') }}</th>
                                <th>{{ __('voyager::seeders.data_rows.total') }}</th>
                                </thead>
                                <tbody>
                                @foreach($order->items as $order_item)
                                    <tr>
                                        <td>{{$order_item->product_name}}</td>
                                        <td>{{$order_item->quantity}}</td>
                                        <td>{{$order_item->price}}</td>
                                        <td>{{$order_item->product_category}}</td>
                                    </tr>
                                @endforeach
                                <tr>
                                    <td colspan="3"></td>
                                    <td><b>{{ __("voyager::generic.sub_total") }}</b></td>
                                    <td colspan="2">{{money($order->total_price)}}</td>
                                </tr>

                                <tr>
                                    <td colspan="3"></td>
                                    <td><strong>{{ __('voyager::seeders.data_rows.total_price') }}</strong></td>
                                    <td colspan="2">{{ $order->total_price }}</td>
                                </tr>
                                </tbody>
                            </table>

                        </div>
                    </div>

                </div> <!-- /end modal body-->

                <div class="modal-footer close">
                    <button type="button" class="btn btn-tumblr btn-sm pull-right" data-dismiss="modal">{{ __('voyager::generic.cancel') }}</button>
                </div>
            </div><!-- /end modal content-->
        </div>
    </div>
@endif