@extends('EcomAuthViews::layouts.authentication.layout')

@section('content')
@php
    $country_code = country()->code();
    $config=config('ecom-auth');
@endphp
<form class="twa-form" action="@if(isset($reset) && $reset) {{route('account-login-verify-challenge-reset')}} @else {{route('account-login-verify-challenge')}} @endif" method="POST"  id="otp-form" >
    @csrf
    @component('EcomGeneralViews::components.form.input', [ "parentClass" => "", "size" => "full", "type" => "text", "label" =>"" ])
        <a class="back-button" href="javascript:;" onclick="history.back()"><b><i class="fa-solid fa-arrow-left"></i> &nbsp; Back</b></a>
    @endcomponent
    @component('EcomGeneralViews::components.form.input', [ "parentClass" => "", "size" => "full", "type" => "text", "label" =>(isset($message)? $message: '') ])
    @endcomponent
    @component('EcomGeneralViews::components.form.input', [ "parentClass" => "", "size" => "full", "type" => "text", "label" => ___('authentication.pin') ])
        <div id="timerDiv"></div>
        <div class="code-input-group" data-fnc="AUTHENTICATION_verifyOTP">
            <input name="code[]" class="code-input" required maxlength="1"></input>
            <input name="code[]" class="code-input" required maxlength="1"></input>
            <input name="code[]" class="code-input" required maxlength="1"></input>
            <input name="code[]" class="code-input" required maxlength="1"></input>
        </div>
    @endcomponent

    @if(isset($phoneInput) && $phoneInput==true)
        <input type="hidden" name="phoneInput" value="1">
    @endif
    <input type="hidden" name="challenge" value="{{$challenge}}">
{{--    @component('EcomGeneralViews::components.form.input', [ "parentClass" => "", "size" => "full", "type" => "submit", "label" => "" ])--}}
{{--        <input type="submit" value="{{ ___('authentication.continue') }}" />--}}
{{--    @endcomponent--}}
</form>
{{--            @if(isset($config['providers']['facebook']))--}}
{{--            <a href="#" class="icon-button">--}}
{{--                <div class="icon"><svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" role="presentation" aria-hidden="true" focusable="false" style="height: 20px; width: 20px; display: block; fill: currentcolor;"><defs><path id="a" d="M.001 0H24v23.854H.001z"></path></defs><g fill="none" fill-rule="evenodd"><mask id="b" fill="#fff"><use xlink:href="#a"></use></mask><path d="M24 12c0-6.627-5.373-12-12-12S0 5.373 0 12c0 5.99 4.388 10.954 10.125 11.854V15.47H7.078V12h3.047V9.356c0-3.007 1.792-4.668 4.533-4.668 1.312 0 2.686.234 2.686.234v2.953H15.83c-1.491 0-1.956.925-1.956 1.874V12h3.328l-.532 3.469h-2.796v8.385C19.612 22.954 24 17.99 24 12" fill="#1877F2" mask="url(#b)"></path><path d="M16.671 15.469L17.203 12h-3.328V9.749c0-.949.465-1.874 1.956-1.874h1.513V4.922s-1.374-.234-2.686-.234c-2.741 0-4.533 1.66-4.533 4.668V12H7.078v3.469h3.047v8.385a12.09 12.09 0 003.75 0V15.47h2.796" fill="#FFF"></path></g></svg></div>--}}
{{--                <div class="text">Continue with Facebook</div>--}}
{{--                <div class="icon"></div>--}}
{{--            </a>--}}
{{--            @endif--}}
{{--@if(isset($config['providers']['google']))--}}
{{--            <a href="#" class="icon-button">--}}
{{--                <div class="icon"><svg viewBox="0 0 18 18" role="presentation" aria-hidden="true" focusable="false" style="height: 20px; width: 20px; display: block;"><g fill="none" fill-rule="evenodd"><path d="M9 3.48c1.69 0 2.83.73 3.48 1.34l2.54-2.48C13.46.89 11.43 0 9 0 5.48 0 2.44 2.02.96 4.96l2.91 2.26C4.6 5.05 6.62 3.48 9 3.48z" fill="#EA4335"></path><path d="M17.64 9.2c0-.74-.06-1.28-.19-1.84H9v3.34h4.96c-.1.83-.64 2.08-1.84 2.92l2.84 2.2c1.7-1.57 2.68-3.88 2.68-6.62z" fill="#4285F4"></path><path d="M3.88 10.78A5.54 5.54 0 0 1 3.58 9c0-.62.11-1.22.29-1.78L.96 4.96A9.008 9.008 0 0 0 0 9c0 1.45.35 2.82.96 4.04l2.92-2.26z" fill="#FBBC05"></path><path d="M9 18c2.43 0 4.47-.8 5.96-2.18l-2.84-2.2c-.76.53-1.78.9-3.12.9-2.38 0-4.4-1.57-5.12-3.74L.97 13.04C2.45 15.98 5.48 18 9 18z" fill="#34A853"></path><path d="M0 0h18v18H0V0z"></path></g></svg></div>--}}
{{--                <div class="text">Continue with Google</div>--}}
{{--                <div class="icon"></div>--}}
{{--            </a>--}}
{{--@endif--}}
{{--@if(isset($config['providers']['apple']))--}}
{{--            <a href="#" class="icon-button">--}}
{{--                <div class="icon"><svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" role="presentation" aria-hidden="true" focusable="false" style="height: 20px; width: 20px; display: block; fill: currentcolor;"><path d="m13.3 2.1a5.1 5.1 0 0 1 3.8-2.1 5.1 5.1 0 0 1 -1.2 3.8 4.1 4.1 0 0 1 -3.6 1.7 4.5 4.5 0 0 1 1-3.4zm-5 3.7c-2.8 0-5.8 2.5-5.8 7.3 0 4.9 3.5 10.9 6.3 10.9 1 0 2.5-1 4-1s2.6.9 4 .9c3.1 0 5.3-6.4 5.3-6.4a5.3 5.3 0 0 1 -3.2-4.9 5.2 5.2 0 0 1 2.6-4.5 5.4 5.4 0 0 0 -4.7-2.4c-2 0-3.5 1.1-4.3 1.1-.9 0-2.4-1-4.2-1z"></path></svg></div>--}}
{{--                <div class="text">Continue with Apple</div>--}}
{{--                <div class="icon"></div>--}}
{{--            </a>--}}
{{--            @endif--}}
{{--            <a href="#" class="icon-button">--}}
{{--                <div class="icon"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32" aria-hidden="true" role="presentation" focusable="false" style="display: block; height: 20px; width: 20px; fill: currentcolor;"><path d="M30.5105,5.87921A5.06207,5.06207,0,0,0,26,3H6A5.06215,5.06215,0,0,0,1.48932,5.87946,4.9444,4.9444,0,0,0,1,8V24a5.00588,5.00588,0,0,0,5,5H26a5.00588,5.00588,0,0,0,5-5V8A4.94373,4.94373,0,0,0,30.5105,5.87921ZM6,5H26a2.97234,2.97234,0,0,1,1.77252.59253l-9.8194,8.41675a2.98373,2.98373,0,0,1-3.90527,0l-9.82013-8.417A2.97238,2.97238,0,0,1,6,5ZM29,24a3.00328,3.00328,0,0,1-3,3H6a3.00328,3.00328,0,0,1-3-3V8a2.96566,2.96566,0,0,1,.10266-.73773l9.64343,8.26556a4.97272,4.97272,0,0,0,6.50782,0L28.89728,7.262A2.96542,2.96542,0,0,1,29,8Z"></path></svg></div>--}}
{{--                <div class="text">Continue with Email</div>--}}
{{--                <div class="icon"></div>--}}
{{--            </a>--}}
@endsection
@section('scripts')

   <script>
       $( document ).ready(function() {

           AUTHENTICATION_InitCodeGroup('code-input-group');
           AUTHENTICATION_start_timer();
       });




   </script>

@endsection