<?php require view('theme/header'); ?>
<style>
.hide{display:none;}
</style>
<main class="app-main">
    <div class="page-content">
        <div class="container-fluid">

            <div class="row mt-2">
                <div class="col-lg-6">
                    <div class="card mb-5">
                        <div class="py-4 px-lg-3 px-4">
						
									<div class="t-head th-3">
										<div class="row align-items-center">
											<div class="col-md-auto">
												<div class="t-icon">
													<i class="fal fa-hand-holding-box"></i>
												</div>
											</div>
											<div class="col-md col-12">
												<h2>Yeni Bir Otomatik Sipariş Ver</h2>
												<p>Otomatik sipariş işlemlerinizi buradan yapabilirsiniz.</p>
											</div>
										</div>
									</div>
									
									<form id="auto_order" onsubmit="return false;">
											  
											  
											  	
                                        <div class="fga mb-4">
                                            <label class="fla" for="category">{AUTO_FORM_CATEGORY_TITLE}</label>
                                            <div class="fg">
                                                <div class="fg-icon"><i class="far fa-list"></i></div>
                                                <select id="category" name="category" class="fg-control" data-toggle="ssp-selectbox" data-class="fg-control">
                                                    
                                                    {AUTO_FORM_CATEGORIES}
                                                </select>
                                            </div>
                                        </div>
        
                                        <div class="fga mb-4">
                                            <label class="fla" for="service">{ORDER_FORM_SERVICE_TITLE}</label>
                                            <div class="fg">
                                                <div class="fg-icon"><i class="far fa-box-open"></i></div>
                                                <select name="service" id="service" class="fg-control" data-toggle="ssp-selectbox" data-class="fg-control">
                                                </select>
                                            </div>
                                        </div>
                                        
                                        <div class="fga mb-4">
                                            <label class="fla" for="link">{ORDER_FORM_LINK_TITLE}</label>
                                            <div class="fg">
                                                <div class="fg-icon"><i class="far fa-link"></i></div>
                                                <input name="link" id="link" class="fg-control" type="text" data-class="fg-control" />
                                            </div>
                                        </div>
                                        
                                        <div class="fga mb-4">
                                            <label class="fla" for="quantity">{ORDER_FORM_QUANTITY_TITLE}</label>
                                            <div class="fg">
                                                <div class="fg-icon"><i class="far fa-sort-numeric-up-alt"></i></div>
                                                <input name="quantity" id="quantity" class="fg-control" type="text" data-class="fg-control" />
                                                <small class="help-block min-max">Min: <span id="min"></span> - Maks: <span id="max"></span></small>
                                            </div>
                                        </div>
            							
            							<div class="fga mb-4">
                                            <label class="fla" for="quantity">{AUTO_FORM_EXPIRATION}</label>
                                            <div class="fg">
                                                <div class="fg-icon"><i class="far fa-sort-numeric-up-alt"></i></div>
                                                <input name="expiration" id="datepicker" class="fg-control" type="date" data-class="fg-control" />
                                            </div>
                                        </div>
                                        
                                        <div class="fga mb-4">
                                            <label class="fla" for="limit">{AUTO_FORM_POST_LIMIT}</label>
                                            <div class="fg">
                                                <div class="fg-icon"><i class="far fa-sort-numeric-up-alt"></i></div>
                                                <input name="limit" id="limit" class="fg-control" type="text" min="1" data-class="fg-control" />
                                            </div>
                                        </div>
                                        
                                        
                                        <div class="row">
                                            <div class="col-md-6 col-12 mb-4 mb-mb-0">
												<input type="hidden" name="_csrf" value="{{ csrftoken }}">
                                                <button type="submit" class="btn btn-primary btn-block">
                                                    {AUTO_FORM_SUBMIT}
                                                </button>
                                            </div>
                                            <div class="col-md-6 col-12 mb-4 mb-mb-0 form-group">
                                                <div class="form-group">
                                                    <input type="text" class="form-control" id="amount" value="" readonly style="padding: 19px 50px;border-radius:10px" placeholder="Ödenecek Tutar">
                                                </div>
                                            </div>
                                        </div>
                                    </form>
                        </div>
                    </div><!-- card -->
                </div><!-- col -->
                <div class="col-lg-6">
                    <div class="card">
                        <div class="py-4 px-lg-3 px-4">
									<div class="t-head th-3">
										<div class="row align-items-center">
											<div class="col-md-auto">
												<div class="t-icon">
													<i class="fal fa-comment-alt-medical"></i>
												</div>
											</div>
											<div class="col-md col-12">
												<h2>Servis Açıklaması</h2>
												<p><span id="s_name"></span></p>
											</div>
										</div>
									</div>
									
                                    <div class="dp-service-text">
										<span id="description"></span>
                                    </div>
                                    <div class="card mt-4">
                                        <div class="cb-content">
                                            <div class="card-body">
                                                <div class="row text-center align-items-center">
                                                    <div class="col">
                                                        <div class="text-muted">
                                                           Sipariş verdiğiniz zaman <a href="/terms">Kullanım Sözleşmesi</a>'ni kabul etmiş sayılırsınız.
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>

                       
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</main>
		
		<?php require view('theme/footer'); ?>