@extends('layouts.app')

@section('title', 'Verify Membership | AICDS')

@section('content')

<x-breadcrumb title="Membership Verification" :breadcrumbs="['Membership' => route('membership.index'), 'Verify' => route('membership.verify')]" />

<div class="sp_top_100 sp_bottom_100">
    <div class="container">
        <div class="row justify-content-center mb-5">
            <div class="col-xl-8 text-center" data-aos="fade-up">
                <span class="badge bg-primary text-white text-uppercase px-3 py-2 fw-semibold mb-3">Official Verification Portal</span>
                <h2 class="fw-bold mb-3">Verify Member Authenticity</h2>
                <p class="text-muted">Enter the official AICDS Membership Identification Number to verify credential authenticity and active standing.</p>

                <form action="{{ route('membership.verify.lookup') }}" method="POST" class="mt-4">
                    @csrf
                    <div class="input-group input-group-lg shadow-sm">
                        <input type="text" name="membership_number" value="{{ old('membership_number', $query ?? '') }}" required class="form-control px-4" placeholder="e.g. AICDS-PRO-2026-0001 or AICDS-STU-2026-0002">
                        <button type="submit" class="default__button px-4 border-0">Verify Now</button>
                    </div>
                    <small class="text-muted mt-2 d-block">Search is case-insensitive. Try: <code>AICDS-PRO-2026-0001</code></small>
                </form>
            </div>
        </div>

        @if(isset($query))
            <div class="row justify-content-center">
                <div class="col-xl-8">
                    @if($membership)
                        <div class="card border-0 shadow-lg rounded-5 overflow-hidden">
                            <div class="bg-success text-white p-4 d-flex justify-content-between align-items-center">
                                <div>
                                    <span class="badge bg-white text-success text-uppercase px-3 py-1 fw-bold">Verified Valid Credential</span>
                                    <h4 class="text-white fw-bold mb-0 mt-2">Active AICDS Membership</h4>
                                </div>
                                <i class="icofont-check-circled display-5 text-white"></i>
                            </div>

                            <div class="p-4 p-md-5 bg-white">
                                <div class="row g-4">
                                    <div class="col-sm-6">
                                        <div class="text-muted small">Membership Number:</div>
                                        <div class="fs-5 fw-bold text-dark">{{ $membership->membership_number }}</div>
                                    </div>
                                    <div class="col-sm-6">
                                        <div class="text-muted small">Member Full Name:</div>
                                        <div class="fs-5 fw-bold text-dark">{{ $membership->user->name }}</div>
                                    </div>
                                    <div class="col-sm-6">
                                        <div class="text-muted small">Category &amp; Tier:</div>
                                        <div class="fs-6 fw-semibold text-primary text-uppercase">{{ $membership->plan->name ?? $membership->category }}</div>
                                    </div>
                                    <div class="col-sm-6">
                                        <div class="text-muted small">Current Standing:</div>
                                        <span class="badge {{ $membership->status === 'active' ? 'bg-success' : 'bg-danger' }} fs-6 px-3 py-2 text-uppercase">
                                            {{ $membership->status }}
                                        </span>
                                    </div>
                                    <div class="col-sm-6">
                                        <div class="text-muted small">Affiliated Institution / Organization:</div>
                                        <div class="fs-6 text-dark">{{ $membership->user->organization ?? 'Associated Professional' }}</div>
                                    </div>
                                    <div class="col-sm-6">
                                        <div class="text-muted small">Membership Validity:</div>
                                        <div class="fs-6 text-dark">
                                            From {{ $membership->start_date->format('M d, Y') }}
                                            @if($membership->expiry_date)
                                                to {{ $membership->expiry_date->format('M d, Y') }}
                                            @else
                                                (Lifetime Standing)
                                            @endif
                                        </div>
                                    </div>
                                </div>

                                <div class="mt-4 pt-4 border-top text-center text-muted small">
                                    <i class="icofont-shield-alt text-success me-1"></i> Official credential verified via Association for Intelligent Computing and Data Science (AICDS) Secretariat.
                                </div>
                            </div>
                        </div>
                    @else
                        <div class="alert alert-danger p-4 rounded-4 shadow-sm text-center">
                            <i class="icofont-close-circled display-4 text-danger mb-2 d-block"></i>
                            <h4 class="fw-bold mb-2">No Verified Record Found</h4>
                            <p class="mb-0">No active membership was found for the reference number "<strong>{{ $query }}</strong>". Please double check the ID format or contact the Secretariat for assistance.</p>
                        </div>
                    @endif
                </div>
            </div>
        @endif
    </div>
</div>

@endsection