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

@section('content')
    <div class="bg-med-gray">
        <div class="container mx-auto px-6 py-16">
            <div class="flex-grow flex items-center justify-center">
                <div class="max-w-2xl w-full">
                    <div class="bg-white p-8 md:p-12 rounded-2xl shadow-lg border border-gray-100">
                        @if ($type === 'general')
                            <div class="flex flex-col items-center justify-center gap-4 mb-6">
                                <div class="flex items-center justify-center h-[6rem] w-[6rem] rounded-full bg-blue-100">
                                    <i class="fa-solid fa-envelope text-blue-600 text-7xl"></i>
                                </div>
                                <div class="font-sm text-blue-600 text-center uppercase tracking-[0.15rem]">
                                    {{ __('frontend::lang.page.register.step3.please_confirm_email') }}
                                </div>
                            </div>
                            <div class="text-center space-y-4">
                                <div class="text-gray-600 leading-relaxed space-y-2">
                                    <h1 class="text-2xl font-bold text-med-dark">
                                        {{ __('frontend::lang.page.register.step3.thank_you_for_registering') }}
                                    </h1>
                                    <p>
                                        {{ __('frontend::lang.page.register.step3.send_email_finished') }} <span class="font-bold">{{ $email ?? '' }}</span> {{ __('frontend::lang.page.register.step3.send_email_finished_desc') }}
                                    </p>
                                </div>
                            </div>
                        @elseif($type === 'wholesale' || $type === 'pharmacy')
                            <div class="flex flex-col items-center justify-center gap-4 mb-6">
                                <div class="flex items-center justify-center h-[6rem] w-[6rem] rounded-full bg-amber-100">
                                    <i class="fa-solid fa-clock text-amber-600 text-7xl"></i>
                                </div>
                                <div class="font-sm text-amber-600 text-center uppercase tracking-[0.15rem]">
                                    {{ __('frontend::lang.page.register.step3.wait_for_approval') }}
                                </div>
                            </div>
                            <div class="text-center space-y-4">
                                <div class="text-gray-600 leading-relaxed space-y-2">
                                    <h1 class="text-2xl font-bold text-med-dark">
                                        {{ __('frontend::lang.page.register.step3.thank_you_for_registering') }}
                                    </h1>
                                    <p>
                                        {{ __('frontend::lang.page.register.step3.wait_for_approval_desc') }}
                                    </p>
                                </div>
                            </div>
                        @endif
                        <div class="flex justify-center items-center gap-4 pt-6 mt-6 border-t border-gray-200">
                            <a class="w-full md:w-auto bg-med-primary hover:bg-med-secondary text-white px-8 py-3 rounded-full font-semibold flex justify-center items-center gap-2 transition-all shadow-md transform active:scale-95" href="{{ mwz_route('frontend.login') }}">
                                <i class="fa-solid fa-arrow-left"></i>
                                {{ __('frontend::lang.btn.back_to_login') }}
                            </a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection