@extends('frontend::layouts.master')

@section('content')
    <div class="pt-6 lg:pt-10">
        <x-frontend::utility.sectiontitle title="Login"></x-frontend>
    </div>
    <div class="container relative">
        <div class="mx-auto max-w-xl p-4 sm:py-8 xl:p-8 rounded-lg bg-glass mt-8 xl:mt-10">
            <div class="mx-auto max-w-sm">
                <form action="member-profile" class="flex flex-wrap -mx-4 transparent-label form-style line-style">
                    <div class="w-full px-4">
                        <div class="com-form-basic float form-style">
                            <input id="email" type="email" autocomplete="username" placeholder="email">
                            <label for="email">
                                Email
                            </label>
                        </div>
                    </div>
                    <div class="w-full px-4">
                        <div class="com-form-basic float form-style line-style">
                            <input id="password" autocomplete="current-password" type="password" placeholder="password">
                            <label for="password">
                                Password
                            </label>
                        </div>
                        <p class="text-red-500 text-12">Username or password is incorrect. Please try again.</p>
                    </div>
                </form>
                <div class="flex flex-wrap -mx-4">
                    <form class="w-full px-4 pb-4 text-right">
                        <x-frontend::modal.basicmodal modalName="passwordForget">
                            <x-slot:modalButton>
                                <div class="mt-2 text-14 text-right text-white">Forget Password ?</div>
                            </x-slot>
                            <x-slot:modalContent>
                                <p class="font-medium text-center mb-4 uppercase">Reset Password</p>
                                <form action="forget-verify" class="mx-auto max-w-sm">
                                    <div class="flex flex-wrap -mx-4 profile-edit-modal">
                                        <div class="w-full px-4">
                                            <div class="com-form-basic float form-style">
                                                <input id="emailforget" type="email"  autocomplete="username" placeholder="emailforget">
                                                <label for="emailforget">
                                                    Email
                                                </label>
                                            </div>
                                        </div>
                                        <div class="w-full px-4 pt-4 text-right">
                                            <a href="forget-verify">
                                                <button type="button" class="button-secondary w-full text-white">
                                                    Submit
                                                </button>
                                            </a>
                                        </div>
                                    </div>
                                </form>
                            </x-slot>
                        </x-frontend>
                    </form>
                    <div class="w-full px-4 text-right">
                        <a href="member-profile">
                        <button class="button-secondary w-full text-white" type="submit">
                                Login
                        </button>
                        </a>
                    </div>
                    <div class="w-full px-4 pt-4 text-center text-14">
                        <p>Don’t have an account ?  
                        <a href="register" class="font-medium ml-1">Register</a></p>
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection