{% extends 'base.html' %}
{% from 'components/rant_card.html' import render_rant_card %}

{% block content %}
<div class="search-box">
    <form class="search-form" action="/search" method="GET">
        <input type="text" name="term" placeholder="Search rants..." value="{{ search_term or '' }}" required>
        <button type="submit" class="btn">Search</button>
    </form>
</div>

<div id="searchResults">
    {% if search_term %}
        {% if results %}
            {% for rant in results %}
                {{ render_rant_card(rant) }}
            {% endfor %}
        {% else %}
            <p style="text-align: center; color: var(--text-dim);">No results found</p>
        {% endif %}
    {% endif %}
</div>
{% endblock %}