feat: complete UI/UX refinement, email flow updates, and deep black theme

- Updated all email templates to a clean light theme and changed button text to 'Finalizar Cadastro'.

- Enforced a strict 15-minute expiration on all auth/reset tokens.

- Created SetupAccount flow distinct from ResetPassword to capture user name during admin init.

- Refined dark mode to a premium True Black (Onyx) palette using Zinc.

- Fixed Dashboard KPI visibility and true period-over-period trend logic.

- Enhanced TeamManagement with global tenant filtering for Super Admins.

- Implemented secure User URL routing via slugs instead of raw UUIDs.

- Enforced strict Agent-level RBAC for viewing attendances.

pages/TeamManagement.tsx

@@ -1,4 +1,5 @@
 import React, { useState, useEffect } from 'react';
+import { Link } from 'react-router-dom';
 import { Users, Plus, Mail, Search, X, Edit, Trash2, Loader2, AlertTriangle } from 'lucide-react';
 import { getUsers, getTeams, createMember, deleteUser, updateUser, getUserById, getTenants } from '../services/dataService';
 import { User, Tenant } from '../types';
@@ -12,6 +13,7 @@ export const TeamManagement: React.FC = () => {
   const [isModalOpen, setIsModalOpen] = useState(false);
   const [isDeleteModalOpen, setIsDeleteModalOpen] = useState(false);
   const [searchTerm, setSearchTerm] = useState('');
+  const [tenantFilter, setTenantFilter] = useState('all');
   const [currentUser, setCurrentUser] = useState<User | null>(null);
   const [userToDelete, setUserToDelete] = useState<User | null>(null);
   const [deleteConfirmName, setDeleteConfirmName] = useState('');
@@ -92,7 +94,10 @@ export const TeamManagement: React.FC = () => {
   if (loading && users.length === 0) return <div className="flex h-screen items-center justify-center text-zinc-400 dark:text-dark-muted transition-colors">Carregando...</div>;
 
   const canManage = currentUser?.role === 'admin' || currentUser?.role === 'super_admin';
-  const filtered = users.filter(u => u.name.toLowerCase().includes(searchTerm.toLowerCase()) || u.email.toLowerCase().includes(searchTerm.toLowerCase()));
+  const filtered = users.filter(u => 
+    (u.name.toLowerCase().includes(searchTerm.toLowerCase()) || u.email.toLowerCase().includes(searchTerm.toLowerCase())) &&
+    (tenantFilter === 'all' || u.tenant_id === tenantFilter)
+  );
 
   const getRoleLabel = (role: string) => {
     if (role === 'super_admin') return 'Super Admin';
@@ -124,11 +129,21 @@ export const TeamManagement: React.FC = () => {
       </div>
 
       <div className="bg-white dark:bg-dark-card border border-zinc-200 dark:border-dark-border rounded-xl shadow-sm overflow-hidden">
-        <div className="p-4 border-b border-zinc-100 dark:border-dark-border bg-zinc-50 dark:bg-dark-bg/50">
-          <div className="relative max-w-md">
+        <div className="p-4 border-b border-zinc-100 dark:border-dark-border bg-zinc-50 dark:bg-dark-bg/50 flex flex-col sm:flex-row gap-4">
+          <div className="relative flex-1 max-w-md">
             <Search size={16} className="absolute left-3 top-1/2 -translate-y-1/2 text-zinc-400 dark:text-dark-muted" />
             <input type="text" placeholder="Buscar membros..." value={searchTerm} onChange={e => setSearchTerm(e.target.value)} className="w-full pl-9 pr-4 py-2 bg-white dark:bg-dark-bg border border-zinc-200 dark:border-dark-border rounded-lg text-sm text-zinc-900 dark:text-dark-text outline-none focus:ring-2 focus:ring-brand-yellow/20 transition-all" />
           </div>
+          {currentUser?.role === 'super_admin' && (
+            <select 
+              value={tenantFilter} 
+              onChange={e => setTenantFilter(e.target.value)} 
+              className="bg-white dark:bg-dark-bg border border-zinc-200 dark:border-dark-border px-3 py-2 rounded-lg text-sm text-zinc-700 dark:text-dark-text outline-none focus:ring-2 focus:ring-brand-yellow/20 cursor-pointer w-full sm:w-auto transition-all"
+            >
+              <option value="all">Todas Organizações</option>
+              {tenants.map(t => <option key={t.id} value={t.id}>{t.name}</option>)}
+            </select>
+          )}
         </div>
         <div className="overflow-x-auto">
           <table className="w-full text-left">
@@ -158,7 +173,7 @@ export const TeamManagement: React.FC = () => {
                         <span className={`absolute bottom-0 right-0 w-2.5 h-2.5 rounded-full border-2 border-white dark:border-dark-card ${user.status === 'active' ? 'bg-green-500' : 'bg-zinc-300 dark:bg-zinc-600'}`}></span>
                       </div>
                       <div>
-                        <div className="font-bold text-zinc-900 dark:text-dark-text">{user.name}</div>
+                        <Link to={`/users/${user.slug || user.id}`} className="font-bold text-zinc-900 dark:text-dark-text hover:underline">{user.name}</Link>
                         <div className="text-xs text-zinc-500 dark:text-dark-muted">{user.email}</div>
                       </div>
                     </div>