{% extends "enap_designsystem/base.html" %}
{% load static wagtailimages_tags wagtailcore_tags %}
{% load css_tags %}
{% block extra_css %}{% block_css 'enap_designsystem/blocks/template_holofote.css' %}{% endblock %}

{% block metadata %}
    {% comment %} <meta name="viewport" content="width=device-width, initial-scale=1.0"> {% endcomment %}
{% endblock %}

{% block title %}
	<title>{{ page.title }}</title>
{% endblock %}


{% block navbar %}
    {% if enap_dynav %}
        {% include "enap_designsystem/blocks/dynamic_nav/dynamic_nav_include.html" %}
    {% elif page.navbar %}
        {% include "enap_designsystem/blocks/navbar/navbar_block.html" with navbar=page.navbar %}
    {% endif %}
{% endblock %}

{% block content %}
<section class="padding-mobile">
<div class="nav-container-holofote">
    <nav class="nav-menu">
        <div class="holofote-title">
            Holofote Enap 
            {% if page.holofote_info_link %}
                <a href="{{ page.holofote_info_link }}" class="oqe">O que é o Holofote?</a>
            {% endif %}
        </div>
        <div class="nav-links-center">
            {% for link_block in page.holofote_links %}
                {% if link_block.block_type == 'holofote_link' %}
                    <a href="{% if link_block.value.anchor %}{{ link_block.value.page.url }}{{ link_block.value.anchor }}{% else %}{{ link_block.value.page.url }}{% endif %}" 
                       class="nav-link-holofote">
                        {{ link_block.value.title }}
                    </a>
                {% endif %}
            {% endfor %}
        </div>
    </nav>
</div>

<div class="main_holofote">
    {% include_block page.body %}
</div>

{% if page.admin_notes %}
    <div style="background-color: #fffae6; padding: 10px; border: 1px dashed #ffaa00;">
        <strong>📝 Anotações Internas:</strong>
        <p>{{ page.admin_notes }}</p>
    </div>
{% endif %}
</section>
{% endblock %}
{% block footer %}
{% include "enap_designsystem/includes/footer.html" %}
{% endblock %}