@extends('frontend.frontMaster')
@section('content')
<style type="text/css">
	input[type=checkbox]{display: none;}
	.MB15 input[type=checkbox]{display: inline-block;}
	.checkboxes input[type=checkbox]{display: inline-block;}
	@media only screen and (max-width: 991px) {.heading_about {margin-top: 15px;}}
</style>
<section class="about_section1">
	<div id="demo" class="carousel slide" data-ride="carousel">
		<div class="carousel-inner">
			<div class="carousel-item active">
				<img class="about_slide" src="{{url('/')}}/accets/frontend/img/slider22.jpg" alt="Los Angeles"  >
				<div class="carousel-caption">
					<h3>Special Designer's Initiative  </h3>
				</div> 
			</div>
		</div>
	</div>
</section>
 <section class="about">
	<div class="container">
		<!-- <div class="col-xl-12 col-lg-12">
        	<img class="produt_img" src="{{url('/')}}/accets/frontend/img/bottom.png">
      	</div> -->
		<div id="msform">
		  <!-- progressbar -->
		  <ul id="progressbar">
		    <li class="active">Category</li>
		    <li>Fit </li>
		    <!-- <li style="display: none;"></li>
		    <li style="display: none;"></li>
		    <li style="display: none;"></li> -->
		    <li>Fabric</li>
		    <!-- <li style="display: none;"></li> -->
		    <li>Wash</li>
		    <li style="display: none;"></li>
		    <li style="display: none;"></li>
		    <li>Quantity</li>
		    <li>Checkout</li>
		  </ul>
		  <!-- <span id="totalPrice">100</span> -->
		  <meta charset="utf-8" name="totPrice" content="0">
		  <!-- fieldsets -->
			<fieldset class="text-left">
				<div class="section_pro">Select Gender</div>
				<input type="button" name="next" class="next action-button btn-align" value="Next" data-table='fits'/>
		  		<div class="row PDT35" id="gender">
		      		<div class="form-check col-xl-6 col-lg-6 col-md-6 col-sm-6 col-6 PL45">
					  <input class="form-check-input" type="radio" value="1" id="collectionCheckMen" name="collections" data-name="Men">
					  <label class="form-check-label gender" for="collectionCheckMen">
					  		Men
					  </label>
					</div>
					<div class="form-check col-lg-6 col-md-6 col-sm-6 col-6">
					  <input class="form-check-input" type="radio" value="2" id="collectionCheckWomen" name="collections" data-name="Women">
					  <label class="form-check-label gender" for="collectionCheckWomen">
					    	Women
					  </label>
					</div>
				</div>
			</fieldset>
		  	<fieldset class="text-left">
					<div class="row">
						<div class="col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">
							<span class="section_pro">Select Multiple Fit</span>
							<span class="sub_cat section_pro collname"> (Men)</span>
						</div>
					</div>
					<input type="button" name="previous" class="previous action-button btn-align" value="Previous" />
			    	<input type="button" name="next" class="next action-button btn-align " value="Next" data-table='fabric_categories'/>  
			      	<ul class="selected_check" id="fitsHtmlUL">
			      		
			      	</ul>
					<!-- <div class="btn-align"> -->
						
			   <!--  	</div> -->
		  	</fieldset>
		  	<fieldset class="text-left">
					<div class="row">
						<div class="col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">
							<span class="section_pro">Select Fabric Categories</span>
							<span class="sub_cat section_pro collname"> (Men)</span>
						</div>
					</div>
					<input type="button" name="previous" class="previous action-button btn-align " value="Previous" />
		    		<input type="button" name="next" class="next action-button btn-align " value="Next" data-table='fabric_shades'/>
			      	<ul class="selected_check" id="catHtmlUL">
			      		
			      	</ul>
					
			    
			   
		  	</fieldset>
		  	
		  	<fieldset class="text-left">
				<div class="row">
					<div class="col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">
						<span class="section_pro">Select Fabric Washes </span>
						<span class="sub_cat section_pro collname"> (Men)</span>
					</div>
				</div>	
				<input type="button" name="previous" class="previous action-button btn-align " value="Previous" />
		    	<input type="button" name="next" class="next action-button btn-align " value="Next" data-table='washesA'/>	
		    	<div class="" style="display: flex;">
			    	<!-- <div class="col-lg-6 top_cat"> -->
			    	<div class="col-md-8 heading MB10">Washes available for <span class="selectedFit">Skinny Fit</span> And <span class="selectedFabric">Wilder Fabric</span></div>
			    	<!-- </div> -->
			    	<!-- <div class="col-lg-6 top_cat text-right"> -->
			    	<!-- <div class="col-md-4 heading"><span>Remaining Items : </span></div> -->
			    	<!-- </div> -->
			    </div>
		    	<form id="washAForm" class="nav_wash">
		    		<div class="col-lg-12 col-md-12 col-sm-12  MB30">
				    	<div class="heading MB10"><span>Your Selection :</span></div>
					    <div class="Select_heading clrr shadesSelections" ></div>
					</div>
		    		 <!-- <div class="heading MB30"><span>Your Selection :</span></div>
                    <a class="Select_heading" href="javascript:;"><span>Wash A :</span> Dark, Light ;<span> Wash B :</span> Light ; <span>Wash D :</span> Dark</a> -->
                <nav>
                    <div class="nav nav-tabs nav-fill" id="washNavTabs" role="tablist">
                       <!-- nav tab html -->
                        
                    </div>
                </nav>
                <div class="tab-content py-3 px-3 px-sm-0" id="washNavTabsContent">
                    <div class="tab-pane fade show active" id="nav-home" role="tabpanel" aria-labelledby="nav-home-tab">
                    	<!-- tab content html -->
                    </div>
                    
                  </div>
                
                
		      	</form>		
							
		  	</fieldset>

		  	<fieldset class="text-left">
				<div class="row">
					<div class="col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">
						<span class="section_pro">Select Fabric Washes </span>
						<span class="sub_cat section_pro collname"> (Men)</span>
					</div>
				</div>	
				<input type="button" name="previous" class="previous action-button btn-align " value="Previous" />
		    	<input type="button" name="next" class="next action-button btn-align " value="Next" data-table='washesB'/>	
		    	<div class="" style="display: flex;">
			    	<!-- <div class="col-lg-6 top_cat"> -->
			    	<div class="col-md-8 heading MB10">Washes available for <span class="selectedFit">Skinny Fit</span> And <span class="selectedFabric">Wilder Fabric</span></div>
			    	<!-- </div> -->
			    	<!-- <div class="col-lg-6 top_cat text-right"> -->
			    	<!-- <div class="col-md-4 heading"><span>Remaining Items : </span></div> -->
			    	<!-- </div> -->
			    </div>
		    	<form id="washBForm" class="nav_wash">
		    		 <div class="col-lg-12 col-md-12 col-sm-12  MB10">
				    	<div class="heading MB10"><span>Your Selection :</span></div>
					    <div class="Select_heading clrr shadesSelections" ></div>
					</div>
                
                <div class="" id="washBContent">
                    	<!-- tab content html -->
                    
                  </div>
                
                
		      	</form>		
							
		  	</fieldset>

		  	<fieldset class="text-left">
				<div class="row">
					<div class="col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">
						<span class="section_pro">Select Fabric Washes </span>
						<span class="sub_cat section_pro collname"> (Men)</span>
					</div>
				</div>	
				<input type="button" name="previous" class="previous action-button btn-align " value="Previous" />
		    	<input type="button" name="next" class="next action-button btn-align " value="Next" data-table='toppings'/>	
		    	<div class="" style="display: flex;">
			    	<!-- <div class="col-lg-6 top_cat"> -->
			    	<div class="col-md-8 heading MB10">Washes available for <span class="selectedFit">Skinny Fit</span> And <span class="selectedFabric">Wilder Fabric</span></div>
			    	<!-- </div> -->
			    	<!-- <div class="col-lg-6 top_cat text-right"> -->
			    	<div class="col-md-4 heading"><span>Remaining Items :<span id='remainingCount'>240</span><meta content="240" name="remainingCount"><meta content="0" name="remainingCounter"> </span></div>
			    	<!-- </div> -->
			    </div>
		    	<form id="washQForm" class="nav_wash">
		    		 <div class="col-lg-12 col-md-12 col-sm-12  MB10">
				    	<div class="heading MB10"><span>Your Selection :</span></div>
					    <div class="Select_heading clrr shadesSelections" id="shadesSelections"></div>
					</div>
                
                <div class="tab-content py-3 px-3 px-sm-0" id="washQContent">
                    
                    <!-- tab content html -->
                    
                  </div>
                
                
		      	</form>		
							
		  	</fieldset>


			<fieldset class="text-left">
				<div class="row">
					<div class="col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">
						<span class="section_pro">Trims, Prints, And Embroideries</span>
					</div>
				</div>	
				<input type="button" name="previous" class="previous action-button btn-align " value="Previous" />
		    	<input type="button" name="next" class="next action-button btn-align " value="Next" data-table='checkout' />	
		    	<form id='tpeForm' enctype="multipart/form-data">		
				<ul class="selected_check li_width">
					<li>
						<div class="name MB15"><span>POCKET BAG FABRIC</span></div>
					    <label for="cba1"></label>
					    <div class="MB15">
					    	<div class="form-check">
						      	<label class="form-check-label fonnt_txt">
						       		<input type="radio" class="form-check-input" name="pocket_bag_fabric" value="1" checked/> POLYESTER/COTTON SHEETING OR FINE TWILL - WHITE <i>(Included)</i>
						      	</label>
						    </div>
						</div>
						<div class="MB15">
					    	<div class="form-check">
						      	<label class="form-check-label fonnt_txt">
						       		<input type="radio" class="form-check-input" name="pocket_bag_fabric" value="2" /> POLYESTER/COTTON SHEETING OR FINE TWILL IN BLACK OR NAVY BLUE <i>(Not-Included)</i>
						      	</label>
						    </div>
						</div>
						<div class="MB15">
				      		<div class="form-check">
						      	<label class="form-check-label fonnt_txt">
						       		<input type="radio" class="form-check-input" name="pocket_bag_fabric" value="3" /> POLYESTER/ COTTON 3X1  TWILL APPROX 130 GSM  <i>(Not-Included)</i>
						      	</label>
						    </div>
						</div>
						<div class="MB15">
				      		<div class="form-check">
						      	<label class="form-check-label fonnt_txt">
						       		<input type="radio" class="form-check-input" name="pocket_bag_fabric" value="4" /> PPOLYESTER /COTTON 3X1 TWILL APPROX 130 GSM BLACK OR NAVY <i>(Not-Included)</i>
						      	</label>
						    </div>
						</div>
						<div class="MB15">
				      		<div class="form-check">
						      	<label class="form-check-label fonnt_txt">
						       		<input type="radio" class="form-check-input" name="pocket_bag_fabric" value="5" /> POLYESTER/COTTON HERRINGBONE OFF-WHITE <i>(Not-Included)</i>
						      	</label>
						    </div>
						</div>
						<div class="MB15">
				      		<div class="form-check">
						      	<label class="form-check-label fonnt_txt">
						       		<input type="radio" class="form-check-input" name="pocket_bag_fabric" value="6" /> POLYESTER/COTTON HERRINGBONE BLACK OR NAVY BLUE <i>(Not-Included)</i>
						      	</label>
						    </div>
						</div>
					</li>
					<li>
						<div class="name MB15"><span>ZIPPER </span> <i>(Included)</i></div>
					    <label for="cba1"></label>
					    <div class="MB15">
				      		<div class="form-check">
						      	<label class="form-check-label">
						       		<input type="checkbox" class="form-check-input" name="zipper" value="1" checked>YKK 
						      	</label>
						    </div>
						</div>
					</li>
					<li>
						<div class="name MB15"><span>CARE LABEL </span><i>(Included)</i></div>
					    <label for="cba1"></label>
					    <div class="MB15">
					    	<div class="form-check">
						      	<label class="form-check-label fonnt_txt">
						       		<input type="checkbox" class="form-check-input" name="care_label" value="1" /> <img src="{{url('/')}}/uploads/1587102497_logo.png"> 
						      	</label>
						    </div>
				      		
						</div>
					</li>
					<li>
						<div class="name MB15"><span>POLYBAG </span><i>(Included)</i></div>
					  	<input type="checkbox" id="cba1" />
					    <label for="cba1"></label>
					    <div class="MB15">
				      		<div class="form-check">
						      	<label class="form-check-label fonnt_txt">
						       		<input type="checkbox" class="form-check-input" name="polybag" value="1" /> <img src="{{url('/')}}/uploads/1587102497_logo.png"> 
						      	</label>
						    </div>
						</div>
					</li>
					<li>
						<div class="name"><span>MAIN BRAND LABEL </span><i>(Included)</i></div>
						<div class="col-md-8 col-md-offset-2 P0">
						  	<div class="custom-file mb-3 MT30">
						      <input type="file" class="custom-file-input" id="main_brand_label" name="main_brand_label">
						      <label class="custom-file-label" for="main_brand_label">Choose file</label>
						    </div>
						</div>
					</li>
					<li>
						<div class="name"><span>LEATHER OR IMMITATION LEATHER LABEL </span><i>(Not-Included)</i></div>
					  	<div class="col-md-8 col-md-offset-2 P0">
						  	<div class="custom-file mb-3 MT30">
						      <input type="file" class="custom-file-input" id="leather_label" name="leather_label">
						      <label class="custom-file-label" for="leather_label">Choose file</label>
						    </div>
						</div>
					</li>
					<li>
						<div class="name"><span>MAIN BUTTON </span><i>(Included) MINIMUM QUANTITY 10,000 BUTTONS </i></div>
					  	<div class="col-md-8 col-md-offset-2 P0">
						  	<div class="custom-file mb-3 MT30">
						      <input type="file" class="custom-file-input" id="main_button" name="main_button">
						      <label class="custom-file-label" for="main_button">Choose file</label>
						    </div>
						</div>
					</li>
					<li>
						<div class="name"><span>RIVETS </span><i>(Included) MINIMUM QUANTITY 40,000 RIVETS </i></div>
					  	<div class="col-md-8 col-md-offset-2 P0">
						  	<div class="custom-file mb-3 MT30">
						      <input type="file" class="custom-file-input" id="rivets" name="rivets">
						      <label class="custom-file-label" for="rivets">Chose file</label>
						    </div>
						</div>
					</li>
					<li>
						<div class="name"><span>HANGTAGS</span> <i>(Not-Included) MINIMUM ORDER 2,000 PCS</i></div>
					  	<div class="col-md-8 col-md-offset-2 P0">
						  	<div class="custom-file mb-3 MT30">
						      <input type="file" class="custom-file-input" id="hangtags" name="hangtags">
						      <label class="custom-file-label" for="hangtags">Choose file</label>
						    </div>
						</div>
					</li>
					<li>
						<div class="name"><span>PRINT ON POCKET BAG </span><i>(Not-Included)</i></div>
					  	<div class="col-md-8 col-md-offset-2 P0">
						  	<div class="custom-file mb-3 MT30">
						      <input type="file" class="custom-file-input" id="print_on_pocket_bag" name="print_on_pocket_bag">
						      <label class="custom-file-label" for="print_on_pocket_bag">Choose file</label>
						    </div>
						</div>
					</li>
					<li>
						<div class="name"><span>BACK POCKET EMBROIDERY </span><i>(Not-Included)</i></div>
					  	<div class="col-md-8 col-md-offset-2 P0">
						  	<div class="custom-file mb-3 MT30">
						      <input type="file" class="custom-file-input" id="back_pocket_emb" name="back_pocket_emb">
						      <label class="custom-file-label" for="back_pocket_emb">Choose file</label>
						    </div>
						</div>
					</li>
				
				</ul>
			</form>
			</fieldset>
		  	<fieldset>
		  		<!-- <input type="button" name="previous" class="previous action-button btn-align btm5 " value="Previous" /> -->
			    <!-- <input type="submit" name="submit" class="submit action-button btn-align btm5" value="Submit" />	 -->
			    <div class="col-lg-12 col-md-12 col-sm-12 text-center" style="margin-top: 10%;">
					<h2>Product Successfully Added Into Cart!!!</h2>	<br>					
			    	<a href="{{url('/')}}/special-designer" class="btn btn-shop "><i class="fa fa-angle-left" aria-hidden="true"></i> Continue Shopping</a>		
					<a href="{{url('/')}}/cart" class="btn btn-Checkout ">View Cart <i class="fa fa-angle-right" aria-hidden="true"></i></a>
				</div>
		  	</fieldset>
		</div>
  		<!-- <div class="col-xl-12 col-lg-12">
        	<img class="produt_img" src="{{url('/')}}/accets/frontend/img/top.png">
		</div>	 -->
</section>
<!--  -->
 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-easing/1.3/jquery.easing.min.js"></script>
 <script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
 <script type="text/javascript" src="{{url('/')}}/accets/frontend/js/sdi.js"></script>


<script>


//Jqueryui date picker 

$(function(){

    $("#fromdate").datepicker({
      minDate: 0,
        onSelect: function(selected) {

          $("#todate").datepicker("option","minDate", selected)

        }

    });

    $("#todate").datepicker({

        onSelect: function(selected) {

           $("#fromdate").datepicker("option","maxDate", selected)

        }

    }); 

});
</script>
@endsection