@php
    $roleGlobal = auth()->user()?:[];
    $checkRole = checkRoleAlready();
@endphp
<style>
    .nav-link.icon.notification {
        border: solid 1px #7abaff;
    }

    .dropdown-custom .username {
        line-height: 3.5;
    }

    .position0 {
        position: absolute !important;
        top: 0;
        right: 0;
    }

    .margin-right0 i {
        margin-right: 0 !important;
    }

    .avatar {
        display: table-cell;
        vertical-align: top;
        width: 52px;
        height: 52px;
        -webkit-box-sizing: none;
        box-sizing: none;
    }

    @media only screen and (max-width: 1367px) {
        .ren-navbar .nav-link {
            padding: 1.3rem 0.9rem;
        }
    }

    .left {
        float: left;
    }
</style>

<!-- Horizantal menu-->
<div class="crm-sidebar-overlay"></div>
<div class="ren-navbar fixed-header1" id="headerMenuCollapse">
    <div class="container">
        <div class="crm-sidebar-brand">
            <div class="crm-sidebar-brand__mark">
                <i class="fas fa-gem"></i>
            </div>
            <div class="crm-sidebar-brand__text">
                <div class="crm-sidebar-brand__name">BEAUTY CRM</div>
                <div class="crm-sidebar-brand__meta">Spa management</div>
            </div>
            <button class="crm-sidebar-toggle" type="button" aria-label="Thu gọn menu" aria-pressed="false">
                <i class="fas fa-bars"></i>
            </button>
        </div>
        <ul class="nav">

            @if($roleGlobal->permission('schedules.list'))
                <li class="nav-item">
                    <a class="nav-link {{ Request::is('schedules*')||Request::is('schedules*') ? 'active' : '' }}"
                       href="{!! url('schedules') !!}"><i class="fas fa-calendar-check"></i><span>Lịch hẹn</span></a>
                </li>
            @endif

            @if($roleGlobal->permission('customers.list'))
                <li class="nav-item">
                    <a class="nav-link {{ Request::is('customers*')||Request::is('customers*') ? 'active' : '' }}"
                       href="{!! route('customers.index') !!}"><i
                            class="fas fa-users"></i><span>Khách hàng</span></a>
                </li>
            @endif
            <li class="nav-item with-sub">
                <a class="nav-link {{ Request::is('marketing/fanpage*')||Request::is('marketing/meta-ads*')||Request::is('posts*')||Request::is('customer-post*')||Request::is('rules*') ? 'active' : '' }}"
                   href="#"><i class="fas fa-bullhorn"></i><span>Marketing</span></a>
                <div class="sub-item">
                    <ul>
                        {{--                        @if($roleGlobal->permission('marketing.fanpage'))--}}
                        {{--                            <li><a href="{{route('marketing.fanpage.index')}}">Fanpage </a></li>--}}
                        {{--                        @endif--}}

                        {{--                        @if($roleGlobal->permission('marketing.fanpage_post'))--}}
                        {{--                            <li><a href="{{route('marketing.fanpage-post.index')}}">Fanpage Post</a></li>--}}
                        {{--                        @endif--}}

                        @if($roleGlobal->permission('marketing.dashboard'))
                            <li class="sub-with-sub">
                                <a href="#">Xếp hạng</a>
                                <ul>
                                    <li><a href="{{route('marketing.dashboard')}}">Marketing Dashbroad</a></li>
                                    <li><a href="{{url('marketing/ranking')}}">Bảng xếp hạng</a></li>
                                </ul>
                            </li>
                        @endif

                        @if($roleGlobal->permission('source.list') || $roleGlobal->permission('marketing.seeding_number'))
                            <li class="sub-with-sub">
                                <a href="#">Dữ liệu</a>
                                <ul>
                                    @if($roleGlobal->permission('source.list'))
                                        {{--                                        <li><a href="{!! route('marketing.source-fb.index') !!}">Kết nối FaceBook</a>--}}
                                        {{--                                        </li>--}}
                                        <li><a href="{!! route('marketing.source-landipage.index') !!}">Kết nối
                                                Landipage</a></li>
                                    @endif

                                    {{--                                    @if($roleGlobal->permission('marketing.seeding_number'))--}}
                                    {{--                                        <li><a href="{{route('marketing.seeding-number.index')}}">Kho số seeding</a>--}}
                                    {{--                                        </li>--}}
                                    {{--                                    @endif--}}
                                    {{--                                    @if($roleGlobal->permission('posts.list'))--}}
                                    {{--                                        <li><a href="{{route('posts.index')}}">Optin form</a>--}}
                                    {{--                                        </li>--}}
                                    {{--                                    @endif--}}
                                </ul>
                            </li>
                        @endif
                        @if(empty($permissions) || !in_array('rules.index',$permissions)|| !in_array('promotions.index',$permissions))
                            <li class="sub-with-sub">
                                <a href="#">Nâng cao</a>
                                <ul>
                                    @if(empty($permissions) || !in_array('rules.index',$permissions))
                                        @if($roleGlobal->permission('rules.list'))
                                            <li><a href="{{url('rules')}}">Automation </a></li>
                                        @endif
                                    @endif
                                    @if(empty($permissions) || !in_array('promotions.index',$permissions))
                                        @if($roleGlobal->permission('promotions.list'))
                                            <li><a href="{{route('promotions.index')}}">Voucher khuyến mãi</a></li>
                                        @endif
                                    @endif
                                    @if($roleGlobal->permission('marketing.fanpage'))
                                        <li><a href="{{route('landipages.index')}}">Landipage</a></li>
                                        {{--                                        <li><a href="{{route('marketing.chat-messages')}}">Nhắn tin fanpage</a></li>--}}
                                    @endif
                                </ul>
                            </li>
                        @endif
                        <li><a href="{{route('marketing.meta-ads.index')}}">Tài khoản quảng cáo Meta</a></li>
                        <li class="sub-with-sub">
                            <a href="#">Chiến dịch</a>
                            <ul>
                                <li><a href="{{route('campaigns.index')}}">Quản lý chiến dịch</a></li>
                                <li><a href="{{route('customer-campaign.index')}}">Khách hàng</a></li>
                            </ul>
                        </li>
                    </ul>
                </div>
            </li>
            <li class="nav-item with-sub">
                <a class="nav-link {{ Request::is('category*')||Request::is('orders-payment')||Request::is('list-orders*')||Request::is('combos*')||Request::is('services*')||Request::is('products*')||Request::is('category-product*') ? 'active' : '' }}"
                   href="#"><i class="fas fa-shopping-cart"></i><span>Bán hàng</span></a>
                <div class="sub-item">
                    <ul>
                        <li class="sub-with-sub">
                            <a href="#">Quản lý nhóm</a>
                            <ul>
                                @if($roleGlobal->permission('category.list'))
                                    <li><a href="{!! route('category.index') !!}">Nhóm dịch vụ</a></li>
                                @endif
                                @if($roleGlobal->permission('category-product.list'))
                                    <li><a href="{!! route('category-product.index') !!}">Nhóm sản phẩm</a></li>
                                @endif
                                @if($roleGlobal->permission('genitives.list'))
                                    <li><a href="{!! route('genitives.index') !!}">Nhóm tính cách</a></li>
                                @endif
                            </ul>
                        </li>
                        <li class="sub-with-sub">
                            <a href="#">Quản lý S.Phẩm & D.Vụ</a>
                            <ul>
                                @if($roleGlobal->permission('services.list'))
                                    <li><a href="{!! route('services.index') !!}">Danh sách dịch vụ</a></li>
                                    <li><a href="{!! route('tips.index') !!}">Danh sách thủ thuật (công)</a></li>
                                @endif
                                @if($roleGlobal->permission('products.list'))
                                    <li><a href="{!! route('products.index') !!}">Danh sách sản phẩm</a></li>
                                @endif
                            </ul>
                        </li>


                        @if($roleGlobal->permission('trademark.list'))
                            <li><a href="{!! route('trademark.index') !!}">Nhà cung cấp</a></li>
                        @endif

                        <li class="sub-with-sub">
                            <a href="#">Quản lý đơn hàng</a>
                            <ul>
                                @if($roleGlobal->permission('order.list'))
                                    <li><a href="{!! route('order.list') !!}">Danh sách đơn hàng</a></li>
                                @endif
                                @if($roleGlobal->permission('order.index_payment'))
                                    <li><a href="{!! route('order.index_payment') !!}">Đã thu trong kỳ</a></li>
                                @endif
                            </ul>
                        </li>
                        <li class="sub-with-sub">
                            <a href="#">Quản lý đơn nạp ví</a>
                            <ul>
                                @if($roleGlobal->permission('order.index_payment'))
                                    <li><a href="{!! route('payment-wallet.index') !!}">Đã thu trong kỳ</a></li>
                                @endif
                            </ul>
                        </li>
                        @if($roleGlobal->permission('order.orders-destroy'))
                            <li><a href="{!! route('order.orders-destroy') !!}">Đơn hàng bị xoá</a></li>
                        @endif
                    </ul>
                </div>
            </li>
                @if($roleGlobal->permission('tasks.employee'))
                    <li class="nav-item">
                        <a class="nav-link {{ Request::is('tasks') ? 'active' : '' }}"
                           href="{{url('tasks-employee')}}">
                            <i class="fas fa-headset"></i><span>CSKH</span></a>
                        {{--                <div class="sub-item">--}}
                        {{--                    <ul>--}}
                        {{--                        @if($roleGlobal->permission('tasks.employee'))--}}
                        {{--                            <li><a href="{{url('tasks')}}">CSKH nhân viên</a></li>--}}
                        {{--                            <li><a href="{{url('tasks-employee')}}">CSKH phòng ban</a></li>--}}
                        {{--                        @endif--}}
                        {{--                    </ul>--}}
                        {{--                </div>--}}
                    </li>
                @endif
            <li class="nav-item with-sub">
                <a class="nav-link {{ Request::is('statistics*')||Request::is('report*')||Request::is('history-sms') ? 'active' : '' }}"
                   href="#"><i class="fas fa-chart-bar"></i><span>Thống kê</span></a>
                <div class="sub-item">
                    <ul>
                        <li class="sub-with-sub">
                            <a href="#">Doanh số & Doanh thu</a>
                            <ul>
                                @if($roleGlobal->permission('statistics.index'))
                                    <li><a href="{{url('statistics')}}">Doanh thu</a></li>
                                @endif
                                @if($roleGlobal->permission('report.chart-revenue'))
                                    <li><a href="{{url('chart-revenue')}}">BĐ hệ thống</a></li>
                                @endif
                                @if($roleGlobal->permission('report.branchs'))
                                    <li><a href="{{route('report.branchs')}}">Nguồn thu từ đơn hệ thống</a></li>
                                @endif

                                <li><a href="{{url('chart-pay')}}">Duyệt chi</a></li>
                                @if($roleGlobal->permission('report.branch-source'))
                                    <li><a href="{{route('report.branch-source')}}">Báo cáo nguồn dữ liệu</a></li>
                                @endif
                                @if($roleGlobal->permission('report.groupSale'))
                                    <li><a href="{{url('report/group-sale')}}">Doanh số nhóm SP&DV</a></li>
                                @endif
                            </ul>
                        </li>

                        @if($roleGlobal->permission('report.mkt'))
                            <li class="sub-with-sub">
                                <a href="#">Marketing</a>
                                <ul>
                                    <li><a href="{{url('marketing/ranking')}}">Bảng xếp hạng</a></li>
                                    <li><a href="{{url('marketing/leader')}}">Báo cáo doanh thu</a></li>
                                </ul>
                            </li>
                        @endif

                        @if($roleGlobal->permission('report.sale') || $roleGlobal->permission('statistics.taskSchedules'))
                            <li class="sub-with-sub">
                                <a href="#">Telesales</a>
                                <ul>
                                    @if($roleGlobal->permission('report.sale'))
                                        <li><a href="{{url('report/sale-ranking')}}">Bảng xếp hạng</a></li>
                                        <li><a href="{{url('report/sales')}}">Báo cáo doanh thu</a></li>
                                        <li><a href="{{url('report/sale-status')}}">Báo cáo phân bổ SĐT</a></li>
                                    @endif
                                    @if($roleGlobal->permission('statistics.taskSchedules'))
                                        <li><a href="{{url('statistics-task')}}">BĐ C.việc & lịch hẹn</a></li>
                                    @endif
                                </ul>
                            </li>
                        @endif

                        <li class="sub-with-sub">
                            <a href="#">Phòng ban khác</a>
                            <ul>
                                @if($roleGlobal->permission('report.cskh'))
                                    <li><a href="{{url('report/cskh')}}">Xếp hạng CSKH</a></li>
                                @endif
                                @if($roleGlobal->permission('carepage.index'))
                                    <li><a href="{{url('marketing/carepage-ranking')}}">Xếp hạng CarePage</a></li>
                                    <li><a href="{{url('marketing/carepage')}}">Báo cáo DT CarePage</a></li>
                                @endif
                                @if($roleGlobal->permission('report.waiters'))
                                    <li><a href="{{url('report/waiters')}}">Báo cáo DT lễ tân</a></li>
                                @endif
                                @if($roleGlobal->permission('report.commission'))
                                    <li><a href="{{url('report/commission')}}">Báo cáo KTV</a></li>
                                @endif
                                <li><a href="/report/hoa-hong-ctv">Hoa hồng CTV</a></li>
                                <li><a href="/report/hoa-hong">Hoa hồng nhân viên</a></li>
                            </ul>
                        </li>
                        <li class="sub-with-sub">
                            <a href="#">Khác</a>
                            <ul>
                                <li><a href="{{route('statistic-campaigns.index')}}">Hiệu quả chiến dịch</a></li>
                                <li><a href="{{url('statistics-personal')}}">Biểu đồ nhân sự</a></li>
                                @if($roleGlobal->permission('sms.history'))
                                    <li><a href="{{url('history-sms')}}">Tin nhắn đã gửi</a></li>
                                @endif
                                @if($roleGlobal->permission('report.tasks'))
                                    <li><a href="{{url('report/tasks')}}">Hiệu quả công việc</a></li>
                                @endif
                            </ul>
                        </li>
                        @if($roleGlobal->permission('call-center'))
                            <li><a href="{{route('call-center.index')}}">Quản lý tổng đài</a></li>
                        @endif

                    </ul>
                </div>
            </li>

            <li class="nav-item with-sub">
                <a class="nav-link {{ Request::is('depots*') ? 'active' : '' }}" href="#">
                    <i class="fas fa-warehouse"></i><span>Kho Vận</span></a>
                <div class="sub-item">
                    <ul>
                        <li><a href="{{url('depots/product')}}">Sản phẩm kho</a></li>
                        <li><a href="{{url('depots/history')}}">Lich sử nhập, xuất kho</a></li>
                        <li><a href="{{url('depots/statistical')}}">Báo cáo tồn</a></li>
                    </ul>
                </div>
            </li>

            @if($roleGlobal->permission('thu-chi.list'))
                <li class="nav-item with-sub">
                    <a class="nav-link {{ Request::is('danh-muc-thu-chi*')||Request::is('ly-do-thu-chi*')||Request::is('thu-chi*') ? 'active' : '' }}"
                       href="#">
                        <i class="fas fa-file-invoice-dollar"></i><span>Duyệt chi</span></a>
                    <div class="sub-item">
                        <ul>
                            @if($roleGlobal->permission('danh-muc-thu-chi.index'))
                                <li><a href="{{url('danh-muc-thu-chi')}}">Danh mục duyệt chi</a></li>
                                <li><a href="{{url('ly-do-thu-chi')}}">Lý do duyệt chi</a></li>
                            @endif
                                @if($roleGlobal->permission('thu-chi.list'))
                                    <li><a href="{{url('thu-chi')}}">Danh sách duyệt chi</a></li>
                                @endif
                        </ul>
                    </div>
                </li>
            @endif

            <li class="nav-item with-sub">
                <a class="nav-link {{ Request::is('settings*')||Request::is('approval*')||Request::is('teams*') ? 'active' : '' }}"
                   href="#"><i class="fas fa-user-tie"></i><span>Nhân sự</span></a>
                <div class="sub-item">
                    <ul>
                        @if($roleGlobal->permission('time-status.index'))
                            <li><a href="{{url('settings/time-status')}}">Cài đặt thời gian</a></li>
                        @endif

                        <li class="sub-with-sub">
                            <a href="#">Chấm công</a>
                            <ul>
                                @if($roleGlobal->permission('cham_cong.list'))
                                    <li><a href="{{url('approval/statistic')}}">DS Chấm công</a></li>
                                @endif
                                @if($roleGlobal->permission('history_approval.list'))
                                    <li><a href="{{url('approval/history')}}">Chi tiết chấm công</a></li>
                                @endif
                            </ul>
                        </li>

                        <li class="sub-with-sub">
                            <a href="#">Bảng lương</a>
                            <ul>
                                @if($roleGlobal->permission('history_salary.list'))
                                    <li><a href="{{url('approval/history-import-salary')}}">Nhập bảng lương</a></li>
                                @endif
                                @if($roleGlobal->permission('salary.list'))
                                    <li><a href="{{url('approval/salary')}}">Bảng lương</a></li>
                                @endif
                            </ul>
                        </li>

                        <li class="sub-with-sub">
                            <a href="#">Đơn từ</a>
                            <ul>
                                @if($roleGlobal->permission('don_tu.list'))
                                    <li><a href="{{url('approval/order')}}">Đơn từ</a></li>
                                @endif
                                @if($roleGlobal->permission('reason.list'))
                                    <li><a href="{{url('approval/reason')}}">Lý do đơn từ</a></li>
                                @endif
                            </ul>
                        </li>
                        @if($roleGlobal->permission('teams.list'))
                            <li><a href="{{route('teams.index')}}">Quản lý đội nhóm</a></li>
                        @endif

                    </ul>
                </div>
            </li>

        </ul>
    </div>
</div>

<div class="div-info">
    <div class="left">
        <button class="mobile-sidebar-toggle" type="button" aria-label="Mở menu">
            <i class="fas fa-bars"></i>
        </button>
        <span class="crm-mobile-brand d-inline-block d-md-none font-weight-bold ml-2 text-primary" style="font-size: 15px; letter-spacing: -0.2px;">
            <i class="fas fa-gem mr-1"></i> BEAUTY CRM
        </span>
                {{-- Chuông thông báo: đang tắt theo config('crm.notification_enabled') (config/crm.php) --}}
                @if(config('crm.notification_enabled'))
                <input id="check_notify" type="hidden">
                <div class="dropdown dropdown-notification d-none d-md-flex">
                    <a class="nav-link icon notification margin-right0" data-toggle="dropdown"><i
                            style="color: #3691ef;"
                            class="fas fa-bell"></i> <span
                            class="badge badge-danger badge-pill position0">10</span></a>
                    <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow"
                         style="overflow: auto;max-height: 400px">
                        <a class="dropdown-item text-center text-dark" href="#">2 New Messages</a>
                        <div class="dropdown-divider"></div>
                        <div class="content-notify">

                        </div>
                        <div class="dropdown-divider"></div>
                        <a class="dropdown-item text-center text-muted-dark"
                           href="{{route('notifications.index')}}">Xem tất cả</a>
                    </div>
                </div>

                <audio id="myAudio">
                    <source src="{{asset('default/sound-notification.mp3')}}" type="audio/ogg">
                </audio>
                <button id="btn_audio" style="display: none"></button>
                @endif
            </div>
            <div class="right">
                {{-- Nút chuyển giao diện sáng/tối: lưu lựa chọn ở localStorage('crmTheme'), trạng thái gắn sớm trong layout/app.blade.php --}}
                <button class="crm-theme-toggle" type="button" aria-label="Bật giao diện tối" aria-pressed="false"
                        title="Bật giao diện tối">
                    <i class="fas fa-moon crm-theme-toggle__moon" aria-hidden="true"></i>
                    <i class="fas fa-sun crm-theme-toggle__sun" aria-hidden="true"></i>
                </button>
                <div class="dropdown dropdown-custom">
                    <a class="pr-0 leading-none d-flex" data-toggle="dropdown" href="#">
                        @if(\Auth::user()->avatar)
                            <span class="avatar avatar-md brround "
                                  style="background-image: url({{ url(\Auth::user()->avatar) }})"></span>
                        @else
                            <span class="avatar avatar-md brround"
                                  style="background-image: url(/assets/images/faces/female/25.jpg)"></span>
                        @endif
                        <span class="ml-2 d-none d-lg-block username">
                    <span class="" style="color: #7490BD">{!! Auth::user()->full_name !!}</span>
                </span>
                    </a>
                    <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow">
                        <a class="dropdown-item" href="{{ url('users/'.Auth::user()->id . '/edit') }}"><i
                                class="dropdown-icon mdi mdi-face-profile"></i> Cài đặt tài khoản</a>
                        @if($roleGlobal->permission('users.list'))
                            <a class="dropdown-item" href="{!! route('users.index') !!}"><i
                                    class="dropdown-icon mdi mdi-account-outline"></i> Quản lý người dùng</a>
                        @endif

                        @if($roleGlobal->permission('department.list'))
                            <a class="dropdown-item" href="{!! route('department.index') !!}"><i
                                    class="dropdown-icon mdi mdi-account-multiple"></i> Quản lý phòng ban</a>
                        @endif

                        @if(empty($permissions) || !in_array('sms.index',$permissions))
                            @if($roleGlobal->permission('sms'))
                                <a class="dropdown-item" href="{!! route('sms.index') !!}">
                                    <i class="dropdown-icon fas fa-envelope"></i> Quản lý tin nhắn
                                </a>
                            @endif
                        @endif
                        @if($roleGlobal->permission('status.list'))
                            <a class="dropdown-item" href="{!! route('status.index') !!}"><i
                                    class="dropdown-icon mdi mdi-account-card-details"></i> Quản lý CRM</a>
                        @endif
                        @if(empty($permissions) || !in_array('package.index',$permissions))
                            @if($roleGlobal->permission('settings'))
                                <a class="dropdown-item" href="{!! route('package.index') !!}"><i
                                        class="dropdown-icon mdi mdi-monitor"></i> Quản lý gói nạp ví</a>
                            @endif
                        @endif
                        @if(empty($permissions) || !in_array('settings.index',$permissions))
                            @if($roleGlobal->permission('settings'))
                                <a class="dropdown-item" href="{!! route('settings.index') !!}"><i
                                        class="dropdown-icon mdi mdi-settings"></i> Cài đặt chung</a>
                            @endif
                        @endif

                        @if($roleGlobal->permission('roles.list'))
                            <a class="dropdown-item" href="{!! route('roles.index') !!}">
                                <i class="dropdown-icon mdi mdi-percent"></i> Quản lý phân quyền</a>
                        @endif

                        @if($roleGlobal->permission('leaderSale'))
                            {{-- Công tắc "Sale xem tất cả KH": cùng 1 dòng như các mục menu, giữ input.check cho JS lưu cài đặt --}}
                            <label class="dropdown-item crm-sale-toggle">
                                <i class="dropdown-icon fas fa-user-friends"></i>
                                <span class="crm-sale-toggle__text">Sale xem tất cả KH</span>
                                <input name="checkbox" class="check" type="checkbox"
                                       {{setting('view_customer_sale')==\App\Constants\StatusCode::ON?'checked':''}}>
                                <span class="crm-sale-toggle__track" aria-hidden="true"></span>
                            </label>
                        @endif
                        <div class="dropdown-divider"></div>
                        <a href="{!! url('/logout') !!}" class="dropdown-item"
                           onclick="event.preventDefault(); document.getElementById('logout-form').submit();">
                            <i class="dropdown-icon mdi mdi-logout-variant"></i>
                            Đăng xuất
                        </a>

                        <form id="logout-form" action="{{ url('/logout') }}" method="POST" style="display: none;">
                            {{ csrf_field() }}
                        </form>
                    </div>
                </div>

            </div>
        </div>

<script>
    (function () {
        var root = document.documentElement;
        var buttons = document.querySelectorAll('.crm-theme-toggle');

        function applyTheme(theme, persist) {
            var isDark = theme === 'dark';
            root.setAttribute('data-theme', isDark ? 'dark' : 'light');
            Array.prototype.forEach.call(buttons, function (btn) {
                var label = isDark ? 'Bật giao diện sáng' : 'Bật giao diện tối';
                btn.setAttribute('aria-pressed', isDark ? 'true' : 'false');
                btn.setAttribute('aria-label', label);
                btn.setAttribute('title', label);
            });
            if (persist) {
                try { localStorage.setItem('crmTheme', isDark ? 'dark' : 'light'); } catch (e) {}
                // Báo cho public/js/crm-dark-text.js quét/khôi phục màu chữ
                document.dispatchEvent(new CustomEvent('crm:themechange', {detail: {theme: isDark ? 'dark' : 'light'}}));
            }
        }

        applyTheme(root.getAttribute('data-theme'), false);

        var reduceMotion = window.matchMedia && window.matchMedia('(prefers-reduced-motion: reduce)').matches;

        Array.prototype.forEach.call(buttons, function (btn) {
            btn.addEventListener('click', function () {
                var next = root.getAttribute('data-theme') === 'dark' ? 'light' : 'dark';
                var run = function () { applyTheme(next, true); };
                // View Transitions: trình duyệt chụp ảnh trước/sau rồi làm mờ chuyển trên GPU,
                // không phải chạy transition màu cho từng phần tử -> mượt kể cả trang nhiều dữ liệu.
                // Trình duyệt chưa hỗ trợ thì đổi ngay lập tức.
                if (document.startViewTransition && !reduceMotion) {
                    document.startViewTransition(run);
                } else {
                    run();
                }
            });
        });
    })();

    (function () {
        var storageKey = 'crmSidebarCollapsed';
        var body = document.body;
        var sidebar = document.querySelector('.ren-navbar');
        var toggle = document.querySelector('.crm-sidebar-toggle');

        if (!sidebar) {
            return;
        }

        function closeItem(item) {
            item.classList.remove('is-open');
            var link = item.querySelector(':scope > a');
            if (link) {
                link.setAttribute('aria-expanded', 'false');
            }
            Array.prototype.forEach.call(item.querySelectorAll('.is-open'), function (child) {
                child.classList.remove('is-open');
                var childLink = child.querySelector(':scope > a');
                if (childLink) {
                    childLink.setAttribute('aria-expanded', 'false');
                }
            });
        }

        function closeAll() {
            Array.prototype.forEach.call(sidebar.querySelectorAll('.is-open'), function (item) {
                closeItem(item);
            });
        }

        function isCollapsed() {
            return body.classList.contains('crm-sidebar-collapsed');
        }

        // persist = false: chỉ áp trạng thái, không lưu (dùng khi khởi tạo để mặc định không bị ghi đè thành lựa chọn của người dùng)
        function setCollapsed(collapsed, lockHover, persist) {
            body.classList.toggle('crm-sidebar-collapsed', collapsed);
            body.classList.toggle('crm-sidebar-hover-locked', !!(collapsed && lockHover));
            body.classList.remove('crm-sidebar-hovering');
            if (collapsed) {
                closeAll();
            }
            if (toggle) {
                toggle.setAttribute('aria-pressed', collapsed ? 'true' : 'false');
                toggle.setAttribute('aria-label', collapsed ? 'Mở rộng menu' : 'Thu gọn menu');
            }
            if (persist !== false) {
                localStorage.setItem(storageKey, collapsed ? '1' : '0');
            }
        }

        function setHovering(isHovering) {
            body.classList.toggle(
                'crm-sidebar-hovering',
                isHovering && isCollapsed() && !body.classList.contains('crm-sidebar-hover-locked')
            );
        }

        // Lần đầu vào hệ thống (chưa lưu lựa chọn) sidebar mặc định THU GỌN trên desktop (>= 992px).
        // Mobile giữ nguyên dạng drawer đầy đủ; người dùng đã chọn trước đó ('1' / '0') thì tôn trọng lựa chọn đó.
        var storedCollapsed = localStorage.getItem(storageKey);
        setCollapsed(storedCollapsed === '1' || (storedCollapsed === null && window.innerWidth >= 992), false, false);

        if (toggle) {
            toggle.addEventListener('click', function (event) {
                event.preventDefault();
                if (window.innerWidth < 768) {
                    body.classList.remove('sidebar-mobile-open');
                } else {
                    setCollapsed(!isCollapsed(), true);
                }
            });
        }

        // Delegated jQuery handlers for mobile sidebar
        $(document).on('click', '.mobile-sidebar-toggle', function(e) {
            e.preventDefault();
            e.stopPropagation();
            $('body').toggleClass('sidebar-mobile-open');
        });

        $(document).on('click', '.crm-sidebar-overlay', function() {
            $('body').removeClass('sidebar-mobile-open');
        });

        $(document).on('click', '.crm-sidebar-toggle', function(e) {
            if (window.innerWidth < 992) {
                e.preventDefault();
                e.stopPropagation();
                $('body').removeClass('sidebar-mobile-open');
            }
        });

        $(document).on('click', '.ren-navbar .nav-link:not(.nav-item.with-sub > a)', function() {
            if (window.innerWidth < 992) {
                $('body').removeClass('sidebar-mobile-open');
            }
        });

        // Sidebar dang thu gon: hover/focus vao se "peek" mo rong tam thoi,
        // dong thoi day topbar/noi dung sang cho khop (xem giai thich trong
        // _layout.scss). Roi chuot/blur khoi sidebar thi thu gon lai.
        // Trễ nhẹ khi vào/ra chuột (hover intent): lướt chuột ngang qua sidebar sẽ không làm nó bật mở/đóng liên tục
        var hoverTimer = null;
        function scheduleHover(isHovering, delay) {
            window.clearTimeout(hoverTimer);
            hoverTimer = window.setTimeout(function () {
                setHovering(isHovering);
            }, delay);
        }

        sidebar.addEventListener('mouseenter', function () {
            scheduleHover(true, 90);
        });

        sidebar.addEventListener('focusin', function () {
            setHovering(true);
        });

        sidebar.addEventListener('mouseleave', function () {
            body.classList.remove('crm-sidebar-hover-locked');
            scheduleHover(false, 160);
            if (toggle) {
                toggle.blur();
            }
        });

        sidebar.addEventListener('focusout', function () {
            window.setTimeout(function () {
                if (!sidebar.contains(document.activeElement)) {
                    setHovering(false);
                }
            }, 0);
        });

        // Menu cha / menu con mo bang CLICK (khong dung hover)
        sidebar.addEventListener('click', function (event) {
            if (!event.target.closest) {
                return;
            }

            var parentLink = event.target.closest('.nav-item.with-sub > a');
            if (parentLink && sidebar.contains(parentLink)) {
                event.preventDefault();
                var item = parentLink.parentNode;
                var willOpen = !item.classList.contains('is-open');

                Array.prototype.forEach.call(sidebar.querySelectorAll('.nav-item.with-sub.is-open'), function (other) {
                    if (other !== item) {
                        closeItem(other);
                    }
                });

                if (willOpen) {
                    // Chi mo nhom menu; neu sidebar dang "peek" do hover thi van giu
                    // trang thai thu gon va khong ghi de lua chon trong localStorage.
                    item.classList.add('is-open');
                    parentLink.setAttribute('aria-expanded', 'true');
                } else {
                    closeItem(item);
                }
                return;
            }

            var subLink = event.target.closest('.sub-with-sub > a');
            if (subLink && sidebar.contains(subLink)) {
                event.preventDefault();
                var subItem = subLink.parentNode;
                var openSub = !subItem.classList.contains('is-open');
                var siblings = subItem.parentNode.children;

                Array.prototype.forEach.call(siblings, function (other) {
                    if (other !== subItem && other.classList.contains('is-open')) {
                        closeItem(other);
                    }
                });

                if (openSub) {
                    subItem.classList.add('is-open');
                    subLink.setAttribute('aria-expanded', 'true');
                } else {
                    closeItem(subItem);
                }
            }
        });

        // Tu dong active + mo san menu cha/menu con (cap 2, cap 3) khop voi
        // URL hien tai, thay vi phai liet ke tay tung route trong Blade (de
        // sot khi them man hinh moi). So khop chinh xac theo pathname cua
        // tung link la (khong tinh query string).
        function normalizePath(pathname) {
            return (pathname || '').replace(/\/+$/, '') || '/';
        }

        var currentPath = normalizePath(window.location.pathname);
        var leafLinks = sidebar.querySelectorAll('.sub-item a[href]:not([href="#"])');
        var matchedLeaf = null;

        Array.prototype.forEach.call(leafLinks, function (link) {
            if (normalizePath(link.pathname) === currentPath) {
                matchedLeaf = link;
            }
        });

        if (matchedLeaf) {
            matchedLeaf.classList.add('active');
            matchedLeaf.setAttribute('aria-current', 'page');

            var subWithSub = matchedLeaf.closest('.sub-with-sub');
            if (subWithSub) {
                subWithSub.classList.add('is-open', 'active');
                var subLink = subWithSub.querySelector(':scope > a');
                if (subLink) {
                    subLink.setAttribute('aria-expanded', 'true');
                }
            }

            var parentWithSub = matchedLeaf.closest('.nav-item.with-sub');
            if (parentWithSub) {
                parentWithSub.classList.add('is-open');
                var parentLink = parentWithSub.querySelector(':scope > a');
                if (parentLink) {
                    parentLink.classList.add('active');
                    parentLink.setAttribute('aria-expanded', 'true');
                }
            }
        }

        // Mo san nhom menu dang active (truong hop Blade tu danh dau active
        // cho menu cha nhung khong khop chinh xac link con nao, vd theo mot
        // pattern gom nhieu route).
        var activeLink = sidebar.querySelector('.nav-item.with-sub > .nav-link.active');
        if (activeLink && !isCollapsed()) {
            activeLink.parentNode.classList.add('is-open');
            activeLink.setAttribute('aria-expanded', 'true');
        }

        Array.prototype.forEach.call(sidebar.querySelectorAll('.nav-item.with-sub > a, .sub-with-sub > a'), function (link) {
            if (!link.hasAttribute('aria-expanded')) {
                link.setAttribute('aria-expanded', 'false');
            }
        });
    })();

    // Bấm vào dòng công tắc không đóng dropdown tài khoản (Bootstrap đóng menu khi click lan ra document)
    $('.crm-sale-toggle').on('click', function (e) {
        e.stopPropagation();
    });

    $('.check').change(function () {
        if (this.checked) {
            var value = 1;
        } else {
            var value = 0;
        }
        $.ajax({
            url: "{{url('ajax/settings')}}",
            method: "get",
            data: {
                value: value,
            }
        }).done(function (data) {

        });
    })
</script>

<!-- Horizantal menu-->