{% extends "portal/base.html" %}
{% block title %}Your locations{% endblock %}
{% block content %}
<h1 class="text-2xl font-semibold mb-1">Your monitoring locations</h1>
<p class="text-gray-400 text-sm mb-6">Live sound levels for your active locations.</p>

{# M1 task 4 fleshes this out into location tiles + a map. #}
{% if locations %}
<div class="grid sm:grid-cols-2 lg:grid-cols-3 gap-4">
    {% for loc in locations %}
    <a href="/portal/location/{{ loc.id }}" class="block rounded-xl border border-slate-700 bg-slate-800/50 p-4 hover:border-seismo-orange transition-colors">
        <div class="font-semibold">{{ loc.name }}</div>
        <div class="text-xs text-gray-400 mt-1">{{ loc.address or loc.project_name }}</div>
    </a>
    {% endfor %}
</div>
{% else %}
<div class="rounded-xl border border-slate-700 bg-slate-800/50 p-8 text-center text-gray-400">
    No active monitoring locations yet.
</div>
{% endif %}
{% endblock %}