    <style>
        .app-brand {
            background: transparent;
            margin: 0 !important;
            padding-right: 0.875rem !important;
            padding-left: 1.3rem !important;
            margin-bottom: 1.2rem !important;
            height: 80px !important;
        }
    </style>
    <aside id="layout-menu" class="layout-menu menu-vertical menu bg-menu-theme">
        <div class="app-brand demo">
            <a href="" class="app-brand-link">
                {{-- <img src="{{ asset(general()->logo) }}" width="55%" /> --}}
            </a>

            <a href="javascript:void(0);" class="layout-menu-toggle menu-link text-large ms-auto">
                <i class="ti menu-toggle-icon d-none d-xl-block ti-sm align-middle"></i>
                <i class="icon-base ti tabler-x d-block d-xl-none"></i>
            </a>
        </div>

        <div class="menu-inner-shadow"></div>

        <ul class="menu-inner">
          
               
            <li class="menu-item {{ menuActive('dashboard') }}">
                <a href="{{ route('dashboard') }}" class="menu-link">
                    <i class="menu-icon icon-base ti tabler-layout-dashboard"></i>
                    <div data-i18n="Dashboard">Dashboard</div>
                </a>
            </li>
               
            

           @can('view permission')
            <li class="menu-item {{ menuActive('permissions.index') }}">
                <a href="{{ route('permissions.index') }}" class="menu-link">
                    <i class="menu-icon ti tabler-lock-access"></i>
                    <div data-i18n="Permissions">Permissions</div>
                </a>
            </li>
        @endcan

          
        @can('view user')
        <li class="menu-item {{ menuActive('users.index') }}">
            <a href="{{ route('users.index') }}" class="menu-link">
                <i class="menu-icon ti tabler-users"></i>
                <div data-i18n="Users">Users</div>
            </a>
        </li>
        @endcan


        @can('view categories')
        <li class="menu-item {{ menuActive('categories.index') }}">
            <a href="{{ route('categories.index') }}" class="menu-link">
                <i class="menu-icon ti tabler-tags"></i>
                <div data-i18n="Categories">Categories</div>
            </a>
        </li>
        @endcan


        @can('courses view')
        <li class="menu-item {{ menuActive('courses.index') }}">
            <a href="{{ route('courses.index') }}" class="menu-link">
                <i class="menu-icon ti tabler-book-2"></i>
                <div data-i18n="Courses">Courses</div>
            </a>
        </li>
        @endcan

        @can('lectures create')
        <li class="menu-item {{ menuActive(['lectures.index', 'lectures.create', 'lectures.show', 'lectures.edit']) }}">
            <a href="{{ route('lectures.create') }}" class="menu-link">
                <i class="menu-icon ti tabler-video-plus"></i>
                <div>Add Lecture</div>
            </a>
        </li>
        @endcan

        <li class="menu-item">
            <a href="{{ route('course-enrollments.index') }}" class="menu-link">
                <i class="menu-icon ti tabler-user-check"></i>
                <div>Course Enrolled Students</div>
            </a>
        </li>

            

        @can('assignments view')
        <li class="menu-item {{ menuActive('assignments.index') }}">
            <a href="{{ route('assignments.index') }}" class="menu-link">
                <i class="menu-icon ti tabler-notebook"></i>
                <div>Assignments</div>
            </a>
        </li>
        @endcan

         @can('view assignment submissions')
        <li class="menu-item {{ menuActive('assignment-submissions.index') }}">
            <a href="{{ route('assignment-submissions.index') }}" class="menu-link">
                <i class="menu-icon ti tabler-clipboard-check"></i>
                <div>AssignmentSubmission</div>
            </a>
        </li>
        @endcan

        @can('view chats') 
        <li class="menu-item {{ menuActive('chats.index') }}">
            <a href="{{ route('chats.index') }}" class="menu-link">
                <i class="menu-icon ti tabler-message-2"></i> {{-- Tabler icon for messages --}}
                <div>Chat list</div>
            </a>
        </li>
        @endcan


         <li class="menu-item {{ menuActive('teacher.chats.students') }}">
            <a href="{{ route('teacher.chats.students') }}" class="menu-link">
                <i class="menu-icon ti tabler-message-2"></i> {{-- Tabler icon for messages --}}
                <div>Chats </div>
            </a>
        </li>
      



        {{-- @can('chat view')
        <li class="menu-item {{ menuActive('chats.index') }}">
            <a href="{{ route('chats.index') }}" class="menu-link">
                <i class="menu-icon ti tabler-messages"></i>
                <div>Chat</div>
            </a>
        </li>
        @endcan --}}

        {{-- Audit Logs --}}
      @can('view audit logs')
            <li class="menu-item {{ menuActive('audit-logs.index') }}">
                <a href="{{ route('audit-logs.index') }}" class="menu-link">
                    <i class="menu-icon  ti tabler-file-search"></i>
                    <div data-i18n="Audit Logs">Audit Logs</div>
                </a>
            </li>
        @endcan

        
        </ul>
    </aside>
