<div class="page login-bg1">
  <div class="page-single">
    <div class="container">
      <div class="row justify-content-center py-4">
        <div class="col-sm-12">
          <div class="card captcha-card px-3 py-5 mx-auto">
            <div class="pb-0 px-5 pt-0 text-center">
              <h3 class="mb-2">{{'Enter Captcha' | translate}}</h3>
            </div>
            <form class="card-body pt-3 pb-0" #ipblock="ngForm" (ngSubmit)="ipblockupdate(ipblock)">

              <div class="form-group row justify-content-center">
                <div class="col-md-12 mb-3">
                  @if (setting?.CAPTCHATYPE == 'manual') {
                    <!-- @if (setting?.RECAPTCH_ENABLE_CONTACT == 'yes') { -->
                      <div class="form-group row">
                        <app-manualcaptcha (captchaComplete)="manualCaptchEvent($event)"
                        required [canvasId]="'IpBlock'"></app-manualcaptcha>
                        <div>
                          @if (captchaMessage) {
                            <span class="text-danger">{{captchaMessage |
                            translate}}</span>
                          }
                        </div>
                      </div>
                    <!-- } -->
                  }

                  <!--- if Enable the Google ReCaptcha --->
                  <div class="form-group">
                    @if (setting?.CAPTCHATYPE == 'google') {
                      @if (!setting?.GOOGLE_RECAPTCHA_KEY) {
                        <p class="text-danger">Need to Provide the valid siteKey</p>
                      } @else {
                        <!-- @if (setting?.RECAPTCH_ENABLE_CONTACT == 'yes') { -->
                          <re-captcha #googlerecaptcha [(ngModel)]="captcha"
                            name="g-recaptcha-response" required #captchaControl="ngModel"
                            (resolved)="resolved($event)"
                          [siteKey]="setting?.GOOGLE_RECAPTCHA_KEY"></re-captcha>
                        <!-- } -->
                      }
                    }

                  </div>
                  <!--- End Google ReCaptcha --->
                </div>
              </div>

              <div class="submit">
                <button class="btn btn-secondary btn-block" type="submit">{{'Submit' |
                translate}}</button>
              </div>
            </form>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>