@guest
    <nav class="navbar navbar-expand-md navbar-light bg-white shadow-sm">
        <div class="container">
            <a class="navbar-brand" href="{{ url('/') }}">
                {{ config('app.name', 'Laravel') }}
            </a>
            <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent"
                aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="{{ __('Toggle navigation') }}">
                <span class="navbar-toggler-icon"></span>
            </button>

            <div class="collapse navbar-collapse" id="navbarSupportedContent">
                <!-- Left Side Of Navbar -->
                <ul class="navbar-nav me-auto">

                </ul>

                <!-- Right Side Of Navbar -->
                {{-- <ul class="navbar-nav ms-auto">
              <!-- Authentication Links -->

                  @if (Route::has('login'))
                      <li class="nav-item">
                          <a class="nav-link" href="{{ route('login') }}">{{ __('Login') }}</a>
                      </li>
                  @endif

                  @if (Route::has('register'))
                      <li class="nav-item">
                          <a class="nav-link" href="{{ route('register') }}">{{ __('Registrar') }}</a>
                      </li>
                  @endif

          </ul> --}}
            </div>
        </div>
    </nav>
@else
    <nav class="navbar navbar-dark bg-dark">
        <div class="container-fluid">

            <div class="d-flex w-100 w-md-auto justify-content-between justify-content-md-start">

                <button class="navbar-toggler" type="button" data-bs-toggle="offcanvas"
                    data-bs-target="#offcanvasDarkNavbar" aria-controls="offcanvasDarkNavbar" aria-label="Toggle navigation"
                    title="Menu">
                    <span class="navbar-toggler-icon"></span>
                </button>
                <a class="navbar-brand px-3" href="{{ url('/') }}">
                    {{ config('app.name', 'Laravel') }}
                </a>
            </div>

            @include('components.nav-info')

            <div class="offcanvas offcanvas-start text-bg-dark" tabindex="-1" id="offcanvasDarkNavbar"
                aria-labelledby="offcanvasDarkNavbarLabel">
                <div class="offcanvas-header">
                    <h5 class="offcanvas-title" id="offcanvasDarkNavbarLabel">Estoque
                        @auth
                            {{ auth()->user()->space_id ? auth()->user()->space->name : '' }}
                        @endauth
                    </h5>
                    <button type="button" class="btn-close btn-close-white" data-bs-dismiss="offcanvas"
                        aria-label="Close"></button>
                </div>

                <div class="offcanvas-body">
                    <div class="d-flex d-md-none flex-column align-items-start">
                        <p class="navbar-brand" style="margin: 0; font-size: 0.75rem; line-height: 1rem; ">
                            <strong>{{ auth()->user() !== null ? auth()->user()->name : '' }}</strong>!
                        </p>
                        <div class="text-secondary d-flex align-items-center  justify-content-start gap-2 date">
                            <i class="bi bi-calendar" style="font-size: 1rem;"></i>
                            <div class="d-flex flex-row justify-content-start w-100 gap-2">
                                <p style="font-size: 0.75rem; line-height: 1rem; margin: 0; text-align: start;">
                                    {{ \Carbon\Carbon::parse(date('Y-m-d H:m'))->locale('pt-BR')->translatedFormat('l') }} -
                                </p>
                                <p style="font-size: 0.75rem; line-height: 1rem; margin: auto;">
                                    {{ \Carbon\Carbon::parse(date('Y-m-d H:m'))->locale('pt-BR')->translatedFormat('d \d\e F \d\e Y') }}
                                </p>
                            </div>
                        </div>

                    </div>
                    <ul class="navbar-nav justify-content-end flex-grow-1 pe-3 mt-2">
                        <li class="nav-item">
                            <a class="nav-link active" aria-current="page" href="{{ route('home') }}">Home</a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown"
                                aria-expanded="false">
                                Movimentação
                            </a>
                            <ul class="dropdown-menu dropdown-menu-dark">
                                <li><a class="dropdown-item" href="{{ route('movement.create') }}">Criar</a></li>
                                <li><a class="dropdown-item" href="{{ route('movement.index') }}">Visualizar</a></li>
                                {{-- <li><a class="dropdown-item" href="#">Entrada</a></li>
                                <li><a class="dropdown-item" href="#">Saída</a></li>
                                <li><a class="dropdown-item" href="#">Retorno</a></li>
                                <li><a class="dropdown-item" href="#">Descarte</a></li> --}}
                                {{-- <li>
            <hr class="dropdown-divider">
          </li>
          <li><a class="dropdown-item" href="#">Something else here</a></li> --}}
                            </ul>
                        </li>
                        <li class="nav-item dropdown">
                            <a class="nav-link dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown"
                                aria-expanded="false">
                                Produtos
                            </a>
                            <ul class="dropdown-menu dropdown-menu-dark">
                                <li><a class="dropdown-item" href="{{ route('product.create') }}">Criar</a></li>
                                <li><a class="dropdown-item" href="{{ route('product.index') }}">Visualizar</a></li>
                                {{-- <li>
            <hr class="dropdown-divider">
          </li>
          <li><a class="dropdown-item" href="#">Something else here</a></li> --}}
                            </ul>
                        </li>
                        <li class="nav-item dropdown">
                            <a class="nav-link dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown"
                                aria-expanded="false">
                                Categorias
                            </a>
                            <ul class="dropdown-menu dropdown-menu-dark">
                                <li><a class="dropdown-item" href="{{ route('category.create') }}">Criar</a></li>
                                <li><a class="dropdown-item" href="{{ route('category.index') }}">Visualizar</a></li>
                                {{-- <li>
            <hr class="dropdown-divider">
          </li>
          <li><a class="dropdown-item" href="#">Something else here</a></li> --}}
                            </ul>
                        </li>
                        <li class="nav-item dropdown">
                            <a class="nav-link dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown"
                                aria-expanded="false">
                                Locais
                            </a>
                            <ul class="dropdown-menu dropdown-menu-dark">
                                <li><a class="dropdown-item" href="{{ route('location.create') }}">Criar</a></li>
                                <li><a class="dropdown-item" href="{{ route('location.index') }}">Visualizar</a></li>
                                {{-- <li>
            <hr class="dropdown-divider">
          </li>
          <li><a class="dropdown-item" href="#">Something else here</a></li> --}}
                            </ul>
                        </li>
                        @auth
                            @if (auth()->user()->role === 'super-admin' || auth()->user()->role === 'admin')
                                <li class="nav-item dropdown"
                                    style="display:{{ auth()->user() && (auth()->user()->role === 'super-admin' || auth()->user()->role === 'admin') ? '' : 'none' }}">
                                    <a class="nav-link dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown"
                                        aria-expanded="false">
                                        Usuários
                                    </a>
                                    <ul class="dropdown-menu dropdown-menu-dark">
                                        <li><a class="dropdown-item"
                                                href="{{ route(auth()->user()->role === 'super-admin' ? 'superuser.register' : 'user.create') }}">Criar</a>
                                        </li>
                                        <li><a class="dropdown-item" href="{{ route('user.index') }}">Visualizar</a></li>
                                    </ul>
                                </li>
                            @endif
                        @endauth
                    </ul>
                    <form class="d-flex mt-5" action="{{ route('logout') }}" method="POST">
                        @csrf
                        <button class="btn btn-outline-danger d-grid gap-2 col-6 mx-auto" type="submit">Sair</button>
                    </form>
                </div>
            </div>

        </div>
    </nav>
@endguest