@model EstimateShippingModel
<link rel="stylesheet" href="~/lib_npm/magnific-popup/magnific-popup.css" />
<script asp-exclude-from-bundle="true" src="~/js/public.estimateshipping.popup.js" asp-location="Footer"></script>
<script asp-exclude-from-bundle="true" src="~/lib_npm/magnific-popup/jquery.magnific-popup.min.js" asp-location="Footer"></script>

<div class="ship-to-title">
    <strong>@T("Shipping.EstimateShippingPopUp.ShipToTitle")</strong>
</div>
<div class="shipping-address">
    <div class="fieldset form-horizontal row">
        <div class="col-12 col-xs-12 col-sm-4 col-md-4 col-lg-4">
            <div class="form-group">
                <div class="estimate-shipping-row-item address-item row">
                    <div class="col-sm-11 col-md-11">
                        <select asp-for="CountryId"
                                asp-items="Model.AvailableCountries"
                                class="estimate-shipping-address-control form-control"
                                data-trigger="country-select"
                                data-url="@(Url.RouteUrl("GetStatesByCountryId"))"
                                data-stateprovince="#@Html.IdFor(model => model.StateProvinceId)"
                                data-loading="#estimate-shipping-loading-progress"
                                placeholder="@T("Shipping.EstimateShippingPopUp.Country")"></select>
                    </div>
                    <div class="col-sm-1 col-md-1">
                        <div class="form-title-rquired"><nop-required /></div>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-12 col-xs-12 col-sm-4 col-md-4 col-lg-4">
            <div class="form-group">
                <div class="estimate-shipping-row-item address-item row">
                    <div class="col-sm-12 col-md-12">
                        <select asp-for="StateProvinceId"
                                asp-items="Model.AvailableStates"
                                class="estimate-shipping-address-control form-control"
                                placeholder="@T("Shipping.EstimateShippingPopUp.StateProvince")"></select>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-12 col-xs-12 col-sm-4 col-md-4 col-lg-4">
            <div class="form-group">
                <div class="estimate-shipping-row-item address-item row">
                    <div class="col-sm-11 col-md-11">
                        @if (Model.UseCity)
                        {
                        <input asp-for="City"
                               class="estimate-shipping-address-control"
                               placeholder="@T("Shipping.EstimateShippingPopUp.City")" />
                        }
                        else
                        {
                        <input asp-for="ZipPostalCode"
                               class="estimate-shipping-address-control form-control"
                               placeholder="@T("Shipping.EstimateShippingPopUp.ZipPostalCode")" />
                        }
                    </div>
                    <div class="col-sm-1 col-md-1">
                        <div class="form-title-rquired"><nop-required /></div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<div class="choose-shipping-title">
    <strong>@T("Shipping.EstimateShippingPopUp.ChooseShippingTitle")</strong>
</div>
<div class="shipping-options">
    <div class="shipping-options-header">
        <div class="estimate-shipping-row">
            <div class="estimate-shipping-row-item-radio">
            </div>
            <div class="estimate-shipping-row-item shipping-item shipping-header-item">
                @T("Shipping.EstimateShippingPopUp.ShippingOption.Name")
            </div>
            <div class="estimate-shipping-row-item shipping-item shipping-header-item">
                @T("Shipping.EstimateShippingPopUp.ShippingOption.EstimatedDelivery")
            </div>
            <div class="estimate-shipping-row-item shipping-item shipping-header-item">
                @T("Shipping.EstimateShippingPopUp.ShippingOption.Price")
            </div>
        </div>
    </div>
    <div class="shipping-options-body">
        <div class="no-shipping-options">@T("Shipping.EstimateShippingPopUp.NoShippingOptions")</div>
    </div>
</div>
<div class="apply-shipping-button-container">
    <button type="button" class="btn btn-primary apply-shipping-button">@T("Shipping.EstimateShippingPopUp.SelectShippingOption.Button")</button>
    <div class="message-failure"></div>
</div>