{% load wagtailcore_tags %}
{% with url=value.arquivo.url|default:value.link_externo %}
<div class="edital-resultado-item">
    <div class="edital-resultado-data">
        {% if value.data_publicacao %}{{ value.data_publicacao|date:"d/m/Y" }}{% endif %}
    </div>
    <div class="edital-resultado-conteudo">
        {% if url %}
            <a href="{{ url }}" target="_blank" rel="noopener noreferrer" class="edital-resultado-titulo">
                {{ value.titulo }}
            </a>
        {% else %}
            <span class="edital-resultado-titulo">{{ value.titulo }}</span>
        {% endif %}
    </div>
</div>
{% endwith %}

<style>
.edital-resultado-item {
    display: flex;
    align-items: flex-start;
    gap: 20px;
    padding: 18px 4px;
    border-bottom: 1px solid #edf1f2;
    transition: background-color 0.15s ease;
}
.edital-resultado-item:last-child {
    border-bottom: none;
}
.edital-resultado-item:hover {
    background-color: #f6fbfb;
}
.edital-resultado-data {
    color: #007D7A;
    font-size: 13px;
    font-weight: 700;
    min-width: 90px;
}
.edital-resultado-conteudo {
    flex: 1;
}
.edital-resultado-titulo {
    color: #024248;
    font-weight: 600;
    font-size: 15px;
    text-decoration: none;
    line-height: 1.5;
}
a.edital-resultado-titulo:hover {
    color: #007D7A;
    text-decoration: underline;
}
@media (max-width: 768px) {
    .edital-resultado-item {
        flex-direction: column;
        gap: 4px;
    }
}
</style>