<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <title>Absensiku - @yield('title')</title>
    <link rel="stylesheet" href="{{ url('/assets/vendors/feather/feather.css') }}">
    <link rel="stylesheet" href="{{ url('/assets/vendors/ti-icons/css/themify-icons.css') }}">
    <link rel="stylesheet" href="{{ url('/assets/vendors/css/vendor.bundle.base.css') }}">

    <!-- DataTables Bootstrap 4 CDN CSS -->
    <link rel="stylesheet" href="https://cdn.datatables.net/1.13.7/css/dataTables.bootstrap4.min.css">
    <link rel="stylesheet" href="https://cdn.datatables.net/responsive/2.5.0/css/responsive.bootstrap4.min.css">
    <link rel="stylesheet" href="https://cdn.datatables.net/select/1.7.0/css/select.bootstrap4.min.css">

    <link rel="stylesheet" href="{{ url('/assets/css/vertical-layout-light/style.css') }}">

    <link rel="shortcut icon" href="{{ url('/assets/images/favicon.png') }}" />
    <style>
        .menu-icon {
            font-size: 0.875rem !important;
            margin-right: 0.75rem !important;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            vertical-align: middle;
        }
        .toggle-password {
            position: absolute;
            top: 38px;
            right: 15px;
            cursor: pointer;
            color: #999;
            z-index: 2;
        }
        .swal2-popup {
            padding-top: 25px;
        }
    </style>
    @stack('css')
</head>

<body>
    <div class="container-scroller">
        @include('dashboard.partials.navbar')

        <div class="container-fluid page-body-wrapper">
            @include('dashboard.partials.setting-panel')
            @include('dashboard.partials.sidebar')
            <div class="main-panel">
                @yield('content')

                @include('dashboard.partials.footer')
            </div>
        </div>
    </div>

    <script src="{{ url('/assets/vendors/js/vendor.bundle.base.js') }}"></script>
    <script src="{{ url('/assets/vendors/chart.js/Chart.min.js') }}"></script>

    <!-- DataTables Bootstrap 4 CDN JS -->
    <script src="https://cdn.datatables.net/1.13.7/js/jquery.dataTables.min.js"></script>
    <script src="https://cdn.datatables.net/1.13.7/js/dataTables.bootstrap4.min.js"></script>
    <script src="https://cdn.datatables.net/responsive/2.5.0/js/dataTables.responsive.min.js"></script>
    <script src="https://cdn.datatables.net/responsive/2.5.0/js/responsive.bootstrap4.min.js"></script>
    <script src="https://cdn.datatables.net/select/1.7.0/js/dataTables.select.min.js"></script>

    <script src="{{ url('/assets/js/off-canvas.js') }}"></script>
    <script src="{{ url('/assets/js/hoverable-collapse.js') }}"></script>
    <script src="{{ url('/assets/js/template.js') }}"></script>
    <script src="{{ url('/assets/js/settings.js') }}"></script>
    <script src="{{ url('/assets/js/todolist.js') }}"></script>
    <script src="{{ url('/assets/js/dashboard.js') }}"></script>
    <script src="{{ url('/assets/js/Chart.roundedBarCharts.js') }}"></script>
    <script src="{{ url('/assets/js/js-cookie.js') }}"></script>
    <script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
    <script>
        function getAuthorizationHeader() {
            return 'Bearer ' + Cookies.get('_absensiku_karyawan_token');
        }

        $('#logoutBtn').click(function (e) {
            e.preventDefault();

            Swal.fire({
                title: 'Keluar?',
                text: 'Apakah Anda yakin ingin logout?',
                icon: 'warning',
                showCancelButton: true,
                confirmButtonText: 'Ya, logout!',
                cancelButtonText: 'Batal'
            }).then((result) => {
                if (result.isConfirmed) {
                    $.ajax({
                        url: '/api/logout',
                        method: 'POST',
                        headers: {
                            'Authorization': getAuthorizationHeader(),
                            'Accept': 'application/json'
                        },
                        success: function (response) {
                            Swal.fire('Berhasil!', response.message || 'Logout berhasil.', 'success').then(() => {
                                Cookies.remove('_absensiku_karyawan_token');
                                window.location.href = "{{ route('auth.login') }}";
                            });
                        },
                        error: function (xhr) {
                            const msg = xhr.responseJSON?.message || 'Gagal logout.';
                            Swal.fire('Oops!', msg, 'error');
                        }
                    });
                }
            });
        });
    </script>
    @stack('script')
</body>

</html>
