@extends('frontend.index')
@section('title')
    Home
@endsection
@section('content')
    <div class="grid lg:grid-cols-2">
        <div class="text-center">
            <h3 class="text-[40px] font-caveat font-medium text-blue-400"> instant visa application forms <br/> fill out and other services</h3>
            <h1 class="text-[50px] text-center mt-10 font-sofia"><span class="text-orange-500">Visa</span> <span class="text-blue-600">Solicit</span></h1>
            <h4 class="text-[30px] text-center text-gray-700 mb-5"><i>Operated by Immigration Lawyers</i></h4>
            <a href="{{ route('profile.home') }}" class="text-center mt-5">
                <button type="submit" class="text-white bg-[#ff7675] hover:bg-[#ff6b6b] focus:ring-4
                    focus:outline-none focus:ring-blue-300 font-medium rounded-md text-[30px]
                    sm:w-auto px-[50px] py-2 text-center dark:bg-blue-600 dark:hover:bg-blue-700 dark:focus:ring-blue-800">Go Inside</button>
            </a>
        </div>
        <div class="text-center">
            <span  class="text-white bg-[#ff7675] hover:bg-[#ff6b6b] focus:ring-4
                    focus:outline-none focus:ring-blue-300 font-medium rounded-md text-[30px]
                    sm:w-auto px-[10px] py-[2px] text-center dark:bg-blue-600 dark:hover:bg-blue-700 dark:focus:ring-blue-800">Login</span>


            <form class="max-w-sm mx-auto bg-[#D2E0FB] mt-2 rounded-lg p-4">
                <div class="mb-5">
                    <label for="email" class="block mb-2 text-[30px] font-normal text-gray-700 dark:text-white">E-mail</label>
                    <input type="email" id="email" name="email" class="bg-gray-50  rounded text-[20px]
                             text-gray-900 text-sm  
                               block w-full p-2.5  
                                placeholder="Enter your email" />
                </div>
                <div class="mb-5">
                    <label for="password"  class="block  mb-2 text-[30px] font-normal text-gray-700 dark:text-white">Password</label>
                    <input type="password" name="password" id="password" class="bg-gray-50 rounded  text-gray-900 text-sm  focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500" required />
                </div>
               
                <div class="mb-5">
                    <!-- <button type="submit" class="text-[#ff6b6b] text-[30px]
                           text-center ">Forget Password</button> -->
                    <a href=""><h1 class="text-[#ff6b6b] text-[30px] text-center"><i> Forget Password</i></h1></a>
                </div>
                <button type="submit" class="mb-1 text-[30px]  text-white bg-blue-800 hover:bg-blue-800 focus:ring-4
                           font-medium rounded-lg  w-full
                         sm:w-auto px-5 py-2 text-center ">Go Next</button>
            </form>
            <a href="{{ route('profile.home') }}">
                <button type="submit" class="text-white mt-3 bg-blue-700 hover:bg-blue-800  
                      font-medium rounded-lg text-[30px] w-full
                    sm:w-auto px-5 py-2.5 text-center dark:bg-blue-600 dark:hover:bg-blue-700 dark:focus:ring-blue-800">Create Profile</button>
            </a>
        </div>

    </div>
@endsection