@component(getPopupLayout(),  ['id' => 'register-modal'])
                <h5 class="modal-title text-center" id="register-modal-title">{{__('heading.heading_register_voucher')}}</h5>
                <div class="form text-left" id="register-modal-form" style="min-height:unset !important">
                    <div class="form-group name">
                        <label class="m-0" for="register-modal-name">{{ __('heading.form_label_name') }}</label>
                        <input type="text" class="form-control register-modal-input" id="register-modal-name" placeholder="">
                        <small class="form-text"></small>
                    </div>

                    <div class="form-group mobile">
                        <label class="m-0" for="register-modal-mobile">{{ __('heading.form_label_mobile') }}</label>
                        <div class="input-group">
                            <select class="input-group-prepend" id="register-modal-countrycode" style="width: auto">
                            </select>
                            <input type="number" class="form-control required register-modal-input" id="register-modal-mobile" placeholder="" inputmode="tel">
                        </div>
                        <small class="form-text"></small>
                    </div>

                    <div class="form-group email">
                        <label class="m-0" for="register-modal-name">{{ __('heading.form_label_email') }}</label>
                        <input type="email" class="form-control register-modal-input" id="register-modal-email" placeholder="" inputmode="email">
                        <small class="form-text"></small>
                    </div>



                    <div class="form-check">
                        <input checked class="required form-check-input register-modal-input" type="checkbox" id="register-modal-pdpa" value="pdpa">
                        <label class="form-check-label" for="register-modal-pdpa" id="register-modal-pdpa">
                            {!! __('heading.form_tnc_checkbox', ['url' => 'http://www.drea.com.sg/privacy-policy/'])  !!} <span id="company_policy"></span>
                        </label>
                        <small class="form-text"></small>
                    </div>

                    <div class="form-check">
                        <input  class="required form-check-input register-modal-input" type="checkbox" id="register-modal-age" value="age">
                        <label class="form-check-label" for="register-modal-age" >
                            {{ __('label.agreement_age_checkbox') }}
                        </label>
                        <small class="form-text"></small>
                    </div>

                    <div class="form-check">
                        <input  class="form-check-input register-modal-input" type="checkbox" id="register-modal-newsletter" value="newsletter">
                        <label class="form-check-label" for="register-modal-newsletter">
                            {{ __('label.agreement_newsletter_subscribe_checkbox', [ 'brand' => $account['company_name'] ?? '' ] )}}
                        </label>
                        <small class="form-text"></small>
                    </div>

                    <div class="form-check">
                        <input  class="form-check-input register-modal-input" type="checkbox" id="register-modal-tnc" value="tnc">
                        <label class="form-check-label" for="register-modal-tnc">
                            {{ __('label.agreement_read_tnc_checkbox') }}
                        </label>
                        <small class="form-text"></small>
                    </div>

                    <div class="form-check">
                        <input  class="form-check-input register-modal-input" type="checkbox" id="register-modal-all" value="all">
                        <label class="form-check-label" for="register-modal-all">
                            {{ __('label.agreement_agree_all_checkbox') }}
                        </label>
                        <small class="form-text"></small>
                    </div>

                    <small>{!! __('label.privacy_usage_info', [
                            'privacy_email' => config('digital_voucher.client.contact.privacy_email'),
                            'contact_tel' => config('digital_voucher.client.contact.tel'),
                            'contact_toll_free' => config('digital_voucher.client.contact.toll_free_tel'),
                            'privacy_notice' => config('digital_voucher.client.url.privacy_policy'),
                            'cookie_notice' => config('digital_voucher.client.url.tnc'),
                        ]) !!}
                    </small>
                </div>
                <div class="w-100 d-block text-center">
                    <button type="button" class="btn" id="register-modal-submit">{{ __('heading.form_button_get_voucher_now') }}</button>
                </div>
                @endcomponent