Tree Style Tab "User Style Sheet"

/* Show title of unread tabs with red and italic font */

:root.sidebar tab-item.unread .label-content {
  color: red !important;
  font-style: italic !important;
}


/* Add private browsing indicator per tab */
/*
:root.sidebar tab-item.private-browsing tab-label:before {
  content: "🕶";
}
*/


/* CHANGE TAB HEIGHT #236, #2389
    URL link to code source: https://github.com/piroor/treestyletab/wiki/Code-snippets-for-custom-style-rules#change-tab-height-236-2389
    note: I'm specifically using this code snippet to make the tab height shorter in the high contrast theme*/
tab-item {
  --tab-size: 22px !important;
}
tab-item  tab-item-substance {
  max-height: var(--tab-size) !important;
  min-height: var(--tab-size) !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}


/* HIGHLIGHT ACTIVE TAB: This makes the active tab very noticeable increasing its height and modifying the color and font
    URL link to code source: https://github.com/piroor/treestyletab/wiki/Code-snippets-for-custom-style-rules#highlight-active-tab */

tab-item.active tab-item-substance {
  height: 39px !important;
}
tab-item.active .background {
  background-color: steelblue;
}
tab-item.active .label-content {
  font-weight: bold;
  font-size: 14px;
}
tab-item.active tab-twisty,
tab-item.active .label-content,
tab-item.active tab-counter {
  color: #fff;
}


/*ONLY SHOW CLOSE BUTTON ON HOVER #1448
    URL link to code source: https://github.com/piroor/treestyletab/wiki/Code-snippets-for-custom-style-rules#only-show-tab-close-button-on-hover-1448 */
/* "#tabbar" is required for TST 3.4.0 and later! */

#tabbar tab-item tab-item-substance:not(:hover) tab-closebox {
  display: none;
}


/*
#sidebar-box[sidebarcommand="treestyletab_piro_sakura_ne_jp-sidebar-action"] #sidebar-header {
  display: none;
}
*/