{% if blog_languages.size > 1 %}
<nav class="language-switcher" aria-label="{{ labels.language_switcher_label }}">
  {% for lang in blog_languages %}
    {% if lang.is_current %}
      <span class="language-switcher-badge language-switcher-badge-current" aria-current="true" title="{{ lang.code }}">{{ lang.flag }}</span>
    {% else %}
      <a class="language-switcher-badge" href="{{ lang.href_prefix | default: '/' }}" data-lang-prefix="{{ lang.href_prefix }}" title="{{ lang.code }}">{{ lang.flag }}</a>
    {% endif %}
  {% endfor %}
  <div class="blog-search-widget" aria-label="{{ labels.site_search_label }}">
    <button type="button" class="blog-search-toggle" data-blog-search-toggle aria-label="{{ labels.site_search_label }}">
      <svg aria-hidden="true" viewBox="0 0 24 24" width="14" height="14" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" focusable="false">
        <circle cx="11" cy="11" r="8"></circle>
        <line x1="21" y1="21" x2="16.65" y2="16.65"></line>
      </svg>
    </button>
    <div class="blog-search-panel" data-blog-search-panel hidden>
      <div id="blog-search" data-blog-search-root data-search-placeholder="{{ labels.search_placeholder }}" data-search-no-results="{{ labels.search_no_results }}"></div>
    </div>
  </div>
</nav>
<script>
(function(){
  var links=document.querySelectorAll('.language-switcher-badge[data-lang-prefix]');
  var path=location.pathname.replace(/^\/[a-z]{2}(?=\/|$)/,'') || '/';
  links.forEach(function(a){a.href=(a.dataset.langPrefix||'')+path;});
}());
</script>
{% else %}
<div class="blog-search-standalone" aria-label="{{ labels.site_search_label }}">
  <button type="button" class="blog-search-toggle" data-blog-search-toggle aria-label="{{ labels.site_search_label }}">
    <svg aria-hidden="true" viewBox="0 0 24 24" width="14" height="14" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" focusable="false">
      <circle cx="11" cy="11" r="8"></circle>
      <line x1="21" y1="21" x2="16.65" y2="16.65"></line>
    </svg>
  </button>
  <div class="blog-search-panel" data-blog-search-panel hidden>
    <div id="blog-search" data-blog-search-root data-search-placeholder="{{ labels.search_placeholder }}" data-search-no-results="{{ labels.search_no_results }}"></div>
  </div>
</div>
{% endif %}
