<!DOCTYPE html>
{#
================================================================================
TEMPLATE VARIABLES
================================================================================
Bengal provides: page, site, config, params (page.metadata alias), meta, section

Cache expensive function calls once per render. Page properties like title,
_path, kind, tags are always defined - no defensive checks needed.
================================================================================
#}
{# Template-wide variables using {% let %} for explicit scope #}
{% let params = params ?? {} %}
{% let _page_title = page.title %}
{% let _page_url = page._path %}

{# Navigation - cache function calls #}
{% let _current_lang = current_lang() %}
{% let _site_title = site.title %}

{# Normalized config objects (pre-processed by Site with defaults applied) #}
{% let _build_badge = site.build_badge %}
{% let _doc_app = site.document_application %}
{% let _link_previews = site.link_previews %}
{% let _per_page_json = 'json' in (config.output_formats.per_page ?? []) %}

{# Derived values #}
{% let _main_menu = get_menu_lang('main', _current_lang) %}
{% let _footer_menu = get_menu_lang('footer', _current_lang) %}

{% let _doc_app_nav = _doc_app?.navigation %}
{% let _view_transitions = _doc_app.enabled and _doc_app_nav?.view_transitions %}
{% let _transition_style = _doc_app_nav?.transition_style %}

{# Auto navigation if main menu is empty #}
{% let _auto_nav = get_auto_nav() if _main_menu | length == 0 else [] %}

{# =============================================================================
HELPER: Render a menu item (desktop/mobile)
============================================================================= #}
{% def render_menu_item(item, is_mobile=false) %}
{% let has_children = item.children | length > 0 %}
{% let is_active = item.active or (_page_url == item.href) %}
{% let is_trail = item.active_trail ?? false %}

<li
    class="{{ ['has-submenu' if has_children, 'active' if is_active, 'active-trail' if is_trail] | classes }}">
    {% if is_mobile and has_children %}
    {# Mobile: Split button pattern - link + chevron toggle #}
    <div class="mobile-nav-item-row">
        {% if item.href == '#' %}
        <span class="nav-dropdown-trigger" tabindex="0" role="button" aria-haspopup="true">{{ item.name }}</span>
        {% else %}
        <a href="{{ item.href | absolute_url }}" {{ 'aria-current="page"' | safe if is_active else '' }}>{{ item.name }}</a>
        {% end %}
        <button type="button" class="mobile-nav-toggle-submenu" aria-label="Toggle {{ item.name }} submenu" aria-expanded="false">
            {{ icon('caret-down', size=16) }}
        </button>
    </div>
    {% elif has_children and item.href == '#' %}
    {# Desktop: Non-navigable dropdown trigger #}
    <span class="nav-dropdown-trigger" tabindex="0" role="button" aria-haspopup="true">{{ item.name }}</span>
    {% else %}
    {# Regular navigation link #}
    <a href="{{ item.href | absolute_url }}" {{ 'aria-current="page"' | safe if is_active else '' }}>{{ item.name }}</a>
    {% end %}

    {% if has_children %}
    <ul class="submenu">
        {% for child in item.children %}
        <li class="{{ ['active' if child.active] | classes }}">
            <a href="{{ child.href | absolute_url }}">
                {% with child.icon as icon_name %}
                {% if icon_name %}<span class="submenu-icon">{{ icon(icon_name, size=16) }}</span>{% end %}
                {% end %}
                <span class="submenu-text">{{ child.name }}</span>
            </a>
        </li>
        {% end %}
    </ul>
    {% end %}
</li>
{% enddef %}

<html lang="{{ _current_lang }}" {% if _view_transitions and _transition_style !='crossfade' %}
    data-transition-style="{{ _transition_style }}" {% end %}>

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">

    {# Document Application: View Transitions meta tag #}
    {% if _view_transitions %}
    <meta name="view-transition" content="same-origin">
    {% end %}

    {# Title - captured for reuse in Open Graph and Twitter Card #}
    {% capture page_title %}
    {% block title %}
    {% match page.title %}
    {% case title if title and _site_title %}{{ title }} - {{ _site_title }}
    {% case title if title %}{{ title }}
    {% case _ %}{{ _site_title }}
    {% end %}
    {% end %}
    {% endcapture %}
    <title>{{ page_title | trim }}</title>

    {# Meta description - captured for reuse in Open Graph and Twitter Card #}
    {% capture meta_desc %}
    {{ meta_desc ?? site.description }}
    {% endcapture %}
    <meta name="description" content="{{ meta_desc | trim }}">

    {# Meta Keywords - use page.keywords or fallback to tags #}
    {% if page.keywords %}
    <meta name="keywords" content="{{ page.keywords | join(', ') }}">
    {% elif page.tags %}
    <meta name="keywords" content="{{ page.tags | meta_keywords(10) }}">
    {% end %}

    {# Robots directive for hidden/unlisted pages #}
    {% if page.robots_meta and page.robots_meta != 'index, follow' %}
    <meta name="robots" content="{{ page.robots_meta }}">
    {% end %}

    {# Open Graph / Facebook #}
    <meta property="og:type" content="article">
    <meta property="og:title" content="{{ page_title | trim }}">
    {% if meta_desc %}
    <meta property="og:description" content="{{ meta_desc | trim }}">
    {% end %}
    {% if site.baseurl %}
    <meta property="og:url" content="{{ canonical_url(_page_url) }}">
    {% end %}
    {# Open Graph Image #}
    {% let _og_image_path = og_image(params?.image ?? config?.og_image ?? '', page) %}
    {% if _og_image_path %}
    <meta property="og:image" content="{{ _og_image_path }}">
    {% end %}

    {# Twitter Card #}
    <meta name="twitter:card" content="summary_large_image">
    <meta name="twitter:title" content="{{ page_title | trim }}">
    {% if meta_desc %}
    <meta name="twitter:description" content="{{ meta_desc | trim }}">
    {% end %}
    {% if _og_image_path %}
    <meta name="twitter:image" content="{{ _og_image_path }}">
    {% end %}

    {# Bengal config meta #}
    <meta name="bengal:search_preload" content="{{ config.search_preload ?? 'smart' }}">
    <meta name="bengal:baseurl" content="{{ site.baseurl }}">
    <meta name="bengal:index_url" content="{{ '/index.json' | absolute_url }}">
    {% if bengal.capabilities.prebuilt_search %}
    <meta name="bengal:search_index_url" content="{{ '/search-index.json' | absolute_url }}">
    {% end %}
    {% if page.version %}
    <meta name="bengal:version" content="{{ page.version }}">
    {% end %}

    {# Canonical URL #}
    {% if site.baseurl %}
    <link rel="canonical" href="{{ canonical_url(_page_url) }}">
    {% end %}

    {# RSS Feed #}
    {% with config.i18n as i18n %}
    {% let rss_href = '/rss.xml' %}
    {% if i18n and i18n.strategy == 'prefix' %}
    {% let default_lang = i18n.default_language ?? 'en' %}
    {% if _current_lang and (i18n.default_in_subdir or _current_lang != default_lang) %}
    {% let rss_href = '/' ~ _current_lang ~ '/rss.xml' %}
    {% end %}
    {% end %}
    <link rel="alternate" type="application/rss+xml" title="{{ _site_title }} RSS Feed" href="{{ rss_href }}">
    {% end %}

    {# hreflang alternates #}
    {% for alt in alternate_links(page) %}
    <link rel="alternate" hreflang="{{ alt.hreflang }}" href="{{ alt.href }}">
    {% end %}

    {# Favicon - use let for safer nil handling #}
    {% let favicon_path = site.favicon ?? none %}
    {% if favicon_path %}
    <link rel="icon" type="image/png" href="{{ favicon_path }}">
    {% else %}
    <link rel="icon" type="image/x-icon" href="{{ asset_url('favicon.ico') }}">
    <link rel="icon" type="image/png" sizes="16x16" href="{{ asset_url('favicon-16x16.png') }}">
    <link rel="icon" type="image/png" sizes="32x32" href="{{ asset_url('favicon-32x32.png') }}">
    <link rel="apple-touch-icon" sizes="180x180" href="{{ asset_url('apple-touch-icon.png') }}">
    <link rel="manifest" href="{{ asset_url('site.webmanifest') }}">
    {% end %}

    {# Preconnect #}
    <link rel="preconnect" href="https://cdn.jsdelivr.net" crossorigin>
    <link rel="preconnect" href="https://d3js.org" crossorigin>

    {# Fonts #}
    {% if config.fonts %}
    <link rel="preload" href="{{ asset_url('fonts/outfit-700.woff2') }}" as="font" type="font/woff2" crossorigin>
    <link rel="preload" href="{{ asset_url('fonts.css') }}" as="style" onload="this.onload=null;this.rel='stylesheet'">
    <noscript>
        <link rel="stylesheet" href="{{ asset_url('fonts.css') }}">
    </noscript>
    {% end %}

    {# Stylesheets #}
    <link rel="stylesheet" href="{{ asset_url('css/style.css') }}">
    {% if 'content.math' in (theme.features ?? []) %}
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/katex@0.16.11/dist/katex.min.css" crossorigin>
    {% end %}

    {# Theme configuration JS #}
    <script>
        window.BENGAL_THEME_DEFAULTS = {
            appearance: '{{ theme.default_appearance }}',
            palette: '{{ theme.default_palette }}'
        };
        window.Bengal = window.Bengal || {};
        window.Bengal.enhanceBaseUrl = '{{ asset_url("js/enhancements") }}';
        window.Bengal.watchDom = {{ (config.enhancements?.watch_dom ?? true) | lower }};
        window.Bengal.debug = {{ (config.enhancements?.debug ?? false) | lower }};
        window.Bengal.enhanceUrls = {
            'toc': '{{ asset_url("js/enhancements/toc.js") }}',
            'docs-nav': '{{ asset_url("js/enhancements/docs-nav.js") }}',
            'tabs': '{{ asset_url("js/enhancements/tabs.js") }}',
            'lightbox': '{{ asset_url("js/enhancements/lightbox.js") }}',
            'interactive': '{{ asset_url("js/enhancements/interactive.js") }}',
            'mobile-nav': '{{ asset_url("js/enhancements/mobile-nav.js") }}',
            'action-bar': '{{ asset_url("js/enhancements/action-bar.js") }}',
            'copy-link': '{{ asset_url("js/enhancements/copy-link.js") }}',
            'data-table': '{{ asset_url("js/enhancements/data-table.js") }}',
            'lazy-loaders': '{{ asset_url("js/enhancements/lazy-loaders.js") }}',
            'holo': '{{ asset_url("js/enhancements/holo.js") }}',
            'link-previews': '{{ asset_url("js/enhancements/link-previews.js") }}'
        };
    </script>

    {# Inline theme init #}
    <script>
        (function () {
            try {
                var defaults = window.BENGAL_THEME_DEFAULTS || { appearance: 'system', palette: '' };
                var defaultAppearance = defaults.appearance;
                if (defaultAppearance === 'system') {
                    defaultAppearance = (window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches) ? 'dark' : 'light';
                }
                var storedTheme = localStorage.getItem('bengal-theme');
                var storedPalette = localStorage.getItem('bengal-palette');
                var theme = storedTheme ? (storedTheme === 'system' ? defaultAppearance : storedTheme) : defaultAppearance;
                var palette = storedPalette ?? defaults.palette;
                document.documentElement.setAttribute('data-theme', theme);
                if (palette) { document.documentElement.setAttribute('data-palette', palette); }
            } catch (e) { document.documentElement.setAttribute('data-theme', 'light'); }
        })();
    </script>

    {# Speculation Rules #}
    {% with _doc_app.speculation as speculation %}
    {% if _doc_app.enabled and speculation.enabled and (_doc_app.features?.speculation_rules ?? true) %}
    <script type="speculationrules">
    {
      "prerender": [
        {
          "where": {
            "and": [
              { "href_matches": "{{ speculation.prerender.patterns | join('", "') }}" },
              { "not": { "selector_matches": "[data-external], [target=_blank], .external" } }
            ]
          },
          "eagerness": "{{ speculation.prerender.eagerness }}"
        }
      ],
      "prefetch": [
        {
          "where": {
            "and": [
              { "href_matches": "{{ speculation.prefetch.patterns | join('", "') }}" },
              { "not": { "selector_matches": "[data-external], [target=_blank], .external" } }
            ]
          },
          "eagerness": "{{ speculation.prefetch.eagerness }}"
        }
      ]
    }
    </script>
    {% end %}
    {% end %}

    {% block extra_head %}{% end %}
    {% include 'partials/meta-generator.html' %}

    {% if config.expose_metadata_json %}
    <script id="bengal-bootstrap" type="application/json">{{ bengal | tojson }}</script>
    <script>
        (function () {
            var el = document.getElementById('bengal-bootstrap');
            if (el) { window.__BENGAL__ = JSON.parse(el.textContent || '{}'); }
        })();
    </script>
    {% end %}
</head>

<body data-type="{{ page.type }}" data-variant="{{ page.variant or '' }}"
    class="page-kind-{{ page.kind or 'page' }}{% if page.is_draft %} draft-page{% end %}{% if page.hidden %} hidden-page{% end %}{% if page.is_featured %} featured-content{% end %}">

    {% if 'accessibility.skip_link' in (theme.features ?? []) %}
    <a href="#main-content" class="skip-link">Skip to main content</a>
    {% end %}

    {# Search Modal Block #}
    {% block site_search_modal %}
    {% with config.search.ui as ui %}
    {% if ui.modal ?? false %}
    <dialog id="search-modal" class="search-modal"
        aria-label="{{ t('search.aria_label', default='Search documentation') }}">
        <div class="search-modal__backdrop" data-close-modal></div>
        <div class="search-modal__container" role="dialog" aria-modal="true">
            <header class="search-modal__header">
                <div class="search-modal__input-wrapper">
                    {{ icon('magnifying-glass', size=20, css_class='search-modal__icon') }}
                    <input type="search" id="search-modal-input" class="search-modal__input"
                        placeholder="{{ ui.placeholder ?? t('search.placeholder', default='Search documentation...') }}"
                        autocomplete="off" autocorrect="off" autocapitalize="off" spellcheck="false"
                        aria-label="{{ t('search.aria_label', default='Search') }}"
                        aria-describedby="search-modal-status" aria-controls="search-modal-results"
                        aria-autocomplete="list">
                    <div class="search-modal__loading hidden" id="search-modal-loading">
                        <div class="search-modal__spinner"></div>
                    </div>
                </div>
                <button type="button" class="search-modal__close" data-close-modal
                    aria-label="Close search"><kbd>ESC</kbd></button>
            </header>
            <div id="search-modal-status" class="sr-only" role="status" aria-live="polite"></div>
            <section class="search-modal__recent" id="search-modal-recent"
                aria-label="{{ t('search.recent_aria_label', default='Recent searches') }}">
                <div class="search-modal__section-header">
                    <span class="search-modal__section-title">{{ t('search.recent', default='Recent') }}</span>
                    <button type="button" class="search-modal__clear-recent" id="clear-recent-searches">{{
                        t('search.clear', default='Clear') }}</button>
                </div>
                <ul class="search-modal__recent-list" id="search-modal-recent-list" role="listbox"></ul>
            </section>
            <section class="search-modal__results" id="search-modal-results"
                aria-label="{{ t('search.results_aria_label', default='Search results') }}">
                <div class="search-modal__results-list" id="search-modal-results-list" role="listbox"></div>
                <div class="search-modal__no-results hidden" id="search-modal-no-results">
                    {{ icon('magnifying-glass', size=48) }}
                    <p class="search-modal__no-results-text">{{ t('search.no_results', default='No results for') }}
                        "<span id="search-modal-no-results-query"></span>"</p>
                </div>
                <div class="search-modal__empty" id="search-modal-empty">
                    <p class="search-modal__empty-hint">{{ t('search.empty_hint', default='Start typing to search...')
                        }}</p>
                </div>
            </section>
            <footer class="search-modal__footer">
                <div class="search-modal__hints">
                    <span class="search-modal__hint"><kbd>↑</kbd><kbd>↓</kbd> <span>{{ t('search.hint_navigate',
                            default='Navigate') }}</span></span>
                    <span class="search-modal__hint"><kbd>↵</kbd> <span>{{ t('search.hint_open', default='Open')
                            }}</span></span>
                    <span class="search-modal__hint"><kbd>ESC</kbd> <span>{{ t('search.hint_close', default='Close')
                            }}</span></span>
                </div>
                <div class="search-modal__powered-by"><span>{{ t('search.powered_by', default='Powered by') }}</span> <a
                        href="https://lunrjs.com/" target="_blank" rel="noopener">Lunr</a></div>
            </footer>
        </div>
    </dialog>
    {% end %}
    {% end %}
    {% end %}

    {# Header #}
    {% let _header_sticky = theme.header_sticky ?? true %}
    {% let _header_nav_position = theme.header_nav_position ?? 'left' %}
    <header role="banner" class="header-appshell" data-sticky="{{ _header_sticky | lower }}">
        <nav role="navigation" aria-label="Main navigation">
            <div class="header-nav-content" data-nav-position="{{ _header_nav_position }}">
                <a href="{{ '/' | absolute_url }}" class="logo">
                    {% match site.logo, site.logo_text %}
                    {% case logo, _ if logo %}<img src="{{ logo | absolute_url }}" alt="{{ _site_title }}"
                        class="brand-image" />
                    {% case _, text if text %}<span class="brand-text">{{ text }}</span>
                    {% case _ %}<span class="brand-text">{{ _site_title }}</span>
                    {% end %}
                </a>

                {% if _main_menu or _auto_nav %}
                {% spaceless %}
                <ul class="nav-main hidden-mobile">
                    {% for item in _main_menu %}{{ render_menu_item(item) }}{% end %}
                    {% if _auto_nav %}
                    <li class="{{ ['active' if _page_url == '/'] | classes }}"><a href="{{ '/' | absolute_url }}">Home</a>
                    </li>
                    {% for item in _auto_nav %}
                    <li
                        class="{{ ['active' if (_page_url is string and item._path is string and _page_url.startswith(item._path) and item._path != '/')] | classes }}">
                        <a href="{{ item.href | absolute_url }}">{{ item.name }}</a>
                    </li>
                    {% end %}
                    {% end %}
                    {% with site.params.repo_url as repo_url %}
                    {% if repo_url and not (site._dev_menu_metadata?.github_bundled ?? false) %}
                    <li><a href="{{ repo_url }}" target="_blank" rel="noopener" aria-label="GitHub">{{
                            icon('github-logo', size=16) }} <span>GitHub</span></a></li>
                    {% end %}
                    {% end %}
                    {% block nav_items %}{% end %}
                </ul>
                {% end %}
                {% end %}

                <div class="header-actions hidden-mobile">
                    {% with config.search.ui as ui %}
                    {% if ui.modal ?? false %}
                    <button type="button" class="nav-search-trigger" id="nav-search-trigger" title="Search (⌘K)">{{
                        icon('magnifying-glass', size=16) }} <span>Search</span> <kbd
                            class="nav-search-shortcut">⌘K</kbd></button>
                    {% else %}
                    <a href="{{ '/search/' | absolute_url }}" class="nav-search-trigger" title="Search (⌘K)">{{
                        icon('magnifying-glass', size=16) }} <span>Search</span></a>
                    {% end %}
                    {% end %}
                    {% with theme_menu_id='theme-menu-desktop' %}{% include 'partials/theme-controls.html' %}{% end %}
                </div>

                <button class="mobile-nav-toggle visible-mobile" aria-label="Open menu"
                    onclick="document.getElementById('mobile-nav-dialog').showModal()">
                    {{ icon('list', size=24) }}
                </button>
            </div>
        </nav>
    </header>

    {# Mobile Navigation #}
    <dialog id="mobile-nav-dialog" class="mobile-nav-dialog" aria-label="Mobile navigation">
        <form method="dialog" class="mobile-nav-header">
            <span class="logo">
                {% match site.logo, site.logo_text %}
                {% case logo, _ if logo %}<img src="{{ logo | absolute_url }}" alt="{{ _site_title }}"
                    class="brand-image" />
                {% case _, text if text %}<span class="brand-text">{{ text }}</span>
                {% case _ %}<span class="brand-text">{{ _site_title }}</span>
                {% end %}
            </span>
            <div class="mobile-nav-actions">
                {% if config.search.ui.modal ?? false %}
                <button type="button" class="mobile-nav-search" data-open-search>{{ icon('magnifying-glass', size=16) }}
                    <span>Search</span></button>
                {% end %}
                <button type="submit" value="close" class="mobile-nav-close">{{ icon('x', size=16) }}
                    <span>Close</span></button>
            </div>
        </form>

        {% if _main_menu or _auto_nav %}
        <nav class="mobile-nav-content" role="navigation">
            <ul>
                {% for item in _main_menu %}{{ render_menu_item(item, is_mobile=true) }}{% end %}
                {% if _auto_nav %}
                <li class="{{ ['active' if _page_url == '/'] | classes }}"><a href="{{ '/' | absolute_url }}">Home</a></li>
                {% for item in _auto_nav %}<li
                    class="{{ ['active' if (_page_url.startswith(item._path) if _page_url is string and item._path != '/' else false)] | classes }}">
                    <a href="{{ item.href | absolute_url }}">{{ item.name }}</a>
                </li>{% end %}
                {% end %}
                {% with site.params.repo_url as repo_url %}
                {% if repo_url and not (site._dev_menu_metadata?.github_bundled ?? false) %}
                <li><a href="{{ repo_url }}" target="_blank" rel="noopener">{{ icon('github-logo', size=16) }}
                        GitHub</a></li>
                {% end %}
                {% end %}
                {% block mobile_nav_items %}{% end %}
            </ul>
        </nav>
        {% end %}
        <div class="mobile-nav-footer">{% with theme_menu_id='theme-menu-mobile' %}{% include
            'partials/theme-controls.html' %}{% end %}</div>
    </dialog>

    <main id="main-content" role="main">{% block content %}{% end %}</main>

    {# Footer #}
    {% block site_footer %}
    <footer role="contentinfo">
        <div class="container">
            <div class="footer-bottom">
                <div class="footer-left">
                    <p class="footer-copyright">&copy; {{ site.build_time | dateformat('%Y') }} {{ _site_title }}</p>
                    {% if _footer_menu %}
                    <ul class="footer-links">{% for item in _footer_menu %}<li><a
                                href="{{ item.href | absolute_url }}">{{ item.name }}</a></li>{% end %}</ul>
                    {% end %}
                </div>
                <div class="footer-right">
                    {% with site.build_badge as badge %}
                    {% if badge.enabled %}
                    <a class="bengal-build-time" data-bengal-build-badge
                        data-bengal-build-badge-dir="{{ badge.dir_name }}"
                        data-bengal-build-badge-path="{{ build_artifact_url('build.json', badge.dir_name) }}"
                        data-bengal-build-badge-label="{{ badge.label }}" href="#" hidden>
                        <span class="bengal-build-time__label">{{ badge.label }}</span>
                        <span class="bengal-build-time__value" data-bengal-build-badge-value></span>
                    </a>
                    {% end %}
                    {% end %}
                    <a href="https://github.com/lbliii/bengal" class="bengal-badge" data-tooltip="Made with Bengal" aria-label="Built with Bengal"><span
                            class="cat cat-contemplative"><span class="cat-tail">ᓚ</span><span
                                class="cat-body">ᘏ</span><span class="cat-head">ᗢ</span></span></a>
                </div>
            </div>
        </div>
    </footer>
    {% end %}

    {# Scripts #}
    {% block site_scripts %}
    {% if config.assets.bundle_js ?? false %}
    <script defer src="{{ asset_url('js/bundle.js') }}"></script>
    <script defer src="{{ asset_url('js/vendor/lunr.min.js') }}"></script>
    {% else %}
    <script defer src="{{ asset_url('js/utils.js') }}"></script>
    <script defer src="{{ asset_url('js/bengal-enhance.js') }}"></script>
    <script defer src="{{ asset_url('js/core/theme.js') }}"></script>
    <script defer src="{{ asset_url('js/core/search.js') }}"></script>
    <script defer src="{{ asset_url('js/core/nav-dropdown.js') }}"></script>
    <script defer src="{{ asset_url('js/core/session-path-tracker.js') }}"></script>
    <script defer src="{{ asset_url('js/core/version-selector.js') }}"></script>
    {% if site.build_badge.enabled %}
    <script defer src="{{ asset_url('js/core/build-badge.js') }}"></script>{% end %}
    <script defer src="{{ asset_url('js/main.js') }}"></script>
    <script defer src="{{ asset_url('js/enhancements/interactive.js') }}"></script>
    <script defer src="{{ asset_url('js/enhancements/mobile-nav.js') }}"></script>
    <script defer src="{{ asset_url('js/enhancements/tabs.js') }}"></script>
    <script defer src="{{ asset_url('js/enhancements/toc.js') }}"></script>
    <script defer src="{{ asset_url('js/enhancements/tracks.js') }}"></script>
    <script defer src="{{ asset_url('js/enhancements/action-bar.js') }}"></script>
    <script defer src="{{ asset_url('js/enhancements/copy-link.js') }}"></script>
    {% if 'content.lightbox' in theme.features %}
    <script defer src="{{ asset_url('js/enhancements/lightbox.js') }}"></script>{% end %}
    {% if 'content.math' in (theme.features ?? []) %}
    <script defer src="https://cdn.jsdelivr.net/npm/katex@0.16.11/dist/katex.min.js" crossorigin></script>
    <script defer src="{{ asset_url('js/enhancements/math.js') }}"></script>
    {% end %}
    {% include "partials/link-previews.html" %}
    <script defer src="{{ asset_url('js/vendor/lunr.min.js') }}"></script>
    <script>
        window.BENGAL_LAZY_ASSETS = { tabulator: '{{ asset_url("js/tabulator.min.js") }}', dataTable: '{{ asset_url("js/data-table.js") }}', mermaidToolbar: '{{ asset_url("js/mermaid-toolbar.js") }}', mermaidTheme: '{{ asset_url("js/mermaid-theme.js") }}', graphMinimap: '{{ asset_url("js/graph-minimap.js") }}', graphContextual: '{{ asset_url("js/graph-contextual.js") }}' };
        window.BENGAL_ICONS = { close: '{{ asset_url("icons/close.svg") }}', enlarge: '{{ asset_url("icons/enlarge.svg") }}', copy: '{{ asset_url("icons/copy.svg") }}', 'download-svg': '{{ asset_url("icons/download.svg") }}', 'download-png': '{{ asset_url("icons/image.svg") }}', 'zoom-in': '{{ asset_url("icons/zoom-in.svg") }}', 'zoom-out': '{{ asset_url("icons/zoom-out.svg") }}', reset: '{{ asset_url("icons/reset.svg") }}' };
    </script>
    <script defer src="{{ asset_url('js/enhancements/lazy-loaders.js') }}"></script>
    {% end %}
    {% end %}

    {% block extra_js %}{% end %}

    {% block site_dialogs %}
    {% if 'navigation.back_to_top' in theme.features %}<button class="back-to-top" aria-label="Scroll to top">{{
        icon("arrow-up", size=24) }}</button>{% end %}
    {% if 'content.lightbox' in theme.features %}
    <dialog id="lightbox-dialog" class="lightbox-dialog" aria-label="Image lightbox">
        <img class="lightbox-dialog__image" alt="">
        <form method="dialog" class="lightbox-dialog__controls"><button type="submit" class="lightbox-dialog__close"
                aria-label="Close lightbox">{{ icon("close", size=24) }}</button></form>
        <div class="lightbox-dialog__caption"></div>
    </dialog>
    {% end %}
    {% end %}
</body>

</html>
