@extends('frontend.layouts.default')

@section('title', 'Pre-Arrival Check')

@section('page_css')
<style>
    .alert, .table {
        background: rgba(255,255,255,0.7);
        border-color: white !important;
        border: 2px solid;
        padding: 10px;
        text-align: center;
    }
</style>
@endsection

@section('content')
<section class="section">
    <img src="{{ asset('logo.png') }}" alt="App Logo" class="logo">

    <h1 class="text-center">Pre-Arrival Validation</h1>
    <hr/>

    @if ($place || $date || $firstname || $lastname || $email)
    <table class="table table-bordered">
        <tr>
            <th colspan="2" style="text-align: center">
                Pre-arrival Information
            </th>
        </tr>
        @if ($place)
        <tr>
            <th>Place</th>
            <td>{!! $place !!}</td>
        </tr>
        @endif
        @if ($date)
        <tr>
            <th>Arrival</th>
            <td>{!! $date !!}</td>
        </tr>
        @endif
        @if ($firstname || $lastname)
        <tr>
            <th>Guest</th>
            <td>{!! trim(($firstname ?? '').' '.($lastname ?? '')) !!}</td>
        </tr>
        @endif
        @if ($email)
        <tr>
            <th>Email</th>
            <td>{!! $email !!}</td>
        </tr>
        @endif
    </table>

    <hr/>
    @endif

    <div class="alert">
        @if ($valid)
            <h2 style="color: green;">Pre-arrival form found.</h2>
            @if ($reason)
                <p>{!! $reason !!}</p>
            @endif
        @else
            <h2 style="color: red;">{!! $reason !!}</h2>
        @endif
    </div>
</section>
@endsection