@if ($errors->any())
    <div class="alert alert-danger">
        <ul>
            @foreach ($errors->all() as $error)
                <li>{{ $error }}</li>
            @endforeach
        </ul>
    </div>
@endif
<!-- <======================= StartContactForm =========================> -->
<form class="dz-form dzForm" method="POST" action="{{ route('website.saveConatct') }}">
    <input type="hidden" class="form-control" name="dzToDo" value="Contact">
    <input type="hidden" class="form-control" name="reCaptchaEnable" value="0">
    <div class="dzFormMsg"></div>
    <div class="row">
        <div class="col-sm-6">
            <label class="form-label">{{__('website.name')}}</label>
            <div class="input-group">
                <input required="" type="text" class="form-control" name="name" placeholder="{{__('website.name')}}">
            </div>
        </div>
        <div class="col-sm-6">
            <label class="form-label">{{__('website.email')}}</label>
            <div class="input-group">
                <input required="" type="email" class="form-control" name="email" placeholder="{{__('website.email')}}">
            </div>
        </div>
        <div class="col-sm-6">
            <label class="form-label">{{__('website.phone')}}</label>
            <div class="input-group">
                <input required="" type="tel" class="form-control" name="phone" placeholder="{{__('website.phone')}}">
            </div>
        </div>
        <div class="col-sm-6">
            <label class="form-label">{{__('website.subject')}}</label>
            <div class="input-group">
                <input required="" type="text" class="form-control" name="company" placeholder="{{__('website.subject')}}">
            </div>
        </div>
        <div class="col-sm-12">
            <label class="form-label">{{__('website.message')}}</label>
            <div class="input-group">
                <textarea name="message" rows="4" required=""
                    class="form-control textarea border-top-0 border-start-0 border-end-0" placeholder="{{__('website.message')}}"></textarea>
            </div>
        </div>
        <div class="col-sm-12">
            <div class="input-recaptcha mb-40">
                <div class="g-recaptcha" data-sitekey="6LefsVUUAAAAADBPsLZzsNnETChealv6PYGzv3ZN"
                    data-callback="verifyRecaptchaCallback" data-expired-callback="expiredRecaptchaCallback"></div>
                <input class="form-control hidden" style="display:none;" data-recaptcha="true" required
                    data-error="Please complete the Captcha">
            </div>
        </div>

        <div>

            @if (config('captcha.sitekey') && config('captcha.sitekey') !== 'Key')
                <input type="hidden" name="recaptcha_token" id="recaptcha_token">
            @endif
            <button name="submit" type="submit" value="submit"
                class="btn btn-lg btn-icon btn-rounded btn-secondary btn-style1 mt-3">{{__('website.submit')}}
                <span class="right-icon">
                    <svg width="22" height="16" viewBox="0 0 22 16" fill="none"
                        xmlns="http://www.w3.org/2000/svg">
                        <path
                            d="M12.4545 15.4999C12.3311 15.5024 12.2067 15.4709 12.0969 15.3998C11.7802 15.1953 11.6838 14.7514 11.8743 14.4197C11.8903 14.3904 13.8809 10.9078 17.6807 8.71607H0.681818C0.305795 8.71607 0 8.39547 0 8.00124C0 7.607 0.305795 7.2864 0.681818 7.2864H17.6807C13.902 5.10722 11.889 1.60917 11.8692 1.57415C11.6827 1.24032 11.786 0.796048 12.1041 0.598396C12.4266 0.397885 12.8514 0.514045 13.044 0.85395C13.3539 1.37221 16.2598 6.01828 21.4719 7.30391C21.7839 7.38433 22 7.67062 22 8.00159C22 8.33256 21.7852 8.61957 21.4777 8.69784C16.2434 9.98812 13.3474 14.6403 13.0344 15.1668C12.9117 15.373 12.6847 15.4952 12.4545 15.4999Z"
                            fill="black" />
                    </svg>
                </span></button>
        </div>
    </div>
</form>
<!-- <======================= EndContactForm =========================> -->
@if (config('captcha.sitekey') && config('captcha.sitekey') !== 'Key')
    <script src="https://www.google.com/recaptcha/api.js?render={{ config('captcha.sitekey') }}"></script>

    <script>
        grecaptcha.ready(function() {
            grecaptcha.execute('{{ config('captcha.sitekey') }}', {
                action: 'contact'
            }).then(function(token) {
                document.getElementById('recaptcha_token').value = token;
            }).catch(function(error) {
                console.warn('reCAPTCHA error:', error);
            });
        });
    </script>
@else
    <script>
        console.warn('reCAPTCHA is not configured properly. Please set NOCAPTCHA_SITEKEY in your .env file');
    </script>
@endif