@extends('layouts/main')

@section('body')
    @include('layouts.navbar')

    <div class="container mx-auto sm:px-5">
        <section class="bg-gray-50 dark:bg-gray-900 p-5 w-full">
            <div
                class="mx-auto p-5 bg-white rounded-lg shadow dark:border sm:max-w-md  dark:bg-gray-800 dark:border-gray-700">
                <h1
                    class="text-xl font-bold leading-tight tracking-tight text-gray-900 md:text-2xl dark:text-white text-center">
                    Mobile Verification Notice
                </h1>
                <br>
                <div class="mb-4 text-sm text-gray-600 dark:text-gray-400">
                    {{ __('Thanks for signing up! Before getting started, could you verify your mobile number by clicking on the link we just smsed to you? If you didn\'t receive the SMS, we will gladly send you another.') }}
                </div>
                @if (session('status') == 'verification-link-sent')
                    <div class="mb-4 font-medium text-sm text-green-600 dark:text-green-400">
                        {{ __('A new verification link has been sent to the mobile number you provided during registration.') }}
                    </div>
                @endif
                <p class=" dark:text-gray-100"><strong>Your Mobile : </strong>{{ auth()->user()->mobile }}</p>
                <form method="POST" action="{{ route('mobile.verification.send') }}">
                    @csrf
                    <div class="flex items-center justify-end mt-4">
                        <button type="submit"
                            class="text-white bg-primary-600 hover:bg-primary-700 focus:ring-4 focus:outline-none focus:ring-primary-300 font-medium rounded-lg text-sm px-5 py-2.5 text-center dark:bg-primary-600 dark:hover:bg-primary-700 dark:focus:ring-primary-800">
                            {{ __('Resend Verification SMS') }}</button>
                    </div>
                </form>
            </div>
        </section>
    </div>
@endsection