<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width">
    <title>Micro | {{.Title}}</title>
    <link rel="stylesheet" href="/styles.css">
</head>
<body>
    <div id="layout" style="display:flex; min-height:100vh;">
        {{if not .HideSidebar}}
        <nav id="sidebar" style="width:230px; background:#f5f5f5; padding:2em 1.5em 2em 2em; border:1px solid #eee;">
            <h1 style="margin-bottom:1.2em;"><a href="/" id="title">Micro</a></h1>
            {{if .User}}
              <div style="margin-bottom:1.5em; font-size:1.05em;">
                <span style="color:#888;">Logged in as</span>
                <b>{{.User.ID}}</b>
                <form method="POST" action="/auth/logout" style="margin-top:0.7em; display:block; background:none; box-shadow:none; padding:0; border:none;">
                  <button type="submit" style="padding:0.25em 0.8em; font-size:0.97em; border-radius:4px; margin:0; cursor:pointer;">Logout</button>
                </form>
              </div>
            {{else if .AuthEnabled}}
              <div style="margin-bottom:1.5em;">
                <a href="/auth/login" class="micro-link">Login</a>
              </div>
            {{end}}
            <ul class="no-bullets" style="padding-left:0; line-height:2.2;">
                <li><a href="/" class="micro-link">&#127968; Home</a></li>
                <li><a href="/agent" class="micro-link">&#129302; Agent</a></li>
                <li><a href="/api" class="micro-link">&#128268; API</a></li>
                <li><a href="/logs" class="micro-link">&#128220; Logs</a></li>
                {{if .AuthEnabled}}
                <li><a href="/auth/scopes" class="micro-link">&#128274; Scopes</a></li>
                {{end}}
                <li><a href="/services" class="micro-link">&#9881; Services</a></li>
                <li><a href="/status" class="micro-link">&#128308; Status</a></li>
                {{if .AuthEnabled}}
                <li><a href="/auth/tokens" class="micro-link">&#128273; Tokens</a></li>
                <li><a href="/auth/users" class="micro-link">&#128100; Users</a></li>
                {{end}}
            </ul>
            {{if and .SidebarEndpoints .SidebarEndpointsEnabled}}
            <hr style="margin:2em 0 1em 0;">
            <div style="font-weight:bold; margin-bottom:0.5em;">API Endpoints</div>
            <div style="max-height:40vh; overflow-y:auto; font-size:0.97em;">
              {{range .SidebarEndpoints}}
                <div style="margin-bottom:0.3em;"><a href="#{{.Anchor}}" class="micro-link">{{.Name}}</a></div>
              {{end}}
            </div>
            {{end}}
        </nav>
        {{end}}
        <main class="container" style="flex:1; min-width:0;">
            {{template "content" .}}
        </main>
    </div>
</body>
</html>
