{% set current_account_page = 'account-edit-address.html' %}
{% extends '/layouts/account.twig' %}

{% block account_body %}
    <div class="card">
        <div class="card-header">
            <h5>Edit Address</h5>
        </div>
        <div class="card-divider"></div>
        <div class="card-body">
            <div class="row no-gutters">
                <div class="col-12 col-lg-10 col-xl-8">
                    <div class="form-row">
                        <div class="form-group col-md-6">
                            <label for="checkout-first-name">First Name</label>
                            <input type="text" class="form-control" id="checkout-first-name" placeholder="First Name">
                        </div>
                        <div class="form-group col-md-6">
                            <label for="checkout-last-name">Last Name</label>
                            <input type="text" class="form-control" id="checkout-last-name" placeholder="Last Name">
                        </div>
                    </div>

                    <div class="form-group">
                        <label for="checkout-company-name">Company Name <span class="text-muted">(Optional)</span></label>
                        <input type="text" class="form-control" id="checkout-company-name" placeholder="Company Name">
                    </div>
                    <div class="form-group">
                        <label for="checkout-country">Country</label>
                        <select id="checkout-country" class="form-control form-control-select2">
                            <option>Select a country...</option>
                            <option>United States</option>
                            <option>Russia</option>
                            <option>Italy</option>
                            <option>France</option>
                            <option>Ukraine</option>
                            <option>Germany</option>
                            <option>Australia</option>
                        </select>
                    </div>
                    <div class="form-group">
                        <label for="checkout-street-address">Street Address</label>
                        <input type="text" class="form-control" id="checkout-street-address" placeholder="Street Address">
                    </div>
                    <div class="form-group">
                        <label for="checkout-address">Apartment, suite, unit etc. <span class="text-muted">(Optional)</span></label>
                        <input type="text" class="form-control" id="checkout-address">
                    </div>
                    <div class="form-group">
                        <label for="checkout-city">Town / City</label>
                        <input type="text" class="form-control" id="checkout-city">
                    </div>
                    <div class="form-group">
                        <label for="checkout-state">State / County</label>
                        <input type="text" class="form-control" id="checkout-state">
                    </div>
                    <div class="form-group">
                        <label for="checkout-postcode">Postcode / ZIP</label>
                        <input type="text" class="form-control" id="checkout-postcode">
                    </div>

                    <div class="form-row">
                        <div class="form-group col-md-6">
                            <label for="checkout-email">Email address</label>
                            <input type="email" class="form-control" id="checkout-email" placeholder="Email address">
                        </div>
                        <div class="form-group col-md-6">
                            <label for="checkout-phone">Phone</label>
                            <input type="text" class="form-control" id="checkout-phone" placeholder="Phone">
                        </div>
                    </div>

                    <div class="form-group mt-3 mb-0">
                        <button class="btn btn-primary">Save</button>
                    </div>
                </div>
            </div>
        </div>
    </div>
{% endblock %}
