@extends('layouts.app')  
@section('title', 'Account Management')
@section('breadcrumb')
    <ol class="breadcrumb border-0 m-0 px-0 px-md-3">
        <li class="breadcrumb-item">Home</li>
        <li class="breadcrumb-item"><a href="{{ route('admin.dashboard') }}">Admin</a></li>
        <li class="breadcrumb-item"><a href="{{ route('admin.customer') }}">Account Management</a></li>
        <li class="breadcrumb-item active">Add Internet Service</li>
    </ol>
@endsection  
<style>
table, th, td{
  border:1px solid #ddd;
  
}
.bootstrap-select.btn-group .btn .caret {
    
    visibility: hidden;
}
.bootstrap-select:not([class*=col-]):not([class*=form-control]):not(.input-group-btn) {
    width: 220px;
}
html:not([dir="rtl"]) .form-check-input {
    margin-left: -1.25rem;
}

input {
  width: 66%;
  border-radius: 26px;
  border: 1px solid #ada9a9;
  padding: 1% 6%;
  margin: 1% 1%;
  background-image: url(https://www.pngarea.com/pngm/109/1164446_searchicon-png-search-icon-png-download.png);
  background-size: contain;
  background-repeat: no-repeat;
  outline: 0;
  background-position: 12px;
  background-size: 16px;
}
.textStyle {
            border: 1px solid #EDEADE;
            padding: 10px;
        }
        .headerLinkLeft {
            line-height: 44px;
            
            padding: 14px;
            color: black;
            text-decoration: none;
            margin: -2px;
        }
        .headerLinkLeft:hover{
            text-decoration: none;
            background-color: crimson;
            color: white;
        }
        .testColorCrimson{
            color: crimson;
            font-weight: bold;
        }
</style>
 @section('content')
 





    <div class="row">
        <div class="col-lg-12">
            <div class="card">
                <div class="card-header text-center"> <strong> PDF DOWNLOAD </strong></div>
                <form class="form-horizontal" action="" method="post">
                    @csrf
                    <div class="card-body">
                    	
                    </div>
                </form>
            </div>
        </div>
    </div>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/js/bootstrap.min.js"></script>
    <script src="//cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.6.3/js/bootstrap-select.min.js"></script>
    <link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.6.3/css/bootstrap-select.min.css" />
    <link href="//netdna.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" rel="stylesheet">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
    <script type="text/javascript">
       

         $("#ContractNote1").hide();
         $("#ContractNote").change(function(){
            if($(this).prop('checked'))
            {
                $("#ContractNote1").show();
            }
            else
            {
                $("#ContractNote1").hide();
            }
        });




        $(document).ready(function(){
            $(".caret").addClass("d-none");
        });
        $("#hide").hide();
        $("#hide1").hide();
        $("#ClientMonitoring").change(function(){
            if($(this).prop('checked'))
            {
                $("#hide").show();
                $("#hide1").show();
            }
            else
            {
                $("#hide").hide();
                $("#hide1").hide();
            }
        });
 

        $("#ProFil").hide();
        $("#ProFil1").hide();
         $("#SusPendService").change(function(){
            if($(this).prop('checked'))
            {
                $("#ProFil").show();
                $("#ProFil1").show();
            }
            else
            {
                $("#ProFil").hide();
                $("#ProFil1").hide();
            }
        });


        $(function(){
            $('.selectpicker').selectpicker();
        });

        $("#installationAddressField").hide();
        
        $("#hideShowInstallationAddressField").change(function(){
            if($(this).prop('checked'))
            {
                $("#installationAddressField").show();
            }
            else
            {
                $("#installationAddressField").hide();
            }
        });
        let inputBoxId = 0;
        function plusInputBox()
        {
            inputBoxId++;
            $("#showNewInputBox").append('<tr id="inputBoxRmId'+inputBoxId+'"><td><input type="text" class="form-control"></td><td><input type="text" class="form-control"></td><td><input type="text" class="form-control"></td><td><input type="text" class="form-control"></td><td></td></tr>');
        }
        function minusInputBox()
        {
            $("#inputBoxRmId"+inputBoxId).remove();
            inputBoxId--;
        }

    
</script>
@endsection