@extends('layout.admin')
@section('content')
<style>

.container {
    width: 100%;
    margin: 21px auto;
    padding: 30px;
    background-color: #3e3e3e0a;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
    border-radius: 8px;
}
        .table-title {
            text-align: center;
            font-size: 28px;
            font-weight: 700;
            color: #333;
            margin-bottom: 30px;
        }

        .grouptext {
            display: flex;
            justify-content: space-between;
            padding: 10px 0;
            font-size: 18px;
            border-bottom: 1px solid #ddd;
        }

        .grouptext span:first-child {
            font-weight: bold;
            color: #555;
        }

        .grouptext span:last-child {
            color: #333;
        }

        .grouptext:last-child {
            border-bottom: none;
        }

        /* Optional: Add responsive behavior for smaller screens */
        @media (max-width: 768px) {
            .container {
                width: 90%;
                padding: 20px;
            }

            .table-title {
                font-size: 24px;
            }

            .grouptext {
                font-size: 16px;
            }
        }
        .imgapply img{
            width: 150px;
    height: 150px;
    object-fit: fill;
        }

        .grouptextdsf{
            display: grid;
    gap: 10px;
    margin-top: 15px;
    text-align: center;
        }
        .images_finger{
            display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 20px;
        }

</style>
<main class="main-wrapper">
    <div class="main-content">
      <!--breadcrumb-->
				<div class="page-breadcrumb d-none d-sm-flex align-items-center mb-3">
					<div class="breadcrumb-title pe-3">View DOB Details</div>
					<div class="ps-3">
						<nav aria-label="breadcrumb">
							<ol class="breadcrumb mb-0 p-0">
								<li class="breadcrumb-item"><a href="javascript:;"><i class="bx bx-home-alt"></i></a>
								</li>
								<li class="breadcrumb-item active" aria-current="page">View</li>
							</ol>
						</nav>
					</div>
				
				</div>
				<!--end breadcrumb-->


        <div class="row">
          <div class="col">
            <div class="card">
              <div class="card-body">

                @if (session('success'))
                <div class="alert alert-success border-0 bg-grd-success alert-dismissible fade show">
                    <div class="d-flex align-items-center">
                        <div class="font-35 text-white"><span class="material-icons-outlined fs-2">check_circle</span>
                        </div>
                        <div class="ms-3">
                            <div class="text-white">{{ session('success') }}</div>
                         
                        </div>
                    </div>
                    <button type="button" class="btn-close text-white" data-bs-dismiss="alert" aria-label="Close"></button>
                </div>
              @endif


              
                <h5 class="card-title">All Details</h5>
               
                <div class="container">
                    <div class="table-title">User Information</div>
                    <div class="grouptext">
                        <span>First Name :</span>
                        <span><b>{{ $row->first_name }}</b></span>
                    </div>
                    <div class="grouptext">
                        <span>Middle Name :</span>
                        <span><b>{{ $row->middle_name }}</b></span>
                    </div>
                    <div class="grouptext">
                        <span>Last :</span>
                        <span><b>{{ $row->last_name }}</b></span>
                    </div>
                    <div class="grouptext">
                        <span>Gender :</span>
                        <span><b>{{ $row->gender }}</b></span>
                    </div>
                    <div class="grouptext">
                        <span>Old Dob :</span>
                        <span><b>{{ $row->old_dob }}</b></span>
                    </div>
                    
                    <div class="grouptext">
                        <span>New Dob :</span>
                        <span><b>{{ $row->new_dob }}</b></span>
                    </div>
                    <div class="grouptext">
                        <span>Aadhar Number :</span>
                        <span><b>{{ $row->aadhar_number }}</b></span>
                    </div>
                    <div class="grouptext">
                        <span>Mobile Number :</span>
                        <span><b>{{ $row->mobile_number }}</b></span>
                    </div>
                    <div class="grouptext">
                        <span>Birth Place :</span>
                        <span><b>{{ $row->birth_place }}</b></span>
                    </div>
                    <div class="grouptext">
                        <span>Father's Name :</span>
                        <span><b>{{ $row->father_name }}</b></span>
                    </div>
                    <div class="grouptext">
                        <span>Mother's Name :</span>
                        <span><b>{{ $row->mother_name }}</b></span>
                    </div>
                    <div class="grouptext">
                        <span>House Number :</span>
                        <span><b>{{ $row->house_number }}</b></span>
                    </div>
                    <div class="grouptext">
                        <span>Village Name :</span>
                        <span><b>{{ $row->vilage_name }}</b></span>
                    </div>
                    <div class="grouptext">
                        <span>District :</span>
                        <span><b>{{ $row->district }}</b></span>
                    </div>
                    <div class="grouptext">
                        <span>State :</span>
                        <span><b>{{ $row->state }}</b></span>
                    </div>
                    <div class="grouptext">
                        <span>Pincode :</span>
                        <span><b>{{ $row->pincode }}</b></span>
                    </div>
                    <div class="grouptext">
                        <span>Purpose :</span>
                        <span><b>{{ $row->purpose }}</b></span>
                    </div>
                    <div class="grouptext">
                        <span>Signature Image :</span>
                        <span>
                            <a href="{{ url('') }}/{{ $row->signature }}" target="_blank" class="imgapply">
                            <img src="{{ url('') }}/{{ $row->signature }}" class="img-thumbnail" alt="" loading="lazy" width="200" height="200" alt="">
                        </a>
                    </span>
                    </div>


                    <div class="grouptext">
                        <span>Passport Image :</span>
                        <span>
                            <a href="{{ url('') }}/{{ $row->passport_photo }}" target="_blank" class="imgapply">
                            <img src="{{ url('') }}/{{ $row->passport_photo }}" class="img-thumbnail" alt="" loading="lazy" width="200" height="200" alt="">
                        </a>
                    </span>
                    </div>


                    <div class="grouptext">
                        <span>Fingerprint Images :</span>
                    </div>

                   <div class="images_finger">
                    <div class="grouptextdsf">
                        <span>Fingerprint 1 :</span>
                        <a href="{{ $row->finger_1 }}" target="_blank" class="imgapply">
                            <img src="{{ $row->finger_1 }}" class="img-thumbnail" alt="" loading="lazy" width="200" height="200" alt="">
                        </a>
                    </div>



                    <div class="grouptextdsf">
                        <span>Fingerprint 2 :</span>
                        <a href="{{ $row->finger_2 }}" target="_blank" class="imgapply">
                            <img src="{{ $row->finger_2 }}" class="img-thumbnail" alt="" loading="lazy" width="200" height="200" alt="">
                        </a>
                    </div>


                    <div class="grouptextdsf">
                        <span>Fingerprint 3 :</span>
                        <a href="{{ $row->finger_3 }}" target="_blank" class="imgapply">
                            <img src="{{ $row->finger_3 }}" class="img-thumbnail" alt="" loading="lazy" width="200" height="200" alt="">
                        </a>
                    </div>


                    <div class="grouptextdsf">
                        <span>Fingerprint 4 :</span>
                        <a href="{{ $row->finger_4 }}" target="_blank" class="imgapply">
                            <img src="{{ $row->finger_4 }}" class="img-thumbnail" alt="" loading="lazy" width="200" height="200" alt="">
                        </a>
                    </div>


                    <div class="grouptextdsf">
                        <span>Fingerprint 5 :</span>
                        <a href="{{ $row->finger_5 }}" target="_blank" class="imgapply">
                            <img src="{{ $row->finger_5 }}" class="img-thumbnail" alt="" loading="lazy" width="200" height="200" alt="">
                        </a>
                    </div>
                   </div>


                   <form class="row g-3 mt-4" action="/admin/changestatus/{{ $row->id }}" method="post" enctype="multipart/form-data">
                    @csrf
                    <div class="col-md-6 col-sm-6">
                        <label for="input1" class="form-label">Change Status</label>
                        <select name="status" id="" class="form-control">
                            <option  value="pending">Pending</option>
                            <option  value="reject">Reject</option>
                            <option  value="accept"><span class="text-success">Accept</span></option>
                        </select>
                        @include('error.danger',['input' => 'amount'])
                       
                    </div>

                    <div class="col-md-6 col-sm-6">
                        <div class="form-label"></div>
                        <br>
                        <button type="submit" class="btn ripple btn-primary px-5">Submit</button>
                    </div>
                    </div>
                    </div>
                
                </form>

                   
                    
                </div>
              </div>
            </div>
          </div>
        
        </div><!--end row-->

    </div>
  </main>


@endsection