<div class="ecp-component ecp_CreateGuestCustomer">
  <h2 aria-describedby="ecpi_CreateGuestCustomer_info">{message:CreateGuestCustomer/Title}</h2>
  <p id="ecpi_CreateGuestCustomer_info" class="ecp-summary">{message:CreateGuestCustomer/Summary}</p>
  <form class="ecp-form">
    <div role="region" aria-labelledby="ecpi_info_title">
      <h3 id="ecpi_info_title">{message:CreateGuestCustomer/PersonalInfoTitle}</h3>
      <div class="ecp-form-fieldset-scrunched">
        <input type="text" name="email_address" placeholder="{message:CreateGuestCustomer/EmailInput}" aria-label="{message:CreateGuestCustomer/EmailInputLabel}" autocomplete="email" required>
      </div>
      <div data-ecp-handle="personal_info">
        <div class="ecp-section">
          <div class="ecp-form-fieldset-scrunched">
            <input type="text" name="first_name" placeholder="{message:CreateGuestCustomer/FirstNameInput}" aria-label="{message:CreateGuestCustomer/FirstNameInputLabel}" autocomplete="given-name" required>
            <input type="text" name="last_name" placeholder="{message:CreateGuestCustomer/LastNameInput}" aria-label="{message:CreateGuestCustomer/LastNameInputLabel}" autocomplete="family-name" required>
          </div>
          <ul class="ecp-form-checkboxes">
            <li><label><input type="checkbox" name="is_ok_to_email">{message:CreateGuestCustomer/OKToEmail}</label></li>
          </ul>
        </div>
        <div class="ecp-section" data-ecp-handle="customer_tags_section" role="region" aria-labelledby="ecpi_tags_title">
          <h3 class="ecp-bottomline" id="ecpi_tags_title">{message:CreateGuestCustomer/TagsTitle}</h3>
          <div data-ecp-handle="customer_tags">
            <!-- 
              | CustomerTag__Single template |
              or
              | CustomerTag__Multiple template | 
            -->
          </div>
        </div>
        <button data-ecp-handle="save_button" data-ecp-action="save" aria-label="{message:CreateGuestCustomer/SaveButtonLabel}">{message:CreateGuestCustomer/SaveButton}</button>
      </div>
      <div data-ecp-handle="login_info">
        <p data-ecp-handle="email_taken">{message:CreateGuestCustomer/Validation/EmailTaken_template}</p>
        <div class="ecp-form-fieldset-scrunched">
          <input type="password" name="password" placeholder="{message:CreateGuestCustomer/PasswordInput}" aria-label="{message:CreateGuestCustomer/PasswordInputLabel}" autocomplete="current-password" autofocus required>
        </div>
        <p><a href="#" class="ecp-option" data-ecp-action="forgot">{message:CreateGuestCustomer/PasswordResetLink}</a></p>
        <button data-ecp-handle="login_button" data-ecp-action="login" aria-label="{message:CreateGuestCustomer/LoginButtonLabel}">{message:CreateGuestCustomer/LoginButton}</button>
      </div>
    </div>
  </form>
</div>