@extends('layout.app')
@section('content')
    @push('styles')
        <!--datatable css-->
        <link rel="stylesheet" href="https://cdn.datatables.net/1.11.5/css/dataTables.bootstrap5.min.css" />
        <!--datatable responsive css-->
        <link rel="stylesheet" href="https://cdn.datatables.net/responsive/2.2.9/css/responsive.bootstrap.min.css" />
        <link rel="stylesheet" href="https://cdn.datatables.net/buttons/2.2.2/css/buttons.dataTables.min.css">
    @endpush
    <div class="page-content">
        <div class="container-fluid">
            <div class="row">
                <div class="col-lg-12">
                    <x-order.show.nav :order="$order" />
                </div>
            </div>
            <div class="row">
                <div class="col-lg-12">
                    <div class="tab-content text-muted">

                        <div class="tab-pane fade active show" id="project-overview" role="tabpanel">
                            <x-order.show.overview :order="$order" />
                        </div>
                        <div class="tab-pane fade" id="order-products" role="tabpanel">
                            <x-order.show.products :order="$order" />
                        </div>
                        <div class="tab-pane fade" id="order-accounts" role="tabpanel">
                            <x-order.show.account :order="$order" />
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>


    @push('scripts')
        <!--datatable js-->
        <script src="https://cdn.datatables.net/1.11.5/js/jquery.dataTables.min.js"></script>
        <script src="https://cdn.datatables.net/1.11.5/js/dataTables.bootstrap5.min.js"></script>
        <script src="https://cdn.datatables.net/responsive/2.2.9/js/dataTables.responsive.min.js"></script>

        <script src="https://cdn.lordicon.com/lordicon.js"></script>
    @endpush
@endsection