import{template as t,makeStyleResponsive as r}from"@gem-sdk/core";import{getLiquidForAppBlock as e}from"../common/helpers.js";let UppromoteAffiliateMarketing=({setting:o,advanced:i})=>{let{align:a,appBlockId:s}=o??{};return o?.widgetType==="registration-form"?t`
       <div
          class="[&_*]:gp-max-w-none ${i?.cssClass}"
          style="${{...r("ta",a)}}"
        >
          <link rel="preload" href="https://d2y7ju1jo0r0dd.cloudfront.net/img/bg.png" as="image" />
          <style>
              body {
                  --section-corners: {{ block.settings.section_width }}%;
                  --border-radius: {{ block.settings.border_radius }}px;
                  --top-margin: {{ block.settings.top_margin }}px;
                  --bottom-margin: {{ block.settings.bottom_margin }}px;
              }

              [data-block-handle="registration-form"] {
                  width: 100%;
              }

              .wrapper-registration {
                  width: var(--section-corners);
                  height: 960px;
                  margin: 0 auto;
                  overflow: hidden;
                  display: block !important;
                  border-radius: var(--border-radius);
                  margin-top: var(--top-margin);
                  margin-bottom: var(--bottom-margin);
                  visibility: hidden;
                  position: relative;
              }

              #registration_form {
                  position: relative;
              }

              .loader-registration,
              .loader-registration:after {
                  border-radius: 50%;
                  width: 10em;
                  height: 10em;
              }

              .loader-registration {
                  display: block !important;
                  position: absolute;
                  left: 50%;
                  transform: translateX(-50%);
                  margin: 60px auto;
                  font-size: 5px;
                  text-indent: -9999em;
                  border-top: 1.1em solid rgba(255, 255, 255, 0.2);
                  border-right: 1.1em solid rgba(255, 255, 255, 0.2);
                  border-bottom: 1.1em solid rgba(255, 255, 255, 0.2);
                  border-left: 1.1em solid #000000;
                  -webkit-transform: translateZ(0);
                  -ms-transform: translateZ(0);
                  transform: translateZ(0);
                  -webkit-animation: load8 0.8s infinite linear;
                  animation: load8 0.8s infinite linear;
              }

              @-webkit-keyframes load8 {
                  0% {
                      -webkit-transform: rotate(0deg);
                      transform: rotate(0deg);
                  }
                  100% {
                      -webkit-transform: rotate(360deg);
                      transform: rotate(360deg);
                  }
              }

              @keyframes load8 {
                  0% {
                      -webkit-transform: rotate(0deg);
                      transform: rotate(0deg);
                  }
                  100% {
                      -webkit-transform: rotate(360deg);
                      transform: rotate(360deg);
                  }
              }
          </style>
          <div class="loader-registration"></div>
          <div class="wrapper-registration" data-shopDomain="{{shop.permanent_domain}}">
          </div>
          <script defer src="https://extensions.uppromote.com/dev/assets/registration-form.js"></script>
        </div>
    `:e(s,a,i?.cssClass)};export{UppromoteAffiliateMarketing as default};
