UX: Tweak last-visit/date separators (#20601)

1. Restore the left margin on both (which reflects the right margin of the scroll bar space)
2. Fix the center alignment of scroll-to-bottom icon
3. Fix the spacing of the `-` character between a date label and "last visit" label
4. Fix the incorrect display the border on date label when at the bottom of viewport

plugins/chat/assets/javascripts/discourse/components/chat-message-separator-date.hbs

@@ -14,7 +14,7 @@
 
         {{#if @message.newest}}
           <span class="chat-message-separator__last-visit">
-            -
+            <span class="chat-message-separator__last-visit-separator">-</span>
             {{i18n "chat.last_visit"}}
           </span>
         {{/if}}

plugins/chat/assets/javascripts/discourse/modifiers/chat/track-message-separator-date.js

@@ -16,11 +16,15 @@ export default class ChatTrackMessageSeparatorDate extends Modifier {
 
   modify(element) {
     this.intersectionObserver = new IntersectionObserver(
-      ([event]) => {
-        if (event.isIntersecting && event.intersectionRatio < 1) {
-          event.target.classList.add(IS_PINNED_CLASS);
+      ([entry]) => {
+        if (
+          entry.isIntersecting &&
+          entry.intersectionRatio < 1 &&
+          entry.boundingClientRect.y < entry.intersectionRect.y
+        ) {
+          entry.target.classList.add(IS_PINNED_CLASS);
         } else {
-          event.target.classList.remove(IS_PINNED_CLASS);
+          entry.target.classList.remove(IS_PINNED_CLASS);
         }
       },
       { threshold: [0, 1] }