@extends('layouts.print')

@section('title', 'Shift Report — ' . $shift->typeLabel() . ' · ' . $shift->started_at->format('M j, Y'))

@section('content')
@php
    $variance = $summary['variance'];
    $propName    = $settings['property_name']    ?? config('app.name', 'Parkview Hotel');
    $propAddress = $settings['property_address'] ?? '';
    $propCity    = $settings['property_city']    ?? '';
    $propPhone   = $settings['property_phone']   ?? '';
    $totalCollected = $summary['payments']->sum('amount') + $summary['posTotal'];
@endphp

<div class="max-w-3xl mx-auto my-8 bg-white shadow-sm rounded-xl overflow-hidden border border-gray-200
            print:shadow-none print:border-0 print:rounded-none print:my-0 print:max-w-none">

    {{-- Screen toolbar (hidden on print) --}}
    <div class="no-print px-8 pt-6 pb-4 flex items-center justify-between border-b border-gray-100">
        <a href="{{ route('shifts.index') }}"
           class="inline-flex items-center gap-1.5 text-sm text-gray-400 hover:text-gray-600 transition-colors">
            <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 19l-7-7 7-7"/>
            </svg>
            All Shifts
        </a>
        <div class="flex items-center gap-2">
            <a href="{{ route('shifts.close', $shift->id) }}"
               class="inline-flex items-center gap-2 px-3 py-1.5 text-xs font-medium text-gray-500 bg-white border-[0.5px] border-gray-200 rounded-lg hover:bg-gray-50 transition-colors">
                Back to Summary
            </a>
            <button onclick="window.print()"
                    class="inline-flex items-center gap-2 px-4 py-1.5 text-xs font-semibold text-white bg-teal-600 hover:bg-teal-700 rounded-lg transition-colors">
                <svg class="w-3.5 h-3.5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
                          d="M17 17h2a2 2 0 002-2v-4a2 2 0 00-2-2H5a2 2 0 00-2 2v4a2 2 0 002 2h2m2 4h6a2 2 0 002-2v-4a2 2 0 00-2-2H9a2 2 0 00-2 2v4a2 2 0 002 2zm8-12V5a2 2 0 00-2-2H9a2 2 0 00-2 2v4h10z"/>
                </svg>
                Print Report
            </button>
        </div>
    </div>

    {{-- ===== LETTERHEAD ===== --}}
    <div class="px-10 pt-8 pb-6 border-b border-gray-200">
        <div class="flex items-start justify-between gap-6">
            <div>
                <h1 class="text-xl font-black text-gray-900 leading-tight tracking-tight">{{ $propName }}</h1>
                @if($propAddress || $propCity)
                <p class="text-gray-400 text-xs mt-0.5">{{ implode(', ', array_filter([$propAddress, $propCity])) }}</p>
                @endif
                @if($propPhone)
                <p class="text-gray-400 text-xs">{{ $propPhone }}</p>
                @endif
            </div>
            <div class="text-right flex-shrink-0">
                <p class="text-[10px] font-semibold text-gray-400 uppercase tracking-widest">Shift Report</p>
                <p class="text-2xl font-black text-gray-900 mt-0.5">{{ $shift->typeLabel() }}</p>
                <p class="text-xs text-gray-400 mt-0.5">{{ $shift->started_at->format('l, F j, Y') }}</p>
            </div>
        </div>
    </div>

    {{-- ===== SHIFT META ===== --}}
    <div class="px-10 py-5 border-b border-gray-100 bg-gray-50/40 print:bg-white">
        <div class="grid grid-cols-4 gap-4">
            <div>
                <p class="text-[10px] font-semibold text-gray-400 uppercase tracking-wider">Staff</p>
                <p class="text-sm font-bold text-gray-800 mt-0.5">{{ $shift->user->name }}</p>
                <p class="text-[11px] text-gray-400">{{ $shift->user->role?->name ?? '' }}</p>
            </div>
            <div>
                <p class="text-[10px] font-semibold text-gray-400 uppercase tracking-wider">Time</p>
                <p class="text-sm font-bold text-gray-800 mt-0.5">{{ $shift->started_at->format('g:i A') }}</p>
                <p class="text-[11px] text-gray-400">→ {{ $shift->ended_at?->format('g:i A') ?? 'ongoing' }}</p>
            </div>
            <div>
                <p class="text-[10px] font-semibold text-gray-400 uppercase tracking-wider">Duration</p>
                <p class="text-sm font-bold text-gray-800 mt-0.5">{{ $shift->duration() }}</p>
            </div>
            <div>
                <p class="text-[10px] font-semibold text-gray-400 uppercase tracking-wider">Status</p>
                <p class="text-sm font-bold mt-0.5 {{ $shift->status === 'open' ? 'text-teal-600' : 'text-gray-700' }}">
                    {{ $shift->status === 'open' ? 'Active' : 'Closed' }}
                </p>
            </div>
        </div>
    </div>

    <div class="px-10 py-8 space-y-8">

        {{-- ===== ACTIVITY SUMMARY ===== --}}
        <section>
            <h2 class="text-[10px] font-semibold text-gray-400 uppercase tracking-widest mb-3 pb-1.5 border-b border-gray-200">
                Activity Summary
            </h2>
            <div class="grid grid-cols-3 gap-px bg-gray-200 border border-gray-200 rounded-lg overflow-hidden">
                @foreach([
                    ['Check-ins',        $summary['checkins']->count(),      'text-teal-700'],
                    ['Check-outs',       $summary['checkouts']->count(),     'text-amber-600'],
                    ['New Reservations', $summary['newReservations'],        'text-blue-700'],
                    ['Rooms Cleaned',    $summary['roomsCleaned'],           'text-green-700'],
                    ['Work Orders',      $summary['maintenance']->count(),   'text-orange-600'],
                    ['POS Transactions', $summary['posTxns']->count(),       'text-purple-700'],
                ] as [$label, $value, $color])
                <div class="bg-white px-5 py-3 flex items-center gap-3">
                    <span class="text-2xl font-black {{ $color }}">{{ $value }}</span>
                    <span class="text-xs text-gray-500 leading-tight">{{ $label }}</span>
                </div>
                @endforeach
            </div>
        </section>

        {{-- ===== CHECK-INS & CHECK-OUTS (side by side) ===== --}}
        <section>
            <div class="grid grid-cols-2 gap-6">
                {{-- Check-ins --}}
                <div>
                    <h2 class="text-[10px] font-semibold text-gray-400 uppercase tracking-widest mb-3 pb-1.5 border-b border-gray-200">
                        Check-ins ({{ $summary['checkins']->count() }})
                    </h2>
                    @if($summary['checkins']->isEmpty())
                    <p class="text-xs text-gray-300 italic">None during this shift.</p>
                    @else
                    <table class="w-full text-xs">
                        <tbody class="divide-y divide-gray-100">
                            @foreach($summary['checkins'] as $log)
                            <tr>
                                <td class="py-1.5 text-gray-700 pr-3">{{ $log->description }}</td>
                                <td class="py-1.5 text-gray-400 text-right whitespace-nowrap">{{ $log->created_at->format('g:i A') }}</td>
                            </tr>
                            @endforeach
                        </tbody>
                    </table>
                    @endif
                </div>

                {{-- Check-outs --}}
                <div>
                    <h2 class="text-[10px] font-semibold text-gray-400 uppercase tracking-widest mb-3 pb-1.5 border-b border-gray-200">
                        Check-outs ({{ $summary['checkouts']->count() }})
                    </h2>
                    @if($summary['checkouts']->isEmpty())
                    <p class="text-xs text-gray-300 italic">None during this shift.</p>
                    @else
                    <table class="w-full text-xs">
                        <tbody class="divide-y divide-gray-100">
                            @foreach($summary['checkouts'] as $log)
                            <tr>
                                <td class="py-1.5 text-gray-700 pr-3">{{ $log->description }}</td>
                                <td class="py-1.5 text-gray-400 text-right whitespace-nowrap">{{ $log->created_at->format('g:i A') }}</td>
                            </tr>
                            @endforeach
                        </tbody>
                    </table>
                    @endif
                </div>
            </div>
        </section>

        {{-- ===== PAYMENTS & CASH RECONCILIATION (side by side) ===== --}}
        <section>
            <div class="grid grid-cols-2 gap-6">

                {{-- Payments collected --}}
                <div>
                    <h2 class="text-[10px] font-semibold text-gray-400 uppercase tracking-widest mb-3 pb-1.5 border-b border-gray-200">
                        Payments Collected
                    </h2>
                    @if($summary['paymentsByMethod']->isEmpty() && $summary['posTotal'] == 0)
                    <p class="text-xs text-gray-300 italic">No payments during this shift.</p>
                    @else
                    <table class="w-full text-xs">
                        <tbody class="divide-y divide-gray-100">
                            @foreach($summary['paymentsByMethod'] as $method => $amount)
                            <tr>
                                <td class="py-1.5 text-gray-600">{{ $method }}</td>
                                <td class="py-1.5 text-right font-semibold text-gray-800">&#8369;{{ number_format($amount, 0) }}</td>
                            </tr>
                            @endforeach
                            @if($summary['posTotal'] > 0)
                            <tr>
                                <td class="py-1.5 text-gray-500 italic">POS ({{ $summary['posTxns']->count() }} txn)</td>
                                <td class="py-1.5 text-right font-semibold text-gray-700">&#8369;{{ number_format($summary['posTotal'], 0) }}</td>
                            </tr>
                            @endif
                        </tbody>
                        <tfoot>
                            <tr class="border-t-2 border-gray-300">
                                <td class="pt-2 text-xs font-bold text-gray-800 uppercase tracking-wider">Total Collected</td>
                                <td class="pt-2 text-right text-base font-black text-gray-900">&#8369;{{ number_format($totalCollected, 0) }}</td>
                            </tr>
                        </tfoot>
                    </table>
                    @endif
                </div>

                {{-- Cash reconciliation --}}
                <div>
                    <h2 class="text-[10px] font-semibold text-gray-400 uppercase tracking-widest mb-3 pb-1.5 border-b border-gray-200">
                        Cash Reconciliation
                    </h2>
                    <table class="w-full text-xs">
                        <tbody class="divide-y divide-gray-100">
                            @if($shift->opening_cash !== null)
                            <tr>
                                <td class="py-1.5 text-gray-500">Opening float</td>
                                <td class="py-1.5 text-right font-medium text-gray-700">&#8369;{{ number_format($shift->opening_cash, 0) }}</td>
                            </tr>
                            @endif
                            <tr>
                                <td class="py-1.5 text-gray-500">Cash received (payments)</td>
                                <td class="py-1.5 text-right font-medium text-gray-700">&#8369;{{ number_format($summary['cashReceived'], 0) }}</td>
                            </tr>
                            @if($summary['posCash'] > 0)
                            <tr>
                                <td class="py-1.5 text-gray-500">Cash from POS</td>
                                <td class="py-1.5 text-right font-medium text-gray-700">&#8369;{{ number_format($summary['posCash'], 0) }}</td>
                            </tr>
                            @endif
                            <tr class="border-t border-gray-300">
                                <td class="py-1.5 font-semibold text-gray-700">Expected on hand</td>
                                <td class="py-1.5 text-right font-bold text-gray-900">&#8369;{{ number_format($summary['expectedCashOnHand'], 0) }}</td>
                            </tr>
                            @if($shift->closing_cash !== null)
                            <tr>
                                <td class="py-1.5 text-gray-500">Actual count</td>
                                <td class="py-1.5 text-right font-medium text-gray-700">&#8369;{{ number_format($shift->closing_cash, 0) }}</td>
                            </tr>
                            <tr class="border-t-2 {{ $variance >= 0 ? 'text-green-700' : 'text-red-600' }}">
                                <td class="pt-2 font-bold uppercase tracking-wider text-[10px]">Variance</td>
                                <td class="pt-2 text-right text-base font-black">
                                    {{ $variance >= 0 ? '+' : '' }}&#8369;{{ number_format(abs($variance), 0) }}
                                </td>
                            </tr>
                            @else
                            <tr>
                                <td colspan="2" class="py-1.5 text-gray-300 italic text-[10px]">No closing cash count recorded.</td>
                            </tr>
                            @endif
                        </tbody>
                    </table>
                </div>

            </div>
        </section>

        {{-- ===== MAINTENANCE WORK ORDERS ===== --}}
        @if($summary['maintenance']->isNotEmpty())
        <section>
            <h2 class="text-[10px] font-semibold text-gray-400 uppercase tracking-widest mb-3 pb-1.5 border-b border-gray-200">
                Maintenance Work Orders Created ({{ $summary['maintenance']->count() }})
            </h2>
            <table class="w-full text-xs">
                <thead>
                    <tr class="border-b border-gray-200">
                        <th class="pb-1.5 text-left text-[10px] font-semibold text-gray-400 uppercase tracking-wider">Description</th>
                        <th class="pb-1.5 text-left text-[10px] font-semibold text-gray-400 uppercase tracking-wider">Room</th>
                        <th class="pb-1.5 text-left text-[10px] font-semibold text-gray-400 uppercase tracking-wider">Priority</th>
                        <th class="pb-1.5 text-right text-[10px] font-semibold text-gray-400 uppercase tracking-wider">Time</th>
                    </tr>
                </thead>
                <tbody class="divide-y divide-gray-100">
                    @foreach($summary['maintenance'] as $wo)
                    <tr>
                        <td class="py-1.5 text-gray-700">{{ $wo->description }}</td>
                        <td class="py-1.5 text-gray-500">{{ $wo->room_no ? 'Room ' . $wo->room_no : 'Common Area' }}</td>
                        <td class="py-1.5 text-gray-500 capitalize">{{ $wo->priority }}</td>
                        <td class="py-1.5 text-right text-gray-400">{{ $wo->created_at->format('g:i A') }}</td>
                    </tr>
                    @endforeach
                </tbody>
            </table>
        </section>
        @endif

        {{-- ===== HANDOVER NOTES ===== --}}
        <section>
            <h2 class="text-[10px] font-semibold text-gray-400 uppercase tracking-widest mb-3 pb-1.5 border-b border-gray-200">
                Handover Notes
            </h2>
            @if($shift->handover_notes)
            <p class="text-sm text-gray-700 leading-relaxed whitespace-pre-wrap">{{ $shift->handover_notes }}</p>
            @else
            <p class="text-xs text-gray-300 italic">No handover notes recorded.</p>
            @endif
        </section>

        {{-- ===== SIGNATURE BLOCK ===== --}}
        <section class="pt-4">
            <div class="grid grid-cols-2 gap-10">
                <div>
                    <div class="border-b border-gray-400 mb-1.5 h-8"></div>
                    <p class="text-[10px] text-gray-400 uppercase tracking-wider">Staff Signature</p>
                    <p class="text-xs text-gray-500 mt-0.5">{{ $shift->user->name }}</p>
                </div>
                <div>
                    <div class="border-b border-gray-400 mb-1.5 h-8"></div>
                    <p class="text-[10px] text-gray-400 uppercase tracking-wider">Supervisor / Manager</p>
                </div>
            </div>
        </section>

        {{-- ===== PRINT FOOTER ===== --}}
        <div class="pt-4 border-t border-gray-100 flex items-center justify-between text-[10px] text-gray-300">
            <span>{{ $propName }} · Shift Report</span>
            <span>Printed {{ now()->format('M j, Y g:i A') }}</span>
        </div>

    </div>
</div>

@endsection