@extends('layouts.master')

@section('page_title', 'Employee Payroll Management')

@section('content')
<div class="content-wrapper">
    <!-- Content area -->
    <div class="content">
        <!-- Page header -->
        <div class="page-header page-header-light">
            <div class="page-header-content header-elements-md-inline">
                <div class="page-title d-flex">
                    <h4>
                        <i class="icon-users4 mr-2"></i>
                        <span class="font-weight-semibold">Employee Payroll Management</span>
                    </h4>
                    <a href="#" class="header-elements-toggle text-default d-md-none"><i class="icon-more"></i></a>
                </div>

                <div class="header-elements d-none">
                    <div class="d-flex justify-content-center">
                        <a href="{{ route('payroll.index') }}" class="btn btn-light mr-2">
                            <i class="icon-arrow-left8 mr-1"></i>
                            Back to Dashboard
                        </a>
                    </div>
                </div>
            </div>
        </div>
        <!-- /page header -->

        <!-- Employee Payroll Manager Component -->
        <livewire:payroll.employee-payroll-manager />
    </div>
    <!-- /content area -->
</div>
@endsection