Centre de notifications

<div class="uv-onc"><div class="pg" aria-hidden="true"><i class="h"></i><i></i><i></i><i></i><i></i><i class="s"></i></div><button type="button" class="fire" aria-label="Notifications"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M6 9.5a6 6 0 0 1 12 0c0 4.5 2 6 2 6H4s2-1.5 2-6M10 19a2 2 0 0 0 4 0"/></svg><b class="bd">2</b></button><div class="scr"></div><div class="pn" role="dialog" aria-label="Notifications"><header><b>Notifications</b><button type="button" class="rd">Tout marquer comme lu</button></header><div class="tb" role="tablist"><button type="button" role="tab" aria-selected="true">Toutes</button><button type="button" role="tab" aria-selected="false">Mentions</button></div><ul><li class="un me"><span class="av" style="--c:#ec4899">M</span><span class="tx"><span>Marta t’a mentionné dans « Refonte »</span><small>il y a 2 min</small></span><i aria-label="Non lu"></i></li><li class="un"><span class="av" style="--c:#3b82f6">I</span><span class="tx"><span>Ton rapport hebdo est prêt</span><small>il y a 1 h</small></span><i aria-label="Non lu"></i></li><li class=""><span class="av" style="--c:#10b981">J</span><span class="tx"><span>Javier a accepté l’invitation</span><small>hier</small></span><i aria-label="Non lu"></i></li><li class=""><span class="av" style="--c:#f59e0b">P</span><span class="tx"><span>Paiement d’octobre reçu</span><small>il y a 2 jours</small></span><i aria-label="Non lu"></i></li></ul></div></div>