@section('optional_css')
    {!! htmlScriptTagJsApi() !!}
@endsection
<x-guest-layout>
    <x-auth-card>
        <x-slot name="logo">
            <a href="/">
                <img src="{{ Storage::url(Setting::getSetting('company-logo')) }}" height="150">
            </a>
        </x-slot>

        <!-- Session Status -->
        <x-auth-session-status :status="session('status')" />

        <!-- Validation Errors -->
        <x-auth-validation-errors :errors="$errors" />

        <form method="POST" action="{{ route('activated-otp') }}">
            @csrf
            <x-input-group class="mb-3">
                <x-slot name="icon">
                    <span class="fas fa-phone"></span>
                </x-slot>
                <x-input id="phone" type="text" name="phone" :value="old('phone')"  placeholder="{{ __('No WA Active') }}" required autofocus />
            </x-input-group>
            {!! htmlFormSnippet() !!}
            <div class="social-auth-links text-center mt-2 mb-3">
                <x-button class="btn-block">
                    {{ __('Request OTP') }}
                </x-button>
            </div>
        </form>
    </x-auth-card>
</x-guest-layout>