@extends('Admin.layouts.app')
@section('content')
<div class="col-lg-12 col-md-12 mb-4">
    <div class="card">
        <div class="card-body p-3">
            <table class="table table-bordered">
                <tbody>
                    @foreach($chartList->chunk(10) as $chunkIndex => $recordChunk)
                        @php
                            $firstRecord = $recordChunk->first();
                            $bgColor = '';
                            if ($firstRecord->type == 1) {
                                $bgColor = 'background-color: #ffdddd;'; // Light Red for Type 1
                            } elseif ($firstRecord->type == 2) {
                                $bgColor = 'background-color: #ddffdd;'; // Light Green for Type 2
                            } elseif ($firstRecord->type == 3) {
                                $bgColor = 'background-color: #ddddff;'; // Light Blue for Type 3
                            } elseif ($firstRecord->type == 4) {
                                $bgColor = 'background-color: #e1b0e9;'; // Light Blue for Type 3
                            }
                        @endphp
                        <tr style="{{ $bgColor }}"> 
                            @foreach($recordChunk as $record)                       
                                <th width="2.5%">{{ $record->number }}</th>
                                <td width="7%">{{ $record->money }}</td>
                            @endforeach
                        </tr>

                    @endforeach              
                </tbody>
            </table>            
        </div>
    </div>
</div>
<style>
    .table th, .table td{
        padding: 0px;
        vertical-align: top;
    }
    .table td, .table th{
        border-color: #a2a2a2 !important;
    }
</style>
@endsection