.mention-highlight {
    background-color: rgba(59, 130, 246, 0.1);
    color: #3b82f6;
    font-size: 0.875rem; /* text-sm */
    line-height: 1.25rem; /* text-sm line-height */
    font-weight: inherit;
    font-family: inherit;
    display: inline;
    vertical-align: top;
    margin: 0;
    padding: 0;
    border: none;
}

.mention-dropdown {
    top: 100%;
    left: 0;
    right: 0;
}

.mention-dropdown li {
    @apply px-3 py-2 text-sm text-gray-700 hover:bg-gray-100 cursor-pointer border-b border-gray-100 last:border-b-0;
}

.mention-dropdown li.active {
    @apply bg-blue-50 text-blue-700;
}

.mention-highlighter {
    font-family: inherit;
    font-size: inherit;
    line-height: inherit;
    border: 1px solid transparent;
}

/* Hide the highlighter when showing the dropdown */
.mention-dropdown:not(.hidden) ~ .mention-highlighter {
    opacity: 0.3;
}