@extends('layout.master')
@section('content')

<section class="content pb-5">
        <div class="container-fluid">
          <!-- <div class="row pt-4">
            <div class="col-md-12">
              <div class="title-section">
                <p>Dashboard</p>
              </div>
            </div>
          </div>   -->

          <div class="row pt-4">
            <div class="col-md-5">
              <div class="title-section">
                <p>Rate Calculator</p>
              </div>

              <div class="zone-box">
                <div class="row">
                  <div class="col-md-6">
                    <div class="form-group custom-form-group">
                      <label class="form-label" for="pincode">From Pincode</label>
                      <input class="form-control" placeholder="" type="text" value="">
                    </div>
                  </div>

                  <div class="col-md-6">
                    <div class="form-group custom-form-group">
                      <label class="form-label" for="pincode">To Pincode</label>
                      <input class="form-control" placeholder="" type="text" value="">
                    </div>
                  </div>

                  <div class="col-md-3 pr-0 mr-0">
                    <div class="form-group custom-form-group">
                      <label class="form-label" for="weight">Actual Weight</label>
                      <input class="form-control" placeholder="" type="text" value="">
                    </div>
                  </div>

                  <div class="col-md-3 ml-0 pl-0">
                    <div class="form-group custom-form-group ml-4">
                      <label class="form-label" for="customer">&nbsp;</label>
                      <select class="form-control">
                        <option value="">Kg</option>
                      </select>
                    </div>
                  </div>

                  <div class="col-md-6 ml-0 pl-0">
                    <div class="form-group custom-form-group">
                      <label class="form-label" for="inr">INR Value (₹)</span>   </label>
                      <div class="input-group mb-3">
                        <div class="input-group-prepend">
                          <span class="input-group-text">₹</span>
                        </div>
                        <input type="text" class="form-control" placeholder="" aria-label="Dollar amount (with dot and two decimal places)">
                      </div>
                    </div>
                  </div>

                  <div class="col-md-12 col-12 pt-3 pt-sm-0">
                    <div class="form-group custom-form-group mb-0">
                      <label class="form-label" for="COD">Payment Type</label> <br>
                        <input class="with-gap" name="group1" type="radio" id="number" checked="">
                        <label for="number" class="order-label">Cash on Delivery</label> 

                        <input class="with-gap" name="group1" type="radio" id="number1" checked="">
                        <label for="number1" class="order-label">Prepaid</label>
                    </div>
                  </div>
                </div>
              </div>


            </div>

            <div class="col-md-7">
              <div class="title-section">
                <p>CFT Calculator</p>
              </div>

              <div class="zone-box">
                  <div class="row">
                    <div class="col-md-4">
                      <div class="row">
                        <div class="col-md-8">
                          <div class="form-group custom-form-group">
                            <label class="form-label" for="pincode">Length</label>
                            <input class="form-control" placeholder="Length" type="text" value="">
                          </div>
                        </div>
                        <div class="col-md-4">
                          <div class="form-group custom-form-group">
                            <label class="form-label" for="pincode">&nbsp;</label>
                            <select class="form-control">
                              <option value="">ft</option>
                            </select>
                          </div>
                        </div>
                      </div>
                    </div>
                    <div class="col-md-4">
                      <div class="row">
                        <div class="col-md-8">
                          <div class="form-group custom-form-group">
                            <label class="form-label" for="pincode">Height</label>
                            <input class="form-control" placeholder="Height" type="text" value="">
                          </div>
                        </div>
                        <div class="col-md-4">
                          <div class="form-group custom-form-group">
                            <label class="form-label" for="pincode">&nbsp;</label>
                            <select class="form-control">
                              <option value="">ft</option>
                            </select>
                          </div>
                        </div>
                      </div>
                    </div>
                    <div class="col-md-4">
                      <div class="row">
                        <div class="col-md-8">
                          <div class="form-group custom-form-group">
                            <label class="form-label" for="pincode">Width</label>
                            <input class="form-control" placeholder="Width" type="text" value="">
                          </div>
                        </div>
                        <div class="col-md-4">
                          <div class="form-group custom-form-group">
                            <label class="form-label" for="pincode">&nbsp;</label>
                            <select class="form-control">
                              <option value="">ft</option>
                            </select>
                          </div>
                        </div>
                      </div>
                    </div>

                    <div class="col-md-12">
                      <div class="cft-calculator text-center">
                          <h6>Total Price: 23142132</h6>
                      </div>
                    </div>

                    <div class="col-md-5 mt-3">
                      <button type="button" class="btn btn-danger">Calculate</button>
                    </div>
                  </div>
              </div>
            </div>

            <div class="col-md-12 mt-4">
              <div class="title-section">
                <p>Notice Serviceability</p>
              </div>
            </div>
            <div class="col-md-4">
              <div class="form-group custom-form-group">
                <label class="form-label" for="weight">Notice Serviceability</label>
                <input class="form-control" placeholder="" type="text" value="">
              </div>
            </div>
            <div class="col-md-2">
              <div class="form-group custom-form-group">
                <label class="form-label" for="weight">&nbsp;</label> <br />
                <button type="button" class="btn btn-danger">Send</button>
              </div>
            </div>
          </div>

        </div>
      </section>
@endsection