{assign var="billingData" value=$paymentProfile->billingData}

<script language="javascript" type="text/javascript">
	var countriesStates = {$countries_states};
	{literal}
	$(document).ready(function(){
		setCountriesStates(
			{/literal}
			"#billing_country", "{$billingData->countryId|htmlspecialchars}",
			"#billing_state", "{$billingData->stateId|htmlspecialchars}",
			"#billing_province", "{$billingData->province|htmlspecialchars}",
			countriesStates
			{literal}
		);
	});
	{/literal}
</script>

<div class="field">
	<label for="name">{$msg.billing.friendly_name}</label>
	<div><input id="name" name="form[name]" type="text" value="{$paymentProfile->name|htmlspecialchars}"/></div>
</div>
<div class="field required first">
	<label for="billing_first_name">{$msg.billing.first_name}</label>
	<div><input id="billing_first_name" maxlength="30" type="text" name="form[first_name]" value="{$billingData->firstName|htmlspecialchars}" /></div>
</div>

<div class="field required">
	<label for="billing_last_name">{$msg.billing.last_name}</label>
	<div><input id="billing_last_name" maxlength="30" type="text" name="form[last_name]" value="{$billingData->lastName|htmlspecialchars}" /></div>
</div>

<div class="field required">
	<label for="billing_address_line1">{$msg.billing.address_line1}</label>
	<div><input id="billing_address_line1" maxlength="30" type="text" name="form[address1]" value="{$billingData->addressLine1|htmlspecialchars}" /></div>
</div>
{if $FormsBillingAddressLine2 != "Invisible"}
	<div class="field{if $FormsBillingAddressLine2 == "Required"} required{/if}">
		<label for="billing_address_line2">{$msg.billing.address_line2}</label>
		<div><input id="billing_address_line2" maxlength="30" type="text" name="form[address2]" value="{$billingData->addressLine2|htmlspecialchars}"/></div>
	</div>
{else}
	<input id="billing_address_line2" type="hidden" name="form[address2]" value="{$billingData->addressLine2|htmlspecialchars}"/>
{/if}
<div class="field required">
	<label for="billing_city">{$msg.billing.city}</label>
	<div><input id="billing_city" maxlength="20" type="text" name="form[city]" value="{$billingData->city|htmlspecialchars}"/></div>
</div>

<div id="billing_country" class="field required">
	<label for="billing_country_select">{$msg.billing.country}</label>
	<div><select id="billing_country_select" name="form[country]"></select></div>
</div>

<div id="billing_state" class="field field-input-states required invisible">
	<label for="billing_state_select">{$msg.billing.state_province}</label>
	<div>
		<select id="billing_state_select" name="form[state]"></select>
	</div>
</div>
<div id="billing_province" class="field field-input-provinces required invisible">
	<label for="billing_province_input">{$msg.billing.state_province}</label>
	<div><input id="billing_province_input" maxlength="2" type="text" name="form[province]" value="{$billingData->province}"/></div>
</div>

<div class="field field-input-zip required">
	<label for="billing_postal_code">{$msg.billing.postal_code}</label>
	<div><input id="billing_postal_code" maxlength="10" type="text" name="form[zip]" value="{$billingData->zip|htmlspecialchars}"/></div>
</div>
{if $FormsBillingPhone != "Invisible"}
	<div class="field{if $FormsBillingPhone == "Required"} required{/if}">
		<label for="billing_phone_number">{$msg.billing.phone_number}</label>
		<div><input id="billing_phone_number" maxlength="14" type="text" name="form[phone]" value="{$billingData->phone|htmlspecialchars}"/></div>
	</div>
{else}
	<input id="billing_phone_number" type="hidden" name="form[phone]" value="{$billingData->phone|htmlspecialchars}"/>
{/if}
{include file="templates/pages/account/elements/element-payment-profile-additional-fields.html"}
<div class="field required">
	<label for="cc_number">{$msg.billing.cc_number}</label>
	<div><input id="cc_number" name="form[cc_number]" type="text" autocomplete="off"/></div>
</div>
<div class="field required">
	<label>{$msg.billing.cc_expiration_date}</label>
	<div>
		<select class="select-expiration-month" name="form[cc_expiration_month]">
			{foreach from=$cc_expiration_months key="key" item="month"}
				<option value="{$key}" {if $billingData->ccExpirationMonth == $key}selected="selected"{/if}>{$month}</option>
			{/foreach}
		</select>
		<select class="select-expiration-year" name="form[cc_expiration_year]">
			{foreach from=$cc_expiration_years key="key" item="year"}
				<option value="{$year}"{if $billingData->ccExpirationYear == substr($year, 2, 2) || $billingData->ccExpirationYear == $year} selected="selected"{/if}>{$year}</option>
			{/foreach}
		</select>
	</div>
</div>
<div class="field">
	<label for="is_primary">{$msg.account.set_primary_payment_profile}</label>
	<div style="padding:5px 0px 0px;"><input style="margin-left:10px;" type="checkbox" id="is_primary" name="form[is_primary]" value="1" {if $paymentProfile->isPrimary}checked="checked"{/if}></div>
</div>