@php
$background_color=$company_details->theme_color;
@endphp
<style>
.text-color{
color: !important;
}
.bg-color{
    background-color:  !important;
}
.border-bottom{
    border-bottom: 1px solid  !important;
}

#invoice{
    padding: 30px;
}

.invoice {
    position: relative;
    background-color: #FFF;
    min-height: 680px;
    padding: 15px
}

.invoice header {
    padding: 10px 0;
    margin-bottom: 20px;
    border-bottom: 1px solid #3989c6
}

.invoice .company-details {
    text-align: right
}

.invoice .company-details .name {
    margin-top: 0;
    margin-bottom: 0
}

.invoice .contacts {
    margin-bottom: 20px
}

.invoice .invoice-to {
    text-align: left
}

.invoice .invoice-to .to {
    margin-top: 0;
    margin-bottom: 0
}

.invoice .invoice-details {
    text-align: right
}

.invoice .invoice-details .invoice-id {
    margin-top: 0;
    color: #3989c6
}

.invoice main {
    padding-bottom: 50px
}

.invoice main .thanks {
    margin-top: -100px;
    font-size: 2em;
    margin-bottom: 50px
}

.invoice main .notices {
    padding-left: 6px;
    border-left: 6px solid #3989c6
}

.invoice main .notices .notice {
    font-size: 1.2em
}

.invoice table {
    width: 100%;
    border-collapse: collapse;
    border-spacing: 0;
    margin-bottom: 20px
}

.invoice table td,.invoice table th {
    padding: 15px;
    background: #eee;
    border-bottom: 1px solid #fff
}

.invoice table th {
    white-space: nowrap;
    font-weight: 400;
    font-size: 16px
}

.invoice table td h3 {
    margin: 0;
    font-weight: 400;
    color: #3989c6;
    font-size: 1.2em
}

.invoice table .qty,.invoice table .total,.invoice table .unit {
    text-align: right;
    font-size: 1.2em
}

.invoice table .no {
    color: #fff;
    font-size: 1.6em;
    background: #3989c6
}

.invoice table .unit {
    background: #ddd
}

.invoice table .total {
    background: #3989c6;
    color: #fff
}

.invoice table tbody tr:last-child td {
    border: none
}

.invoice table tfoot td {
    background: 0 0;
    border-bottom: none;
    white-space: nowrap;
    text-align: right;
    padding: 10px 20px;
    font-size: 1.2em;
    border-top: 1px solid #aaa
}

.invoice table tfoot tr:first-child td {
    border-top: none
}

.invoice table tfoot tr:last-child td {
    color: #3989c6;
    font-size: 1.4em;
    border-top: 1px solid #3989c6
}

.invoice table tfoot tr td:first-child {
    border: none
}

.invoice footer {
    width: 100%;
    text-align: center;
    color: #777;
    border-top: 1px solid #aaa;
    padding: 8px 0
}

@media print {
    .invoice {
        font-size: 11px!important;
        overflow: hidden!important
    }

    .invoice footer {
        position: absolute;
        bottom: 10px;
        page-break-after: always
    }

    .invoice>div:last-child {
        page-break-before: always
    }
}
</style>
<div id="invoice">


    <div class="invoice overflow-auto">
        <div style="min-width: 600px">
            <header class="border-bottom">
                <div class="row">

                    @if ($company_details)
                    <div class="col company-details text-color">
                            <div style="float:left">
                            <a target="_blank" href="#">
                            <img  style="width: 200px;height:80px"  src="uploads/layouts/{{$company_details->admin_logo}}" data-holder-rendered="true" />
                            </a>
                            </div>

                        <h2 class="name" class="invoice-id  text-color text-primary">
                            @if ($company_details->branch_name)
                            {{$company_details->branch_name}}
                            @endif
                        </h2>
                        @if ($company_details->branch_address)
                        <div class="invoice-id  text-color text-primary">{{$company_details->branch_address}}</div>
                        @endif
                        @if ($company_details->branch_mob)
                        <div class="invoice-id  text-color text-primary">+974 {{$company_details->branch_mob}}</div>
                        @endif
                        @if ($company_details->branch_email)
                        <div class="invoice-id  text-color text-primary">{{$company_details->branch_email}}</div>
                        @endif
                    </div>
                      @endif
                </div>
            </header>
            <main>
                <div class="row contacts">
         
                    <div class="col invoice-details ">
                        <h1 style="text-align: center" class="invoice-id  text-color text-primary">{{$report_heading}}</h1>
                        @if (session('from_date'))
                        @if (session('to_date') && session('from_date') )
                        <div class="date">From : {{session('from_date')}}</div>
                        <div class="date">To : {{session('to_date')}}</div>
                         @else
                         <div class="date">Date : {{session('from_date')}}</div>                       
                        @endif
                        @endif
                        <div class="date">Created By : {{Auth::user()->name}}</div>
                        <div class="date">Created Date : {{date('Y-m-d')}}</div>
                    </div>
                </div>
                <table border="0" style="text-align: center" cellspacing="0" cellpadding="0">
                    <thead>
                        <tr class="text-center">
                            <th>#</th>
                            <th class="text-left">Date</th>
                            <th class="text-right">Total Reviews</th>
                            @if(session('rating_exist'))  
                            <th class="text-right">AVG Rating</th>
                            @endif
                        </tr>
                    </thead>
                    <tbody>
                        @php
                            $i=1;
                        $total_count=$total_average_count=0;
                        @endphp
                        @foreach ($report_data as $data)
                        @php
                            $average_count=$data['total_rating']/$data['total_form_count'];
                            $total_count=$total_count+$data['total_form_count'];
                            $total_average_count=$total_average_count+$average_count;
                        @endphp
                        <tr class="">
                            <td class="no bg-color text-center">{{$i}}</td>
                            <td class="text-center">{{$data['form_date']}}</td>
                            <td class=" text-center">{{$data['total_form_count']}}</td>
                             @if(session('rating_exist'))  
                            <td class="Total text-center">
                                
                                @if($average_count<2)
                                <img style="width: 20px;height: 20px;" src="assets/images/brand/star.png">
                                @elseif($average_count<3)
                                <img style="width: 20px;height: 20px;" src="assets/images/brand/star.png">
                                <img style="width: 20px;height: 20px;" src="assets/images/brand/star.png">
                                @elseif($average_count<4)
                                <img style="width: 20px;height: 20px;" src="assets/images/brand/star.png">
                                <img style="width: 20px;height: 20px;" src="assets/images/brand/star.png">
                                <img style="width: 20px;height: 20px;" src="assets/images/brand/star.png">
                                @elseif($average_count<5)
                                <img style="width: 20px;height: 20px;" src="assets/images/brand/star.png">
                                <img style="width: 20px;height: 20px;" src="assets/images/brand/star.png">
                                <img style="width: 20px;height: 20px;" src="assets/images/brand/star.png">
                                <img style="width: 20px;height: 20px;" src="assets/images/brand/star.png">
                                @elseif($average_count==5)
                                <img style="width: 20px;height: 20px;" src="assets/images/brand/star.png">
                                <img style="width: 20px;height: 20px;" src="assets/images/brand/star.png">
                                <img style="width: 20px;height: 20px;" src="assets/images/brand/star.png">
                                <img style="width: 20px;height: 20px;" src="assets/images/brand/star.png">
                                <img style="width: 20px;height: 20px;" src="assets/images/brand/star.png">
                                @else
                                    
                                @endif

                       

                            </td>
                            @endif
                        </tr>
                        @php
                            $i++
                        @endphp
                         @endforeach
                         @php
                            if(count($report_data)!=0){
                         $total_average_count_rating=round($total_average_count/count($report_data));
                         }
                         else{
                         $total_average_count_rating=0;
                         }
                         @endphp
                         <tr class="">
                            <td colspan="2" class="no bg-color text-right">Total</td>
                            <td class="text-center">{{$total_count}}</td>
                             @if(session('rating_exist'))  
                            <td class=" text-center">
                                 @if($total_average_count_rating < 2)
                                <img style="width: 20px;height: 20px;" src="assets/images/brand/star.png">
                                @elseif($total_average_count_rating < 3)
                                <img style="width: 20px;height: 20px;" src="assets/images/brand/star.png">
                                <img style="width: 20px;height: 20px;" src="assets/images/brand/star.png">
                                @elseif($total_average_count_rating < 4)
                                <img style="width: 20px;height: 20px;" src="assets/images/brand/star.png">
                                <img style="width: 20px;height: 20px;" src="assets/images/brand/star.png">
                                <img style="width: 20px;height: 20px;" src="assets/images/brand/star.png">
                                @elseif($total_average_count_rating < 5)
                                <img style="width: 20px;height: 20px;" src="assets/images/brand/star.png">
                                <img style="width: 20px;height: 20px;" src="assets/images/brand/star.png">
                                <img style="width: 20px;height: 20px;" src="assets/images/brand/star.png">
                                <img style="width: 20px;height: 20px;" src="assets/images/brand/star.png">
                                @elseif($average_count==5)
                                <img style="width: 20px;height: 20px;" src="assets/images/brand/star.png">
                                <img style="width: 20px;height: 20px;" src="assets/images/brand/star.png">
                                <img style="width: 20px;height: 20px;" src="assets/images/brand/star.png">
                                <img style="width: 20px;height: 20px;" src="assets/images/brand/star.png">
                                <img style="width: 20px;height: 20px;" src="assets/images/brand/star.png">
                                @else
                                    
                                @endif

                            </td>
                            @endif
                         <tr>
                    </tbody>
                    
                </table>
               
            </main>
            <footer>
               Report  was created on a computer and is valid without the signature and seal.
            </footer>
        </div>
        <!--DO NOT DELETE THIS div. IT is responsible for showing footer always at the bottom-->
        <div></div>
    </div>
</div>