{% extends 'layouts/base.twig' %}

{% block content %}
    <h1 class="mb-5 position-relative fs-3 fw-bold sp-module-title">{{ post.title }}</h1>

    <section class="posts-noticias">
        {% if posts_noticias %}
            {% for noticias in posts_noticias %}

            {% set imagen = noticias.thumbnail.src | default('/wp-content/uploads/2025/10/Imagen_por_defecto.png') %}
            {% set alt = noticias.thumbnail.alt | default('Imagen por defecto') %}

                <div class="card my-3 position-relative">
                    <div class="row g-0">
                        <div class="col-md-4">
                            <a href="{{ noticias.link }}" title="{{ noticias.title }}">
                                <img src="{{ imagen }}" 
                                        class="rounded-start object-fit-cover w-100 h-100 img-noticias" 
                                        alt="{{ alt }}"
                                        style="min-height: 200px;"
                                        />
                            </a>
                        </div>
                        <div class="col-md-8">
                            <div class="card-body" style="padding-bottom: 60px;">
                                <a href="{{ noticias.link }}" title="{{ noticias.title }}" class="text-decoration-none card-title">
                                    <h5 class="card-title-text">{{ noticias.title }}</h5>
                                </a>
                                <p class="card-text"> {{
                                        noticias.excerpt({
                                            words: 50,
                                            read_more: ''
                                        })
                                    }}</p>
                                <p class="card-text"><small class="text-body-secondary">{{ noticias.date }}</small></p>
                                <a href="{{ noticias.link  }}" 
                                        class="btn position-absolute btn-secondary-cnt"
                                        style="position: absolute; bottom: 15px; right: 15px; z-index: 10;" 
                                        >
                                        {{ __('Sigue leyendo', 'Sindikatua') }}...
                                        
                                        </a>
                            </div>
                        </div>
                    </div>
                </div>

            {% endfor %}
        {% else %}
            <h2>no hay artículos</h2>
        {% endif %}

        <!-- PAGINATION -->
        <div class="pagination-custom mt-5">
            {% include 'partials/pagination-custom.twig' %}
        </div>

    </section>

{% endblock %}