@extends('frontend.layouts.default')

@section('title', 'Guest Pass Validity 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">Guest Pass Validity Check</h1>
    <hr/>

    @if ($place)
    <table class="table table-bordered">
        <tr>
            <th colspan="2" style="text-align: center">
                Guest Pass Information
            </th>
        </tr>
        <tr>
            <th>Place</th>
            <td>{!! $place !!}</td>
        </tr>
        <tr>
            <th>Date</th>
            <td>{!! $date !!}</td>
        </tr>
        <tr>
            <th>Member that invited</th>
            <td>{!! $member !!}</td>
        </tr>
        <tr>
            <th>First Name</th>
            <td>{!! $firstname !!}</td>
        </tr>
        <tr>
            <th>Last Name</th>
            <td>{!! $lastname !!}</td>
        </tr>
        <tr>
            <th>Email</th>
            <td>{!! $email !!}</td>
        </tr>
        @if ($idnumber)
        <tr>
            <th>ID Number</th>
            <td>{!! $idnumber !!}</td>
        </tr>
        @endif
        </tr>
    </table>

    <hr/>
    @endif

    <div class="alert">
        @if ($valid)
            <h2 style="color: green;">This pass is valid.</h2>
        @else
            <h2 style="color: red;">{!! $reason !!}</h2>
        @endif
    </div>
</section>
@endsection

@section('page_scripts')
<!-- Additional scripts can go here -->
@endsection