{% extends "base.html" %}

{% block headers %}
<link rel="stylesheet" href="/static/css/clients/index.css">

{% endblock %}

{% block content %}
<table class="table">
    <thead class="table-header">
        <tr class="table-row">
            <td class="table-header-item">First Name</td>
            <td class="table-header-item">Last Name</td>
            <td class="table-header-item">Address</td>
            <td class="table-header-item">Number</td>
            <td class="table-header-item">Email</td>
        </tr>
    </thead>
    <tbody class="table-body">
        {% for client in clients %}
        <tr class="table-row">
            <td class="table-cell">{{ client.first_name }}</td>
            <td class="table-cell">{{ client.last_name }}</td>
            <td class="table-cell">
                {{ client.country}}
                {{ client.city}}
                {{ client.state}}
                {{ client.address_line}}
                {{ client.house_number}}
                {{ client.postal_code}}
            </td>
            <td class="table-cell">{{ client.phone_number }}</td>
            <td class="table-cell">{{ client.email }}</td>
        </tr>
        {% endfor %}
    </tbody>
</table>
{% endblock %}