diff --git a/BTCPayServer.Abstractions/Extensions/ViewsRazor.cs b/BTCPayServer.Abstractions/Extensions/ViewsRazor.cs
index 4664d65ef..07c91bc03 100644
--- a/BTCPayServer.Abstractions/Extensions/ViewsRazor.cs
+++ b/BTCPayServer.Abstractions/Extensions/ViewsRazor.cs
@@ -101,6 +101,14 @@ namespace BTCPayServer.Abstractions.Extensions
             return categoryAndPageMatch && idMatch ? ActivePageClass : null;
         }
 
+        public static HtmlString ToBrowserDate(this DateTimeOffset date, string netFormat, string jsDateFormat = "short", string jsTimeFormat = "short")
+        {
+            var dateTime = date.ToString("o", CultureInfo.InvariantCulture);
+            var displayDate = date.ToString(netFormat, CultureInfo.InvariantCulture);
+            var tooltip = dateTime.Replace("T", " ");
+            return new HtmlString($"<time datetime=\"{dateTime}\" data-date-style=\"{jsDateFormat}\" data-time-style=\"{jsTimeFormat}\" data-initial=\"localized\" data-bs-toggle=\"tooltip\" data-bs-title=\"{tooltip}\">{displayDate}</time>");
+        }
+
         public static HtmlString ToBrowserDate(this DateTimeOffset date, DateDisplayFormat format = DateDisplayFormat.Localized)
         {
             var relative = date.ToTimeAgo();
diff --git a/BTCPayServer.Data/Data/InvoiceEventData.cs b/BTCPayServer.Data/Data/InvoiceEventData.cs
index bda4ef29d..2e0c1ef32 100644
--- a/BTCPayServer.Data/Data/InvoiceEventData.cs
+++ b/BTCPayServer.Data/Data/InvoiceEventData.cs
@@ -40,7 +40,6 @@ namespace BTCPayServer.Data
         {
             return Severity switch
             {
-                EventSeverity.Info => "info",
                 EventSeverity.Error => "danger",
                 EventSeverity.Success => "success",
                 EventSeverity.Warning => "warning",
diff --git a/BTCPayServer/Views/UIInvoice/Invoice.cshtml b/BTCPayServer/Views/UIInvoice/Invoice.cshtml
index 515f0d2c7..da959bba5 100644
--- a/BTCPayServer/Views/UIInvoice/Invoice.cshtml
+++ b/BTCPayServer/Views/UIInvoice/Invoice.cshtml
@@ -577,7 +577,7 @@
                                     <span>@blob.Limit @blob.Currency</span>
                                 </td>
                                 <td>
-                                    <span> @refund.PullPaymentData.StartDate.ToBrowserDate() </span>
+                                    <span>@refund.PullPaymentData.StartDate.ToBrowserDate()</span>
                                 </td>
                             </tr>
                         }
@@ -598,9 +598,10 @@
             <tbody>
             @foreach (var evt in Model.Events)
             {
-                <tr class="text-@evt.GetCssClass()">
-                    <td>@evt.Timestamp.ToBrowserDate()</td>
-                    <td>@evt.Message</td>
+                var cssClass = string.IsNullOrEmpty(evt.GetCssClass()) ? null : $"text-{evt.GetCssClass()}";
+                <tr>
+                    <td class="@cssClass">@evt.Timestamp.ToBrowserDate("o", "short", "medium")</td>
+                    <td class="@cssClass">@evt.Message</td>
                 </tr>
             }
             </tbody>
diff --git a/BTCPayServer/wwwroot/main/site.js b/BTCPayServer/wwwroot/main/site.js
index a344717c6..e40d38ba4 100644
--- a/BTCPayServer/wwwroot/main/site.js
+++ b/BTCPayServer/wwwroot/main/site.js
@@ -2,15 +2,14 @@ const baseUrl = Object.values(document.scripts).find(s => s.src.includes('/main/
 
 const flatpickrInstances = [];
 
-// https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/DateTimeFormat/DateTimeFormat
-const dtFormatOpts = { dateStyle: 'short', timeStyle: 'short' };
-
 const formatDateTimes = format => {
     // select only elements which haven't been initialized before, those without data-localized
     document.querySelectorAll("time[datetime]:not([data-localized])").forEach($el => {
         const date = new Date($el.getAttribute("datetime"));
+        // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/DateTimeFormat/DateTimeFormat
+        const { dateStyle = 'short', timeStyle = 'short' } = $el.dataset;
         // initialize and set localized attribute
-        $el.dataset.localized = new Intl.DateTimeFormat('default', dtFormatOpts).format(date);
+        $el.dataset.localized = new Intl.DateTimeFormat('default', { dateStyle, timeStyle }).format(date);
         // set text to chosen mode
         const mode = format || $el.dataset.initial;
         if ($el.dataset[mode]) $el.innerText = $el.dataset[mode];