<div class="container-fluid">
    <div class="row justify-content-center">

        <!-- os meus clientes -->
        <div class="col-12 p-5 bg-white">

            <div class="row">
                <div class="col">
                    <h5><i class="fa-solid fa-user-tie me-2"></i>Agente: <strong>[nome do agente]</strong></h5>
                </div>
                <div class="col text-end">
                    <a href="#" class="btn btn-secondary"><i class="fa-solid fa-upload me-2"></i></i>Carregar ficheiro</a>
                    <a href="#" class="btn btn-secondary"><i class="fa-solid fa-plus me-2"></i>Novo cliente</a>
                </div>
            </div>

            <hr>

            <p class="my-5 text-center opacity-75">Não existem clientes registados.</p>

            <table class="table table-striped table-bordered">
                <thead class="table-dark">
                    <tr>
                        <th>Nome</th>
                        <th class="text-center">Sexo</th>
                        <th class="text-center">Data nascimento</th>
                        <th>Email</th>
                        <th class="text-center">Telefone</th>
                        <th>Interesses</th>
                        <th></th>
                    </tr>
                </thead>
                <tbody>
                    <tr>
                        <td>[Nome do cliente]</td>
                        <td class="text-center">[Sexo]</td>
                        <td class="text-center">[Data nascimento]</td>
                        <td>[Email]</td>
                        <td class="text-center">[Telefone]</td>
                        <td>[Interesses]</td>
                        <td class="text-end">
                            <a href="#"><i class="fa-regular fa-pen-to-square me-2"></i>Editar</a>
                            <span class="mx-2 opacity-50">|</span>
                            <a href="#"><i class="fa-solid fa-trash-can me-2"></i>Eliminar</a>
                        </td>
                    </tr>
                </tbody>
            </table>

            <div class="row">
                <div class="col">
                    <p class="mb-5">Total: <strong>[0]</strong></p>
                </div>
                <div class="col text-end">
                    <a href="#" class="btn btn-secondary">
                        <i class="fa-regular fa-file-excel me-2"></i>Exportar para XLSX
                    </a>
                </div>
            </div>
            
        </div>
    </div>
</div>