/* Source file https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/hide_tabs_toolbar.css made available under Mozilla Public License v. 2.0
See the above repository for updates as well as full license text. */

/* Hides tabs toolbar */
/* For OSX use hide_tabs_toolbar_osx.css instead */

/* Note, if you have either native titlebar or menubar enabled, then you don't really need this style.
 * In those cases you can just use: #TabsToolbar{ visibility: collapse !important }
 */

/* IMPORTANT */
/*
Get window_control_placeholder_support.css
Window controls will be all wrong without it
*/

* {
  font-family: "Iosevka Nerd Font Mono" !important;
}

:root[tabsintitlebar] {
  --uc-toolbar-height: 40px;
}

:root[tabsintitlebar][uidensity="compact"] {
  --uc-toolbar-height: 32px
}

#titlebar {
  will-change: unset !important;
  transition: none !important;
  opacity: 1 !important;
}

#TabsToolbar {
  visibility: collapse !important
}

:root[sizemode="fullscreen"] #titlebar {
  position: relative
}

:root[sizemode="fullscreen"] #TabsToolbar>.titlebar-buttonbox-container {
  visibility: visible !important;
  z-index: 2;
}

:root:not([inFullscreen]) #nav-bar {
  margin-top: calc(0px - var(--uc-toolbar-height, 0px));
}

:root[tabsintitlebar] #toolbar-menubar[autohide="true"] {
  min-height: unset !important;
  height: var(--uc-toolbar-height, 0px) !important;
  position: relative;
}

#toolbar-menubar[autohide="false"] {
  margin-bottom: var(--uc-toolbar-height, 0px)
}

:root[tabsintitlebar] #toolbar-menubar[autohide="true"] #main-menubar {
  flex-grow: 1;
  align-items: stretch;
  background-attachment: scroll, fixed, fixed;
  background-position: 0 0, var(--lwt-background-alignment), right top;
  background-repeat: repeat-x, var(--lwt-background-tiling), no-repeat;
  background-size: auto 100%, var(--lwt-background-size, auto auto), auto auto;
  padding-right: 20px;
}

:root[tabsintitlebar] #toolbar-menubar[autohide="true"]:not([inactive]) #main-menubar {
  background-color: var(--lwt-accent-color);
  background-image: linear-gradient(var(--toolbar-bgcolor, --toolbar-non-lwt-bgcolor), var(--toolbar-bgcolor, --toolbar-non-lwt-bgcolor)), var(--lwt-additional-images, none), var(--lwt-header-image, none);
  mask-image: linear-gradient(to left, transparent, black 20px);
}

#toolbar-menubar:not([inactive]) {
  z-index: 2
}

#toolbar-menubar[autohide="true"][inactive]>#menubar-items {
  opacity: 0;
  pointer-events: none;
  margin-left: var(--uc-window-drag-space-pre, 0px)
}

#sidebar-header {
  display: none;
}

/******************** BEGIN PYWALFOX CUSTOM CSS ********************/
#main-window {
  --pywalfox-font-size: 14px;
  --pywalfox-font-size-sm: calc(var(--pywalfox-font-size) * 0.9);
  --pywalfox-background: var(--lwt-accent-color);
  --pywalfox-background-light: var(--arrowpanel-background);
  --pywalfox-text: var(--arrowpanel-color);
  --pywalfox-text-focus: var(--toolbar-color);
  --pywalfox-unselected-tab-opacity: 0.8;
  --pywalfox-darker-background: rgba(0, 0, 0, 0.4);
  --pywalfox-padding: 4px 8px;
  font-size: var(--pywalfox-font-size) !important;
}

/* Disable default appearance of certain elements to be able to override shadow DOM attributes */
menupopup,
menuseparator,
button,
search-textbox {
  -moz-appearance: none !important;
}

/* Override the default appearance of buttons and textboxes to match the pywalfox theme */
button,
search-textbox,
menuseparator {
  background-color: var(--pywalfox-darker-background) !important;
}

/* Background color on hover in right-click context menus */
menu[_moz-menuactive="true"],
menuitem[_moz-menuactive="true"] {
  -moz-appearance: none !important;
  background-color: var(--pywalfox-background) !important;
  color: var(--pywalfox-text-focus) !important;
  padding: 4px 4px !important;
}

/* Separators in dropwdown menus */
menuseparator {
  height: 1px;
}

/* Elements where we set appearance to none, we need to set padding manually */
notification,
button,
search-textbox {
  padding: var(--pywalfox-padding) !important;
}

/* Fix background color of elements that can not be targeted via the Theme API */
notification,
menupopup {
  background: var(--pywalfox-background-light) !important;
  color: var(--pywalfox-text) !important;
}

/* Apply bold text to elements */
textbox,
panelview,
.tabbrowser-tab,
#sidebar-header,
.findbar-container,
toolbar[overflowable]>.customization-target {
  font-weight: bold !important;
}

/* Decrease opacity of unselected tabs to match the default Firefox theme */
.tabbrowser-tab:not([visuallyselected="true"]) {
  opacity: var(--pywalfox-unselected-tab-opacity) !important;
}

/* Hide unnecessary borders */
.sidebar-splitter,
notification {
  border: 0px !important;
}

/* Change the background color of the resize splitter on the right side of the sidebar */
.sidebar-splitter {
  background-color: transparent !important;
}

/* Smaller font size in panel dropdown menus */
panelmultiview {
  font-size: var(--pywalfox-font-size-sm) !important;
}

/* Change the grey background color seen e.g. when opening a bookmark in a newtab */
#tabbrowser-tabpanels {
  background-color: var(--pywalfox-background) !important;
}

/* Theme the status panel at the bottom */
#statuspanel-label {
  background: var(--pywalfox-background-light) !important;
  border-color: var(--pywalfox-background) !important;
  color: var(--pywalfox-text) !important;
}

/********************* END PYWALFOX CUSTOM CSS *********************/
