@extends('frontend.index')
@section('title')
    Profile
@endsection
@section('content')
    <!-- <div class="grid lg:grid-cols-2">
        <div class="grid lg:grid-row">
            <div class="flex justify-between">
                <div class="text-[25px]">Dashboard</div>
                <div class="text-[25px]">Blocked</div>
                <div class="text-[25px]">Photo</div>
            </div>
            <h1 class="text-[30px "> Edit Profile</h1>

        </div>

        <div class="text-center">
            <h1 class="text-[30px] bg-white text-center text-black-300"><i> Create Your Profile</i></h1>
                <form class="w-full max-w-lg">
                    <div class="md:flex md:items-center mb-6">
                        <div class="md:w-full">
                            <label class="block text-gray-500 font-bold md:text-right mb-1 md:mb-0 pr-4" for="g_name">
                                Given Name
                            </label>
                        </div>
                        <div class="md:w-full">
                            <input class="bg-gray-200 appearance-none border-2 border-gray-200 rounded
                             w-full px-4 py-2 text-gray-700 leading-tight focus:outline-none focus:bg-white
                             focus:border-purple-500" id="g_name" type="text" name="g_name" value="">
                        </div>
                    </div>
                    <div class="md:flex md:items-center mb-6">
                        <div class="md:w-full">
                            <label class="block text-gray-500 font-bold md:text-right mb-1 md:mb-0 pr-4" for="sure_name">
                                Sure Name
                            </label>
                        </div>
                        <div class="md:w-full">
                            <input class="bg-gray-200 appearance-none border-2 border-gray-200 rounded
                             w-full py-2 px-4 text-gray-700 leading-tight focus:outline-none focus:bg-white
                             focus:border-purple-500" id="sure_name" type="text" name="sure_name" value="">
                        </div>
                    </div>
                    <div class="md:flex md:items-center mb-6">
                        <div class="md:w-full">
                            <label class="block text-gray-500 font-bold md:text-right mb-1 md:mb-0 pr-4" for="birth">
                                Date Of Birth
                            </label>
                        </div>
                        <div class="md:w-2/3">
                            <input class="bg-gray-200 appearance-none border-2 border-gray-200 rounded
                             w-full py-2 px-4 text-gray-700 leading-tight focus:outline-none focus:bg-white
                             focus:border-purple-500" id="birth" type="date" name="birth" value="">
                        </div>
                    </div>
                    <div class="md:flex md:items-center mb-6">
                        <div class="md:w-full">
                            <label class="block text-gray-500 font-bold md:text-right mb-1 md:mb-0 pr-4" for="gender">
                                Sex
                            </label>
                        </div>
                        <div class="md:w-2/3">
                            <select id="gender" name="gender" class="bg-gray-200 appearance-none border-2 border-gray-200 rounded
                             w-full py-2 px-4 text-gray-700 leading-tight focus:outline-none focus:bg-white
                             focus:border-purple-500">
                                <option selected>Choose  Gender</option>
                                <option value="Male">Male</option>
                                <option value="Female">Female</option>
                                <option value="other">Other</option>
                            </select>
                        </div>
                    </div>
                    <div class="md:flex md:items-center mb-6">
                        <div class="md:w-full">
                            <label class="block text-gray-500 font-bold md:text-right mb-1 md:mb-0 pr-4" for="countries">
                                Country Of Nationalily:
                            </label>
                        </div>
                        <div class="md:w-2/3">
                            <select id="countries" name="countries" class="bg-gray-200 appearance-none border-2 border-gray-200 rounded
                             w-full py-2 px-4 text-gray-700 leading-tight focus:outline-none focus:bg-white
                             focus:border-purple-500">
                                <option selected>Choose a country</option>
                                <option value="US">United States</option>
                                <option value="CA">Canada</option>
                                <option value="FR">France</option>
                                <option value="DE">Germany</option>
                            </select>
                        </div>
                    </div>
                    <div class="md:flex md:items-center mb-6">
                        <div class="md:w-full">
                            <label class="block text-gray-500 font-bold md:text-right mb-1 md:mb-0 pr-4" for="number">
                                Mobile Number
                            </label>
                        </div>
                        <div class="md:w-2/3">
                            <input class="bg-gray-200 appearance-none border-2 border-gray-200 rounded
                             w-full py-2 px-4 text-gray-700 leading-tight focus:outline-none focus:bg-white
                             focus:border-purple-500" id="number" type="number" name="number" value="">
                        </div>
                    </div>
                    <div class="md:flex md:items-center mb-6">
                        <div class="md:w-full">
                            <label class="block text-gray-500 font-bold md:text-right mb-1 md:mb-0 pr-4" for="email">
                                E-mail Address
                            </label>
                        </div>
                        <div class="md:w-2/3">
                            <input class="bg-gray-200 appearance-none border-2 border-gray-200 rounded
                             w-full py-2 px-4 text-gray-700 leading-tight focus:outline-none focus:bg-white
                             focus:border-purple-500" id="email" type="email" name="email" value="">
                        </div>
                    </div>
                    <div class="md:flex md:items-center mb-6">
                        <div class="md:w-full">
                            <label class="block text-gray-500 font-bold md:text-right mb-1 md:mb-0 pr-4" for="address">
                                Present Address Flat <br>/Appartment No
                            </label>
                        </div>
                        <div class="md:w-2/3">
                            <input class="bg-gray-200 appearance-none border-2 border-gray-200 rounded
                             w-full py-2 px-4 text-gray-700 leading-tight focus:outline-none focus:bg-white
                             focus:border-purple-500" id="address" type="text" name="address" value="">
                        </div>
                    </div>
                    <div class="md:flex md:items-center mb-6">
                        <div class="md:w-full">
                            <label class="block text-gray-500 font-bold md:text-right mb-1 md:mb-0 pr-4" for="house">
                                House No
                            </label>
                        </div>
                        <div class="md:w-2/3">
                            <input class="bg-gray-200 appearance-none border-2 border-gray-200 rounded
                             w-full py-2 px-4 text-gray-700 leading-tight focus:outline-none focus:bg-white
                             focus:border-purple-500" id="house" type="text" name="house" value="">
                        </div>
                    </div>
                    <div class="md:flex md:items-center mb-6">
                        <div class="md:w-full">
                            <label class="block text-gray-500 font-bold md:text-right mb-1 md:mb-0 pr-4" for="road">
                                Road No
                            </label>
                        </div>
                        <div class="md:w-2/3">
                            <input class="bg-gray-200 appearance-none border-2 border-gray-200 rounded
                             w-full py-2 px-4 text-gray-700 leading-tight focus:outline-none focus:bg-white
                             focus:border-purple-500" id="road" type="text" name="road" value="">
                        </div>
                    </div>
                    <div class="md:flex md:items-center mb-6">
                        <div class="md:w-full">
                            <label class="block text-gray-500 font-bold md:text-right mb-1 md:mb-0 pr-4" for="block">
                                Block No
                            </label>
                        </div>
                        <div class="md:w-2/3">
                            <input class="bg-gray-200 appearance-none border-2 border-gray-200 rounded
                             w-full py-2 px-4 text-gray-700 leading-tight focus:outline-none focus:bg-white
                             focus:border-purple-500" id="block" type="text" name="block" value="">
                        </div>
                    </div>
                    <div class="md:flex md:items-center mb-6">
                        <div class="md:w-full">
                            <label class="block text-gray-500 font-bold md:text-right mb-1 md:mb-0 pr-4" for="avenue">
                                Avenue  No
                            </label>
                        </div>
                        <div class="md:w-2/3">
                            <input class="bg-gray-200 appearance-none border-2 border-gray-200 rounded
                             w-full py-2 px-4 text-gray-700 leading-tight focus:outline-none focus:bg-white
                             focus:border-purple-500" id="avenue" type="text" name="avenue" value="">
                        </div>
                    </div>
                    <div class="md:flex md:items-center mb-6">
                        <div class="md:w-full">
                            <label class="block text-gray-500 font-bold md:text-right mb-1 md:mb-0 pr-4" for="village">
                                Village  No
                            </label>
                        </div>
                        <div class="md:w-2/3">
                            <input class="bg-gray-200 appearance-none border-2 border-gray-200 rounded
                             w-full py-2 px-4 text-gray-700 leading-tight focus:outline-none focus:bg-white
                             focus:border-purple-500" id="village" type="text" name="village" value="">
                        </div>
                    </div>
                    <div class="md:flex md:items-center mb-6">
                        <div class="md:w-full">
                            <label class="block text-gray-500 font-bold md:text-right mb-1 md:mb-0 pr-4" for="village">
                                Village  No
                            </label>
                        </div>
                        <div class="md:w-2/3">
                            <input class="bg-gray-200 appearance-none border-2 border-gray-200 rounded
                             w-full py-2 px-4 text-gray-700 leading-tight focus:outline-none focus:bg-white
                             focus:border-purple-500" id="village" type="text" name="village" value="">
                        </div>
                    </div>
                    <div class="md:flex md:items-center mb-6">
                        <div class="md:w-full">
                            <label class="block text-gray-500 font-bold md:text-right mb-1 md:mb-0 pr-4" for="post_office">
                                Post Office
                            </label>
                        </div>
                        <div class="md:w-2/3">
                            <input class="bg-gray-200 appearance-none border-2 border-gray-200 rounded
                             w-full py-2 px-4 text-gray-700 leading-tight focus:outline-none focus:bg-white
                             focus:border-purple-500" id="post_office" type="text" name="post_office" value="">
                        </div>
                    </div>
                    <div class="md:flex md:items-center mb-6">
                        <div class="md:w-full">
                            <label class="block text-gray-500 font-bold md:text-right mb-1 md:mb-0 pr-4" for="post">
                                Post code
                            </label>
                        </div>
                        <div class="md:w-2/3">
                            <input class="bg-gray-200 appearance-none border-2 border-gray-200 rounded
                             w-full py-2 px-4 text-gray-700 leading-tight focus:outline-none focus:bg-white
                             focus:border-purple-500" id="post" type="text" name="post" value="">
                        </div>
                    </div>
                    <div class="md:flex md:items-center mb-6">
                        <div class="md:w-full">
                            <label class="block text-gray-500 font-bold md:text-right mb-1 md:mb-0 pr-4" for="district">
                                District
                            </label>
                        </div>
                        <div class="md:w-2/3">
                            <input class="bg-gray-200 appearance-none border-2 border-gray-200 rounded
                             w-full py-2 px-4 text-gray-700 leading-tight focus:outline-none focus:bg-white
                             focus:border-purple-500" id="district" type="text" name="district" value="">
                        </div>
                    </div>
                    <div class="md:flex md:items-center mb-6">
                        <div class="md:w-full">
                            <label class="block text-gray-500 font-bold md:text-right mb-1 md:mb-0 pr-4" for="state">
                                Province/state
                            </label>
                        </div>
                        <div class="md:w-2/3">
                            <input class="bg-gray-200 appearance-none border-2 border-gray-200 rounded
                             w-full py-2 px-4 text-gray-700 leading-tight focus:outline-none focus:bg-white
                             focus:border-purple-500" id="state" type="text" name="state" value="">
                        </div>
                    </div>

                </form>
            <div class="grid lg:grid-cols-3">
                <div>
                    <input type="checkbox" name="check" id="check" required/>
                    <label class="text-[25px] font-sans"  for="scales">Terms & Conditions </label>
                </div>
                <div class="col-span-2 text-right">
                    <a href="">
                        <button type="submit" class="text-white  p-10 bg-orange-700 hover:bg-blue-800 focus:ring-4
                    focus:outline-none focus:ring-blue-300 font-medium rounded-lg text-[30px] w-full
                    sm:w-auto px-15 py-2.5 text-center dark:bg-blue-600 dark:hover:bg-blue-700 dark:focus:ring-blue-800">Go Next</button>
                    </a>
                </div>
            </div>
        </div>
    </div> -->
@endsection