<header>

  <section class="bg-primary">
    <nav class="navbar d-grid place-items-center d-lg-flex navbar-expand-lg container-xl" aria-label="Offcanvas navbar large">

      <button class="navbar-toggler justify-self-start" type="button" data-bs-toggle="offcanvas" data-bs-target="#offcanvasNavbar2" aria-controls="offcanvasNavbar2" aria-label="Toggle navigation">
        <i class="fa-solid fa-align-justify"></i>
      </button>

      <div class="offcanvas offcanvas-start" tabindex="-1" id="offcanvasNavbar2" aria-labelledby="offcanvasNavbar2Label">

        <div class="offcanvas-header">

          <img class="navbar-brand" src="{{ asset('archivos/imagenes/logotipo/daite.png') }}" alt="{{ config('app.name') }}">

          <button class="btn-close btn-close-white" type="button" data-bs-dismiss="offcanvas" aria-label="Close"></button>

        </div>

        <div class="offcanvas-body">

          <ul class="navbar-nav">

            <li class="nav-item">
              <a class="d-flex gap-2 align-items-center nav-link{{ request()->routeIs('inicio') ? ' active' : '' }}" aria-current="page" href="{{ route('inicio') }}">

                <i class="fa-solid fa-house"></i>

                <span>Inicio</span>

              </a>
            </li>

            <li class="nav-item dropdown">

              <a class="nav-link dropdown-toggle{{ request()->routeIs('registros.*') ? ' active' : '' }}" href="#" data-bs-toggle="dropdown" data-bs-auto-close="outside" aria-expanded="false">

                <div class="d-flex gap-2 align-items-center">

                  <i class="fa-solid fa-floppy-disk"></i>

                  <span>Registros</span>

                </div>

              </a>

              <ul class="dropdown-menu">
                @foreach (session('modulos') as $modulo)
                  <div>

                    @if (array_key_exists($modulo->id_modulo, session('programas')['registros']))

                      <li>
                        <a class="dropdown-header fw-bold text-capitalize">
                          {{ mb_strtolower($modulo->modulo, 'UTF-8') }}
                        </a>
                      </li>

                      @foreach (session('programas')['registros'][$modulo->id_modulo] as $indice => $programa)
                        @if ($modulo->id_modulo === $programa->id_modulo && $programa->visible)
                          <li class="d-flex align-items-center">

                            <a class="dropdown-item{{ request()->routeIs($programa->programa) ? ' active' : '' }}" href="{{ route($programa->programa) }}" data-programa-id="{{ $programa->id_programa }}"{{ $programa->favorito ? ' data-programa-favorito': '' }}>
                              {{ $programa->descripcion }}
                            </a>

                            <i class="btn btn-primary fa-solid fa-star{{ $programa->favorito ? ' text-warning' : ' opacity-lg-0' }} favorito"></i>

                          </li>
                        @endif
                      @endforeach

                      <li class="d-lg-none">
                        <hr class="dropdown-divider">
                      </li>

                    @endif

                  </div>
                @endforeach
              </ul>

            </li>

            <li class="nav-item dropdown">

              <a class="nav-link dropdown-toggle{{ request()->routeIs('procesos.*') ? ' active' : '' }}" href="#" data-bs-toggle="dropdown" data-bs-auto-close="outside" aria-expanded="false">

                <div class="d-flex gap-2 align-items-center">

                  <i class="fa-solid fa-list-check"></i>

                  <span>Procesos</span>

                </div>

              </a>

              <ul class="dropdown-menu">
                @foreach (session('modulos') as $modulo)
                  <div>

                    @if (array_key_exists($modulo->id_modulo, session('programas')['procesos']))

                      <li>
                        <a class="dropdown-header fw-bold text-capitalize">
                          {{ mb_strtolower($modulo->modulo, 'UTF-8') }}
                        </a>
                      </li>

                      @foreach (session('programas')['procesos'][$modulo->id_modulo] as $indice => $programa)
                        @if ($modulo->id_modulo === $programa->id_modulo && $programa->visible)
                          <li class="d-flex align-items-center">

                            <a class="dropdown-item{{ request()->routeIs($programa->programa) ? ' active' : '' }}" href="{{ route($programa->programa) }}" data-programa-id="{{ $programa->id_programa }}"{{ $programa->favorito ? ' data-programa-favorito': '' }}>
                              {{ $programa->descripcion }}
                            </a>

                            <i class="btn btn-primary fa-solid fa-star{{ $programa->favorito ? ' text-warning' : ' opacity-lg-0' }} favorito"></i>

                          </li>
                        @endif
                      @endforeach

                      <li class="d-lg-none">
                        <hr class="dropdown-divider">
                      </li>

                    @endif

                  </div>
                @endforeach
              </ul>

            </li>

            <li class="nav-item dropdown">

              <a class="nav-link dropdown-toggle{{ request()->routeIs('reportes.*') ? ' active' : '' }}" href="#" data-bs-toggle="dropdown" data-bs-auto-close="outside" aria-expanded="false">

                <div class="d-flex gap-2 align-items-center">

                  <i class="fa-solid fa-file-chart-column"></i>

                  <span>Reportes</span>

                </div>

              </a>

              <ul class="dropdown-menu">
                @foreach (session('modulos') as $modulo)
                  <div>

                    @if (array_key_exists($modulo->id_modulo, session('programas')['reportes']))

                      <li>
                        <a class="dropdown-header fw-bold text-capitalize">
                          {{ mb_strtolower($modulo->modulo, 'UTF-8') }}
                        </a>
                      </li>

                      @foreach (session('programas')['reportes'][$modulo->id_modulo] as $indice => $programa)
                        @if ($modulo->id_modulo === $programa->id_modulo && $programa->visible)
                          <li class="d-flex align-items-center">

                            <a class="dropdown-item{{ request()->routeIs($programa->programa) ? ' active' : '' }}" href="{{ route($programa->programa) }}" data-programa-id="{{ $programa->id_programa }}"{{ $programa->favorito ? ' data-programa-favorito': '' }}>
                              {{ $programa->descripcion }}
                            </a>

                            <i class="btn btn-primary fa-solid fa-star{{ $programa->favorito ? ' text-warning' : ' opacity-lg-0' }} favorito"></i>

                          </li>
                        @endif
                      @endforeach

                      <li class="d-lg-none">
                        <hr class="dropdown-divider">
                      </li>

                    @endif

                  </div>
                @endforeach
              </ul>

            </li>

            <li class="nav-item">
              <a class="d-flex gap-2 align-items-center nav-link{{ request()->routeIs('procesos.caja') ? ' active' : '' }}" aria-current="page" href="{{ route('procesos.caja') }}">

                <i class="fa-solid fa-cash-register"></i>

                <span>Caja</span>

              </a>
            </li>

            <li class="nav-item">
              <a class="d-flex gap-2 align-items-center nav-link{{ request()->routeIs('estadisticas') ? ' active' : '' }}" aria-current="page" href="{{ route('estadisticas') }}">

                <i class="fa-solid fa-chart-simple"></i>

                <span>Estadísticas</span>

              </a>
            </li>

						<li class="nav-item">
              <a class="d-flex gap-2 align-items-center nav-link{{ request()->routeIs('reportes.documentos') ? ' active' : '' }}" aria-current="page" href="{{route('reportes.documentos')}}">

                <i class="fa-solid fa-folder-open"></i>
                <span>Documentos</span>

              </a>
            </li>

            <li class="nav-item d-lg-none">
              <a class="d-flex gap-2 align-items-center nav-link" aria-current="page" href="{{ route('autenticacion.cerrar') }}">

                <i class="fa-solid fa-right-from-bracket"></i>

                <span>Cerrar sesión</span>

              </a>
            </li>

          </ul>

        </div>

      </div>

      <h1 class="d-block d-lg-none">
        @yield('titulo')
      </h1>

      <form class="d-none d-lg-block justify-self-end" role="search">
        <input class="form-control" type="search" placeholder="Buscar" aria-label="Buscar">
      </form>

      <div class="dropdown justify-self-end">

        <a href="#" class="d-flex gap-2 align-items-center dropdown-toggle" aria-expanded="false" data-bs-toggle="dropdown" data-bs-auto-close="outside" aria-label="">

          <span>
            {{ session('usuario')->nombre_usuario }}
          </span>

          <i class="fa-solid fa-user"></i>

        </a>

        <ul class="dropdown-menu dropdown-menu-end">

          <li>
            <a class="dropdown-item{{ request()->routeIs('perfil') ? ' active' : '' }}" href="{{ route('perfil') }}">
              <i class="fa-solid fa-user-gear"></i>
              Perfil
            </a>
          </li>

          <li>
            <a class="dropdown-item{{ request()->routeIs('configuracion') ? ' active' : '' }}" href="#">
              <i class="fa-solid fa-gear"></i>
              Configuración
            </a>
          </li>

          <li><hr class="dropdown-divider"></li>

          <li>
            <a class="dropdown-item" href="{{ route('autenticacion.cerrar') }}">
              <i class="fa-solid fa-right-from-bracket"></i>
              Cerrar sesión
            </a>
          </li>

        </ul>

      </div>

    </nav>
  </section>

  <section class="bg-primary-subtle">
    <nav class="navbar navbar-expand container-xl">

      <div class="d-lg-none"></div>

      <ul class="navbar-nav">
        @foreach (session('programas')['favoritos'] as $indice => $programa)
          @if ($programa->visible)
          <li class="nav-item">
            <a class="d-flex gap-2 align-items-center nav-link{{ request()->routeIs($programa->programa) ? ' active' : '' }}" aria-current="page" href="{{ route($programa->programa) }}">
              <i class="{{ empty($programa->icono) ? 'fa-solid fa-circle-exclamation' : $programa->icono  }}"></i>
              <span class="d-none d-lg-block text-truncate">
                {{ $programa->referencia ? $programa->referencia : $programa->descripcion }}
              </span>
            </a>
          </li>
          @endif
        @endforeach
      </ul>

    </nav>
  </section>

</header>
