{% extends "enap_designsystem/base.html" %}
{% load static %}
{% load wagtailcore_tags wagtailimages_tags %}

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


{%block govnavbar %}
    <div style="background-color: #071E41;">
        <div class="menu">
            <div class="logo">
                <img style="width: 51px; height: 18px;" src="{% static 'enap_designsystem/icons/logo-white.png' %}" alt="Passar pro lado esquerdo" alt="Logo GovBR" height="40">
            </div>
            <a href="https://www.gov.br/secom/pt-br/acesso-a-informacao/comunicabr">Comunica BR</a>
            <div class="separator"></div>
            <a href="https://www.gov.br/acessoainformacao/pt-br">Acesso à informação</a>
            <div class="separator"></div>
            <a href="https://www.gov.br/pt-br/participacao-social/">Participe</a>
            <div class="separator"></div>
            <a href="https://www4.planalto.gov.br/legislacao/">Legislação</a>
            <div class="separator"></div>
            <a href="https://www.gov.br/pt-br/orgaos-do-governo">Órgãos do Governo</a>
        </div>
    </div>
{% endblock %}

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

{% block content %}
	<article class="enap-noticia">
		<h1>{{ page.title }}</h1>

		<!-- Autor da notícia -->
		{% if page.autor %}
			<div class="noticia-autor">
				<p><strong>Por:</strong> {{ page.autor }}</p>
			</div>
		{% endif %}

		<div class="wrapper-compartilhar">
			<!-- Metadados da notícia -->
			<div class="noticia-meta">
				{% if page.first_published_at %}
					<p><strong>Publicado:</strong> {{ page.first_published_at|date:"d F Y H:i" }}</p>
				{% endif %}
				{% if page.last_published_at and page.last_published_at != page.first_published_at %}
					<p><strong>Última Atualização:</strong> {{ page.last_published_at|date:"d F Y H:i" }}</p>
				{% endif %}
			</div>

			<!-- Botões de Compartilhar -->
			<div class="compartilhar">
				<h3>Compartilhe:</h3>
				<div class="social-buttons">
					<a href="https://api.whatsapp.com/send?text={{ page.title|urlencode }} - {{ request.build_absolute_uri }}" target="_blank" class="social-btn whatsapp" title="Compartilhar no WhatsApp">
						<i class="fab fa-whatsapp"></i>
					</a>
					<a href="https://www.facebook.com/sharer/sharer.php?u={{ request.build_absolute_uri }}" target="_blank" class="social-btn facebook" title="Compartilhar no Facebook">
						<i class="fab fa-facebook-f"></i>
					</a>
					<a href="https://twitter.com/intent/tweet?text={{ page.title|urlencode }}&url={{ request.build_absolute_uri }}" target="_blank" class="social-btn twitter" title="Compartilhar no Twitter">
						<i class="fab fa-twitter"></i>
					</a>
					<a href="https://www.linkedin.com/sharing/share-offsite/?url={{ request.build_absolute_uri }}" target="_blank" class="social-btn linkedin" title="Compartilhar no LinkedIn">
						<i class="fab fa-linkedin-in"></i>
					</a>
				</div>
			</div>
		</div>

		<div class="img-externa">
			{% if page.imagem_externa %}
				{% image page.imagem_externa fill-800x400 %}
				{% if page.fotografo %}
					<div class="credito-foto">
						<p><em>Foto: {{ page.fotografo }}</em></p>
					</div>
				{% endif %}
			{% endif %}
		</div>

		<div class="introtext">
			{{ page.descricao_html|safe }}
		</div>

		<div class="img-interna">
			{% if page.imagem_interna %}
				{% image page.imagem_interna original %}
				{% if page.fotografo %}
					<div class="credito-foto">
						<p><em>Foto: {{ page.fotografo }}</em></p>
					</div>
				{% endif %}
			{% endif %}
		</div>

		<div class="fulltext">
			{{ page.conteudo_html|safe }}
		</div>

		<br/>
	</article>
{% endblock %}


{% block footer %}
{% include "enap_designsystem/includes/footer.html" %}
{% endblock %}