userchrome

@import url("sidebar.css");

/* Hide the tabs toolbar */
#TabsToolbar {
  visibility: collapse;  /* Completely hides the tabs toolbar */
}

/* Main Settings for colors */
:root {
  --toolbar-field-focus-border-color: transparent !important; /* Makes the toolbar field focus border color transparent */
  --urlbar-background-color: #201929; /* Sets the background color of the URL bar to a dark shade */
}

/* Change background color for private browsing mode */
:root[privatebrowsingmode="temporary"] {
  --urlbar-background-color: #25003E; /* Sets a different background color for the URL bar in private browsing mode */
}

/* Clean up the appearance of the URL bar and search bar */
#urlbar,
#searchbar {
  font-size: 13px !important; /* Sets the font size of both the URL bar and search bar */
}

#urlbar-background,
#searchbar {
  border: none !important;  /* Removes the border from the URL bar and search bar */
  animation-name: none !important;  /* Disables any animations on the URL bar and search bar */
  box-shadow: none !important;  /* Removes any shadow around the URL bar and search bar */
}

/* Changes for the extended URL bar */
#urlbar[breakout][breakout-extend] > #urlbar-background {
  background-image: var(--lwt-additional-images) !important;  /* Allows for background images in the URL bar */
  background-repeat: var(--lwt-background-tiling) !important;  /* Defines if the background image repeats */
  background-position: var(--lwt-background-alignment) !important;  /* Sets the background image position */
}

/* Removes borders on URL bar when open */
#urlbar[open] > .urlbarView > .urlbarView-body-outer > .urlbarView-body-inner {
  border: none !important;  /* Removes borders when the URL bar is open */
}

/* Change background of selected rows in the URL bar */
.urlbarView-row[selected] > .urlbarView-row-inner,
.urlbarView-row-inner[selected] {
  background: #3A3941 !important;  /* Darkens the background of selected rows in the URL bar */
}

/* Remove shadow from the navigation bar */
#nav-bar:not([tabs-hidden="true"]) {
  box-shadow: none !important;  /* Removes any box shadow from the navigation bar */
}

/* Remove the bottom border from the navigator toolbox */
#navigator-toolbox {
  border-bottom: none !important;  /* Removes the bottom border from the navigator toolbox */
}

/* Adds a smooth background transition to toolbar buttons */
toolbar .toolbarbutton-1:not([disabled="true"], [checked], [open], :active) > .toolbarbutton-icon {
  transition: background linear 0.5s;  /* Smooth transition for background color on toolbar buttons */
}

/* Make the title bar very small so it can be dragged by the mouse */
#titlebar {
  appearance: none !important; /* Removes any default appearance from the title bar */
  height: 1px; /* Makes the title bar height very small */
}

/* Adjust the findbar (search bar) position */
.browserContainer > findbar {
  position: absolute;  /* Positions the findbar absolutely */
  top: -1px;  /* Moves it up slightly */
  right: 0px;  /* Aligns it to the right */
  contain: content;  /* Ensures that the findbar content is contained */
  border-radius: 0 0 var(--toolbarbutton-border-radius) var(--toolbarbutton-border-radius); /* Rounded corners for the findbar */
}

/* Hide the status message in the findbar */
findbar .findbar-find-status {
  display: none; /* Hides the find status message */
}

/* Replace checkboxes with buttons in the findbar */
findbar .checkbox-check {
  display: none !important;  /* Hides checkboxes in the findbar */
}

findbar checkbox {
  border: 1px solid var(--input-border-color);  /* Adds a border around checkboxes */
  border-radius: var(--toolbarbutton-border-radius);  /* Makes the checkbox corners round */
  padding: 2px 4px;  /* Adds padding inside the checkbox */
  margin: -2px 4px !important;  /* Adjusts the margin around the checkbox */
  transition: 0.1s ease-in-out;  /* Smooth transition for changes */
}

findbar checkbox[checked="true"] {
  background: var(--button-active-bgcolor);  /* Changes the background color when the checkbox is checked */
  transition: 0.1s ease-in-out;  /* Smooth transition when the checkbox is checked */
}

/* Center the text in the URL bar */
#urlbar-input {
  text-align: center !important; /* Centers the text inside the URL bar */
}

/* Make the placeholder text in the URL bar transparent */
#urlbar-input::placeholder {
  color: transparent;  /* Makes the placeholder text invisible */
}

/* Hide the URL bar completely */
.urlbarView {
  display: none !important;  /* Completely hides the URL bar */
}

/* Disable the back and forward buttons when they are disabled */
#back-button[disabled="true"] {
  display: none !important;  /* Hides the back button when it's disabled */
}

#forward-button[disabled="true"] {
  display: none !important;  /* Hides the forward button when it's disabled */
}

/* Hide the user context icons (like profile icon) */
#userContext-icons {
  display: none;  /* Hides the user context icons */
}

/* Hide the page action buttons */
#pageAction-urlbar-_testpilot-containers {
  display: none !important;  /* Hides the page action buttons in the URL bar */
}