{% extends "!layout.html" %}

{% block extrahead %}
{{ super() }}
{% if theme_llm_disabled|lower != 'true' and theme_llm_disabled != true %}
<!-- LLM/AI Agent: See /llms.txt for comprehensive navigation guidance -->
<!-- Machine-readable LLM metadata -->
<meta name="llm:site-type" content="documentation">
<meta name="llm:framework" content="PyTorch">
{% if page_meta_description %}
<meta name="llm:description" content="{{ page_meta_description }}">
{% elif theme_llm_description %}
<meta name="llm:description" content="{{ theme_llm_description }} - {{ title|striptags }}">
{% else %}
<meta name="llm:description" content="{{ title|striptags }} - Documentation for {{ project }}, part of the PyTorch ecosystem.">
{% endif %}
{% if theme_llm_domain %}
{% set llm_base = ('https://' ~ theme_llm_domain ~ '/' ~ theme_llm_base_path)|replace('//', '/')|replace('https:/', 'https://') %}
{% elif theme_canonical_url %}
{% set llm_base = theme_canonical_url %}
{% else %}
{% set llm_base = '' %}
{% endif %}
{% set llm_base = llm_base.rstrip('/') %}
<meta name="llm:navigation-file" content="{{ llm_base }}/llms.txt">
<meta name="llm:sitemap" content="{{ llm_base }}/sitemap.xml">
<meta name="llm:version" content="{{ version }}">
<meta name="llm:project" content="{{ project }}">
<meta name="llm:page-type" content="{% if 'generated' in pagename %}api{% elif 'tutorial' in pagename %}tutorial{% else %}documentation{% endif %}">
<link rel="alternate" type="text/plain" href="{{ llm_base }}/llms.txt" title="LLM Navigation Guide">
{% endif %}
<script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/list.js/2.3.1/list.min.js"></script>
<script>
  if (window.location.hostname === 'docs.pytorch.org' || window.location.hostname === 'docs-preview.pytorch.org') {
    const script = document.createElement('script');
    script.src = 'https://cmp.osano.com/16A0DbT9yDNIaQkvZ/31b1b91a-e0b6-47ea-bde2-7f2bd13dbe5c/osano.js?variant=one';
    document.head.appendChild(script);
  }
</script>
<script>
  // Cookie banner for non-LF projects
  document.addEventListener('DOMContentLoaded', function () {
    // Hide cookie banner on local environments and LF owned docs
    if (window.location.hostname === 'localhost' ||
      window.location.hostname === '0.0.0.0' ||
      window.location.hostname === '127.0.0.1' ||
      window.location.hostname === 'docs.pytorch.org' ||
      window.location.hostname === 'docs-preview.pytorch.org' ||
      window.location.hostname.startsWith('192.168.')) {
      const banner = document.querySelector('.cookie-banner-wrapper');
      if (banner) {
        banner.style.display = 'none';
      }
    }
  });
</script>
<!-- Conditional CSS for header and footer height adjustment -->
{% if theme_show_lf_header|lower != 'true' and theme_show_lf_header != true %}
<style>
  :root {
    --header-height: 0px !important;
    --header-height-desktop: 0px !important;
  }
  /* Ensure proper mobile layout when LF header is hidden */
  @media (max-width: 960px) {
    .bd-header {
      top: 0 !important;
      position: sticky !important;
      z-index: 1020 !important;
    }
    .bd-main {
      padding-top: 0 !important;
      margin-top: 0 !important;
    }
    .bd-article-container {
      padding-top: 0 !important;
    }
    .header-article__inner {
      padding-top: 1rem !important;
    }

  }
</style>
{% endif %}
{% if not theme_show_lf_footer %}
<style>
  @media (min-width: 1100px) {
    .site-footer {
      height: 300px !important;
    }
  }
</style>
{% endif %}
<link rel="stylesheet" type="text/css" href="{{ pathto('_static/css/theme.css', 1) }}" crossorigin="anonymous">
<script type="text/javascript" src="{{ pathto('_static/js/theme.js', 1) }}"></script>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400&display=swap" rel="stylesheet">
<meta property="og:image" content="https://docs.pytorch.org/docs/stable/_static/img/pytorch_seo.png" />
<link rel="stylesheet" href="{{ pathto('_static/webfonts/all.min.css', 1) }}" crossorigin="anonymous">
<meta http-equiv="Content-Security-Policy"
  content="default-src * 'unsafe-inline' 'unsafe-eval' data: blob:; style-src * 'unsafe-inline'; script-src * 'unsafe-inline' 'unsafe-eval' blob:;">
<meta name="pytorch_project" content="{{ theme_pytorch_project }}">
<!-- Google Tag Manager (noscript) -->
<noscript><iframe src="https://www.googletagmanager.com/ns.html?id={{ theme_analytics_id }}" height="0" width="0"
    style="display:none;visibility:hidden"></iframe></noscript>
<!-- End Google Tag Manager (noscript) -->
<!-- Google Tag Manager -->
<script>(function (w, d, s, l, i) {
    w[l] = w[l] || []; w[l].push({
      'gtm.start':
        new Date().getTime(), event: 'gtm.js'
    }); var f = d.getElementsByTagName(s)[0],
      j = d.createElement(s), dl = l != 'dataLayer' ? '&l=' + l : ''; j.async = true; j.src =
        'https://www.googletagmanager.com/gtm.js?id=' + i + dl; f.parentNode.insertBefore(j, f);
    j.onload = function () {
      window.dispatchEvent(new Event('gtm_loaded'));
      console.log('GTM loaded successfully');
    };
  })(window, document, 'script', 'dataLayer', '{{ theme_analytics_id }}');
</script>
<!-- End Google Tag Manager -->
<!-- Facebook Pixel Code -->
<script>
  !function (f, b, e, v, n, t, s) {
    if (f.fbq) return; n = f.fbq = function () {
      n.callMethod ?
        n.callMethod.apply(n, arguments) : n.queue.push(arguments)
    };
    if (!f._fbq) f._fbq = n; n.push = n; n.loaded = !0; n.version = '2.0';
    n.queue = []; t = b.createElement(e); t.async = !0;
    t.src = v; s = b.getElementsByTagName(e)[0];
    s.parentNode.insertBefore(t, s)
  }(window, document, 'script',
    'https://connect.facebook.net/en_US/fbevents.js');
  fbq('init', '243028289693773');
  fbq('track', 'PageView');
</script>
<script>
  document.documentElement.setAttribute('data-version', '{{ version }}');
</script>
<noscript>
  <img height="1" width="1" src="https://www.facebook.com/tr?id=243028289693773&ev=PageView&noscript=1" />
</noscript>
<script>
  function gtag() {
    window.dataLayer.push(arguments);
  }
</script>
<!-- End Facebook Pixel Code -->
<!-- Repository configuration for tutorials -->
{% if (theme_pytorch_project == 'tutorials' or has_sphinx_gallery) and github_user and github_repo %}
<script>
  // Define repository configuration for tutorial buttons using existing html_context variables
  // Only injected when tutorial buttons are shown AND github variables are defined
  // If either condition is false, JavaScript will fallback to default PyTorch tutorial links
  window.repoConfig = {
    github_repo: "{{ github_user }}/{{ github_repo }}",
    github_branch: "{{ github_version }}",
    colab_repo: "{{ github_user }}/{{ github_repo }}",
    colab_branch: "{{ colab_branch }}"
  };
</script>
{% endif %}

<!-- Script to Fix scrolling with fast fixed-duration animation -->
<script>
  document.addEventListener('DOMContentLoaded', function () {
    const SCROLL_DURATION = 150; // Fixed duration in ms regardless of distance
    let lockedTargetId = null; // Lock the TOC to this target until user scrolls manually
    let isUpdatingToc = false; // Guard against infinite loops

    function smoothScrollTo(targetY, duration, onComplete) {
      const startY = window.pageYOffset;
      const difference = targetY - startY;
      const startTime = performance.now();

      function step(currentTime) {
        const elapsed = currentTime - startTime;
        const progress = Math.min(elapsed / duration, 1);
        // Ease-out cubic for smooth deceleration
        const easeOut = 1 - Math.pow(1 - progress, 3);
        window.scrollTo(0, startY + difference * easeOut);
        if (progress < 1) {
          requestAnimationFrame(step);
        } else if (onComplete) {
          onComplete();
        }
      }
      requestAnimationFrame(step);
    }

    function updateTocHighlight(targetId) {
      if (isUpdatingToc) return; // Prevent infinite loop
      isUpdatingToc = true;

      // Find the TOC link that points to this target
      const tocNav = document.querySelector('.bd-toc-nav');
      if (!tocNav) {
        isUpdatingToc = false;
        return;
      }

      // Remove active class from all TOC items
      tocNav.querySelectorAll('.nav-link').forEach(link => {
        link.classList.remove('active');
        link.parentElement.classList.remove('active');
      });

      // Add active class to the matching link and all its ancestor TOC items
      const matchingLink = tocNav.querySelector(`a[href="#${CSS.escape(targetId)}"]`);
      if (matchingLink) {
        matchingLink.classList.add('active');
        matchingLink.parentElement.classList.add('active');

        // Walk up the DOM to activate parent TOC entries (e.g. h2 parent of h3)
        let ancestor = matchingLink.parentElement.parentElement;
        while (ancestor && ancestor !== tocNav) {
          if (ancestor.classList.contains('toc-entry')) {
            ancestor.classList.add('active');
            const parentLink = ancestor.querySelector(':scope > a.nav-link');
            if (parentLink) {
              parentLink.classList.add('active');
            }
          }
          ancestor = ancestor.parentElement;
        }
      }

      // Use setTimeout to reset the guard after the current call stack
      setTimeout(function() {
        isUpdatingToc = false;
      }, 0);
    }

    // Watch for ScrollSpy trying to change the active state and override it
    const tocNav = document.querySelector('.bd-toc-nav');
    if (tocNav) {
      const observer = new MutationObserver(function(mutations) {
        if (lockedTargetId && !isUpdatingToc) {
          // Force our target to stay highlighted
          updateTocHighlight(lockedTargetId);
        }
      });
      observer.observe(tocNav, {
        attributes: true,
        attributeFilter: ['class'],
        subtree: true
      });
    }

    // Release the lock when user scrolls manually (not programmatically)
    window.addEventListener('wheel', function() {
      lockedTargetId = null;
    });
    window.addEventListener('touchmove', function() {
      lockedTargetId = null;
    });

    document.querySelectorAll('a[href^="#"]').forEach(anchor => {
      anchor.addEventListener('click', function (e) {
        const targetId = this.getAttribute('href').substring(1);
        if (!targetId) return; // Skip empty hash links
        const targetElement = document.getElementById(targetId);

        if (targetElement) {
          e.preventDefault();

          // Lock the TOC to this target
          lockedTargetId = targetId;

          const headerHeight =
            (document.querySelector('.header-holder') ? document.querySelector('.header-holder').offsetHeight : 0) +
            (document.querySelector('.bd-header') ? document.querySelector('.bd-header').offsetHeight : 0) + 20;

          const targetPosition = targetElement.getBoundingClientRect().top + window.pageYOffset - headerHeight;

          // Update TOC highlight immediately
          updateTocHighlight(targetId);

          smoothScrollTo(targetPosition, SCROLL_DURATION, function() {
            // Keep it highlighted after scroll
            updateTocHighlight(targetId);
          });

          // Update URL hash without scrolling
          history.pushState(null, null, '#' + targetId);
        }
      });
    });
  });
</script>

<script async src="https://cse.google.com/cse.js?cx=e65585f8c3ea1440e"></script>
<!-- RunLLM Widget Configuration -->
{% if theme_runllm_assistant_id %}
<script>
  window.runllmConfig = {
    assistant_id: "{{ theme_runllm_assistant_id }}",
    name: "{{ theme_runllm_name }}",
    position: "{{ theme_runllm_position }}",
    keyboard_shortcut: "{{ theme_runllm_keyboard_shortcut }}"
  };
</script>
<script type="text/javascript" src="{{ pathto('_static/js/runllm-widget.js', 1) }}"></script>
{% endif %}
{{ super() }}
{% endblock%}

{% block html_tag %}
<html data-version="{{ version }}">
{% endblock %}

{% block body_tag %}

<body data-feedback-url="{{ feedback_url }}" class="pytorch-body">
  {% include "announcement_banner.html" %}
  {% if theme_show_lf_header|lower == 'true' or theme_show_lf_header == true %}
  {% include "pytorch_header.html" %}
  {% endif %}
  {{ super() }}
{% endblock %}

{% block docs_body %}
{% include "components/searchbox.html" %}
<div id="pytorch-article">
  <!-- Hidden breadcrumb schema for SEO only -->
  <div style="display:none;" itemscope itemtype="https://schema.org/BreadcrumbList">
    {% for parent in parents %}
    <div itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem">
      <link itemprop="item" href="{{ parent.link|e }}">
      <meta itemprop="name" content="{{ parent.title }}">
      <meta itemprop="position" content="{{ loop.index }}">
    </div>
    {% endfor %}
    <div itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem">
      <meta itemprop="name" content="{{ title }}">
      <meta itemprop="position" content="{{ parents|length + 1 }}">
    </div>
  </div>

  {% if theme_pytorch_project == 'tutorials' %}
  <script>
    if ((window.location.href.indexOf("/unstable/") != -1) && (window.location.href.indexOf("/unstable/unstable_index") < 1)) {
      var div = '<div class="prototype-banner"><i class="fa fa-flask" aria-hidden="true"></i> <strong>Unstable feature:</strong> Not typically available in binary distributions like PyPI. Early stage for feedback and testing.</div>'
      document.addEventListener('DOMContentLoaded', function () {
        document.getElementById("pytorch-article").insertAdjacentHTML('afterBegin', div);
      });
    }
  </script>
  {% endif %}
  {% if theme_pytorch_project == 'tutorials' or has_sphinx_gallery %}
  <div class="pytorch-call-to-action-links">
    <div id="tutorial-type">{{ pagename }}</div>
    <a id="colab-link" data-behavior="call-to-action-event" data-response="Run in Google Colab" target="_blank">
      <div id="google-colab-link">
        <img class="call-to-action-img" src="{{ pathto('_static/img/pytorch-colab.svg', 1) }}" />
        <div class="call-to-action-desktop-view">Run in Google Colab</div>
        <div class="call-to-action-mobile-view">Colab</div>
      </div>
    </a>
    <a id="notebook-link" data-behavior="call-to-action-event" data-response="Download Notebook">
      <div id="download-notebook-link">
        <img class="call-to-action-notebook-img" src="{{ pathto('_static/img/pytorch-download.svg', 1) }}" />
        <div class="call-to-action-desktop-view">Download Notebook</div>
        <div class="call-to-action-mobile-view">Notebook</div>
      </div>
    </a>
    <a id="github-link" data-behavior="call-to-action-event" data-response="View on Github" target="_blank">
      <div id="github-view-link">
        <img class="call-to-action-img" src="{{ pathto('_static/img/pytorch-github.svg', 1) }}" />
        <div class="call-to-action-desktop-view">View on GitHub</div>
        <div class="call-to-action-mobile-view">GitHub</div>
      </div>
    </a>
  </div>
  {% endif %}

  {{ super() }}
</div>
{% endblock docs_body %}

  {% block footer%}
  {% include "pytorch_footer.html" %}
  {{ super() }}
  <script type="application/ld+json">
    {
       "@context": "https://schema.org",
       "@type": "Article",
       "name": {{ title|striptags|trim|tojson }},
       "headline": {{ title|striptags|trim|tojson }},
       "description": {% if page_meta_description %}{{ page_meta_description|tojson }}{% elif theme_llm_description %}{{ (theme_llm_description ~ " - " ~ title|striptags)|tojson }}{% else %}"PyTorch Documentation. Explore PyTorch, an open-source machine learning library that accelerates the path from research prototyping to production deployment."{% endif %},
       "url": "{{ canonical_url|default((url_root if url_root is defined else '/') + pagename + '.html', true) }}",
       "articleBody": {{ body|striptags|trim|tojson }},
       "author": {
         "@type": "Organization",
         "name": "PyTorch Contributors",
         "url": "https://pytorch.org"
       },
       "image": "https://pytorch.org/docs/stable/_static/img/pytorch_seo.png",
       "mainEntityOfPage": {
         "@type": "WebPage",
         "@id": "{{ canonical_url|default((url_root if url_root is defined else '/') + pagename + '.html', true) }}"
       },
       "datePublished": "{{ doc_created|default('2023-01-01') }}T00:00:00Z",
       "dateModified": "{{ doc_updated|default('2023-01-01') }}T00:00:00Z"
     }
 </script>
  <script>
    // Tutorials Call to action event tracking
    $("[data-behavior='call-to-action-event']").on('click', function () {
      fbq('trackCustom', "Download", {
        tutorialTitle: $('h1:first').text(),
        downloadLink: this.href,
        tutorialLink: window.location.href,
        downloadTitle: $(this).attr("data-response")
      });
      if (typeof gtag === 'function') {
        gtag('event', 'click', {
          'event_category': $(this).attr("data-response"),
          'event_label': $("h1").first().text(),
          'tutorial_link': window.location.href
        });
      }
    });
  </script>
  {% endblock %}