@extends('layouts/guest/masters.master')

@section('opengraph')
<!-- Search Engine Optimization by Rank Math - http://s.rankmath.com/home -->
@endsection

@section('tittle','VOICES AND BEATS [ EVENTS MANAGEMENT ] | SUCESS-MESSAGE')

@section('content') 
<div class="page-content">
  <div class="bg-cover bg-liveband-stage">
    <div class="h-64 flex items-center justify-center bg-black bg-opacity-50">
      <h1 class="text-lg md:text-2xl font-opensans-bold text-white text-center">
        HOME &nbsp;&nbsp;>&nbsp;&nbsp;<span class="text-lime-500">BUY MULTIPLE TICKET</span>
      </h1>
    </div>
  </div>

   <div class="py-5 px-3 md:p-10 flex flex-col md:flex-row space-y-3 md:space-y-0 md:space-x-10" style="border:1px solid green;">
    <div class="w-full md:w-2/3 space-y-3">
      <div>
        <h1 class="font-opensans-bold md:text-xl text-center">
          TICKETS TO BE FORMULATED
        </h1>
      </div>

      @if(Session::has('success'))
       <div class="capitalize border border-green-600 rounded-sm p-2 text-center text-green-600 text-sm font-opensans-bold">
        {{ Session::get('success') }}
       </div>
      @endif

      <div class="guest overflow-x-auto rounded-md bg-gray-50">
        <table class="w-full border-collapse">
         <thead>
          <tr class="font-opensans-bold text-white bg-lime-500">
            <th class="w-14">Sn</th>
            <th class="w-30">User Name</th>
            <th class="w-30">Email</th>
            <th class="w-30">Phone No.</th>
          </tr>   
         </thead>
         <tbody>
       @foreach($data->client_detail as $key => $value)
          <tr class="capitalize">
           <td class="">{{ $key + 1 }}</td>
           <td class="">{{ $value['username'] }}</td>
           <td class="">{{ $value['email'] }}</td>
           <td class="">{{ $value['phone'] }}</td>
          </tr>
         @endforeach
         </tbody>
        </table> 
      </div>
    </div>
    <div class="w-full md:w-1/3">
     <div class="p-3 md:p-5 border border-gray-300 rounded-md">  
      <form action="/Events/Buy-Ticket-Multiple/Add-Ticket" method="post">
        @csrf
       <div class="space-y-3 "> 
       <div>
        <h1 class="font-opensans-bold text-center">
          ENTER MORE (<span class="text-red-500">{{$data->qty_left}}</span>) MORE TICKETS 
        </h1>
       </div>
      
       <hr class="border border-lime-500">

       <div class="space-y-1">
        <label class="font-opensans-bold">First Name</label>
        <input type="text" name="firstname" class="border border-gray-300 bg-white w-full focus:outline-none p-1 rounded-sm @error('firstname') border-red-500 @enderror" value="{{old('firstname')}}">

        @error('firstname')
          <div class="text-red-500 text-sm font-opensans-bold">
            {{$message}}
          </div>
        @enderror
       </div>

       <div class="space-y-1">
        <label class="font-opensans-bold">Last Name</label>
        <input type="text" name="lastname" class="border border-gray-300 bg-white w-full focus:outline-none p-1 rounded-sm @error('lastname') border-red-500 @enderror" value="{{old('lastname')}}">

        @error('lastname')
          <div class="text-red-500 text-sm font-opensans-bold">
            {{$message}}
          </div>
        @enderror
       </div>

       <div class="space-y-1">
        <label class="font-opensans-bold">Email</label>
        <input type="text" name="email" class="border border-gray-300 bg-white w-full focus:outline-none p-1 rounded-sm @error('email') border-red-500 @enderror" value="{{old('email')}}">

        @error('email')
          <div class="text-red-500 text-sm font-opensans-bold">
            {{$message}}
          </div>
        @enderror
       </div>

       <div class="space-y-1">
        <label class="font-opensans-bold">Phone no.</label>
        <input type="text" name="phone" class="border border-gray-300 bg-white w-full focus:outline-none p-1 rounded-sm @error('phone') border-red-500 @enderror" value="{{old('phone')}}">

        @error('phone')
          <div class="text-red-500 text-sm font-opensans-bold">
            {{$message}}
          </div>
        @enderror
       </div>

       <div class="flex items-center justify-center">
        <button class="py-1 px-2 bg-black text-white hover:bg-lime-500 rounded-md w-24">
          ADD
        </button>
       </div>
      </div>  
      </form>  
     </div> 
    </div>
   </div>  
</div> 
@endsection