{#
  SPDX-License-Identifier: MIT
  SPDX-FileCopyrightText: 2026 TU Wien
#}
{%- from "invenio_communities/details/macros/access-status-label.html" import access_status_label -%}

<div class="ui container fluid with-submenu ml-0-mobile mr-0-mobile">
  <div id="mn-community-header" class="ui theme-tertiary container fluid ml-0-mobile mr-0-mobile">
    <div class="ui fluid title container ml-0-mobile mr-0-mobile">
      <div class="ui relaxed container">
        <div class="community-header flex row align-items-center column-mobile rel-pt-2 rel-pb-2">

          <div class="flex align-items-center rel-mt-3">
            <a href="{{ community.links.self_html }}">
              <h1 class="ui huge header mb-0">{{ community.metadata.title }}</h1>
            </a>
          </div>

          {% if community.access.visibility == 'restricted' %}
          <div class="rel-ml-1">
            {{ access_status_label() }}
          </div>
          {% endif %}
        </div>
      </div>
    </div>

    {% if community.metadata.website %}
    <div id="info-box" class="ui container fluid theme-secondary page-subheader p-10 ml-0-mobile mr-0-mobile">
      <div id="website-link" class="ui container">
        <span>
          <a href="{{ community.metadata.website }}">{{ community.metadata.website }}</a>
        </span>
      </div>
    </div>
    {% endif %}

    {# community navigation menu #}
    <div id="mn-navbar" class="ui container fluid secondary pointing stackable menu theme-primary mr-0-mobile ml-0-mobile">
      {% if community_menu_active %}
      <div class="ui container">
        {% for item in current_menu.submenu('communities').children if (item.permissions == True or permissions[item.permissions]) and item.visible and item.name != "submit" %}
        <a class="item {{ 'active' if active_community_header_menu_item == item.name }} {{ 'disabled' if not item.url }}" href="{{ item.url }}" >
          <i aria-hidden="true" class="{{ item.icon }} icon"></i>
          {{ item.text }}
        </a>
        {% endfor %}
      </div>
      {% endif %}
    </div>
  </div>
</div>