@php
$sideDashboards = ['/accounts'];
@endphp
<style>
	#sidebar-wrapper{
	position:absolute !important;
	height: calc(300vh - 66px);
	} 
</style>
<div class="d-flex width100P">
<div class="bar-width1 sidenav" id="bodyDiv">
	<script>
		// Check browser support
		if (typeof(Storage) !== "undefined") {
		    if(localStorage.getItem("slideClass") != '') {
		        $("#bodyDiv").addClass(localStorage.getItem("slideClass"));
		    } else {
		        localStorage.setItem("slideClass", "");
		    }
		}
	</script>
	<div id="sidebar-wrapper" class="scrollTop">
		<div class="mainNav">
			<ul>
				<li>
					<a href="{!!url('/accountsdashboard')!!}" class="waves-effect waves-light {{ activeSide($sideDashboards) }}">
                        <span class="icon24 icon-Dashboard"></span>
                        <span class="navFontSize">Accounts Dashboard</span>
					</a>
				</li>

				<li>
					<a class="waves-effect waves-light collapsed" data-toggle="collapse" href="#Accountants-tab" role="button" aria-expanded="false" aria-controls="Accountants-tab">
						<span class="icon24 icon-Banking"></span>
						<span class="navFontSize"> 
							<span class="float-left">Banking</span>
							<span class="navFontSizeIcon"> <i class="material-icons">keyboard_arrow_left</i></span> 
						</span>
					</a>
					<ul class="child_menu" id="Accountants-tab">
						<li>
							<a class="waves-effect waves-light" href="{!! url('/banking/accounts')!!}">
								
								<span class="navFontSize mrg-5">Bank and Credit Cards</span>
							</a>
						</li>
						<li>
							<a class="waves-effect waves-light" href="{!! url('/banking/transfers')!!}">
								
								<span class="navFontSize mrg-5">Transfers</span>
							</a>
						</li>
						<li>
							<a class="waves-effect waves-light" href="{!! url('/banking/deposit')!!}">
								
								<span class="navFontSize mrg-5">Bank Deposit</span>
							</a>
						</li>
						<li>
							<a class="waves-effect waves-light" href="{!! url('/expenses/cheques')!!}">
								
								<span class="navFontSize mrg-5">Cheque</span>
							</a>
						</li>
						<li>
							<a class="waves-effect waves-light" href="{!! url('/banking/journal')!!}">
								
								<span class="navFontSize mrg-5">Journel Entry</span>
							</a>
						</li>
					</ul>
				</li>

				<li>
					<a class="waves-effect waves-light collapsed" data-toggle="collapse" href="#Accountants-tab" role="button" aria-expanded="false" aria-controls="Accountants-tab">
						<span class="icon24 icon-Sales"></span>						
						<span class="navFontSize"> 
							<span class="float-left">Sales</span>
							<span class="navFontSizeIcon"> <i class="material-icons">keyboard_arrow_left</i></span> 
						</span>
					</a>
					<ul class="child_menu" id="Accountants-tab">
						<li>
							<a class="waves-effect waves-light" href="{!! url('/incomes/invoices')!!}">								
								<span class="navFontSize mrg-5">Invoices</span>
							</a>
						</li>
						<li>
							<a class="waves-effect waves-light" href="{!! url('/incomes/creditmemo')!!}">								
								<span class="navFontSize mrg-5">Credit Memos</span>
							</a>
						</li>
						<li>
							<a class="waves-effect waves-light" href="{!! url('incomes/customers')!!}">								
								<span class="navFontSize mrg-5">Customers</span>
							</a>
						</li>
						<li>
							<a class="waves-effect waves-light" href="{!! url('/items/items') !!}">								
								<span class="navFontSize mrg-5">Product and Services (Items)</span>
							</a>
						</li>
					</ul>
				</li>

				<li>
					<a class="waves-effect waves-light collapsed" data-toggle="collapse" href="#Accountants-tab" role="button" aria-expanded="false" aria-controls="Accountants-tab">
						<span class="icon24 icon-Expenses"></span>					
						<span class="navFontSize"> 
							<span class="float-left">Expenses</span>
							<span class="navFontSizeIcon"> <i class="material-icons">keyboard_arrow_left</i></span> 
						</span>
					</a>
					<ul class="child_menu" id="Accountants-tab">
						<li>
							<a class="waves-effect waves-light" href="{!! url('/expenses/bills')!!}">
								
								<span class="navFontSize mrg-5">Bills</span>
							</a>
						</li>
						<li>
							<a class="waves-effect waves-light" href="{!! url('/expenses/vendors')!!}">
								
								<span class="navFontSize mrg-5">Vendors</span>
							</a>
						</li>
						<li>
							<a class="waves-effect waves-light" href="{!! url('/expenses/debitmemo')!!}">
								
								<span class="navFontSize mrg-5">Debit Memos</span>
							</a>
						</li>
						<li>
							<a class="waves-effect waves-light" href="{!! url('/expenses/payments')!!}">
								
								<span class="navFontSize mrg-5">Payments</span>
							</a>
						</li>
					</ul>
				</li>

				<li class="menu-head-container">
					<span class="menu-head-responsive">R</span>
					<span class="navFontSize menu-head">Reports</span>
				</li>

				<li>
					<a class="waves-effect waves-light collapsed" data-toggle="collapse" href="#Accountants-tab" role="button" aria-expanded="false" aria-controls="Accountants-tab">
						<span class="icon24 icon-Reports"></span>			
						<span class="navFontSize"> 
							<span class="float-left">Reports</span>
							<span class="navFontSizeIcon"> <i class="material-icons">keyboard_arrow_left</i></span> 
						</span>
					</a>
					<ul class="child_menu" id="Accountants-tab">
						<li>
							<a class="waves-effect waves-light" href="{!! url('/reports/standard')!!}">
								
								<span class="navFontSize mrg-5">Standard Reports</span>
							</a>
						</li>
						<li>
							<a class="waves-effect waves-light" href="{!! url('/reports/management')!!}">
								
								<span class="navFontSize mrg-5">Management Reports</span>
							</a>
						</li>
					</ul>
				</li>

				<li>
					<a class="waves-effect waves-light collapsed" data-toggle="collapse" href="#Accountants-tab" role="button" aria-expanded="false" aria-controls="Accountants-tab">
						<span class="icon24 icon-Accountants"></span>
						<span class="navFontSize"> 
							<span class="float-left">Accounting</span>
							<span class="navFontSizeIcon"> <i class="material-icons">keyboard_arrow_left</i></span> 
						</span>
					</a>
					<ul class="child_menu" id="Accountants-tab">
						<li>
							<a class="waves-effect waves-light" href="{!! url('/accounting/chartofaccounts')!!}">
								
								<span class="navFontSize mrg-5">Chart of Accounts</span>
							</a>
						</li>
						<li>
							<a class="waves-effect waves-light" href="{!! url('/banking/reconcile')!!}">
								
								<span class="navFontSize mrg-5">Reconcile</span>
							</a>
						</li>
					</ul>
				</li>
				
				<li class="menu-head-container">
					<span class="menu-head-responsive">P</span>
					<span class="navFontSize menu-head">Payroll</span>
				</li>

				<li>
					<a class="waves-effect waves-light collapsed" data-toggle="collapse" href="#Accountants-tab" role="button" aria-expanded="false" aria-controls="Accountants-tab">
						<span class="icon24 icon-payRolls"></span>
						<span class="navFontSize"> 
							<span class="float-left">Payroll</span>
							<span class="navFontSizeIcon"> <i class="material-icons">keyboard_arrow_left</i></span> 
						</span>
					</a>
					<ul class="child_menu" id="Accountants-tab">
						<li>
							<a class="waves-effect waves-light" href="{!! url('/consultnatpayrates')!!}">
								
								<span class="navFontSize mrg-5">Consultant Pay Rates</span>
							</a>
						</li>
						<li>
							<a class="waves-effect waves-light" href="{!! url('/payrole/timesheet')!!}">
								
								<span class="navFontSize mrg-5">Employee Timesheet</span>
							</a>
						</li>
						<li>
							<a class="waves-effect waves-light" href="{!! url('/run_payroll')!!}">
								
								<span class="navFontSize mrg-5">Run Payroll</span>
							</a>
						</li>
						<li>
							<a class="waves-effect waves-light" href="{!! url('/setup_payroll')!!}">
								
								<span class="navFontSize mrg-5">Setup Payroll</span>
							</a>
						</li>
						<li>
							<a class="waves-effect waves-light" href="{!! url('/adp_payroll')!!}">
								
								<span class="navFontSize mrg-5">ADP Payroll</span>
							</a>
						</li>
						<li>
							<a class="waves-effect waves-light" href="{!! url('/pay_stubs')!!}">
								
								<span class="navFontSize mrg-5">Pay Stubs</span>
							</a>
						</li>
					</ul>
				</li>				
				
				<li class="menu-head-container">
					<span class="menu-head-responsive">T</span>
					<span class="navFontSize menu-head">Tools</span>
				</li>

				<li>
					<a class="waves-effect waves-light collapsed" data-toggle="collapse" href="#Accountants-tab" role="button" aria-expanded="false" aria-controls="Accountants-tab">
						<span class="icon24 icon-Settings"></span>					
						<span class="navFontSize"> 
							<span class="float-left">Settings</span>
							<span class="navFontSizeIcon"> <i class="material-icons">keyboard_arrow_left</i></span> 
						</span>
					</a>
					<ul class="child_menu" id="Accountants-tab">
						<li>
							<a class="waves-effect waves-light" href="{!! url('/settings/ac_settings')!!}">
								
								<span class="navFontSize mrg-5">Company</span>
							</a>
						</li>
						<li>
							<a class="waves-effect waves-light" href="{!! url('/settings/ac_settings#localisation')!!}">
								
								<span class="navFontSize mrg-5">Date Settings</span>
							</a>
						</li>
						<li>
							<a class="waves-effect waves-light" href="{!! url('/settings/ac_settings#invoice')!!}">
								
								<span class="navFontSize mrg-5">Invoice</span>
							</a>
						</li>
						<li>
							<a class="waves-effect waves-light" href="{!! url('/settings/ac_settings#default')!!}">
								
								<span class="navFontSize mrg-5">Defaults</span>
							</a>
						</li>
						<li>
							<a class="waves-effect waves-light" href="{!! url('/settings/ac_settings#scheduling')!!}">
								
								<span class="navFontSize mrg-5">Scheduling</span>
							</a>
						</li>
					</ul>
				</li>	
			</ul>
		</div>
	</div>
</div>
<script>
	$('.selectpicker').selectpicker('refresh');
</script>