/* Source from reddit users /u/BatDogOnBatMobile, /u/moko1960, and /u/It_Was_The_Other_Guy
     https://teddit.net/r/FirefoxCSS/comments/s4wsww/
     https://teddit.net/r/FirefoxCSS/comments/yb8tr9/ */

/* Apply this customization only on smaller screens */
@media (max-width: 700px) {

    /* Show Tab Manager button even when tabs aren't overflowing -
         can instead use browser.tabs.tabmanager.enabled;true as well
         or skip this part if you want to retain the default behaviour */
    #alltabs-button {
        display: -moz-box !important;
    }

    /* Tab Manager button (v) tab counter */
    #TabsToolbar-customization-target {
        counter-reset: tabCount;
    }
    .tabbrowser-tab:not([pinned]) {
        counter-increment: tabCount;
    }
    #alltabs-button > .toolbarbutton-badge-stack > .toolbarbutton-icon {
        visibility: collapse !important;
    }
    #alltabs-button > .toolbarbutton-badge-stack {
        position: relative !important;
    }
    #alltabs-button > .toolbarbutton-badge-stack::before {
        content: counter(tabCount);
        border-bottom: 1px solid var(--toolbarbutton-icon-fill);
        color: var(--toolbarbutton-icon-fill);
        opacity: var(--toolbarbutton-icon-fill-opacity);
        position: absolute;
        bottom: var(--toolbarbutton-inner-padding);
        left: 50%;
        transform: translateX(-50%);
        padding: 0 3px;
    }

    /* Tab Manager menu tab counter */
    #allTabsMenu-allTabsViewTabs {
        counter-reset: nn_tabs 0 !important;
    }
    .all-tabs-button::before {
        display: -moz-inline-box !important;
        -moz-padding-end: 8px !important;
        content: counter(nn_tabs) !important;
        /*font-weight: bold !important; */
        font-size: 12px !important; 
        margin-top: -2px !important; 
        margin-right: -2px !important;
    }
    .all-tabs-item {
        counter-increment: nn_tabs !important;
    }

}