vertical tabs

@charset "utf-8";
@namespace xul url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
@namespace html url(http://www.w3.org/1999/xhtml);
toolbarbutton#alltabs-button {
  -moz-binding: url("userChrome.xml#js");
}

/*vertical width 16px,
horizontal height 28px*/
:root {
  --tab-min-height: 16px !important;
  --tabstrip-min-height: 16px !important;
  --sidebar-launcher-collapsed-width: 16px !important;
  --tab-collapsed-width: 16px !important;
}

/*horizontal*/
#tabbrowser-tabs {
  &[orient="horizontal"] {
    max-height: 20px !important;
  }
}

/*tab height*/
.tab-background {
  margin-block: 0px !important;
  min-height: 22px !important;
  margin-inline: 0px !important;
}

/*title bar spaces erased*/
.titlebar-spacer[type="pre-tabs"],
.titlebar-spacer[type="post-tabs"] {
  display:none !important;
}

/*urlbar,searchbar no padding and margin*/
#urlbar-container,
#search-container {
  padding-block:  0px !important;
  margin-inline: 0px !important;
}

/*toolbar height 28px*/
:root {
  --urlbar-container-height: 28.00px !important;
  --border-radius-medium: 2px !important;
  --border-radius-small: 2px !important;
  --tab-border-radius: 2px !important;
}

/*urlbar height 28px*/
#urlbar-container[breakout] {
  min-height: 28px !important;
}

/*reduce min horizontal tab width*/
#tabbrowser-tabs {
  &[orient="horizontal"] {
    --tab-min-width-pref: 48px !important;
  }
}

/*current tab text*/
.tab-text[selected]{
      font-weight: bolder !important;
}

/* Reduce Vertical Tabs Padding */
#tabbrowser-tabs[orient="vertical"] {
    & .tabbrowser-tab:not([pinned]) {
      padding-block: 0px !important;
    }
}

/*tab text height*/
.tab-label {
  line-height: 20px !important;
}

/*icon paddeing*/
toolbar,
.toolbarbutton-1 {
  padding: 0px !important;
}

.tab-content {
  padding:  0px 0px !important;
}

/*max, min, close button padding*/
.titlebar-button {
  padding: 2px 2px !important;
}

/*list all tabs button*/
.all-tabs-item {
  &[selected] {
    background-color: #222 !important;
  }
}

toolbar .toolbaritem-combined-buttons {
  margin-inline: 0px !important;
}

image.toolbarbutton-icon{
  margin-left: 0px !important;
}

/*tab close button*/
.tab-close-button {
  width: 20px !important;
  height: 20px !important;
  padding: 3px !important;
}


.button-background {
   [type~="icon"]:not(.labelled),&&:not(.labelled):has(img) {
    width: 16px !important;
    height: 16px !important;
  }
  padding: 0px !important;
}

hbox.titlebar-buttonbox{
  display: visible !important;
}

:root{
  ---urlbar-width: 230px !important;
}

.actions-list {
  & > moz-button:not(.tools-overflow) {
    &:first-of-type {
      --button-outer-padding-block-start: 0px !important;
    }
    &:last-of-type {
      --button-outer-padding-block-end: 0px !important;
    }
  }
}

.actions-list {
  & > moz-button:not(.tools-overflow) {
    --button-outer-padding-inline: 0px !important;
    --button-outer-padding-block: 0px !important;
  }
}

button-group.tools-and-extensions.actions-list{
  display:  none !important;
}

.expanded-button {
  display: none !important;
}

/*new tab button margin*/
#tabs-newtab-button {
  margin-block: 0px !important;
  margin-inline: 0px !important;
}

/*new tab button text height*/
#tabs-newtab-button, #vertical-tabs-newtab-button {
  line-height: 1 !important;
}

#vertical-tabs-newtab-button {
  margin-inline: 0px !important;
}

#tabbrowser-tabs[orient="vertical"] {
  &[overflow]::after {
    margin-inline: 0px !important;
  }
}

/*tab color*/
.tab-background {
  &:is([selected], [multiselected]) {
  /*  background-color: oklch(.5 .2 210) !important;*/
  }
}

/*sidebar*/
box#sidebar-main {
  z-index: 3 !important;
  opacity: 50%  !important;
  background-color: transparent !important;
  /*background: var(--sidebar-background-color) !important;*/
}
/*hover sidebar*/
box#sidebar-main:hover{
  z-index: 3 !important;
  opacity: 85%  !important;
  background: var(--sidebar-background-color) !important;
}

/*shift only favicon image size*/
:root[sidebar-expand-on-hover] {
  & #tabbrowser-tabbox {
      &:not([sidebar-panel-open]) {
        margin-left: -16px !important;
      }
  }
  & #tabbrowser-tabbox {
    &:not([sidebar-positionend]) {
      &[sidebar-launcher-expanded][sidebar-launcher-hovered]:not([sidebar-panel-open]),
      &[sidebar-ongoing-animations]:not([sidebar-launcher-expanded], [sidebar-panel-open]) {
        margin-left: 0px !important;
      }
    }
  }
}

.tab-icon-stack [selected] {
  opacity: 100% !important;
}
/*
box#sidebar-main:hover {
  min-width: 220px !important;
  transition-delay: 0ms !important;
  opacity: 100% !important;
  transform: translateX(0px) !important;
}*/

/*#tabbrowser-tabbox {margin-left: -15px !important;}
/*#tabbrowser-tabbox {margin-left: -245px !important;}

/*#tabbrowser-tabbox { margin-left: -245px !important; }*/
/*#sidebar-box { z-index: 4 !important; margin-left: -15px !important; }*/

/*
box#sidebar-main {
  z-index: 3 !important;
  position: relative !important;
  transform: translateX(-220px) !important;
  opacity: 5% !important;
  transition: all 0ms ease-in-out 0ms !important;
  background: var(--sidebar-background-color) !important;
}
box#sidebar-main:hover {
  transition-delay: 0ms !important;
  opacity: 100% !important;
  transform: translateX(0px) !important;
}
#tabbrowser-tabbox { margin-left: -246px !important; }
#sidebar-box { z-index: 4 !important; margin-left: -246px !important; }*/

/*hide sidebar lancher*/
#sidebar-launcher-splitter{
  display: none !important;
  width: 0px !important;
}

/*scrollbar width*/
* {
  scrollbar-width: none !important;
}

/*reduce toolbar buttons padding*/
toolbar .toolbarbutton-1 {
  & > .toolbarbutton-icon{
    width: 20px !important;
    padding: 2px !important;
  }
}

/*reduce toolbar rest of buttons padding*/
#downloads-button,
#alltabs-button,
#PanelUI-menu-button,
#tabby_whatsyouridea_com-BAP{
  & > stack.toolbarbutton-badge-stack{
      padding: 6px 2px !important;
  }
}

/*reduce min window width*/
#main-window {
min-width:  100px !important;
min-height: 100px !important;
}

@media (-moz-bool-pref: "sidebar.verticalTabs") {
  :root:not([chromehidden~="toolbar"]) {
    min-width: 500px !important;
  }
}