@inherits LayoutComponentBase

<div class="d-flex flex-column min-vh-100">
    <nav class="navbar navbar-expand-lg navbar-dark bg-primary shadow-sm">
        <div class="container">
            <a class="navbar-brand fw-bold" href="/">
                <img src="/images/TrueCV_Logo.png" alt="TrueCV" style="height: 36px; filter: brightness(0) invert(1);" />
            </a>

            <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
                <span class="navbar-toggler-icon"></span>
            </button>

            <div class="collapse navbar-collapse" id="navbarNav">
                <ul class="navbar-nav me-auto">
                    <li class="nav-item">
                        <NavLink class="nav-link" href="/" Match="NavLinkMatch.All">
                            Home
                        </NavLink>
                    </li>
                    <AuthorizeView>
                        <Authorized>
                            <li class="nav-item">
                                <NavLink class="nav-link" href="/dashboard">
                                    Dashboard
                                </NavLink>
                            </li>
                            <li class="nav-item">
                                <NavLink class="nav-link" href="/check">
                                    New Check
                                </NavLink>
                            </li>
                        </Authorized>
                    </AuthorizeView>
                </ul>

                <ul class="navbar-nav">
                    <AuthorizeView>
                        <Authorized>
                            <li class="nav-item dropdown">
                                <a class="nav-link dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-expanded="false">
                                    <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-person-circle me-1" viewBox="0 0 16 16">
                                        <path d="M11 6a3 3 0 1 1-6 0 3 3 0 0 1 6 0z"/>
                                        <path fill-rule="evenodd" d="M0 8a8 8 0 1 1 16 0A8 8 0 0 1 0 8zm8-7a7 7 0 0 0-5.468 11.37C3.242 11.226 4.805 10 8 10s4.757 1.225 5.468 2.37A7 7 0 0 0 8 1z"/>
                                    </svg>
                                    @context.User.Identity?.Name
                                </a>
                                <ul class="dropdown-menu dropdown-menu-end">
                                    <li>
                                        <form action="/account/logout" method="post">
                                            <AntiforgeryToken />
                                            <button type="submit" class="dropdown-item">Logout</button>
                                        </form>
                                    </li>
                                </ul>
                            </li>
                        </Authorized>
                        <NotAuthorized>
                            <li class="nav-item">
                                <NavLink class="nav-link" href="/account/login">
                                    Login
                                </NavLink>
                            </li>
                            <li class="nav-item">
                                <NavLink class="nav-link btn btn-outline-light ms-2 px-3" href="/account/register">
                                    Register
                                </NavLink>
                            </li>
                        </NotAuthorized>
                    </AuthorizeView>
                </ul>
            </div>
        </div>
    </nav>

    <main class="flex-grow-1">
        @Body
    </main>

    <footer class="bg-dark text-light py-4 mt-auto">
        <div class="container text-center">
            <p class="mb-0">&copy; @DateTime.Now.Year TrueCV. All rights reserved.</p>
        </div>
    </footer>
</div>

<div id="blazor-error-ui" class="alert alert-danger fixed-bottom m-3" style="display: none;">
    An unhandled error has occurred.
    <a href="" class="alert-link reload">Reload</a>
    <button type="button" class="btn-close float-end dismiss" aria-label="Close"></button>
</div>
