<div style="margin-bottom: 4rem; margin-top: 2rem">
<spektrix-gift-vouchers client-name="demo2">
<div>
<h2>spektrix-gift-vouchers:Native</h2>
</div>
<div>
<label for="amount">
Amount:
<input type="number" step="0.01" name="amount" data-amount>
</label>
</div>
<div>
<label for="sendDate">
Send Date:
<input type="date" name="sendDate" data-send-date>
</label>
</div>
<div>
<label for="toname">
To:
<input type="text" name="toname" data-to-name>
</label>
</div>
<div>
<label for="fromname">
From:
<input type="text" name="fromname" data-from-name>
</label>
</div>
<div>
<label for="message">
Message:
<input type="text" name="message" data-message>
</label>
</div>
<div>
<label for="deliveryType">Delivery Type: </label>
<select name="deliveryType" data-delivery-type>
<option value="CustomerEmail" selected>Customer Email</option>
<option value="OtherEmail">Other Email</option>
</select>
</div>
<div>
<label for="deliveryEmail">
Delivery Email Address:
<input type="text" name="deliveryEmail" data-delivery-email-address>
</label>
</div>
<button data-submit-gift-voucher>Buy Gift Voucher</button>
<div data-success-container style="display: none;">Insert success content/markup here</div>
<div data-fail-container style="display: none;">Insert failure content/markup here</div>
</spektrix-gift-vouchers>
</div>