<div class="container">
    <div class="row">
        <div class="col-md-12">
            <div class="product-category social-link align-items-center pb-lg-3">
                <span class="title pe-3"><h4>Return</h4></span>
            </div>
        </div>
        <div class="col-md-12">
            <div class="single-product-content text-center">
                <p class="title pe-3 text-center mb-5">
                    <h3>Return conditions:</h3></p>
            </div>
            <i>Credit will be issued upon successful completion of the quality control inspection. The wheels must be in like-new condition, with no valve stems, wheel weights, mounting lubricant, or scratches.
			</i>
        </div>
    </div>
    <div class="row">
        <div class="row">
        	<div class="col-md-12">
        		<p>Additionally, all original protective packaging must be securely applied to the wheels to prevent damage during transit.</p>
        	</div>
        </div>
        <div class="row">
        	<div class="col-md-6">
                <div class="product-category pb-3">
                    <div class="form-check">
                        <input class="form-check-input" type="radio" name="package_agreed" id="radioDefault11" onclick="get_account_form('yes');">
                        <label class="form-check-label" for="radioDefault11">I Agree </label>
                    </div>
                </div>
        	</div>
        	<div class="col-md-6">
            	<div class="product-category pb-3">
                    <div class="form-check">
                        <input class="form-check-input" type="radio" name="package_agreed" id="radioDefault21" onclick="get_account_form('no');">
                        <label class="form-check-label" for="radioDefault21">Disagree </label>
                    </div>
            	</div>
        	</div>
        </div>
		<div class="row d-none" id="warranty_account_form">
		    <div class="col-lg-12">
                <form action="{{ url('/') }}/save-return-form" method="post" enctype="multipart/form-data">
                    @csrf
                    <div class="login-form">
                        <h4 class="login-title">Account Information</h4>
                        <div class="row">
                            <div class="col-12">
                                <label>Account Number #*</label>
                                <input type="text" placeholder="Account Number" name="account_no">
                            </div>
                            <div class="col-12">
                                <label>Account Name*</label>
                                <input type="text" placeholder="Account Name" name="account_name">
                            </div>
                           	<div class="col-12">
                                <label>Use account address for shipping?*</label>
                            </div>
			                 <div class="col-md-6">
		                        <div class="product-category pb-3">
		                            <div class="form-check">
		                                <input class="form-check-input" type="radio" name="is_account_address_as_shipping" value="Yes" id="radioDefault211" onclick="get_account_address('yes');" style="padding: 4px 6px;width: auto;" checked>
		                                <label class="form-check-label" for="radioDefault211">Yes </label>
		                            </div>
		                        </div>
                        	</div>
                        	<div class="col-md-6">
	                        	<div class="product-category pb-3">
		                            <div class="form-check">
		                                <input class="form-check-input" type="radio" name="is_account_address_as_shipping" value="No" id="radioDefault21" onclick="get_account_address('no');" style="padding: 4px 6px;width: auto;">
		                                <label class="form-check-label" for="radioDefault21">No </label>
		                            </div>
	                        	</div>
                        	</div>
							<div class="col-md-12 d-none account_addr">
                                <label>Address*</label>
                                <input type="text" placeholder="Address" id="address" name="address" required>
                            </div>
                            <div class="col-md-6 d-none account_addr">
                                <label>City</label>
                                <input type="text" placeholder="City" name="city">
                            </div>
                            <div class="col-md-6 d-none account_addr">
                                <label>Postal Code/Zipcode</label>
                                <input type="text" placeholder="Postal Code/Zipcode" name="postal_code">
                            </div>
                       		<div class="col-md-6">
                                <label>VRMA#</label>
                                <input type="text" placeholder="VRMA#" name="vrma">
                            </div>
                            <div class="col-md-6">
                                <label>Delivery Method</label>
                                <select class="form-control" name="delivery_method">
                                	<option value="ATW Pickup">ATW Pickup</option>
                                	<option value="Customer Delivery">Customer Delivery</option>
                                	<option value="3rd Party Shipping">3rd Party Shipping</option>
                                </select>
                            </div>
                            <div class="col-12 mt-5">
                                <h4 class="login-title">Product Information</h4>
                            </div>
                            <div class="container" id="product_info_div">
                            	<div class="row mb-3 item" style="padding: 4em;background: #d3d3d333;">
                            		<div class="col-md-12">
                            			<h4 class="login-title">Product 1</h4>
                            		</div>
                            		<div class="col-md-6">
		                                <label>Quantity*</label>
		                                <input class="bg-white" name="qty[]" type="number[]" placeholder="Quantity" required>
		                            </div>
		                            <div class="col-md-6">
		                                <label>Item Number*</label>
		                                <input class="bg-white" type="text" name="item_number[]" placeholder="Item Number" required>
		                            </div>
		                            <div class="col-md-6">
		                                <label>Manufacturer*</label>
		                                <input class="bg-white" type="text" name="manufacturer[]" placeholder="Manufacturer" required>
		                            </div>
		                            <div class="col-md-6">
		                                <label>Invoice #*</label>
		                                <input class="bg-white" type="text" name="invoice_no[]" placeholder="Invoice" required>
		                            </div>
		                            <div class="col-md-6">
		                                <label>Date Purchased*</label>
		                                <input class="bg-white" type="date" name="purchase_date[]" placeholder="Date Purchased" required>
		                            </div>
		                            <div class="col-md-12">
		                                <label>Reason*</label>
		                                <textarea class="form-control" name="reason[]" placeholder="Reason" required></textarea>
		                            </div>
		                           	<div class="col-md-12 mt-2">
		                                <label>File *</label>
		                                <input class="bg-white" class="form-control" name="file1[]" multiple type="file" required>
		                            </div>
                            	</div>
                            </div>
                            <div class="col-12">
                                <button class="btn btn-custom-size lg-size btn-primary" type="button" onclick="get_product_form();">Add Product +</button>
                            </div>
                            <input type="hidden" name="no_of_product" id="no_of_product" value="1">
                        	<div class="col-12 mt-5">
                                <h4 class="login-title">Contact Information</h4>
                            </div>
                            <div class="col-6">
                            <label>First Name*</label>
                                <input type="text" name="first_name" placeholder="First Name">
                            </div>
                            <div class="col-6">
                                <label>Last Name*</label>
                                <input type="text" name="last_name" placeholder="Last Name">
                            </div>
                            <div class="col-6">
                                <label>Email*</label>
                                <input type="email" name="email" placeholder="Email">
                            </div>
                            <div class="col-6">
                                <label>Phone*</label>
                                <input type="tel" name="phone" placeholder="Phone">
                            </div>
            			    <div class="col-md-12">
                            	<button class="btn btn-danger">Submit Return Form</button>
                            </div>
                        </div>
                    </div>
                </form>
		    </div>
		</div>
    </div>
</div>



<script>
if ($('#address').is(':visible')) {
    $('#address').attr('required', true);
} else {
    $('#address').removeAttr('required');
}
function get_product_form()
{
	var count = $('#product_info_div .item').length+1;
    $("#no_of_product").val(count);
	var html = `<div class="row mb-3 item div`+count+`" style="padding: 4em;background: #d3d3d333;">
            		<div class="col-md-12">
            			<h4 class="login-title"><span><i class="fa fa-times text-danger cursor" onclick="remove_html(`+count+`);"></i></span> Product `+count+`</h4>
            		</div>
            		<div class="col-md-6">
                        <label>Quantity*</label>
                        <input class="bg-white" type="text" name="qty[]" placeholder="Quantity">
                    </div>
                    <div class="col-md-6">
                        <label>Item Number*</label>
                        <input class="bg-white" type="text" name="item_number[]" placeholder="Item Number">
                    </div>
                    <div class="col-md-6">
                        <label>Manufacturer*</label>
                        <input class="bg-white" type="text" name="manufacturer[]" placeholder="Manufacturer">
                    </div>
                    <div class="col-md-6">
                        <label>Invoice #*</label>
                        <input class="bg-white" type="text" name="invoice_no[]" placeholder="Invoice">
                    </div>
                    <div class="col-md-6">
                        <label>Date Purchased*</label>
                        <input class="bg-white" type="date" name="purchase_date[]" placeholder="Date Purchased">
                    </div>
                    <div class="col-md-12">
                        <label>Reason*</label>
                        <textarea class="form-control" name="reason[]" placeholder="Reason"></textarea>
                    </div>
                   	<div class="col-md-12 mt-2">
                        <label>File*</label>
                        <input class="bg-white" name="file`+count+`[]" multiple class="form-control" type="file">
                    </div>
            	</div>`;
     $("#product_info_div").append(html);
}
function remove_html(count)
{
	$('.div'+count).remove();
    var count = $('#product_info_div .item').length+1;
    $("#no_of_product").val(count);
}
</script>