/* ============================================
   feed-desktop-comments.css — Desktop Home comments column only.
   Every rule scoped under .feed-comments-row--hover-menu (added only in
   _loadCommentsCol) and @media (min-width: 769px), so the lightbox and
   touch back comment rows are never affected.
   ============================================ */

@media (min-width: 769px) {

  .feed-comments-row--hover-menu {
    position: relative;
    border-radius: 8px;
    transition: background-color 0.15s ease;
  }

  .feed-comments-row--hover-menu:hover {
    background-color: #FAFAFB;
  }

  .feed-comments-row--hover-menu.feed-comments-row--menu-open {
    background-color: #EFE8FC;
  }

  /* The shared dots-reserved padding isn't needed — dots overlay instead. */
  .feed-comments-row--hover-menu.feed-comment-row--has-menu {
    padding-right: 8px;
  }

  .feed-comments-row--hover-menu .feed-comments-row-time {
    flex-shrink: 0;
    min-width: 48px;
    margin-left: auto;
    padding-left: 8px;
    text-align: right;
    font-size: 11px;
    color: var(--color-text-muted);
    font-family: var(--font-display);
    white-space: nowrap;
  }

  /* Dots: no reserved space, invisible until row hover, sit just left of the
     timestamp with a small background matching the row's current state so a
     long first line tucks under them instead of visibly colliding. */
  .feed-comments-row--hover-menu .sb-comment-dots {
    top: 0;
    right: 60px;
    opacity: 0;
    pointer-events: none;
    background-color: #FAFAFB;
    transition: opacity 0.15s ease;
  }

  .feed-comments-row--hover-menu:hover .sb-comment-dots,
  .feed-comments-row--hover-menu.feed-comments-row--menu-open .sb-comment-dots {
    opacity: 1;
    pointer-events: auto;
  }

  .feed-comments-row--hover-menu.feed-comments-row--menu-open .sb-comment-dots {
    background-color: #EFE8FC;
  }
}