<!DOCTYPE html>

<head>
    <title>@yield('title', 'Employee Panel | Odyssey')</title>
    <meta name="description" content="#" />
    <meta name="keywords" content="#" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta charset="utf-8" />
    {{-- <meta property="og:locale" content="en_US" />
    <meta property="og:type" content="#" />
    <meta property="og:title" content="#" />
    <meta property="og:url" content="#" />
    <meta property="og:site_name" content="#" /> --}}
    {{-- <link rel="canonical" href="#" /> --}}
    <link rel="shortcut icon" href="{{ asset('vault/images/content/favicon.ico') }}" />
    <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Poppins:300,400,500,600,700" />
    @stack('styles')
    <link href="{{ asset('assets/employee/plugins/global/plugins.bundle.css') }}" rel="stylesheet" type="text/css" />
    <link href="{{ asset('assets/employee/css/style.bundle.css') }}" rel="stylesheet" type="text/css" />
</head>

<body id="kt_body"
    class="header-fixed header-tablet-and-mobile-fixed toolbar-enabled toolbar-fixed aside-enabled aside-fixed"
    style="--kt-toolbar-height:55px;--kt-toolbar-height-tablet-and-mobile:55px">
    <div class="d-flex flex-column flex-root">
        <div class="flex-row page d-flex flex-column-fluid">

            {{-- ? Section Sidebar --}}
            @include('employee.components.sidebar')

            <div class="wrapper d-flex flex-column flex-row-fluid" id="kt_wrapper">

                {{-- ? Section Header --}}
                @include('employee.components.header')

                <div class="content d-flex flex-column flex-column-fluid" id="kt_content">
                    {{-- ? Section Header Toolbar --}}
                    <div class="toolbar" id="kt_toolbar">
                        <div id="kt_toolbar_container" class="container-fluid d-flex flex-stack">
                            <div data-kt-swapper="true" data-kt-swapper-mode="prepend"
                                data-kt-swapper-parent="{default: '#kt_content_container', 'lg': '#kt_toolbar_container'}"
                                class="flex-wrap mb-5 page-title d-flex align-items-center me-3 mb-lg-0">
                                @yield('navigation')
                            </div>
                        </div>
                    </div>

                    {{-- ? Section Content Pages --}}
                    <div class="post d-flex flex-column-fluid" id="kt_post">
                        <div id="kt_content_container" class="container-xxl">
                            @yield('content')
                        </div>
                    </div>
                </div>

                {{-- ? Section Footer --}}
                @include('employee.components.footer')
            </div>
        </div>
    </div>

    <script src="{{ asset('assets/employee/plugins/global/plugins.bundle.js') }}"></script>
    <script src="{{ asset('assets/employee/js/scripts.bundle.js') }}"></script>
    <script>
        @if (Session::has('message'))
            function showToast(type, message) {
                toastr.options = {
                    "closeButton": false,
                    "debug": false,
                    "newestOnTop": false,
                    "progressBar": true,
                    "positionClass": "toast-top-right",
                    "preventDuplicates": false,
                    "onclick": null,
                    "showDuration": "300",
                    "hideDuration": "1000",
                    "timeOut": "5000",
                    "extendedTimeOut": "1000",
                    "showEasing": "swing",
                    "hideEasing": "linear",
                    "showMethod": "fadeIn",
                    "hideMethod": "fadeOut"
                };

                switch (type) {
                    case 'info':
                        toastr.info(message);
                        break;
                    case 'success':
                        toastr.success(message);
                        break;
                    case 'warning':
                        toastr.warning(message);
                        break;
                    case 'error':
                        toastr.error(message);
                        break;
                }
            }

            $(document).ready(function() {
                var type = "{{ Session::get('alert-type') }}";
                var message = "{{ Session::get('message') }}";
                showToast(type, message);
            });
        @endif
    </script>
    @stack('scripts')
</body>

</html>
