@extends('layouts.app')
@section('title', 'Nutrition Report')

@section('content')

<style>
    .report-container {
        margin: 20px;
        padding: 25px;
        background: #fff;
    }

    .header {
        text-align: center;
        margin-bottom: 20px;
    }

    .header h2 {
        margin-bottom: 8px;
        font-size: 22px;
    }

    .meta {
        text-align: center;
        font-size: 13px;
        color: #374151;
        margin-bottom: 20px;
        line-height: 1.6;
    }

    .btn-area {
        margin-bottom: 15px;
        text-align: right;
    }

    .btn {
        padding: 8px 14px;
        border-radius: 5px;
        border: none;
        cursor: pointer;
        font-size: 13px;
    }

    .btn-back {
        background: #6b7280;
        color: #fff;
        text-decoration: none;
        display: inline-block;
    }

    .btn-print {
        background: #16a34a;
        color: #fff;
        margin-left: 5px;
    }

    table {
        width: 100%;
        border-collapse: collapse;
        table-layout: fixed;
        font-size: 12px;
    }

    th, td {
        border: 1px solid #e5e7eb;
        padding: 6px;
        text-align: left;
        word-wrap: break-word;
    }

    th {
        background: #f3f4f6;
        font-size: 11px;
        text-transform: uppercase;
    }

    tbody tr:nth-child(even) {
        background: #f9fafb;
    }

    /* Column sizing */
    .col-sl { width: 4%; }
    .col-day { width: 8%; }
    .col-date { width: 10%; }
    .col-meal { width: 10%; }
    .col-remarks { width: 14%; }

    /* PRINT STYLE FOR A4 */
    @media print {

        @page {
            size: A4 portrait;
            margin: 10mm;
        }

        body {
            -webkit-print-color-adjust: exact;
            print-color-adjust: exact;
        }

        .btn-area {
            display: none !important;
        }

        .report-container {
            margin: 0;
            padding: 0;
        }

        table {
            font-size: 10px;
        }

        th, td {
            padding: 4px;
        }

        .header h2 {
            font-size: 16px;
        }

        .meta {
            font-size: 11px;
        }

        body {
            transform: scale(0.98);
            transform-origin: top left;
        }
    }
</style>

<div class="report-container">

    {{-- HEADER --}}
    <div class="header">
        <h2>Nutrition Report</h2>
    </div>

    {{-- META INFO --}}
    <div class="meta">
        @if($member)
            <div><strong>Name:</strong> {{ $member->name }}</div>
            <div><strong>Member ID:</strong> {{ $member->contact_id }}</div>
        @else
            <div><strong>Member:</strong> All Members</div>
        @endif

        @if($request->from_date && $request->to_date)
            <div>
                <strong>Period:</strong>
                {{ $request->from_date }} to {{ $request->to_date }}
            </div>
        @endif
    </div>

    {{-- BUTTONS --}}
    <div class="btn-area no-print">
        <a href="{{ route('nutrition.index') }}" class="btn btn-back">Back</a>
        <button onclick="window.print()" class="btn btn-print">Print</button>
    </div>

    {{-- TABLE --}}
    @if($records->isEmpty())
        <p style="text-align:center;">No nutrition records found.</p>
    @else

    <table>
        <thead>
            <tr>
                <th class="col-sl">SL</th>
                <th class="col-day">Day</th>
                <th class="col-date">From</th>
                <th class="col-date">To</th>
                <th class="col-meal">Breakfast</th>
                <th class="col-meal">Mid Snack</th>
                <th class="col-meal">Lunch</th>
                <th class="col-meal">Afternoon</th>
                <th class="col-meal">Dinner</th>
                <th class="col-remarks">Remarks</th>
            </tr>
        </thead>

        <tbody>
            @foreach($records as $record)
                <tr>
                    <td class="col-sl">{{ $loop->iteration }}</td>
                    <td class="col-day">{{ $record->day }}</td>
                    <td class="col-date">
                        {{ \Carbon\Carbon::parse($record->from_date)->format('d-m-Y') }}
                    </td>
                    <td class="col-date">
                        {{ \Carbon\Carbon::parse($record->to_date)->format('d-m-Y') }}
                    </td>
                    <td class="col-meal">{{ $record->breakfast }}</td>
                    <td class="col-meal">{{ $record->mid_morning_snacks }}</td>
                    <td class="col-meal">{{ $record->lunch }}</td>
                    <td class="col-meal">{{ $record->afternoon_snacks }}</td>
                    <td class="col-meal">{{ $record->dinner }}</td>
                    <td class="col-remarks">{{ $record->remarks }}</td>
                </tr>
            @endforeach
        </tbody>
    </table>

    @endif

</div>

@endsection