<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>EPF Report</title>
    <style>
        @page {
            margin: 20px 20px 60px 20px;
            size: A4 portrait;
        }

        body {
            font-family: DejaVu Sans, sans-serif;
            font-size: 10px;
            margin: 0;
            color: #000;
        }

        /* ── FOOTER ── */
        .footer {
            position: fixed;
            bottom: -45px;
            left: 0;
            right: 0;
            height: 40px;
            font-size: 9px;
            border-top: 1px solid #ccc;
            padding-top: 4px;
        }
        .footer-left   { float: left;  width: 33%; }
        .footer-center { float: left;  width: 34%; text-align: center; }
        .footer-right  { float: right; width: 33%; text-align: right; }
        .page-number:before { content: "Page " counter(page) " / " counter(pages); }

        /* ── HEADER ── */
        .report-title {
            text-align: center;
            margin-bottom: 4px;
        }
        .report-title h2 {
            font-size: 14px;
            font-weight: bold;
            margin: 0 0 2px 0;
        }
        .report-title h3 {
            font-size: 12px;
            font-weight: bold;
            margin: 0 0 2px 0;
        }
        .report-title p {
            font-size: 10px;
            margin: 1px 0;
        }

        /* ── FORM NUMBER C box ── */
        .form-label {
            font-weight: bold;
            margin: 8px 0 4px 0;
            font-size: 10px;
        }

        .info-table {
            width: 100%;
            border-collapse: collapse;
            margin-bottom: 10px;
            font-size: 9px;
        }
        .info-table td {
            border: 1px solid #000;
            padding: 4px 6px;
            height: 16px;
        }
        .info-table td.label {
            width: 22%;
            background: #fff;
        }
        .info-table td.value {
            width: 12%;
        }
        .info-table td.right-label {
            width: 18%;
        }
        .info-table td.right-value {
            width: 15%;
        }

        /* ── MAIN TABLE ── */
        table.main {
            width: 100%;
            border-collapse: collapse;
            font-size: 9px;
        }
        table.main th, table.main td {
            border: 1px solid #000;
            padding: 3px 4px;
        }
        table.main th {
            background: #f5f5f5;
            font-weight: bold;
            text-align: center;
        }
        table.main td.num {
            text-align: right;
        }
        table.main td.center {
            text-align: center;
        }

        .clearfix::after { content: ""; display: table; clear: both; }
    </style>
</head>
<body>

<!-- FOOTER -->
<div class="footer">
    <div class="footer-left">LaraOffice</div>
    <div class="footer-center"><span class="page-number"></span></div>
    <div class="footer-right">Printed: {{ now()->format('Y-m-d H:i') }}</div>
</div>

@php
    $totalEmployees = count($employees);
    $grandEpfTotal    = array_sum(array_column($employees, 'epf_total'));
    $grandEpf8        = array_sum(array_column($employees, 'epf_employee'));
    $grandEpf12       = array_sum(array_column($employees, 'epf_employer'));
    $grandEarnings    = array_sum(array_column($employees, 'total_earnings'));
@endphp

<!-- REPORT HEADER -->
<div class="report-title">
    <h2>EPF Report - {{ $period_label }}</h2>
    <h3>{{ $company->display_name ?? $company->legal_name ?? '' }}</h3>
    <p>{{ trim(($company->address_line1 ?? '') . ' ' . ($company->address_line2 ?? '')) }}</p>
</div>

<!-- FORM NUMBER C -->
<div class="form-label">FORM NUMBER C</div>

<table class="info-table">
    <tr>
        <td class="label">E.P.F. Registration Number</td>
        <td class="value">{{ $company->epf_reg_no ?? '' }}</td>
        <td class="right-label">Cheque Issued Date</td>
        <td class="right-value"></td>
    </tr>
    <tr>
        <td class="label">Contribution For the Month of</td>
        <td class="value"></td>
        <td class="right-label">Cheque Number</td>
        <td class="right-value"></td>
    </tr>
    <tr>
        <td class="label">Contribution</td>
        <td class="value"></td>
        <td class="right-label">Branch Name</td>
        <td class="right-value"></td>
    </tr>
    <tr>
        <td class="label">Surcharge</td>
        <td class="value"></td>
        <td class="right-label">Bank Name</td>
        <td class="right-value"></td>
    </tr>
    <tr>
        <td class="label">Total Remittance</td>
        <td class="value"></td>
        <td class="right-label">No Of Employees</td>
        <td class="right-value"><strong>{{ $totalEmployees }}</strong></td>
    </tr>
</table>

<!-- MAIN EMPLOYEE TABLE -->
<table class="main">
    <thead>
        <tr>
            <th rowspan="2" style="width:22%;">Employee Name</th>
            <th rowspan="2" style="width:14%;">ID Card No</th>
            <th rowspan="2" style="width:10%;">Member<br>No</th>
            <th colspan="3" style="width:36%;">Contribution RS</th>
            <th rowspan="2" style="width:14%;">Total Earnings</th>
        </tr>
        <tr>
            <th style="width:12%;">Total</th>
            <th style="width:12%;">Emploee(8%)</th>
            <th style="width:12%;">Employer(12%)</th>
        </tr>
    </thead>
    <tbody>
        @foreach($employees as $emp)
        <tr>
            <td>{{ $emp['employee_name'] }}</td>
            <td class="center">{{ $emp['nic'] }}</td>
            <td class="center">{{ $emp['epf_no'] }}</td>
            <td class="num">{{ number_format($emp['epf_total'], 2) }}</td>
            <td class="num">{{ number_format($emp['epf_employee'], 2) }}</td>
            <td class="num">{{ number_format($emp['epf_employer'], 2) }}</td>
            <td class="num">{{ number_format($emp['total_earnings'], 2) }}</td>
        </tr>
        @endforeach
    </tbody>
    <tfoot>
        <tr>
            <td colspan="3" style="text-align:right; font-weight:bold;">Total</td>
            <td class="num"><strong>{{ number_format($grandEpfTotal, 2) }}</strong></td>
            <td class="num"><strong>{{ number_format($grandEpf8, 2) }}</strong></td>
            <td class="num"><strong>{{ number_format($grandEpf12, 2) }}</strong></td>
            <td class="num"><strong>{{ number_format($grandEarnings, 2) }}</strong></td>
        </tr>
    </tfoot>
</table>

@if(count($employees) === 0)
<div style="text-align:center; padding:40px; color:#999;">
    No EPF records found for the selected filters.
</div>
@endif

</body>
</html>
