/* 
  ___ _            _                 _   
 / __(_)_ __  _ __| |___ _ _ ___ _ _| |_ 
 \__ \ | '  \| '_ \ / -_) '_/ -_) ' \  _|
 |___/_|_|_|_| .__/_\___|_| \___|_||_\__|
 | __|____ __|_|                         
 | _/ _ \ \ /                            
 |_|\___/_\_\                            
                                         
 With URL Bar Version

 Designed and Coded by Miguel R. Ávila: https://github.com/MiguelRAvila
 Patched by u/CommonSenseUsed or @jruaaa on github
 All Addons by u/It_Was_the_other_guy or @MrOtherGuy

*/

@import url('dark_checkboxes_and_radios.css');
@import url('dark_additional_windows.css');
@import url('dark_context_menus.css');

/* 

V A R I A B L E S 

Here you can change the main color of the browser. Also the color of the selections (When you select text)

*/

:root {
  --srf-color-primary: rgb(247, 241, 227);
  /* 
  WARNING: Transparency breakes the window behavior, 
  you can still add transparency but the 
  window manager will have some bugs. 
  */
  --srf-color-selection: #f7f1e3;
  --srf-color-urlbar: rgba(247, 241, 227);
}

/* 
G E N E R A L 
*/

window,
#main-window,
#toolbar-menubar,
#TabsToolbar,
#PersonalToolbar,
#navigator-toolbox,
#sidebar-box {
  background-color: var(--srf-color-primary) !important;
  -moz-appearance: none !important;
  background-image: none !important;
  border: none !important;
  box-shadow: none !important;
}

::selection {
  background-color: var(--srf-color-selection);
  color: #f7f1e3;
}

/* 
T A B S 
*/

:root {
  --tabs-border: transparent !important;
}

.tab-background {
  border: none !important;
}

.tab-background[selected='true'] {
  -moz-appearance: none !important;
  background-image: none !important;
}
.tabbrowser-tabs {
  border: none !important;
  opacity: 0 !important;
}

.tabbrowser-tab::before,
.tabbrowser-tab::after {
  opacity: 0 !important;
  border-left: none !important;
}

.titlebar-placeholder {
  border: none !important;
}

.tab-line {
  display: none !important;
}

/* 

B U T T O N S 

Here you can comment if you want your buttons to be showed up!

*/

/* This one is the forward button  */
#forward-button {
  display: none !important;
}

/* This one is the back button  */
#back-button {
  display: none !important;
}

/* This one is the spacer between tabs and border  */
.titlebar-spacer {
  display: none !important;
}

/* This one is the "shield" icon  */
#tracking-protection-icon-container {
  display: none !important;
}

/* This one is the hamburger menu!  */
#PanelUI-button {
  display: none !important;
}

/* This one removes the close button  */
.tabbrowser-tab:not([pinned]) .tab-close-button {
  display: none !important;
}

/* This one clears the tabs icon when they're not pinned  */
.tabbrowser-tab:not([pinned]) .tab-icon-image {
  display: none !important;
}

/* Removing the zoom button  */
#urlbar-zoom-button {
  display: none !important;
}

/* Page action (right three dots button)  */
#pageActionButton {
  display: none !important;
}

/* 
N A V B A R
*/

#navigator-toolbox::after {
  border-bottom: 0px !important;
  border-top: 0px !important;
}

#nav-bar {
  background: rgba(247, 241, 227) !important;
  border: none !important;
  box-shadow: none !important;
  margin-top: -1px !important;
  border-top-width: -1px !important;
  margin-bottom: -1px !important;
  border-bottom-width: -1px !important;
}

/* 
S I D E - B A R
*/

#history-panel,
#sidebar-search-container,
#bookmarksPanel {
  background: var(--srf-color-primary) !important;
}

#search-box {
  -moz-appearance: none !important;
  background: var(--srf-color-primary) !important;
  border-radius: 6px !important;
}

#sidebar-search-container {
  background-color: var(--srf-color-primary) !important;
}

#sidebar-icon {
  display: none !important;
}

.sidebar-placesTree {
  color: #eee !important;
}

#sidebar-switcher-target {
  color: #eee !important;
}

#sidebar-header {
  background: var(--srf-color-primary) !important;
}

#sidebar-box {
  --sidebar-background-color: var(--srf-color-primary) !important;
}

#sidebar-splitter {
  border: none !important;
  opacity: 1 !important;
  background-color: var(--srf-color-primary) !important;
}

/* 
U R L - B A R
*/

#urlbar[breakout] {
  margin-inline-start: 0px !important;
  width: 100% !important;
  left: 0 !important;
  top: calc(
    (var(--urlbar-toolbar-height) - var(--urlbar-height)) / 2
  ) !important;
}

#urlbar[breakout]:not([open]) {
  bottom: calc(
    (var(--urlbar-toolbar-height) - var(--urlbar-height)) / 2
  ) !important;
}

#urlbar-background {
  background: var(--srf-color-urlbar) !important;
  border: var(--srf-color-urlbar) !important;
  animation: none !important;
}

#urlbar-input-container {
  padding: 0 !important;
  height: 100% !important;
}

#identity-box {
  display: none;
}

#urlbar-input:focus {
  color: #fff !important;
}

.megabar[open='true'] > #urlbar-background {
  background: #fff !important;
}

.urlbarView {
  margin-inline: 0 !important;
  width: auto !important;
}

.urlbarView-row {
  padding: 0 2px !important;
}

.urlbarView-row-inner {
  padding-inline-start: 4px !important;
}

#urlbar-label-box,
#urlbar-search-mode-indicator {
  display: none !important;
}

/* 
P A T C H E S
*/

#tabbrowser-tabpanels {
  background-color: var(0, 0, 0) !important;
}

#statuspanel-label:-moz-lwtheme-brighttext {
  background-color: rgb(247, 241, 227) !important;
  color: rgb(247, 241, 227) !important;
  border-color: grey !important;
}

.panel-subview-body,
#permList,
scrollbar {
  color: inherit;
  scrollbar-color: currentColor transparent;
  scrollbar-width: thin;
}