{% extends "_raw.html" %}
{% load i18n %}
{% load static %}
{% load base_filters %}
{% block raw_content %}
    <div id="popup-overlay"
         class="fixed inset-0 opacity-75 bg-gray-800 hidden"></div>
    <header class="fixed h-14 pl-56 top-0 inset-x-0 flex flex-wrap z-50 bg-gray-300">
        <div class="flex-1 relative w-full"></div>
        {% if debug and request.user.is_staff %}
            <a href="{% url 'admin:index' %}"
               target="_blank"
               rel="noopener noreferrer"
               class="relative px-2 pt-4 text-gray-800 hover:bg-gray-200 border-r border-gray-400">
                <i data-feather="sliders"></i>
                {% trans 'Django Admin' %}
            </a>
        {% endif %}
        <a href="{% url 'public:wiki_redirect' %}"
           target="_blank"
           rel="noopener noreferrer"
           class="relative px-2 pt-4 text-gray-900 hover:bg-gray-200 border-r border-gray-400">
            <img class="inline-block"
                 alt="logo"
                 fill="none"
                 width="21"
                 height="21"
                 src="{% static 'logos/integreat/integreat-icon-flat.svg' %}"/>
            {% trans 'Documentation (Wiki)' %}
        </a>
        <div id="region-selector"
             class="relative flex flex-col justify-center px-2 cursor-pointer text-gray-800 hover:bg-gray-200 border-r border-gray-400">
            <div class="flex flex-wrap">
                {% if request.region %}
                    <a href="{% url 'dashboard' region_slug=request.region.slug %}"
                       class="block whitespace-nowrap">
                        <i data-feather="home"></i>
                        {{ request.region.full_name }}
                        {% if request.region_selection or user.is_superuser or user.is_staff %}<i data-feather="chevron-down"></i>{% endif %}
                    </a>
                {% else %}
                    <a href="{% url 'admin_dashboard' %}" class="block whitespace-nowrap">
                        <i data-feather="grid"></i>
                        {% trans 'Network Management' %}
                        {% if request.region_selection or user.is_superuser or user.is_staff %}<i data-feather="chevron-down"></i>{% endif %}
                    </a>
                {% endif %}
            </div>
            <div id="region-list"
                 class="absolute hidden shadow rounded-b top-full right-0 bg-gray-200">
                {% for region in request.region_selection %}
                    <a href="{% url 'dashboard' region_slug=region.slug %}"
                       class="block whitespace-nowrap px-4 py-3 text-gray-800 hover:bg-gray-300">
                        <i data-feather="home"></i>
                        {{ region.full_name }}
                    </a>
                {% endfor %}
                {% if user.is_superuser or user.is_staff %}
                    {% if request.region %}
                        <a href="{% url 'admin_dashboard' %}"
                           class="block whitespace-nowrap px-4 py-3 text-gray-800 hover:bg-gray-300 rounded-b">
                            <i data-feather="grid"></i>
                            {% trans 'Network Management' %}
                        </a>
                    {% endif %}
                {% endif %}
            </div>
        </div>
        <div id="user-info"
             class="relative px-2 text-gray-800 flex flex-col justify-center cursor-pointer hover:bg-gray-200">
            <a href="{% if request.region %}{% url 'user_settings' region_slug=request.region.slug %}{% else %}{% url 'user_settings' %}{% endif %}"
               class="relative block whitespace-nowrap">
                <i data-feather="user"></i>
                {{ request.user.full_user_name }}
                <i data-feather="chevron-down"></i>
            </a>
            <div id="user-menu"
                 class="absolute hidden shadow rounded-b top-full right-0 bg-gray-200">
                <a href="{% if request.region %}{% url 'user_settings' region_slug=request.region.slug %}{% else %}{% url 'user_settings' %}{% endif %}"
                   class="relative block whitespace-nowrap px-4 py-3 text-gray-800 hover:bg-gray-400">
                    <i data-feather="settings"></i>
                    {% trans 'User Settings' %}
                </a>
                <a href="{% url 'public:logout' %}"
                   class="relative block whitespace-nowrap px-4 py-3 text-gray-800 hover:bg-gray-400 rounded-b">
                    <i data-feather="log-out" class="text-red-500"></i>
                    {% trans 'Log out' %}
                </a>
            </div>
        </div>
    </header>
    <nav id="primary-navigation"
         class="w-56 h-full fixed left-0 inset-y-0 text-gray-200 bg-gray-700 z-50">
        <div class="w-full p-1 h-14 bg-gray-800">
            <a href="/">
                <div class="h-full w-full bg-{{ BRANDING }}-logo-white hover:bg-{{ BRANDING }}-logo-hover bg-contain bg-center bg-no-repeat"></div>
            </a>
        </div>
        <div id="menu" class="pb-2 overflow-y-auto {{ BRANDING }}-branding">
            {% if request.region %}
                <a href="{% url 'dashboard' region_slug=request.region.slug %}"
                   class="{% if current_menu_item == 'region_dashboard' %} active{% endif %}">
                    <i data-feather="grid"></i>
                    {% trans 'My Dashboard' %}
                </a>
                <!-- Analytics Section -->
                <div class="min-h-3 pl-2">
                    <p class="font-bold">
                        {% trans "Analytics" %}
                    </p>
                </div>
                {% if request.region.statistics_enabled %}
                    <a href="{% url 'statistics' region_slug=request.region.slug %}"
                       class="{% if current_menu_item == 'statistics' %} active{% endif %}">
                        <i data-feather="trending-up"></i>
                        {% trans 'Statistics' %}
                    </a>
                {% endif %}
                <a href="{% url 'translation_coverage' region_slug=request.region.slug %}"
                class="{% if current_menu_item == 'translation_coverage' %} active{% endif %}">
                    <i data-feather="check-circle"></i>
                    {% trans 'Translation Report' %}
                </a>
                {% if perms.cms.view_feedback %}
                <a href="{% url 'region_feedback' region_slug=request.region.slug %}"
                   class="{% if current_menu_item == 'region_feedback' %} active{% endif %}">
                    <i data-feather="thumbs-up"></i>
                    {% trans 'Feedback' %}
                </a>
                {% endif %}
                <a href="{% url 'linkcheck_landing' region_slug=request.region.slug %}"
                class="{% if current_menu_item == 'linkcheck' %} active{% endif %}">
                    <i data-feather="link"></i>
                    {% trans 'Broken Links' %}
                </a>
                <!-- Content Section -->
                <div class="min-h-3 pl-2">
                    <p class="font-bold">
                        {% trans "Content" %}
                    </p>
                </div>
                {% if perms.cms.view_directory and perms.cms.view_mediafile %}
                    <a href="{% url 'media' region_slug=request.region.slug %}"
                       class="{% if current_menu_item == 'media' %} active{% endif %}">
                        <i data-feather='file'></i>
                        {% trans 'Media Library' %}
                    </a>
                {% endif %}
                {% if perms.cms.view_page %}
                    <div class="{% if current_menu_item|in_list:'pages,new_page' %} active {% endif %}">
                        <a href="{% url 'pages' region_slug=request.region.slug %}">
                            <i data-feather="layout"></i>
                            {% trans 'Pages' %}
                        </a>
                    </div>
                {% endif %}
                {% if perms.cms.view_event %}
                    <div class="{% if current_menu_item|in_list:'events,events_form' %} active {% endif %}">
                        <a href="{% url 'events' region_slug=request.region.slug %}">
                            <i data-feather="calendar"></i>
                            {% trans 'Events' %}
                        </a>
                    </div>
                {% endif %}
                {% if perms.cms.view_poi %}
                    <div class="{% if current_menu_item|in_list:'pois,pois_form' %} active {% endif %}">
                        <a href="{% url 'pois' region_slug=request.region.slug %}">
                            <i data-feather="map-pin"></i>
                            {% trans 'Locations' %}
                        </a>
                    </div>
                {% endif %}
                {% if FCM_ENABLED and request.region.push_notifications_enabled and perms.cms.view_pushnotification %}
                    <div class="{% if current_menu_item|in_list:'push_notifications,push_notifications_form' %} active {% endif %}">
                        <a href="{% url 'push_notifications' region_slug=request.region.slug %}">
                            <i data-feather="send"></i>
                            {% trans 'News' %}
                        </a>
                    </div>
                {% endif %}
                {% if perms.cms.view_imprintpage %}
                    <a href="{% url 'edit_imprint' region_slug=request.region.slug %}"
                       class="{% if current_menu_item == 'imprint' %} active{% endif %}">
                        <i data-feather="file-text"></i>
                        {% trans 'Imprint' %}
                    </a>
                {% endif %}
                {% if perms.cms.view_user or perms.cms.view_languagetreenode %}
                    <!-- Settings Section-->
                    <div class="min-h-3 pl-2">
                        <p class="font-bold">
                            {% trans "Settings" %}
                        </p>
                    </div>
                {% endif %}
                {% if perms.cms.view_organization %}
                <a href="{% url 'organizations' region_slug=request.region.slug %}"
                   class="{% if current_menu_item == 'organizations' %} active{% endif %}">
                    <i data-feather="umbrella"></i>
                    {% trans 'Organizations' %}
                </a>
                {% endif %}
                {% if perms.cms.view_user %}
                    <div class="{% if current_menu_item|in_list:'region_users,region_user_form' %} active {% endif %}">
                        <a href="{% url 'region_users' region_slug=request.region.slug %}">
                            <i data-feather="users"></i>
                            {% trans 'Users' %}
                        </a>
                    </div>
                {% endif %}
                {% if perms.cms.view_languagetreenode %}
                    <a href="{% url 'languagetreenodes' region_slug=request.region.slug %}"
                       class="{% if current_menu_item|in_list:'languagetreenodes,language_tree_form' %} active {% endif %}">
                        <i data-feather="flag"></i>
                        {% trans 'Language Tree' %}
                    </a>
                {% endif %}
            {% else %}
                <a href="{% url 'admin_dashboard' %}"
                   class="{% if current_menu_item == 'admin_dashboard' %} active{% endif %}">
                    <i data-feather="grid"></i>
                    {% trans 'Admin Dashboard' %}
                </a>
                {% if perms.cms.view_region %}
                    <a href="{% url 'regions' %}"
                       class="{% if current_menu_item == 'regions' %} active{% endif %}">
                        <i data-feather="map"></i>
                        {% trans 'Regions' %}
                    </a>
                {% endif %}
                {% if perms.cms.view_directory and perms.cms.view_mediafile %}
                    <a href="{% url 'media_admin' %}"
                       class="{% if current_menu_item == 'media' %} active{% endif %}">
                        <i data-feather='file'></i>
                        {% trans 'Media Library' %}
                    </a>
                {% endif %}
                {% if perms.cms.view_language %}
                    <a href="{% url 'languages' %}"
                       class="{% if current_menu_item == 'languages' %} active{% endif %}">
                        <i data-feather="flag"></i>
                        {% trans 'Languages' %}
                    </a>
                {% endif %}
                {% if perms.cms.view_user %}
                    <div class="{% if current_menu_item|in_list:'users,user_form' %} active {% endif %}">
                        <a href="{% url 'users' %}">
                            <i data-feather="users"></i>
                            {% trans 'Users' %}
                        </a>
                    </div>
                {% endif %}
                {% if perms.auth.view_group %}
                    <a href="{% url 'roles' %}"
                       class="{% if current_menu_item == 'roles' %} active{% endif %}">
                        <i data-feather="key"></i>
                        {% trans 'Roles' %}
                    </a>
                {% endif %}
                {% if perms.cms.view_offer_template %}
                    <a href="{% url 'offertemplates' %}"
                       class="{% if current_menu_item == 'offertemplates' %} active{% endif %}">
                        <i data-feather="star"></i>
                        {% trans 'Offer Templates' %}
                    </a>
                {% endif %}
                {% if perms.cms.view_feedback %}
                    <a href="{% url 'admin_feedback' %}"
                       class="{% if current_menu_item == 'admin_feedback' %} active{% endif %}">
                        <i data-feather="thumbs-up"></i>
                        {% trans 'Feedback' %}
                    </a>
                {% endif %}
            {% endif %}
        </div>
        <div class="p-2 text-center absolute inset-x-0 bottom-0 bg-gray-600">{% trans 'Version' %}: {{ version }}</div>
    </nav>
    <main class="relative min-h-screen flex pl-56 pt-14 bg-gray-100">
        <div class="flex-1 min-w-0 p-6">
            {% include "messages.html" %}
            {% block content %}
            {% endblock content %}
        </div>
    </main>
{% endblock raw_content %}