@extends('app')
@section('content')

    <style type="text/css">
        .box.box-solid.box-info > .box-header {
            color: #ffffff;
            background: #0a5077;
            background-color: #0a5077;
        }

        .box.box-solid.box-info {
            border: 1px solid #0a5077;
        }

        .box.box-solid.box-danger {
            border: 1px solid #0a5077;

        }
    </style>
    <!-- Content Header (Page header) -->
    <section class="content-header">
        <h1>
            Reports
            <small>Preview</small>
        </h1>
        <ol class="breadcrumb">
            <li><a href="#"><i class="fa fa-dashboard"></i> Home</a></li>
            <li><a href="#">Reports</a></li>
            <li class="active">Reports</li>
        </ol>
    </section>

    <!-- Main content -->
    <section class="content">
        <!-- SELECT2 EXAMPLE -->
        <div class="box box-default">
            <!-- /.box-header -->
            <div class="box-body">
                <div class="col-md-4">
                    <div class="box box-info box-solid ">
                        <div class="box-header with-border">
                            <h3 class="box-title">Details Reports</h3>
                            <div class="box-tools pull-right">
                                <button type="button" class="btn btn-box-tool" data-widget="collapse"><i
                                        class="fa fa-minus"></i>
                                </button>
                            </div>
                            <!-- /.box-tools -->
                        </div>
                        <!-- /.box-header -->
                        <div class="box-body" style="">

                            @can('diagnostic-test-report-view')
                                <div class="col-md-4 overlay-icons-body">
                                    <div class="box box-danger box-solid">
                                        <div class="box-body">
                                            <i class="fa fa-edit overlay-icons"></i>
                                            <br> <span> Diagnostic Test Report  </span>
                                        </div>
                                        <!-- /.box-body -->
                                        <!-- Loading (remove the following to stop the loading)-->
                                        <div class="overlay">
                                            <div class="buttons">
                                                @can('diagnostic-test-report-view')
                                                    <a class="btn btn-default"
                                                       href="{{route('reports.diagnostic-test-report')}}"
                                                       style=" margin-top: 35px;">
                                                        <i class="fa fa-search-plus"></i>
                                                        &nbsp;View
                                                    </a>
                                                @endcan
                                            </div>
                                        </div>
                                        <!-- end loading -->
                                    </div>
                                    <!-- /.box -->
                                </div>
                            @endcan
                        </div>
                        <!-- /.box-body -->
                    </div>
                </div>
            </div>
        </div>
    </section>

@endsection

@section('script')
    <script type="text/javascript">
        $(document).ready(function () {

        });
    </script>
@endsection