{config_load file="$language/lang_$language.conf" section="create_account"}
{config_load file="$language/own_lang_$language.conf" section="create_account"}
<style>
    .form-control{
        margin-top:5px;
    }
</style>
<div class="uberuns boxes pb-5">
	<div class="container bg-light border border-secondary border-2 p-3 rounded-3 shadow ">
        <!--<img src="{$tpl_path}/img/account-1.jpg" class="rounded rounded-3 mb-2 w-100">-->
        <h1 class="ico ico-9">Register customer account</h1>
	<div class=" mh">
        {if $error!=''}
        <div class="alert alert-danger"> {$error}</div>
        {/if} 
        <div class="text-center alert alert-primary mt-3">
            Please fill in all fields marked with *.
        </div>
        {$FORM_ACTION|replace:'name="create_account"':'name="create_account" data-abide novalidate'}
        <input type="hidden" name="action" value="process">
        <div class=" border-secondary border-2 rounded border p-3 h-100  bg-light">
            <h3>{#title_personal#|replace:"Ihre persönlichen Daten":"Your personal data"}</h3>
            <div class="row">
                {if $gender=='1'}
                <div class="col-12 col-lg">
                    
                   <label class="d-block">{#text_gender#|replace:"Anrede":"Title"} {if $INPUT_GENDER_ARRAY.plain.required=='1'}*{/if}                    </label>        

                    <fieldset class="mt-3">
                        {foreach from=$INPUT_GENDER_ARRAY.plain.values item=gend}
                        <input type="{$INPUT_GENDER_ARRAY.plain.type}" name="{$INPUT_GENDER_ARRAY.plain.name}" id="radio_{$gend.gender}" value="{$gend.value}" {if $INPUT_GENDER_ARRAY.plain.required=='1'}required{/if}><label  class=" me-3" for="radio_{$gend.gender}">{$gend.label|replace:"Herr":"Man"|replace:"Frau":"Woman"}</label>          {/foreach}
                     <input type="radio" name="gender" id="radio_" value="m" required=""><label for="radio_">Divers</label>
					</fieldset>
				    
                </div>
                {/if}
                <div class="col-12 col-lg">
                    <label  class="d-block ">{$INPUT_FIRSTNAME_ARRAY.plain.label|replace:"Vorname":"Firstname"} {if $INPUT_FIRSTNAME_ARRAY.plain.required =='1'}*{/if}</label>
                    <input class="form-control" placeholder="Max" type="{$INPUT_FIRSTNAME_ARRAY.plain.type}" name="{$INPUT_FIRSTNAME_ARRAY.plain.name}" {if $INPUT_FIRSTNAME_ARRAY.plain.required =='1'}required {/if} {if $INPUT_FIRSTNAME_ARRAY.plain.placeholder != ''} placeholder="{$INPUT_FIRSTNAME_ARRAY.plain.placeholder}" {/if}>
                </div>
                <div class="col-12 col-lg"><label  class="d-block ">{$INPUT_LASTNAME_ARRAY.plain.label|replace:"Nachname":"Lastname"} {if $INPUT_LASTNAME_ARRAY.plain.required =='1'}*{/if}</label>
                    <input class="form-control" placeholder="Musterman" type="{$INPUT_LASTNAME_ARRAY.plain.type}" name="{$INPUT_LASTNAME_ARRAY.plain.name}" {if $INPUT_LASTNAME_ARRAY.plain.required =='1'}required {/if} {if $INPUT_LASTNAME_ARRAY.plain.placeholder != ''} placeholder="{$INPUT_LASTNAME_ARRAY.plain.placeholder}" {/if}>
                </div>
            </div>
            <div class="row">
                <div class="col-12 col-lg"><label  class="d-block ">{$INPUT_EMAIL_ARRAY.plain.label|replace:"Email-Adresse":"Email address"} {if $INPUT_EMAIL_ARRAY.plain.required =='1'}*{/if}</label>
                    <input class="form-control" placeholder="max@musterman.com" type="{$INPUT_EMAIL_ARRAY.plain.type|replace:'text':'email'}" name="{$INPUT_EMAIL_ARRAY.plain.name}" {if $INPUT_EMAIL_ARRAY.plain.required =='1'}required {/if} {if $INPUT_EMAIL_ARRAY.plain.placeholder != ''} {/if}></div>
                {if $company=='1'}
                <div class="col-12 col-lg">
                    <label  class="d-block ">{$INPUT_COMPANY_ARRAY.plain.label|replace:"Firmenname":"Company name"}{if $INPUT_COMPANY_ARRAY.plain.required =='1'}*{/if}</label>
                    <input class="form-control" placeholder="Sample company" type="{$INPUT_COMPANY_ARRAY.plain.type}" name="{$INPUT_COMPANY_ARRAY.plain.name}" {if $INPUT_COMPANY_ARRAY.plain.required =='1'}required {/if} placeholder="Sample company}">
                </div>
                {/if}        
				
				<div class="col-12 col-lg-4">
					<label class="d-block" for="{$INPUT_VAT_ARRAY.plain.name}">{$INPUT_VAT_ARRAY.plain.label|replace:"Ust-Nr":"VAT no."}{if $INPUT_VAT_ARRAY.plain.required =='1'}*{/if} </label>
					<input class="form-control" placeholder="DE123456789" type="{$INPUT_VATL_ARRAY.plain.value}" name="{$INPUT_VAT_ARRAY.plain.name}" {if $INPUT_VAT_ARRAY.plain.required =='1'}required {/if}>
					</label>
				</div>
				
            </div>
            </div>
            <div class=" border-secondary border-2 rounded border p-3 h-100  bg-light mt-5">
            <h3>{* #title_address# *}Your address</h3>
            <div class="row">
                <div class="col-12 col-lg">
                    <label class="d-block">{$INPUT_STREET_ARRAY.plain.label|replace:"Strasse/Nr.":"Street"} {if $INPUT_STREET_ARRAY.plain.required =='1'}*{/if}</label>
                    <input class="form-control" placeholder="Street No: 1" type="{$INPUT_STREET_ARRAY.plain.type}" name="{$INPUT_STREET_ARRAY.plain.name}" {if $INPUT_STREET_ARRAY.plain.required =='1'}required class="req_input"{/if}">    
                </div>
                {if $suburb=='1'}
                <div class="col-12 col-lg">
                <label class="d-block">{$INPUT_SUBURB_ARRAY.plain.label|replace:"Stadtteil":"Address suffix"}  {if $INPUT_SUBURB_ARRAY.plain.required =='1'}<i class="fi-star"></i> {/if}</label>
                <input class="form-control" placeholder="Address suffix" type="{$INPUT_SUBURB_ARRAY.plain.type}" name="{$INPUT_SUBURB_ARRAY.plain.name}" {if $INPUT_SUBURB_ARRAY.plain.required =='1'}required {/if}>
                </div>
                {/if}
				<div class="col-12 col-lg-4">
					<label class="d-block" for="{$INPUT_TEL_ARRAY.plain.name}">{$INPUT_TEL_ARRAY.plain.label|replace:"Telefonnummer":"Phone number"}{if $INPUT_TEL_ARRAY.plain.required =='1'}*{/if} </label>
					<input class="form-control" placeholder="+49123" type="{$INPUT_TEL_ARRAY.plain.value}" name="{$INPUT_TEL_ARRAY.plain.name}" {if $INPUT_TEL_ARRAY.plain.required =='1'}required {/if}>
					</label>
				</div>
            </div>
            <div class="row">
                <div class="col-12 col-lg">
                    <label class="d-block ">{$INPUT_CODE_ARRAY.plain.label|replace:"Postleitzahl":"Zip code"} {if $INPUT_CODE_ARRAY.plain.required =='1'}* {/if}</label>
                    <input class="form-control" placeholder="12345" type="{$INPUT_CODE_ARRAY.plain.type}" name="{$INPUT_CODE_ARRAY.plain.name}" {if $INPUT_CODE_ARRAY.plain.required =='1'}required" {/if}>    
                </div>
                <div class="col-12 col-lg">
                    <label class="d-block ">{$INPUT_CITY_ARRAY.plain.label|replace:"Ort":"City"} {if $INPUT_CITY_ARRAY.plain.required =='1'}* {/if}</label>
                    <input class="form-control" placeholder="Mustercity" type="{$INPUT_CITY_ARRAY.plain.type}" name="{$INPUT_CITY_ARRAY.plain.name}" {if $INPUT_CITY_ARRAY.plain.required =='1'}required {/if}>
                </div>
                <div class="col-12 col-lg">
                    <label class="d-block ">{$INPUT_COUNTRY_ARRAY.plain.label|replace:"Land":"Country"} {if $INPUT_COUNTRY_ARRAY.plain.required=='1'}*{/if}</label>
                    <select  {if $INPUT_COUNTRY_ARRAY.plain.required =='1'}required {/if} name="{$INPUT_COUNTRY_ARRAY.plain.name}"  class="form-control">
                    <option value="">Please select your country</option>
                    <option value="81">Germany</option>
                    {foreach from=$INPUT_COUNTRY_ARRAY.plain.options item=country}
                    <option value="{$country.id}">{$country.name}</option>
                    {/foreach}
                    </select>
                </div>
				
				

				<!--<div class="col-12 col-lg-4">
					<label for="{$INPUT_FAX_ARRAY.plain.name}">{$INPUT_FAX_ARRAY.plain.label}{if $INPUT_FAX_ARRAY.plain.required =='1'}*{/if}</label>
					<label class="field prepend-icon">
					<input {if $INPUT_FAX_ARRAY.plain.required =='1'}required {/if} {if $INPUT_FAX_ARRAY.plain.value}value="{$INPUT_FAX_ARRAY.plain.value}"{/if} type="text" name="{$INPUT_FAX_ARRAY.plain.name}"  class="gui-input" placeholder="Faxnummer">
					</label>
				</div>-->
            </div>
            
            </div>
            <div class=" border-secondary border-2 rounded border p-3 h-100  bg-light mt-5">
                <div class="row">
                    <div class="col-12 col-lg-8">
                        <h3 class="">Your password</h3>
                    </div>
                    <div class="col-12 col-lg-4">
                        <h3>{#text_privacy#|replace:"Datenschutzerklärung":"Privacy policy"}</h3>
                    </div>
                </div>
                <div class="row">
                    <div class="col-12 col-lg">
                        
                    <label class="d-block">{#text_password#|replace:"Ihr Passwort":"Your password"} *                    </label>

                        <input class="form-control" type="password" name="password" maxlength="40" required placeholder="********" >
                    </div>
                    <div class="col-12 col-lg">                        
                        <label class="d-block">{#text_confirmation#|replace:"Passwort bestätigen":"Confirm password"}*</label>
                        <input type="password" class="form-control" name="confirmation" required maxlength="40" placeholder="********">
                    </div>
                    <div class="col-12 col-lg">                        
                        <a href="#" data-modalTitle='{#text_privacy#}' data-modalSize="md" data-modalCnt='{$PRIVACY_RAW}' class="btn btn-outline-primary modal-call btn-sm" style="margin-top:30px;">{#text_privacy#|replace:"Datenschutzerklärung":"Privacy policy"} show</a>
                    </div>
                </div>  
                </div>      
                <div class=" border-secondary border-2 rounded border p-3 h-100  bg-light mt-5">    
                <h3 class="">Complete registration</h3>
                <div class="row">
                    <div class="col-12 col-lg">Your data will be included in our customer database.</div>
                    <div class="col-12 col-lg">{$YES_CAPTCHA}
					</div>
                    <div class="col-12 col-lg"><input type="submit" class="btn btn-primary w-100 d-block mt-3" value="Register account"></div>
                </div>
            </div>
    </form>
</div>
</div>
</div>