<div class="iq-sidebar  sidebar-default  ">
<div class="iq-sidebar-logo d-flex align-items-end justify-content-between">
    <a href="{{ route('home') }}" class="header-logo">
        <img src="{{ asset('assets/images/logo-white.png') }}" class="img-fluid rounded-normal light-logo" alt="logo">
        <img src="{{ asset('assets/images/logo-dark.png') }}" class="img-fluid rounded-normal d-none sidebar-light-img" alt="logo">
            
    </a>
    <div class="side-menu-bt-sidebar-1">
        <svg xmlns="http://www.w3.org/2000/svg" class="text-light wrapper-menu" width="30" fill="none" viewBox="0 0 24 24" stroke="currentColor">
        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
        </svg>
    </div>
</div>
<div class="data-scrollbar" data-scroll="1">
    <nav class="iq-sidebar-menu">
        <ul id="iq-sidebar-toggle" class="side-menu">
            @can('home')
            <li class=" sidebar-layout {{ isActive('home') }}">
                <a href="{{ route('home') }}" class="svg-icon ">
                    <i class="">
                        <svg xmlns="http://www.w3.org/2000/svg" width="18" fill="none" viewBox="0 0 24 24" stroke="currentColor">
                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 12l2-2m0 0l7-7 7 7M5 10v10a1 1 0 001 1h3m10-11l2 2m-2-2v10a1 1 0 01-1 1h-3m-6 0a1 1 0 001-1v-4a1 1 0 011-1h2a1 1 0 011 1v4a1 1 0 001 1m-6 0h6" />
                        </svg>
                    </i>
                    <span class="ml-2">inicio</span>
                    
                </a>
            </li>
            @endcan
            @can('denunciante.dashboard')
            <li class=" sidebar-layout {{ isActive('home') }}">
                <a href="{{ route('denunciante.dashboard') }}" class="svg-icon">
                    <i class="">
                        <svg xmlns="http://www.w3.org/2000/svg" width="18" fill="none" viewBox="0 0 24 24" stroke="currentColor">
                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 12l2-2m0 0l7-7 7 7M5 10v10a1 1 0 001 1h3m10-11l2 2m-2-2v10a1 1 0 01-1 1h-3m-6 0a1 1 0 001-1v-4a1 1 0 011-1h2a1 1 0 011 1v4a1 1 0 001 1m-6 0h6" />
                        </svg>
                    </i>
                    <span class="ml-2">Mis denuncias</span>
                    
                </a>
            </li>
            @endcan
            @can('denuncias.index')
            <li class=" sidebar-layout {{ isActive(['denuncias.index','denuncias.show']) }}">
                <a href="{{ route('denuncias.index') }}" class="svg-icon">
                    <i class="">
                        <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="size-6">
  <path stroke-linecap="round" stroke-linejoin="round" d="M14.857 17.082a23.848 23.848 0 0 0 5.454-1.31A8.967 8.967 0 0 1 18 9.75V9A6 6 0 0 0 6 9v.75a8.967 8.967 0 0 1-2.312 6.022c1.733.64 3.56 1.085 5.455 1.31m5.714 0a24.255 24.255 0 0 1-5.714 0m5.714 0a3 3 0 1 1-5.714 0M3.124 7.5A8.969 8.969 0 0 1 5.292 3m13.416 0a8.969 8.969 0 0 1 2.168 4.5" />
</svg>

                    </i>
                    <span class="ml-2">Denuncias Activas</span>
                    
                </a>
            </li>
            @endcan
            @can('denuncias.finalizadas')
            <li class=" sidebar-layout {{ isActive('denuncias.finalizadas') }}">
                <a href="{{ route('denuncias.finalizadas') }}" class="svg-icon">
                    <i class="">
                        <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="size-6">
  <path stroke-linecap="round" stroke-linejoin="round" d="m20.25 7.5-.625 10.632a2.25 2.25 0 0 1-2.247 2.118H6.622a2.25 2.25 0 0 1-2.247-2.118L3.75 7.5M10 11.25h4M3.375 7.5h17.25c.621 0 1.125-.504 1.125-1.125v-1.5c0-.621-.504-1.125-1.125-1.125H3.375c-.621 0-1.125.504-1.125 1.125v1.5c0 .621.504 1.125 1.125 1.125Z" />
</svg>

                    </i>
                    <span class="ml-2">Denuncias Finalizadas</span>
                    
                </a>
            </li>
            @endcan
            @can('users.index')
            <li class="px-3 pt-3 pb-2">
                <span class="text-uppercase small font-weight-bold">Seguridad</span>
            </li>
            
            <li class="sidebar-layout {{ isActive(['users.*','roles.*']) }}">
                <a href="#app1" class="collapsed svg-icon" data-toggle="collapse" aria-expanded="false">
                    <i>
                        <svg xmlns="http://www.w3.org/2000/svg" width="18" fill="none" viewBox="0 0 24 24" stroke="currentColor">
                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 15v2m-6 4h12a2 2 0 002-2v-6a2 2 0 00-2-2H6a2 2 0 00-2 2v6a2 2 0 002 2zm10-10V7a4 4 0 00-8 0v4h8z" />
                        </svg>
                    </i>
                    <span class="ml-2">Authentication</span>
                    <svg xmlns="http://www.w3.org/2000/svg" class="svg-icon iq-arrow-right arrow-active" width="15" fill="none" viewBox="0 0 24 24" stroke="currentColor">
                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7" />
                    </svg>
                </a>
                <ul id="app1" class="submenu collapse {{ isActiveSubMenu(['users.*','roles.*']) }}" data-parent="#iq-sidebar-toggle">                        
                    <li class=" sidebar-layout {{ isActive('users.*') }}">
                        <a href="{{ route('users.index') }}" class="svg-icon">
                            <i class=""><svg xmlns="http://www.w3.org/2000/svg" width="18" fill="none" viewBox="0 0 24 24" stroke="currentColor">
                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 11c0 3.517-1.009 6.799-2.753 9.571m-3.44-2.04l.054-.09A13.916 13.916 0 008 11a4 4 0 118 0c0 1.017-.07 2.019-.203 3m-2.118 6.844A21.88 21.88 0 0015.171 17m3.839 1.132c.645-2.266.99-4.659.99-7.132A8 8 0 008 4.07M3 15.364c.64-1.319 1-2.8 1-4.364 0-1.457.39-2.823 1.07-4" />
                            </svg>
                            </i><span class="">Usuarios</span>
                        </a>
                    </li>
                    <li class=" sidebar-layout {{ isActive('roles.*') }}">
                        <a href="{{ route('roles.index') }}" class="svg-icon">
                            <i class="">
                                <svg xmlns="http://www.w3.org/2000/svg" width="18" fill="none" viewBox="0 0 24 24" stroke="currentColor">
                                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4" />
                                </svg>
                            </i><span class="">Roles</span>
                        </a>
                    </li>
                    
                </ul>
            </li>
            @endcan
            <li class=" sidebar-layout">
                <a href="{{ route('logout') }}" class="svg-icon" onclick="event.preventDefault(); document.getElementById('logout-form-ii').submit();">
                    <i class="">
                        <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="size-6">
  <path stroke-linecap="round" stroke-linejoin="round" d="M8.25 9V5.25A2.25 2.25 0 0 1 10.5 3h6a2.25 2.25 0 0 1 2.25 2.25v13.5A2.25 2.25 0 0 1 16.5 21h-6a2.25 2.25 0 0 1-2.25-2.25V15m-3 0-3-3m0 0 3-3m-3 3H15" />
</svg>

                    </i>
                    <span class="ml-2">Salir</span>
                    
                </a>
                <form id="logout-form-ii" action="{{ route('logout') }}" method="POST" style="display: none;">
                    @csrf
                </form>
            </li>
        </ul>
    </nav>
    <div class="pt-5 pb-5"></div>
</div>
</div>