/* Scope only to our material badges. Native unread counters retain their styling. */
#buddypress .bp-navs li > a:has(> .dtfpro-content-count) {
    display: inline-flex;
    align-items: center;
    gap: 7px;
}
#buddypress .bp-navs li > a > .dtfpro-content-count {
    box-sizing: border-box;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    min-width: 23px;
    height: 21px;
    margin: 0;
    padding: 0 5px;
    border: 1px solid var(--bb-content-border-color, #dce1eb);
    border-radius: 6px;
    background: var(--bb-content-alternate-background-color, #f5f7fb);
    color: var(--bb-body-text-color, #63738a);
    font-size: 11px;
    font-weight: 600;
    line-height: 1;
    font-variant-numeric: tabular-nums;
}
#buddypress .bp-navs li > a > .dtfpro-content-count--empty { opacity: .6; }
#buddypress .bp-navs li > a:hover > .dtfpro-content-count,
#buddypress .bp-navs li > a:focus-visible > .dtfpro-content-count,
#buddypress .bp-navs li.current > a > .dtfpro-content-count,
#buddypress .bp-navs li.selected > a > .dtfpro-content-count {
    opacity: 1;
    color: var(--bb-primary-color, #4974ff);
    border-color: currentColor;
}
@media (max-width: 767px) {
    #buddypress .bp-navs li > a:has(> .dtfpro-content-count) { gap: 5px; }
}