{% load css_tags %}{% block_css 'enap_designsystem/blocks/cta_destaque_formacao_block.css' %}
{% load wagtailimages_tags %}
{% load wagtailcore_tags wagtailimages_tags %}
{% block content %}
<div class="data-inicio-container">
    <div class="data-inicio-content">
        
        <!-- Ícone -->
        <div class="icone-container">
            {% if value.icone_personalizado %}
                {% image value.icone_personalizado width-400 height-300 as icone_img %}
                <img src="{{ icone_img.url }}" alt="Ícone" class="icone-personalizado">
            {% else %}
                <!-- Ícone SVG de relógio -->
                <svg width="40" height="40" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
                    <circle cx="12" cy="12" r="10" stroke="white" stroke-width="2"/>
                    <polyline points="12,6 12,12 16,14" stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
                </svg>
            {% endif %}
            <div class="cta-destaque-descricao-imagem">
                {{ value.descricao_imagem|richtext }}
            </div>

            {% if value.links_imagem %}
                <div class="cta-destaque-links-imagem">
                    {% for item in value.links_imagem %}
                        <div class="cta-link-item">
                            {% include_block item with extra_classes="cta-btn" %}
                        </div>
                    {% endfor %}
                </div>
            {% endif %}
        </div>
        
        <!-- Conteúdo -->
        <div class="conteudo-texto">
            <h2 class="titulo-formacao">
                {{ value.titulo }}
            </h2>
            
            <div class="descricao-formacao">
                {{ value.descricao|richtext }}
            </div>
            {% if value.links %}
            <div class="cta-destaque-links-imagem">
                    {% for item in value.links %}
                        <div class="cta-link-item">
                            {% include_block item with extra_classes="cta-btn" %}
                        </div>
                    {% endfor %}
                </div>
            {% endif %}
        </div>
        
    </div>
</div>
{% endblock %}