<turbo-stream action="prepend" target="modals">
  <template><div
  class="modal fade"
  id="customer_signup_modal"
  data-modals-target="modal"
  tabindex="-1"
  aria-labelledby="customer_signup_modalLabel"
  aria-modal="true"
>
  <div class="modal-dialog modal-dialog-centered modal-dialog-scrollable modal-lg">
    <div class="modal-content">
      <div class="modal-header"><h1 class="modal-title fs-5" id="customer_signup_modalLabel">Konto anlegen</h1><button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Schließen"></button>
      </div>
      <div class="modal-body"><form
  id="registration-form-container"
  method="post"action="/customer.turbo_stream"
  novalidate
  data-controller="form"
  data-action="submit->form#validate"
>
  <input type="hidden" name="_method" value="post" autocomplete="off">
  <input type="hidden" name="authenticity_token" value="V4kvxifrJPS_t38E7HBhQ5ZS7resOcSleF8kV-xaMudxn-M8c8F83RqCHjjhV_YbLeNOpNSZPNVNmb4qdatkuw" autocomplete="off"><input type="hidden" name="modal_id" value="customer_signup_modal" autocomplete="off"><div id="additional_invalid_feedback"></div>

  <div class="d-flex flex-column gap-4">
    <div id="country_input"><div class="form-floating">
  <select
    value="DE"
    id="country"
    name="customer[address][country]"
    class="form-select scroll-m-5"
    aria-label="Land/Region"
    aria-describedby="country_feedback"
    required
    autocomplete=" country"><option
      value=""
      disabled>Bitte wählen</option><option
        value="DE"selected="true">Deutschland</option><option
        value="AT">Österreich</option><option
        value="CH">Schweiz</option><option
        value="LU">Luxemburg</option><option
        value="FR">Frankreich</option><option
        value="NL">Niederlande</option><option
        value="BE">Belgien</option><option
        value="DK">Dänemark</option><option
        value="PL">Polen</option><option
        value="CZ">Tschechische Republik</option><option
        value="AC">Ascension</option><option
        value="AD">Andorra</option><option
        value="AE">Vereinigte Arabische Emirate</option><option
        value="AF">Afghanistan</option><option
        value="AG">Antigua und Barbuda</option><option
        value="AI">Anguilla</option><option
        value="AL">Albanien</option><option
        value="AM">Armenien</option><option
        value="AN">Niederländische Antillen</option><option
        value="AO">Angola</option><option
        value="AQ">Antarktis</option><option
        value="AR">Argentinien</option><option
        value="AS">Amerikanisch-Samoa</option><option
        value="AU">Australien</option><option
        value="AW">Aruba</option><option
        value="AX">Åland-Inseln</option><option
        value="AZ">Aserbaidschan</option><option
        value="BA">Bosnien und Herzegowina</option><option
        value="BB">Barbados</option><option
        value="BD">Bangladesch</option><option
        value="BF">Burkina Faso</option><option
        value="BG">Bulgarien</option><option
        value="BH">Bahrain</option><option
        value="BI">Burundi</option><option
        value="BJ">Benin</option><option
        value="BL">St. Barthélemy</option><option
        value="BM">Bermuda</option><option
        value="BN">Brunei Darussalam</option><option
        value="BO">Bolivien</option><option
        value="BQ">Karibische Niederlande</option><option
        value="BR">Brasilien</option><option
        value="BS">Bahamas</option><option
        value="BT">Bhutan</option><option
        value="BV">Bouvetinsel</option><option
        value="BW">Botsuana</option><option
        value="BY">Belarus</option><option
        value="BZ">Belize</option><option
        value="CA">Kanada</option><option
        value="CC">Kokosinseln</option><option
        value="CD">Kongo-Kinshasa</option><option
        value="CF">Zentralafrikanische Republik</option><option
        value="CG">Kongo-Brazzaville</option><option
        value="CK">Cookinseln</option><option
        value="CL">Chile</option><option
        value="CM">Kamerun</option><option
        value="CN">China</option><option
        value="CO">Kolumbien</option><option
        value="CP">Clipperton-Insel</option><option
        value="CR">Costa Rica</option><option
        value="CU">Kuba</option><option
        value="CV">Kap Verde</option><option
        value="CW">Curaçao</option><option
        value="CX">Weihnachtsinsel</option><option
        value="CY">Zypern</option><option
        value="DG">Diego Garcia</option><option
        value="DJ">Dschibuti</option><option
        value="DM">Dominica</option><option
        value="DO">Dominikanische Republik</option><option
        value="DZ">Algerien</option><option
        value="EA">Ceuta und Melilla</option><option
        value="EC">Ecuador</option><option
        value="EE">Estland</option><option
        value="EG">Ägypten</option><option
        value="EH">Westsahara</option><option
        value="ER">Eritrea</option><option
        value="ES">Spanien</option><option
        value="ET">Äthiopien</option><option
        value="FI">Finnland</option><option
        value="FJ">Fidschi</option><option
        value="FK">Falklandinseln</option><option
        value="FM">Mikronesien</option><option
        value="FO">Färöer</option><option
        value="GA">Gabun</option><option
        value="GB">Vereinigtes Königreich</option><option
        value="GD">Grenada</option><option
        value="GE">Georgien</option><option
        value="GF">Französisch-Guayana</option><option
        value="GG">Guernsey</option><option
        value="GH">Ghana</option><option
        value="GI">Gibraltar</option><option
        value="GL">Grönland</option><option
        value="GM">Gambia</option><option
        value="GN">Guinea</option><option
        value="GP">Guadeloupe</option><option
        value="GQ">Äquatorialguinea</option><option
        value="GR">Griechenland</option><option
        value="GS">Südgeorgien und die Südlichen Sandwichinseln</option><option
        value="GT">Guatemala</option><option
        value="GU">Guam</option><option
        value="GW">Guinea-Bissau</option><option
        value="GY">Guyana</option><option
        value="HK">Sonderverwaltungszone Hongkong</option><option
        value="HM">Heard- und McDonald-Inseln</option><option
        value="HN">Honduras</option><option
        value="HR">Kroatien</option><option
        value="HT">Haiti</option><option
        value="HU">Ungarn</option><option
        value="IC">Kanarische Inseln</option><option
        value="ID">Indonesien</option><option
        value="IE">Irland</option><option
        value="IL">Israel</option><option
        value="IM">Isle of Man</option><option
        value="IN">Indien</option><option
        value="IO">Britisches Territorium im Indischen Ozean</option><option
        value="IQ">Irak</option><option
        value="IR">Iran</option><option
        value="IS">Island</option><option
        value="IT">Italien</option><option
        value="JE">Jersey</option><option
        value="JM">Jamaika</option><option
        value="JO">Jordanien</option><option
        value="JP">Japan</option><option
        value="KE">Kenia</option><option
        value="KG">Kirgisistan</option><option
        value="KH">Kambodscha</option><option
        value="KI">Kiribati</option><option
        value="KM">Komoren</option><option
        value="KN">St. Kitts und Nevis</option><option
        value="KP">Demokratische Volksrepublik Korea</option><option
        value="KR">Republik Korea</option><option
        value="KW">Kuwait</option><option
        value="KY">Kaimaninseln</option><option
        value="KZ">Kasachstan</option><option
        value="LA">Laos</option><option
        value="LB">Libanon</option><option
        value="LC">St. Lucia</option><option
        value="LI">Liechtenstein</option><option
        value="LK">Sri Lanka</option><option
        value="LR">Liberia</option><option
        value="LS">Lesotho</option><option
        value="LT">Litauen</option><option
        value="LV">Lettland</option><option
        value="LY">Libyen</option><option
        value="MA">Marokko</option><option
        value="MC">Monaco</option><option
        value="MD">Republik Moldau</option><option
        value="ME">Montenegro</option><option
        value="MF">St. Martin</option><option
        value="MG">Madagaskar</option><option
        value="MH">Marshallinseln</option><option
        value="MK">Mazedonien</option><option
        value="ML">Mali</option><option
        value="MM">Myanmar</option><option
        value="MN">Mongolei</option><option
        value="MO">Sonderverwaltungsregion Macau</option><option
        value="MP">Nördliche Marianen</option><option
        value="MQ">Martinique</option><option
        value="MR">Mauretanien</option><option
        value="MS">Montserrat</option><option
        value="MT">Malta</option><option
        value="MU">Mauritius</option><option
        value="MV">Malediven</option><option
        value="MW">Malawi</option><option
        value="MX">Mexiko</option><option
        value="MY">Malaysia</option><option
        value="MZ">Mosambik</option><option
        value="NA">Namibia</option><option
        value="NC">Neukaledonien</option><option
        value="NE">Niger</option><option
        value="NF">Norfolkinsel</option><option
        value="NG">Nigeria</option><option
        value="NI">Nicaragua</option><option
        value="NO">Norwegen</option><option
        value="NP">Nepal</option><option
        value="NR">Nauru</option><option
        value="NU">Niue</option><option
        value="NZ">Neuseeland</option><option
        value="OM">Oman</option><option
        value="PA">Panama</option><option
        value="PE">Peru</option><option
        value="PF">Französisch-Polynesien</option><option
        value="PG">Papua-Neuguinea</option><option
        value="PH">Philippinen</option><option
        value="PK">Pakistan</option><option
        value="PM">St. Pierre und Miquelon</option><option
        value="PN">Pitcairninseln</option><option
        value="PR">Puerto Rico</option><option
        value="PS">Palästinensische Autonomiegebiete</option><option
        value="PT">Portugal</option><option
        value="PW">Palau</option><option
        value="PY">Paraguay</option><option
        value="QA">Katar</option><option
        value="QO">Äußeres Ozeanien</option><option
        value="RE">Réunion</option><option
        value="RO">Rumänien</option><option
        value="RS">Serbien</option><option
        value="RW">Ruanda</option><option
        value="SA">Saudi-Arabien</option><option
        value="SB">Salomonen</option><option
        value="SC">Seychellen</option><option
        value="SD">Sudan</option><option
        value="SE">Schweden</option><option
        value="SG">Singapur</option><option
        value="SH">St. Helena</option><option
        value="SI">Slowenien</option><option
        value="SJ">Svalbard und Jan Mayen</option><option
        value="SK">Slowakei</option><option
        value="SL">Sierra Leone</option><option
        value="SM">San Marino</option><option
        value="SN">Senegal</option><option
        value="SO">Somalia</option><option
        value="SR">Suriname</option><option
        value="SS">Südsudan</option><option
        value="ST">São Tomé und Príncipe</option><option
        value="SV">El Salvador</option><option
        value="SX">Sint Maarten</option><option
        value="SY">Syrien</option><option
        value="SZ">Swasiland</option><option
        value="TA">Tristan da Cunha</option><option
        value="TC">Turks- und Caicosinseln</option><option
        value="TD">Tschad</option><option
        value="TF">Französische Süd- und Antarktisgebiete</option><option
        value="TG">Togo</option><option
        value="TH">Thailand</option><option
        value="TJ">Tadschikistan</option><option
        value="TK">Tokelau</option><option
        value="TL">Timor-Leste</option><option
        value="TM">Turkmenistan</option><option
        value="TN">Tunesien</option><option
        value="TO">Tonga</option><option
        value="TR">Türkei</option><option
        value="TT">Trinidad und Tobago</option><option
        value="TV">Tuvalu</option><option
        value="TW">Taiwan</option><option
        value="TZ">Tansania</option><option
        value="UA">Ukraine</option><option
        value="UG">Uganda</option><option
        value="UM">Amerikanisch-Ozeanien</option><option
        value="US">Vereinigte Staaten</option><option
        value="UY">Uruguay</option><option
        value="UZ">Usbekistan</option><option
        value="VA">Vatikanstadt</option><option
        value="VC">St. Vincent und die Grenadinen</option><option
        value="VE">Venezuela</option><option
        value="VG">Britische Jungferninseln</option><option
        value="VI">Amerikanische Jungferninseln</option><option
        value="VN">Vietnam</option><option
        value="VU">Vanuatu</option><option
        value="WF">Wallis und Futuna</option><option
        value="WS">Samoa</option><option
        value="XK">Kosovo</option><option
        value="YE">Jemen</option><option
        value="YT">Mayotte</option><option
        value="ZA">Südafrika</option><option
        value="ZM">Sambia</option><option
        value="ZW">Simbabwe</option></select>
  <label for="country">Land/Region</label>
  <div id="country_feedback" class="invalid-feedback">Kein Land</div>
</div>
</div>
    <div id="email_input"><div class="form-floating">
  <input
    type="email"
    value=""
    class="form-control scroll-m-5"
    id="email"
    aria-describedby="email_feedback"
    name="customer[email]"
    placeholder="E-Mail"
    pattern="[^@\s]+@[^@\s]+\.[^@\s]+"required="true"autocomplete=" email"
  >
  <label for="email" class="text-muted">E-Mail</label>
  <div id="email_feedback" class="invalid-feedback">Ungültiges E-Mail-Format</div>
</div>
</div>
    <div id="password_input"><div class="form-floating">
  <input
    type="password"
    class="form-control scroll-m-5"
    id="password"
    aria-describedby="password_feedback"
    name="customer[password]"
    placeholder="Passwort"required="true">
  <label for="password" class="text-muted">Passwort</label>
  <div id="password_feedback" class="invalid-feedback">Kein Passwort</div>
  <div class="invalid-feedback text-muted">Mindestens fünf Zeichen</div>
</div>
</div>
    <div id="password_confirmation_input"><div class="form-floating">
  <input
    type="password"
    class="form-control scroll-m-5"
    id="password_confirmation"
    aria-describedby="password_feedback"
    name="customer[password_confirmation]"
    placeholder="Passwort wiederholen"required="true">
  <label for="password_confirmation" class="text-muted">Passwort wiederholen</label>
  <div id="password_feedback" class="invalid-feedback">Kein Passwort</div>
  <div class="invalid-feedback text-muted">Mindestens fünf Zeichen</div>
</div>
</div>
    <div class="d-flex gap-4">
      <div id="firstname_input" class="flex-fill"><div class="form-floating">
  <input
    type="text"
    value=""
    class="form-control scroll-m-5"
    id="firstname"
    aria-describedby="firstname_feedback"
    name="customer[address][firstname]"
    placeholder="Vorname"required="true"autocomplete=" given-name"
  >
  <label for="firstname" class="text-muted">Vorname</label>
  <div id="firstname_feedback" class="invalid-feedback">Kein Vorname</div>
</div>
</div>
      <div id="lastname_input" class="flex-fill"><div class="form-floating">
  <input
    type="text"
    value=""
    class="form-control scroll-m-5"
    id="lastname"
    aria-describedby="lastname_feedback"
    name="customer[address][lastname]"
    placeholder="Nachname"required="true"autocomplete=" family-name"
  >
  <label for="lastname" class="text-muted">Nachname</label>
  <div id="lastname_feedback" class="invalid-feedback">Kein Nachname</div>
</div>
</div>
    </div>
    <div id="companyname_input"><div class="form-floating">
  <input
    type="text"
    value=""
    class="form-control scroll-m-5"
    id="companyname"name="customer[address][companyname]"
    placeholder="Unternehmen (optional)"autocomplete=" organization"
  >
  <label for="companyname" class="text-muted">Unternehmen (optional)</label></div>
</div>
    <div id="street_input"><div class="form-floating">
  <input
    type="text"
    value=""
    class="form-control scroll-m-5"
    id="street"
    aria-describedby="street_feedback"
    name="customer[address][street]"
    placeholder="Straße und Hausnummer"required="true"pattern=".*[0-9].*"
    autocomplete=" street-address"
  >
  <label for="street" class="text-muted">Straße und Hausnummer</label>
  <div id="street_feedback" class="invalid-feedback">Keine Straße</div>
  <div class="invalid-feedback text-muted">Beispiel: 'Musterstraße 12'</div>
</div>
</div>
    <div id="address_addition_input"><div class="form-floating">
  <input
    type="text"
    value=""
    class="form-control scroll-m-5"
    id="address_addition"name="customer[address][address_addition]"
    placeholder="Wohnung, Stockwerk, etc. (optional)"autocomplete=" address-line3"
  >
  <label for="address_addition" class="text-muted">Wohnung, Stockwerk, etc. (optional)</label><div id="address_addition_help" class="form-text">Beispiel: '3.OG links'</div>
</div>
</div>
    <div class="d-flex gap-4">
      <div id="zip_code_input" class="flex-fill"><div class="form-floating">
  <input
    type="text"
    value=""
    class="form-control scroll-m-5"
    id="zip_code"
    aria-describedby="zip_code_feedback"
    name="customer[address][zip_code]"
    placeholder="PLZ"required="true"autocomplete=" postal-code"
  >
  <label for="zip_code" class="text-muted">PLZ</label>
  <div id="zip_code_feedback" class="invalid-feedback">Keine Postleitzahl (PLZ)</div>
</div>
</div>
      <div id="city_input" class="flex-fill"><div class="form-floating">
  <input
    type="text"
    value=""
    class="form-control scroll-m-5"
    id="city"
    aria-describedby="city_feedback"
    name="customer[address][city]"
    placeholder="Stadt"required="true"autocomplete=" address-level2"
  >
  <label for="city" class="text-muted">Stadt</label>
  <div id="city_feedback" class="invalid-feedback">Keine Stadt</div>
</div>
</div>
    </div>
    <div id="phone_input"><div class="form-floating">
  <input
    type="tel"
    value=""
    class="form-control scroll-m-5"
    id="phone"
    aria-describedby="phone_feedback"
    name="customer[address][phone]"
    placeholder="Telefonnummer (optional)"autocomplete=" tel"
  >
  <label for="phone" class="text-muted">Telefonnummer (optional)</label>
  <div id="phone_feedback" class="invalid-feedback">Falls wir Sie in Bezug auf Ihre Bestellung kontaktieren müssen</div>
  <div class="invalid-feedback text-muted">Beispiel: '0169 2347890'</div>
  <div id="phone_help" class="form-text">Falls wir Sie in Bezug auf Ihre Bestellung kontaktieren müssen</div>
</div>
</div>
  </div>

  <button class="btn btn-lg btn-primary mt-4 px-5 w-100" type="submit">
    <span>
      <span class="show-when-enabled">Absenden</span>
      <span class="show-when-disabled"><i class="fal fa-spinner fa-fw ms-2 fa-spin"></i></span>
    </span>
  </button><div class="mt-3 d-flex flex-column gap-2">
    <a
      href="/customer/login.turbo_stream"
      data-turbo-stream
      data-turbo-frame="_top"
      class="link-primary fw-bold text-center"
    >Bereits ein Konto? Jetzt anmelden</a>
  </div>
</form>
</div></div>
  </div>
</div>
</template>
</turbo-stream>
