@extends('header')
<div class="main_body" style="padding-right:20px;">
	<div class="main_dashboard_child">
<div class="add_new_service row">
	<div class="col-sm-8 pl-0">
		<div class="new_service_sec">
			<div class="appointments_types_title">
<div class="cards_title" style="padding-bottom: 0px;border: none;">
 <div class="row">
    <div class="col-sm-6">
       <div class="cards_tt">
          <h5>Appointment Types</h5>
       </div>
    </div>
    <div class="col-sm-6">
       <div class="cards_tt text-right">
          <a href="#" class="btn btn-primary default-btn">Add New Service</a>
       </div>
    </div>
 </div>
</div>

<div class="all_types">
	<div class="card">
		<div class="single_type">
			<div class="row">
				<div class="col-sm-8">
					<div class="types_left">
						<div class="row">
							<div class="col-sm-4">
								<p>Service Name <span>:</span></p>
							</div>
							<div class="col-sm-8">
								<p>Accounting</p>
							</div>
						</div>
						<div class="row">
							<div class="col-sm-4">
								<p>Duration <span>:</span></p>
							</div>
							<div class="col-sm-8">
								<p>60 Min</p>
							</div>
						</div>
						<div class="row">
							<div class="col-sm-4">
								<p>Price <span>:</span></p>
							</div>
							<div class="col-sm-8">
								<p>$60.00</p>
							</div>
						</div>
						<div class="row">
							<div class="col-sm-4">
								<p>Description <span>:</span></p>
							</div>
							<div class="col-sm-8">
								<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
							</div>
						</div>
					</div>
				</div>
				<div class="col-sm-4">
					<div class="types_right">
						<div class="card_actions text-right">
                          <a href="#" class="btn btn-default cancel-btn">Edit</a>
                          <a href="#" class="btn btn-danger delet-btn">Delete</a>
                       </div>
					</div>

				</div>
			</div>

		</div>
		<div class="single_type">
			<div class="row">
				<div class="col-sm-8">
					<div class="types_left">
						<div class="row">
							<div class="col-sm-4">
								<p>Service Name <span>:</span></p>
							</div>
							<div class="col-sm-8">
								<p>Accounting</p>
							</div>
						</div>
						<div class="row">
							<div class="col-sm-4">
								<p>Duration <span>:</span></p>
							</div>
							<div class="col-sm-8">
								<p>60 Min</p>
							</div>
						</div>
						<div class="row">
							<div class="col-sm-4">
								<p>Price <span>:</span></p>
							</div>
							<div class="col-sm-8">
								<p>$60.00</p>
							</div>
						</div>
						<div class="row">
							<div class="col-sm-4">
								<p>Description <span>:</span></p>
							</div>
							<div class="col-sm-8">
								<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
							</div>
						</div>
					</div>
				</div>
				<div class="col-sm-4">
					<div class="types_right">
						<div class="card_actions text-right">
                          <a href="#" class="btn btn-default cancel-btn">Edit</a>
                          <a href="#" class="btn btn-danger delet-btn">Delete</a>
                       </div>
					</div>

				</div>
			</div>

		</div>

	</div>

</div>

</div>
		</div>
	</div>
	<div class="col-sm-4 pl-0">
		<div class="new_service_sec">
			<div class="card" style="height:100%;">
				
             
            <div class="schedule-appointment-details" style="position: relative;">
              <a href="#" class="close_btn"><img src="../images/Icon ionic-ios-close-circle-outline.png"></a>
              <h6>Add New Srvice</h6>
              <form >
              <div class="user-client-details-form single-event-details">
                
                  <div class="form-group">
                    <label>Service Name</label>
                    <input type="text" class="form-control" placeholder="Ex: Accounting">
                  </div>
                  <div class="form-group">
                    <label>Duration</label>
                    <input type="text" class="form-control" placeholder="Ex: 30 Min">
                  </div>
                  <div class="form-group">
                    <label>Price</label>
                    <input type="text" class="form-control" placeholder="Ex: $0.00">
                  </div>
                  <div class="form-group">
                    <label>Description</label>
                    <textarea rows="4" class="form-control" placeholder="Write Here"></textarea>
                  </div>
                  <div class="form-group">
                  <div class="schedule-btn">
                    <a href="#" class="btn btn-primary default-btn" style="padding: 4px 25px;font-size: 12px;">Save</a>
                  </div>
                </div>
              </div>
              </form>
            </div>
          </div>
		</div>
	</div>

</div>




</div>
</div>

@extends('footer')