{% include "header.html" %}
<header class="docs-header">
  <a href="{{ base_url }}/" class="logo">smugglex <span>Docs</span></a>
  <nav>
    <a href="{{ base_url }}/usage/">Usage</a>
    <a href="{{ base_url }}/checks/">Checks</a>
    <a href="{{ base_url }}/advanced/">Advanced</a>
  </nav>
  <div class="header-right">
    <button class="search-trigger" onclick="openSearch()" title="Search">
      <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="11" cy="11" r="8"/><line x1="21" y1="21" x2="16.65" y2="16.65"/></svg>
      <span>Search</span>
      <kbd>&#8984;K</kbd>
    </button>
    <a href="https://github.com/hahwul/smugglex">GitHub</a>
  </div>
</header>
<div class="search-overlay" id="searchOverlay" onclick="if(event.target===this)closeSearch()">
  <div class="search-modal">
    <div class="search-input-wrap">
      <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="11" cy="11" r="8"/><line x1="21" y1="21" x2="16.65" y2="16.65"/></svg>
      <input type="text" id="searchInput" placeholder="Search documentation..." autocomplete="off">
      <kbd onclick="closeSearch()">ESC</kbd>
    </div>
    <div class="search-results" id="searchResults"></div>
  </div>
</div>
<div class="docs-container">
  <aside class="docs-sidebar">
    <a href="{{ base_url }}/" class="sidebar-logo">
      <img src="{{ base_url }}/images/logo-single.png" alt="smugglex">
    </a>
    <div class="sidebar-section">
      <div class="sidebar-title">Getting Started</div>
      <ul class="sidebar-links">
        <li><a href="{{ base_url }}/usage/">Installation</a></li>
        <li><a href="{{ base_url }}/usage/quick-start/">Quick Start</a></li>
        <li><a href="{{ base_url }}/usage/options/">Options</a></li>
        <li><a href="{{ base_url }}/usage/output/">Output</a></li>
      </ul>
    </div>
    <div class="sidebar-section">
      <div class="sidebar-title">Checks</div>
      <ul class="sidebar-links">
        <li><a href="{{ base_url }}/checks/">Overview</a></li>
        <li><a href="{{ base_url }}/checks/cl-te/">CL.TE</a></li>
        <li><a href="{{ base_url }}/checks/te-cl/">TE.CL</a></li>
        <li><a href="{{ base_url }}/checks/te-te/">TE.TE</a></li>
        <li><a href="{{ base_url }}/checks/h2c/">H2C</a></li>
        <li><a href="{{ base_url }}/checks/h2/">H2</a></li>
        <li><a href="{{ base_url }}/checks/cl-edge/">CL-Edge</a></li>
      </ul>
    </div>
    <div class="sidebar-section">
      <div class="sidebar-title">Advanced</div>
      <ul class="sidebar-links">
        <li><a href="{{ base_url }}/advanced/">Overview</a></li>
        <li><a href="{{ base_url }}/advanced/fingerprinting/">Fingerprinting</a></li>
        <li><a href="{{ base_url }}/advanced/fuzzing/">Fuzzing</a></li>
        <li><a href="{{ base_url }}/advanced/exploitation/">Exploitation</a></li>
        <li><a href="{{ base_url }}/advanced/pipeline/">Pipeline</a></li>
      </ul>
    </div>
  </aside>
  <main class="docs-main">
    <h1>{{ page.title }}</h1>
    {{ content }}

    <h2>In This Section</h2>
    <ul class="section-list">
      {{ section.list }}
    </ul>
    {{ pagination }}
{% include "footer.html" %}
  <aside class="docs-toc" id="docsToc">
    <div class="toc-title">On this page</div>
    <nav id="tocNav"></nav>
  </aside>