/* globals */
:root {
	--block-colour:#182230;
	--bg-colour:#14151f;
	--tert-colour:#1a1b26;

	--text-main:#ccc;
	--text-bold:#ededed;

	--accent-main:#81606b;
	--accent-blue:#546a81;
	--accent-green:#73857b;
	--accent-orange:#d8a070;

	--shadow:rgba(8, 11, 16, 0.6);

	--font-main:"IBM Plex Sans", "Murecho";
	--font-header:"Kaisei HarunoUmi";
}

* {
	box-sizing: border-box;
  font-family:var(--font-main);
}

/* tabs */
.tab-close-button {
  display:none !important;
}

.tabbrowser-tab {
  background-color: var(--bg-colour) !important;
  color: var(--text-main) !important;
  
  &:not([pinned]) {
    transition: min-width 100ms ease-out, max-width 100ms ease-out, font-weight 100ms ease-out !important;
  }
  
}

.tabbrowser-tab:hover {
  font-weight:600 !important;
}

.tabbrowser-tab:is([visuallyselected], [multiselected]) {
  color: var(--text-bold) !important;
  color-scheme: var(--tab-selected-color-scheme) !important;
  background: var(--block-colour) !important;
  box-shadow: 0px 0px 10px 2px var(--shadow) !important;
  z-index: 0 !important;
}

.tab-background:is([selected], [multiselected]), .tabbrowser-tab:hover > .tab-stack > .tab-background:not([selected], [multiselected]) {
  box-shadow: none !important;
  background:none !important;
  outline:none !important;
}

#tabbrowser-tabs {
  --tab-loading-fill: var(--accent-orange) !important;
}

#tabs-newtab-button > .toolbarbutton-icon {
  width: 20px !important;
  height: 20px !important;
  padding: 4px !important;
  border-radius: 100% !important;
  margin-left: 6px !important;
}

#tabs-newtab-button.toolbarbutton-1 {
  stroke:var(--text-main) !important;
}

#tabs-newtab-button:hover {
  stroke:var(--block-colour) !important;
  -moz-context-properties: stroke !important;
}

toolbar .toolbarbutton-1 {
  &:not([disabled]) {
    &:hover > :is(.toolbarbutton-icon, .toolbarbutton-text, .toolbarbutton-badge-stack) {
      background-color: var(--text-main) !important;
    }
  }
}

#tabs-newtab-button:hover {
  stroke:var(--block-colour) !important;
}

.titlebar-button {
    stroke: var(--text-main) !important;
}

.titlebar-min:hover, .titlebar-max:hover {
    background-color:var(--text-main) !important;
    stroke:var(--block-colour) !important;
}

.titlebar-close:hover {
    background-color:var(--accent-main) !important;
}

/* url bar */
#nav-bar {
  border:none !important;
  height:40px !important;
}

#navigator-toolbox {
  border:none !important;
  background-color:var(--tert-colour) !important;
}

#nav-bar-customization-target, #PanelUI-button {
  background-color:var(--block-colour) !important;
}

#urlbar-background {
  background:var(--bg-colour) !important;
}

#urlbar-input {
  text-align: center !important;
  color: var(--text-main) !important;
  transition: font-weight 100ms ease-out !important;
}

#urlbar-input:hover {
  font-weight:600 !important;
}

/* url bar hover */
#nav-bar {
  transition: all 0.3s ease !important;
  opacity: 0;
  margin-top:-40px
}

#urlbar {
  transition: opacity 0.3s ease !important;
  opacity:0;
}

#navigator-toolbox:focus-within > #nav-bar,
#navigator-toolbox:hover > #nav-bar
{
  opacity: 1 !important;
  margin-top:0px !important;
}

#navigator-toolbox:focus-within > #nav-bar > #nav-bar-customization-target > #urlbar-container > #urlbar,
#navigator-toolbox:hover > #nav-bar > #nav-bar-customization-target > #urlbar-container > #urlbar {
  opacity: 1 !important;
}

/* buttons */
#back-button, #forward-button, #tracking-protection-icon-container, #identity-box, #reader-mode-button, #sidebar-button, #alltabs-button {
  display:none !important;
}

#reload-button:hover, #downloads-button:hover > .toolbarbutton-badge-stack > box, #unified-extensions-button:hover, #PanelUI-menu-button:hover > .toolbarbutton-badge-stack {
  -moz-context-properties: stroke !important;
}

/* stupid border */
#tabbrowser-tabbox {
  outline: none !important;
  box-shadow:rgba(0, 0, 0, 0) 0px 0px 0px 0px !important;
}